Category: JavaScript

rss

How I built a social game in one week: SwarmFight

It has been an interesting past month, so I want to share how I build a social game for desktop and mobile devices by using Javascript and HTML/CSS.

Since it took me 7 days to make it, I entitled the blog post: "How to create a social game in one week"! I will post all 7 days of my development diary now, so you can see what progress I made at which time and which issues evolved and got fixed :).

The game is an online realtime multiplayer puzzle game called **SwarmFight** and freely available to join at http://swarmfight.com.

In php, JavaScript, jQuery, JsBehaviour & SwarmFight By DracoBlue @ 20:44 12.02.2012

JSB 1.3.0 released - Good bye Inline-Javascript

Today I finally finished JSB 1.3.0. The JsBehavourToolkit is a little toolkit to avoid any inline javascript, allow copy-and-paste of behaviour on html elements.

There is a native version, which works without any framework from (Firefox 3+, Safari 5+, Opera, Chrome and IE9+). The jQuery and Mootools Version works with any browser (even IE6).

New in 1.3.0 is a simple (by design!) event system. It is framework independent and works with simple channel identifier and a json-object as value.

1
jsb.fireEvent('HoneyPot::CLICKED', {"name": "Bob", "times": 2});

This should be fired by a Js-Behaviour which needs to say something, instead of global variables and direct call. This enables you to use dependency injection if you keep the channel identifier the same.

You can listen to that event, too:

1
2
3
4
5
6
jsb.on(
'HoneyPot::CLICKED', // identifier
function(values) { // callback
alert('The user ' + values.name + ' clicked it already ' + values.times);
}
);

It's even possible to filter for a filter-object when listening:

1
2
3
4
5
6
7
jsb.on(
'HoneyPot::CLICKED', // identifier
{"name": "Bob"}, // filter everything with name = Bob
function(values) { // callback
alert('The user ' + values.name + ' clicked it already ' + values.times);
}
);

You may also use RegExp as channel identifier when calling jsb.on:

1
2
3
4
5
6
jsb.on(
/^HoneyPot.*$, // identifier which starts with HoneyPot*
function(values) { // callback
alert('The user ' + values.name + ' clicked it already ' + values.times);
}
);

Have fun with this release. Sourcecode is of course MIT-Licensed and available on github. Tests for jquery, mootols and native version are shipped in the tests-folder.

In open source, JavaScript, Mootools, jQuery & JsBehaviour By DracoBlue @ 11:45 04.01.2012

Facebook Client for node.js 1.3.0

Today I have an update for the Facebook Client for node.js finished.

The version 1.3.0 is a graph and rest api client for facebook. It has support for the latest stable nodejs 0.4.x.

Now it's possible to post data (for instance into your news feed):

1
2
3
4
5
6
7
8
facebook_session.graphCall(
"/me/feed", {
"message":"I love node.js!"
},
'POST'
)(function(result) {
console.log('The new feed post id is: ' + result.id);
});

All you need to do is to specify the method parameter (defaults to GET).

Thanks to jharlap for this addition.

Also thanks to tslater and shaisultanov. They found an issue with expires-time (which is fixed now) and requested the brand new FacebookSession#isValid method, which tells you if the session is really alive.

Source may be found at node-facebook-client@github.

The package is also available by using npm:

1
$ npm install facebook-client

PhpDebugToolbar 1.3.0 (for agavi) released

Today I am pleased to announce the new version 1.3.0 of the Agavi PHP DebugToolbar for download.

New features include full propel support (thanks tim), rows+time+memory display for the database queries and some small bugfixes.

The source can be found on github now http://github.com/DracoBlue/PhpDebugToolbar, feel free to fork it and send pull request with new features!

Download for PhpDebugToolbar 1.3.0 (just 23KB) is also available here at dracoblue.net.

Short installation and configuration information can be found in the readme. Thanks to all contributors!

Update for Mootools Youtube Player

Today I updated the YtMooPlayer.js-component (showcase).

A while back the youtube chromeless api of google changed, so it was manadatory to set the "version"-parameter.

The new 1.0.1 version of YtMooPlayer.js fixes this issue.

You can download the youtube mootools class at dracoblue.net or pull the source from github.

In open source, JavaScript & Mootools By DracoBlue @ 10:20 07.11.2010

PhpDebugToolbar 1.1.1 (for agavi) released

Today I am pleased to announce the availability of the Agavi PHP DebugToolbar for download. After the success of the Qos-Filter for agavi, I want to relaunch the useful agavi toolbar with a different name, a better look and feel and a way better code base.

Screenshot:
http://twitpic.com/show/thumb/2zgig8.png

What is PhpDebugToolbar?
Like you can see on the screenshot, it's a little Toolbar (written in JS+CSS), which keeps track of all stuff happening in your php agavi application.
So you can easily spot memory leaks, time exhausting tasks and extensive usage of database queries (with the doctrine extension).

Additionally it integrates easily into the logging system of agavi, just add the PhpDebugToolbarLoggerAppender class in your logging.xml!

Where to download Toolbar?
The source can be found on github now http://github.com/DracoBlue/PhpDebugToolbar, feel free to fork it and send pull request with new features!

Download for PhpDebugToolbar 1.1.1 (just 20KB) is also available here at dracoblue.net.

Short installation and configuration information can be found in the readme. Thanks to all contributors!

This is meant to be a lightweight alternative to the unofficial Agavi Debug Tools. It won't have FirePHP output or other neat features, which ship with Agavi Debug Tools. So if you need them: use adt, please!

In open source, php, JavaScript, Agavi & PhpDebugToolbar By DracoBlue @ 12:33 21.10.2010