Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

update to latest

  • Loading branch information...
commit e1cdfadfec93b66cc7618def1c213e11e834ce3e 1 parent d7497cf
@maccman authored
Showing with 129 additions and 142 deletions.
  1. +52 −37 README.markdown
  2. +34 −35 superapp.js
  3. +41 −59 superapp.view.js
  4. +2 −11 superclass.js
View
89 README.markdown
@@ -43,31 +43,41 @@ Example:
SuperApp is a state machine, the callbacks available are documented below.
- SuperApp.addState("authorize", {
- load: function(){
- // Triggered on page load
- },
-
- setup: function(){
- // Trigger first time state is used
- },
-
- beforeEnter: function(){
- },
-
- afterEnter: function(){
- },
-
- beforeExit: function(){
- }
+ var App = new SuperClass;
+ App.extend(SuperEvent);
+
+ App.extend({
+ state: new SuperApp,
});
- // 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
- SuperApp.change("authorize");
+ state.afterEnter(function(){
+
+ });
+
+ })(jQuery);
+
+ App.state.change("search", "query");
+
+
+ App.state.change(function(to, state){
+ // change callback
+ })
#SuperApp.view
@@ -90,26 +100,31 @@ Example:
<script src="superapp.view.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
- SuperApp.addState("view1", {
- beforeEnter: function(){
- // #view1 div
- this.viewElement.height(100);
-
- // variable automatically populated from
- // data-element span in the view
- this.userName.text("wem");
- },
+ var app = new SuperApp;
+
- // Enable view support for this state
- view: true
- });
-
- SuperApp.addState("view2", {
- view: true
+ var state = app.add("view1");
+
+ state.beforeEnter(function(){
+ // #view1 div
+ this.viewElement.height(100);
+
+ // 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(){
- SuperApp.change("view1")
+ app.view = new SuperApp.View($("#views"));
+ app.change("view1");
})
</script>
View
69 superapp.js
@@ -1,13 +1,22 @@
-var SuperApp = new SuperClass();
+//= require <superclass>
+//= require <superevent>
-SuperApp.extend({
- states: {},
- current: null,
- observers: [],
+var SuperApp = new SuperClass;
+SuperApp.include(SuperEvent);
+SuperApp.include({
+ init: function(){
+ this.states = {};
+ this.current = new SuperApp.State;
+ },
- addState: function(name, options){
- var state = new this(name, options);
+ add: function(name){
+ var state = new SuperApp.State(this, name);
this.states[name] = state;
+ return state;
+ },
+
+ find: function(name){
+ return(this.states[name]);
},
change: function(){
@@ -18,9 +27,7 @@ SuperApp.extend({
var state = this.states[name];
if ( !state ) throw "Unknown state: " + name;
-
- // if ( state == previous ) return;
-
+
state.runSetup();
previous.beforeExit();
state.beforeEnter.apply(state, args);
@@ -30,32 +37,20 @@ SuperApp.extend({
state.afterEnter();
previous.afterExit();
- for (var i in this.observers) {
- this.observers[i](name);
- }
- },
-
- setup: function(){
- this.current = new this;
- },
-
- onChange: function(cb){
- this.observers.push(cb);
+ this.trigger("change", name, state);
}
});
-SuperApp.include({
- load: function(){},
- setup: function(){},
- beforeEnter: function(){},
- afterEnter: function(){},
- beforeExit: function(){},
- afterExit: function(){},
-
- init: function(name, options){
+SuperApp.State = new SuperClass;
+SuperApp.State.include(SuperEvent);
+
+SuperApp.State.include({
+ init: function(app, name){
+ this.app = app;
this.name = name;
- jQuery.extend(this, options || {});
- jQuery(this.proxy(this.load));
+ jQuery(this.proxy(function(){
+ this.load();
+ }));
},
runSetup: function(){
@@ -65,9 +60,13 @@ SuperApp.include({
}
},
- async: function(callback){
- setTimeout(this.proxy(callback), 20);
+ delay: function(func, timeout){
+ setTimeout(this.proxy(func, timeout || 0));
}
});
-SuperApp.setup();
+SuperApp.State.fn.setupEvents([
+ "beforeEnter", "afterEnter",
+ "beforeExit", "afterExit",
+ "load", "setup"
+]);
View
100 superapp.view.js
@@ -1,28 +1,24 @@
+//= require <superapp>
+//= require <superevent>
if (typeof jQuery.support.CSSAnimation == "undefined")
jQuery.support.CSSAnimation = (typeof WebKitTransitionEvent != "undefined");
-SuperApp.view = new SuperClass();
+SuperApp.View = new SuperClass();
+SuperApp.View.include(SuperEvent);
-SuperApp.view.extend({
- current: null,
- elementSelector: "#views",
- animations: jQuery.support.CSSAnimation,
- observers: [],
-
- findAnimation: function(fview, tview) { },
-
- element: function(){
- return jQuery(this.elementSelector);
+SuperApp.View.include({
+ init: function(element){
+ this.element = jQuery(element);
+ this.animations = jQuery.support.CSSAnimation;
+ this.current = null;
},
- elements: function(){
- return this.element().find("[data-view=*]");
+ find: function(name){
+ return this.element.find("> [data-view='" + name + "']:first");
},
- findView: function(name){
- return this.element().find("[data-view='" + name + "']:first");
- },
+ findAnimation: function(fview, tview) { },
equal: function(fview, tview){
return(fview[0] == tview[0]);
@@ -35,15 +31,14 @@ SuperApp.view.extend({
} else {
if(fromView) fromView.removeClass("current");
}
- this.current = toView;
},
change: function(name){
var fromView = this.current;
- var toView = this.findView(name);
+ var toView = this.find(name);
if (fromView && this.equal(fromView, toView)) return;
-
+
var animation;
if ( this.animations )
animation = this.findAnimation(fromView, toView);
@@ -61,56 +56,43 @@ SuperApp.view.extend({
this.callback(fromView, toView);
}
- for (var i in this.observers) {
- this.observers[i](toView);
- }
- },
-
- onChange: function(cb){
- this.observers.push(cb);
+ this.current = toView;
+ this.trigger("change");
}
});
if (typeof SuperApp != "undefined") {
- SuperApp.include({
- initWithView: function(){
- jQuery(jQuery.proxy(this.viewLoad, this));
- this.initWithoutView.apply(this, arguments);
- },
-
- viewLoad: function(){
- if ( !this.view ) return;
- this.viewElement = this.findView();
- this.setupElements();
- },
-
- findView: function(){
- return this._class.view.findView(this.name);
+ var oldStateInit = SuperApp.State.fn.init;
+
+ SuperApp.State.include({
+ init: function(){
+ jQuery(this.proxy(this.loadView));
+ oldStateInit.apply(this, arguments);
},
- elementNames: function(){
- var self = this;
- var elements = self.viewElement.find("[data-element]");
- return jQuery.map(elements, function(item, i){
- return jQuery(item).attr("data-element");
- });
- },
-
- 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 + "']");
- });
+ loadView: function(){
+ if ( !this.hasView ) return;
+ this.view = this.app.view.find(this.name);
+ this.view.find("[data-name]").each(this.proxy(function(i, item){
+ item = jQuery(item);
+ this[item.attr("data-name")] = item;
+ }));
}
});
- SuperApp.fn.aliasMethodChain("init", "View");
+ var oldInit = SuperApp.fn.init;
- SuperApp.onChange(function(name){
- var view = SuperApp.current.view;
- if (view == true) view = SuperApp.current.name;
- if (view) SuperApp.view.change(view);
+ SuperApp.include({
+ init: function(){
+ this.on("change", this.proxy(this.changeView));
+ 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);
+ }
});
}
View
13 superclass.js
@@ -1,3 +1,5 @@
+//= require <jquery>
+
var SuperClass = function(parent){
var result = function(){
this.init.apply(this, arguments);
@@ -34,17 +36,6 @@ var SuperClass = function(parent){
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){
var thisObject = this;
return(function(){
Please sign in to comment.
Something went wrong with that request. Please try again.