ZajoPlugin is another javascript-unobtrusive-generation plugin. It's built on jQuery and (something new) jQuery Enchant! It has unobtrusive Ajax calls, and it also visual-effect generator. All unobtrusively!
Copyright (c) 2008 Vojto Rinik <vojto@rinik.net>
Permission is hereby granted, free of charge, to any person
obtaining a copy of this software and associated documentation
files (the "Software"), to deal in the Software without
restriction, including without limitation the rights to use,
copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the
Software is furnished to do so, subject to the following
conditions:
The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
OTHER DEALINGS IN THE SOFTWARE.
The ZajoPlugin offers helpers that integrate the Jquery Javascript framework unobtrusive way
Warning: This plugin is in Alpha state. Syntax is subject to change.
Maintainer
Please report all bugs to Vojto Rinik
License
This plugin is licensed under the MIT license. For the full copyright and license information, please view the LICENSE file that was distributed with this source code.
Introduction
ZajoPlugin is new plugin for unobtrusive adding of javascript.
There is already a plugin for unobtrusive javascript with jQuery, it's called sfUJSPlugin.
This one also uses jQuery, but it uses also something new, called jQuery Enchant. That means you can create nice effects like with Script.aculo.us very easily.
As of now, there is not too much functionality. You can use basic helpers link_to_function, link_to_remote and form_remote_tag. These are static methods of ZajoHelper class, if you use helper ZajoHelper than you can use it as helper functions.
The another part is Enchant. There is ZajoEnchantHelper class, which provides methods for generating visual effects. In ZajoHelper there are helper functions for these methods too.
How it works
When you call link_to_function method, a new zajoID is generated. It is assigned to the a element, and the association between the zajoID and javascript function is stored into session.
The Helper automatically attaches javascript file (with PJS), which is generated from session of these associations.
How Enchant works
Enchant is different. There is no ZajoID, and there is no association. It's just code in attached pjs-javascript. That means you cannot do Enchant effect on event. These functionality is going to be implemented.
Enchant is created to work like Rails-RJS. If you write Enchant helpers into AJAX response, Zajo's filter will generate script with the code.
Alternatively, if you don't have PEAR installed, you can download the latest package attached to this plugin's wiki page and extract it under your project's plugins/ directory
If it is not installed yet, install the sfPJSPlugin, which is necessary to run this plugin
Copy all the files from /plugins/ZajoPlugin/web/js to your /web/js folder
Add ZajoFilter to your filters.yml file. This configuration is not necessarily needed, but it takes care of attaching JavaScript to your Ajax responses. If you don't enable this, you cannot use it in your Ajax responses.
generally, you will want to insert your own filters here
ZajoFilter:
class: ZajoFilter
Clear cache
$ symfony cc
In your template, use the ZajoHelper
Now the plugin should be ready to use. Let's try it in this mini-tutorial.
Tutorial
This is a small demonstration of principle of ZajoPlugin.
If you don't have one, create a new project, application and module.
$ mkdir zt
$ cd zt
$ symfony init-project zt
$ symfony init-app a
Install the plugin according to instructions. When you're done, create a new module.
$ symfony init-module a test
Open generated actions.class.php, remove code inside executeIndex (leave it empty)
Open generated indexSuccess.php, add
Hello World!
Navigate your browser to /web/a_dev.php/test. You should see Hello World message.
Now add ZajoHelper, and create a new H1.
Hello World!
If you have everything done properly, there should be no errors now. Let's try an effect.
Hello World!
"up")) ?>
Reload your page, and the title should disappear! This was jQuery Enchant effect called Drop.
Now let's try something cooler. Let's create a simple form.
Hello World!
'test/send', 'update' => '#r')) ?>
So this is very simple form. The url is test/send so we have to create send action. Open actions.class.php and add an empty executeSend method. Then add sendSuccess.php template, and write something like this:
"up")) ?>
Comment posted.
This hide effect won't work as the drop effect couldn't be loaded. All effects are loaded automatically when you call them, but when you call an effect from Ajax response, it couldn't be added to the header of page. So you need to add it manually into indexSuccess.php:
Now if you try to post this form, it should display message 'Comment posted.', and the form should disappear.
Conclusion
You can discover all the functions of this plugin by checking source code.
TODO
ZajoPlugin is not finished yet. It has only those three basic Ajax functions, and visual effects functions (show, hide, toggle, effect).
Implement the rest of Ajax functions
Implement whole jQuery UI
Create new visual effect helpers, not for direct changing the document, but to use with like 'before' => visual_effect
Vojto Rinik 