Skip to content

Commit

Permalink
update to latest
Browse files Browse the repository at this point in the history
  • Loading branch information
maccman committed Sep 11, 2010
1 parent d7497cf commit e1cdfad
Show file tree
Hide file tree
Showing 4 changed files with 129 additions and 142 deletions.
89 changes: 52 additions & 37 deletions README.markdown
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -43,31 +43,41 @@ Example:


SuperApp is a state machine, the callbacks available are documented below. SuperApp is a state machine, the callbacks available are documented below.


SuperApp.addState("authorize", { var App = new SuperClass;
load: function(){ App.extend(SuperEvent);
// Triggered on page load
}, App.extend({

state: new SuperApp,
setup: function(){
// Trigger first time state is used
},

beforeEnter: function(){
},
afterEnter: function(){
},

beforeExit: function(){
}
}); });


// Callback
SuperApp.onChange(function(){ (function($){

var state = App.state.add("search");

state.load(function(){
// On page load
});

state.setup(function(){
// When first entered
});

state.beforeEnter(function(query){
}); });


// Change state state.afterEnter(function(){
SuperApp.change("authorize");
});

})(jQuery);

App.state.change("search", "query");


App.state.change(function(to, state){
// change callback
})


#SuperApp.view #SuperApp.view


Expand All @@ -90,26 +100,31 @@ Example:
<script src="superapp.view.js" type="text/javascript" charset="utf-8"></script> <script src="superapp.view.js" type="text/javascript" charset="utf-8"></script>


<script type="text/javascript" charset="utf-8"> <script type="text/javascript" charset="utf-8">
SuperApp.addState("view1", { var app = new SuperApp;
beforeEnter: function(){
// #view1 div
this.viewElement.height(100);
// variable automatically populated from
// data-element span in the view
this.userName.text("wem");
},


// Enable view support for this state var state = app.add("view1");
view: true
}); state.beforeEnter(function(){

// #view1 div
SuperApp.addState("view2", { this.viewElement.height(100);
view: true
// variable automatically populated from
// data-element span in the view
this.userName.text("wem");
}); });
state.hasView = true;
var state2 = app.add("view2");
state2.hasView = true;


var state2 = app.add("view2");
state2.hasView = true;

jQuery(function(){ jQuery(function(){
SuperApp.change("view1") app.view = new SuperApp.View($("#views"));
app.change("view1");
}) })
</script> </script>


Expand Down
69 changes: 34 additions & 35 deletions superapp.js
Original file line number Original file line Diff line number Diff line change
@@ -1,13 +1,22 @@
var SuperApp = new SuperClass(); //= require <superclass>
//= require <superevent>


