@@ -15,7 +15,7 @@ <script type="text/javascript" charset="utf-8"> $(document).ready(function() { - $('body').polypage([]); + $('body').polypage(); }); </script> index.html @@ -1,7 +1,7 @@ /* * PolyPage 0.9.0 [dev] * - * Copyright (c) 2007 New Bamboo (new-bamboo.co.uk) + * Copyright (c) 2009 Andy Kent * Dual licensed under the MIT and GPL licenses: * http://www.opensource.org/licenses/mit-license.php * http://www.gnu.org/licenses/gpl.html @@ -10,80 +10,90 @@ * * For help please open the index.html file in your web browser. * - * Developed by Andy Kent & Natalie Downe + * Developed by Andy Kent */ (function($) { - $.fn.polypage = function(defaults, opts) { - $.polypage.init(defaults,opts,this); + $.fn.polypage = function(opts) { + return this.each(function() { new $.polypage(this, opts); }); }; - $.polypage = { + $.polypage = function(scope, options) { + this.scope = $(scope); + this.options = $.extend($.polypage.DEFAULTS, options||{}); + this.init(); + }; + + $.polypage.DEFAULTS = { + prefix: 'pp', + separator: '_', + label: "Page States:" + }; - states: null, + $.polypage.prototype = { + init: function(){ + this.findStates(); + // this.buildOptionsBar(elems); + this.bindEvents(); + this.setStartStates(); + this.refresh(); + }, - options: { - prefix: 'pp', - separator: '_', - label: "Page States:", - closed: false + + setState: function(stateName,val){ + var newState = !!val; + this.states[stateName] = newState; + this.setCookie(stateName, newState); + this.refresh(); + return newState; + }, + + getState: function(stateName){ + return this.states[stateName]; + }, + + toggleState: function(stateName) { + return this.setState(stateName, !this.getState(stateName)); }, - init: function(defaults, opts, elems){ - var elems = elems || 'body'; - $.extend(this.options,opts); - this.findStates(); - this.buildOptionsBar(elems); - this.setStartValues(defaults); - this.setListeners(); - this.refresh(); + setCookie: function(state,val) { + if(!$.cookie()||!state.length) return; + $.cookie(state, val ? 'yes' : null, {"path":"/"}); + return this; + }, + + + bindEvents: function(){ + var pp = this; + this.scope.bind('pp_setState', function(e, opts) { + console.log("pp_setState", opts) + pp.setState(opts.name, opts.value); + }); + this.scope.bind('pp_toggleState', function(e, opts) { + pp.toggleState(opts.name); + }); + // this.scope.bind('click', this.clickHandler); + // this.scope.bind('submit', this.submitHandler); }, + separated: function(val) { return this.options.separator+val+this.options.separator }, - setStartValues: function(initValues){ - if(initValues) { - for(var i in initValues) { - this.setState(initValues[i]); - } - }; - - return this.setValuesFromHash(window.location.hash); + setStartStates: function(){ + if(this.options.defaultStates) + for(var i in this.options.defaultStates) { this.setState(initValues[i], true); } + this.setValuesFromHash(window.location.hash); }, setValuesFromHash: function(hash) { var hashValues = hash.replace(/^#/,'').split(new RegExp(this.separated('and'))); - - for(var i in hashValues) { - this.setState(hashValues[i]); - } - + for(var i in hashValues) { this.setState(hashValues[i], true); } return this; }, - setListeners: function() { - var self = this; - $(document.body) - .click(function(event) { - var target = $(event.target).closest("a"); - if(target.length && target.attr("href").search(/#.+$/) != -1) { - self.setValuesFromHash(target[0].getAttribute("href")); - event.preventDefault(); - event.stopPropagation(); - } - }) - .submit(function(event) { - var target = $(event.target); - if($(event.target).is("form") && target.attr("action").search(/#.+$/) != -1) { - self.setValuesFromHash(target[0].getAttribute("action")); - event.preventDefault(); - event.stopPropagation(); - } - }); - }, - + findStates: function(){ var el = this.findAll(); var self = this; @@ -94,11 +104,8 @@ for(var state in states) { if(self.states[states[state]]==undefined && states[state]!='') { if($.cookie()){ - // the state may be undefined but if the state has been set on another page - // we need to reset that state in our array to be on self.states[states[state]]=$.cookie(states[state]) != null; } else { - // if we are not using cookies if its not in our aray we dont know about it self.states[states[state]]=false; } } @@ -126,14 +133,11 @@ refresh: function(){ var self = this; - this.findAll().each(function(){ - self.evaluateNode(this); - }); + this.findAll().each(function(){ self.evaluateNode(this); }); return this; }, evaluateNode: function(node){ - // a node is an element with the pp_ class var on = this.evaluate(this.extractDataFromClassName($(node).attr('class'))); // toggle on or off if to be displayed $(node).toggle(on); @@ -148,75 +152,45 @@ .replace(/([a-z_0-9\-]+)/gi,"this.states['$1']"); return eval(str); }, - - setState: function(state,val){ - val = typeof val === "undefined" ? true : !!val; - if(state.substring(0, 3+this.options.separator.length) === "not"+this.options.separator) { - state = state.substring(3+this.options.separator.length); - val = !val; - } - - var state_switch = $('#pp_state_switch_'+state); - var className ='state'+this.options.separator+state; - - if(val) { - this.states[state] = true; - state_switch.addClass('active'); - $('body').addClass(className); - } else { - this.states[state] = false; - state_switch.removeClass('active'); - $('body').removeClass(className); - } - this.setCookie(state,val); - this.refresh(); - return this; - }, - - setCookie: function(state,val) { - if(!$.cookie()||!state.length) return; - $.cookie(state, val ? 'yes' : null, {"path":"/"}); - return this; - }, - alphabeticalStateNames: function(){ - var ret = []; - for(var state in this.states) { ret.push(state); }; - return ret.sort(); - }, - - buildOptionsBar: function(elems){ - if(!this.pageHasPPElements()) return; - var self=this; - $(elems).append('<div id="pp_options"><p>'+this.options.label+'</p><ul></ul></div>'); - - var alphaStates = this.alphabeticalStateNames(); - - for(var index in alphaStates) { - var state = alphaStates[index]; - var val = this.states[state]; - - $('#pp_options ul').append('<li><a href="#'+state+'" id="pp_state_switch_'+state+'">'+state.replace(this.options.separator,' ')+'</a></li>'); - var stateSwitch = $('#pp_state_switch_'+state); - - if($.cookie() && $.cookie(state) != null) { - self.setState(state); - this.refresh(); - }; - } - - $('#pp_options').click(function(event) { - var target = $(event.target).closest('a'); - if(target.length) { - if(target.attr('id')) { - var state = target.attr('id').substring('pp_state_switch_'.length); - self.setState(state,!self.states[state]); - } - event.preventDefault(); - event.stopPropagation(); - } - }); - } + // alphabeticalStateNames: function(){ + // var ret = []; + // for(var state in this.states) { ret.push(state); }; + // return ret.sort(); + // }, + + // buildOptionsBar: function(elems){ + // if(!this.pageHasPPElements()) return; + // var self=this; + // $(elems).append('<div id="pp_options"><p>'+this.options.label+'</p><ul></ul></div>'); + // + // var alphaStates = this.alphabeticalStateNames(); + // + // for(var index in alphaStates) { + // var state = alphaStates[index]; + // var val = this.states[state]; + // + // $('#pp_options ul').append('<li><a href="#'+state+'" id="pp_state_switch_'+state+'">'+state.replace(this.options.separator,' ')+'</a></li>'); + // var stateSwitch = $('#pp_state_switch_'+state); + // + // if($.cookie() && $.cookie(state) != null) { + // self.setState(state); + // this.refresh(); + // }; + // } + // + // $('#pp_options').click(function(event) { + // var target = $(event.target).closest('a'); + // if(target.length) { + // if(target.attr('id')) { + // var state = target.attr('id').substring('pp_state_switch_'.length); + // self.setState(state,!self.states[state]); + // } + // event.preventDefault(); + // event.stopPropagation(); + // } + // }); + // } }; lib/polypage.jquery.js dc51cbb479510e469f59eeb05ac2b2e1be4cbe82 Andy Kent andrew.d.kent@gmail.com http://github.com/andykent/polypage/commit/ba923bccd1b26973241b25adef17c3df4165c474 ba923bccd1b26973241b25adef17c3df4165c474 2009-03-07T14:06:54-08:00 2009-03-07T14:06:54-08:00 switching to a proper polypage object and starting to move over to a more event based system 1bb34b834aff5e5b0386202a187e935f46737c2b Andy Kent andrew.d.kent@gmail.com