Ajax Machine Plugins

Overview

We have seen a basic Ajax machine and an Ajax machine with before and after events so far. This article introduces plugins. Plugins are special handlers for before and after events. Once registered with the Ajax Machine they receive before and after events for all actions. They can introspect the action and choose to execute or skip.

Demo

This demo combines the previous two articles by providing an edit mode and a sort mode. Both the modes display an in-place modal to focus the user.

    Note: The above code is for demonstration and does not really save anything.

Some Tidbits

1. All plugins are called after any handlers that are registered for the action
2. Plugin results determine if the next step (binding/changing state) is executed.

Demo Example

$(function(){
  canEdit = function(widget){
    return confirm("Are you sure?");
};

inplaceModalPlugin = {
    after: function(widget, action){
        if($.inArray(action.name, ["edit", "sort"]) != -1){
            $(widget.element).inplaceModal();
            $(widget.element).inplaceModal("show");
        }
        if($.inArray(action.name, ["close", "cancel", "view"]) != -1){
            $(widget.element).inplaceModal("hide");
        }
        return true;
    }
};

makeSortable = function(widget){
    $("#list_items_container").sortable({
        opacity: 0.7,
        revert: true,
        scroll: true, 
        handle: $(".drag_handle"),
        cursor: "move",
        axis:'y',
        placeholder: 'sort_placeholder'
        });
        return true;  
};

$("#plugins_demo_container").ajaxMachine({
    prefix: function(widget){return "#plugins_demo_container";},
    plugins: [inplaceModalPlugin],
    startStateName: "view",
    states: {
        view: {
            actions: [
                $.ajaxAction("edit", "edit", {before:canEdit}),
                $.ajaxAction("sort", "sort", {after:makeSortable})
            ]},
        edit: {actions: [$.ajaxAction("view", "view")]},
        sort: {actions: [$.ajaxAction("view", "view")]}
    }
});
});

This series

1. Basics
2. Events
3. Plugins
4. Posting forms
5. Advanced machines