SuperApp.extend({ var SuperApp = new SuperClass;
states: {}, SuperApp.include(SuperEvent);
current: null, SuperApp.include({
observers: [], init: function(){
this.states = {};
this.current = new SuperApp.State;
},


addState: function(name, options){ add: function(name){
var state = new this(name, options); var state = new SuperApp.State(this, name);
this.states[name] = state; this.states[name] = state;
return state;
},

find: function(name){
return(this.states[name]);
}, },


change: function(){ change: function(){
Expand All @@ -18,9 +27,7 @@ SuperApp.extend({
var state = this.states[name]; var state = this.states[name];


if ( !state ) throw "Unknown state: " + name; if ( !state ) throw "Unknown state: " + name;


// if ( state == previous ) return;

state.runSetup(); state.runSetup();
previous.beforeExit(); previous.beforeExit();
state.beforeEnter.apply(state, args); state.beforeEnter.apply(state, args);
Expand All @@ -30,32 +37,20 @@ SuperApp.extend({
state.afterEnter(); state.afterEnter();
previous.afterExit(); previous.afterExit();


for (var i in this.observers) { this.trigger("change", name, state);
this.observers[i](name);
}
},

setup: function(){
this.current = new this;
},

onChange: function(cb){
this.observers.push(cb);
} }
}); });


SuperApp.include({ SuperApp.State = new SuperClass;
load: function(){}, SuperApp.State.include(SuperEvent);
setup: function(){},
beforeEnter: function(){}, SuperApp.State.include({
afterEnter: function(){}, init: function(app, name){
beforeExit: function(){}, this.app = app;
afterExit: function(){},

init: function(name, options){
this.name = name; this.name = name;
jQuery.extend(this, options || {}); jQuery(this.proxy(function(){
jQuery(this.proxy(this.load)); this.load();
}));
}, },


runSetup: function(){ runSetup: function(){
Expand All @@ -65,9 +60,13 @@ SuperApp.include({
} }
}, },


async: function(callback){ delay: function(func, timeout){
setTimeout(this.proxy(callback), 20); setTimeout(this.proxy(func, timeout || 0));
} }
}); });


SuperApp.setup(); SuperApp.State.fn.setupEvents([
"beforeEnter", "afterEnter",
"beforeExit", "afterExit",
"load", "setup"
]);
100 changes: 41 additions & 59 deletions superapp.view.js
Original file line number Original file line Diff line number Diff line change
@@ -1,28 +1,24 @@
//= require <superapp>
//= require <superevent>


if (typeof jQuery.support.CSSAnimation == "undefined") if (typeof jQuery.support.CSSAnimation == "undefined")
jQuery.support.CSSAnimation = (typeof WebKitTransitionEvent != "undefined"); jQuery.support.CSSAnimation = (typeof WebKitTransitionEvent != "undefined");


SuperApp.view = new SuperClass(); SuperApp.View = new SuperClass();
SuperApp.View.include(SuperEvent);


SuperApp.view.extend({ SuperApp.View.include({
current: null, init: function(element){
elementSelector: "#views", this.element = jQuery(element);
animations: jQuery.support.CSSAnimation, this.animations = jQuery.support.CSSAnimation;
observers: [], this.current = null;

findAnimation: function(fview, tview) { },

element: function(){
return jQuery(this.elementSelector);
}, },


elements: function(){ find: function(name){
return this.element().find("[data-view=*]"); return this.element.find("> [data-view='" + name + "']:first");
}, },


findView: function(name){ findAnimation: function(fview, tview) { },
return this.element().find("[data-view='" + name + "']:first");
},


equal: function(fview, tview){ equal: function(fview, tview){
return(fview[0] == tview[0]); return(fview[0] == tview[0]);
Expand All @@ -35,15 +31,14 @@ SuperApp.view.extend({
} else { } else {
if(fromView) fromView.removeClass("current"); if(fromView) fromView.removeClass("current");
} }
this.current = toView;
}, },


change: function(name){ change: function(name){
var fromView = this.current; var fromView = this.current;
var toView = this.findView(name); var toView = this.find(name);


if (fromView && this.equal(fromView, toView)) return; if (fromView && this.equal(fromView, toView)) return;

var animation; var animation;
if ( this.animations ) if ( this.animations )
animation = this.findAnimation(fromView, toView); animation = this.findAnimation(fromView, toView);
Expand All @@ -61,56 +56,43 @@ SuperApp.view.extend({
this.callback(fromView, toView); this.callback(fromView, toView);
} }


for (var i in this.observers) { this.current = toView;
this.observers[i](toView); this.trigger("change");
}
},

onChange: function(cb){
this.observers.push(cb);
} }
}); });


if (typeof SuperApp != "undefined") { if (typeof SuperApp != "undefined") {


SuperApp.include({ var oldStateInit = SuperApp.State.fn.init;
initWithView: function(){
jQuery(jQuery.proxy(this.viewLoad, this)); SuperApp.State.include({
this.initWithoutView.apply(this, arguments); init: function(){
}, jQuery(this.proxy(this.loadView));

oldStateInit.apply(this, arguments);
viewLoad: function(){
if ( !this.view ) return;
this.viewElement = this.findView();
this.setupElements();
},

findView: function(){
return this._class.view.findView(this.name);
}, },


elementNames: function(){ loadView: function(){
var self = this; if ( !this.hasView ) return;
var elements = self.viewElement.find("[data-element]"); this.view = this.app.view.find(this.name);
return jQuery.map(elements, function(item, i){ this.view.find("[data-name]").each(this.proxy(function(i, item){
return jQuery(item).attr("data-element"); item = jQuery(item);
}); this[item.attr("data-name")] = item;
}, }));

setupElements: function(){
var self = this;
// We're doing it in this convoluted way, so live events still work.
jQuery.each(this.elementNames(), function(i, name){
self[name] = self.viewElement.find("[data-element='" + name + "']");
});
} }
}); });


SuperApp.fn.aliasMethodChain("init", "View"); var oldInit = SuperApp.fn.init;


SuperApp.onChange(function(name){ SuperApp.include({
var view = SuperApp.current.view; init: function(){
if (view == true) view = SuperApp.current.name; this.on("change", this.proxy(this.changeView));
if (view) SuperApp.view.change(view); oldInit.apply(this, arguments);
},

changeView: function(){
if ( !this.current || !this.current.hasView ) return;
if ( !this.view ) throw "View not connected";
this.view.change(this.current.name);
}
}); });
} }
13 changes: 2 additions & 11 deletions superclass.js
Original file line number Original file line Diff line number Diff line change
@@ -1,3 +1,5 @@
//= require <jquery>

var SuperClass = function(parent){ var SuperClass = function(parent){
var result = function(){ var result = function(){
this.init.apply(this, arguments); this.init.apply(this, arguments);
Expand Down Expand Up @@ -34,17 +36,6 @@ var SuperClass = function(parent){
if (included) included(result) if (included) included(result)
}; };


result.aliasMethod = function(newName, oldName){
this[newName] = this[oldName];
};
result.fn.aliasMethod = result.aliasMethod;

result.aliasMethodChain = function(method, name){
this.aliasMethod(method + "Without" + name, method);
this.aliasMethod(method, method + "With" + name);
};
result.fn.aliasMethodChain = result.aliasMethodChain;

result.proxy = function(func){ result.proxy = function(func){
var thisObject = this; var thisObject = this;
return(function(){ return(function(){
Expand Down

0 comments on commit e1cdfad

Please sign in to comment.