From: dsc Date: Tue, 28 Feb 2012 08:22:13 +0000 (-0800) Subject: Scaffold now updates page URL after every render. X-Git-Url: http://git.less.ly:3516/?a=commitdiff_plain;h=911493425cce2f2ef8fe8f49f1d02c03bf83431f;p=limn.git Scaffold now updates page URL after every render. --- diff --git a/lib/graph/view.co b/lib/graph/view.co index a734073..e1ccadc 100644 --- a/lib/graph/view.co +++ b/lib/graph/view.co @@ -5,6 +5,7 @@ _ = require 'kraken/underscore' { GraphModel, GraphOption, GraphOptionList, TagSet, } = require 'kraken/graph/model' +root = do -> this DEBOUNCE_RENDER = exports.DEBOUNCE_RENDER = 100ms @@ -58,20 +59,24 @@ GraphOptionsScaffold = exports.GraphOptionsScaffold = Scaffold.extend do # {{{ collectionType : GraphOptionList subviewType : GraphOptionView + # GraphView will set this + ready : false + + initialize : -> - Scaffold::initialize ... @render = _.debounce @render.bind(this), DEBOUNCE_RENDER + Scaffold::initialize ... render: -> - console.log "#this.render() -> .isotope()" + # console.log "#this.render() -> .isotope()" @__super__.render ... + return this unless @ready @$el.isotope do itemSelector : '.field.option' layoutMode : 'masonry' masonry : columnWidth : 10 # itemPositionDataEnabled : true - # animationEngine : 'jquery' /** * Add a GraphOption to this scaffold, rerendering the isotope @@ -91,7 +96,7 @@ GraphOptionsScaffold = exports.GraphOptionsScaffold = Scaffold.extend do # {{{ GraphView = exports.GraphView = BaseView.extend do # {{{ - __bind__ : <[ render renderAll ]> + __bind__ : <[ render renderAll onReady ]> ctorName : 'GraphView' tagName : 'section' className : 'graph' @@ -101,6 +106,9 @@ GraphView = exports.GraphView = BaseView.extend do # {{{ 'keypress form.options .value' : 'onKeypress' 'submit form.options' : 'onSubmit' + ready: false + + initialize : (o={}) -> @model or= new GraphModel @@ -113,7 +121,7 @@ GraphView = exports.GraphView = BaseView.extend do # {{{ @model.on 'change', @render, this @model.on 'change:options', ~> changes = @model.changedAttributes() - console.log 'Model.changed(options) ->', changes + # console.log 'Model.changed(options) ->', changes @chartOptions changes, {+silent} @build() @@ -124,14 +132,17 @@ GraphView = exports.GraphView = BaseView.extend do # {{{ @scaffold.collection.reset that if o.graph_spec @scaffold.on 'change', (scaffold, value, key, field) ~> - console.log "scaffold.change!", value, key, field - @model.setOption key, value, {+silent} + # console.log "scaffold.change!", value, key, field + @model.setOption key, value, {+silent} unless field.isDefault() options = @model.get 'options', {} @chartOptions options, {+silent} - _.delay @renderAll, DEBOUNCE_RENDER + _.delay @onReady, DEBOUNCE_RENDER + onReady: -> + @ready = @scaffold.ready = true + @renderAll() chartOptions: (values, opts) -> # Handle @chartOptions(k, v, opts) @@ -149,6 +160,7 @@ GraphView = exports.GraphView = BaseView.extend do # {{{ render: -> + return this unless @ready options = @chartOptions() w = options.width or= @scaffold.get 'width' .getValue() or 480 h = options.height or= @scaffold.get 'height' .getValue() or 320 @@ -157,14 +169,13 @@ GraphView = exports.GraphView = BaseView.extend do # {{{ # Remove old style, as it confuses dygraph after options update @viewport.attr 'style', '' - console.log "#this" - console.log do - " .viewport.{ width=%s, height=%s, style=%s }" - @viewport.css('width') - @viewport.css('height') - @viewport.attr 'style' - # @viewport - console.log ' .options:', JSON.stringify options + # console.log "#this" + # console.log do + # " .viewport.{ width=%s, height=%s, style=%s }" + # @viewport.css('width') + # @viewport.css('height') + # @viewport.attr 'style' + # console.log ' .options:', JSON.stringify options # @chart?.destroy() unless @chart @@ -176,9 +187,15 @@ GraphView = exports.GraphView = BaseView.extend do # {{{ @chart.updateOptions options @chart.resize w, h + path = root.location?.path or '/' + url = "#path?#{@toKVPairs()}" + # console.log 'History.pushState', url + History.pushState url, @model.get('name', root.document?.title or ''), url + this renderAll: -> + return this unless @ready _.invoke @scaffold.subviews, 'render' @scaffold.render() @render() @@ -188,12 +205,12 @@ GraphView = exports.GraphView = BaseView.extend do # {{{ $(evt.target).submit() if evt.keyCode is 13 onSubmit: -> - console.log "#this.onSubmit!" + # console.log "#this.onSubmit!" @render() false toKVPairs: -> - @model.toKVPairs ... + @model.toKVPairs.apply @model, arguments toString: -> "#{@ctorName}(#{@model})" # }}} diff --git a/lib/main.co b/lib/main.co index 5ba6cc9..f226812 100644 --- a/lib/main.co +++ b/lib/main.co @@ -1,20 +1,38 @@ -{_, op} = require 'kraken/util' -{BaseView} = require 'kraken/base' -{ Field, FieldList, FieldView, Scaffold -} = require 'kraken/scaffold' +{ _, op +} = require 'kraken/util' +{ BaseView, BaseModel, BaseList, +} = require 'kraken/base' +{ Field, FieldList, FieldView, Scaffold, +} = require 'kraken/scaffold' { GraphView, GraphModel, TagSet, GraphOption, GraphOptionList, GraphOptionView, GraphOptionsScaffold, -} = require 'kraken/graph' +} = require 'kraken/graph' root = do -> this # Create the Graph Scaffold main = -> - graph = root.graph = new GraphView { - graph_spec: CHART_OPTIONS_SPEC - } + History.Adapter.bind window, 'statechange', -> + console.log 'StateChange!', String root.location + + graph = root.graph = new GraphView do + graph_spec : CHART_OPTIONS_SPEC + + # If we got querystring args, apply them to the graph + if root.location?.search.slice 1 + g = _.uncollapseObject _.fromKVPairs that + # yarr, have to do options separately or everything goes to shit + options = delete g.options + graph.model.set g, {+silent} + graph.chartOptions options, {+silent} + + # Flush all changes once the DOM settles + _.defer do + -> graph.scaffold.invoke 'change' + 50 + $ '#content .inner' .append graph.el diff --git a/lib/scaffold/model.co b/lib/scaffold/model.co index 91ff110..5049c87 100644 --- a/lib/scaffold/model.co +++ b/lib/scaffold/model.co @@ -15,7 +15,7 @@ Field = exports.Field = BaseModel.extend do # {{{ initialize: -> @set 'value', @get('default'), {+silent} if not @has 'value' # console.log "#this.initialize!" - @on 'all', (evt) ~> console.log "#this.trigger(#evt)" + # @on 'all', (evt) ~> console.log "#this.trigger(#evt)" # Model defaults defaults: -> @@ -37,7 +37,7 @@ Field = exports.Field = BaseModel.extend do # {{{ type = _ (type or @get 'type').toLowerCase() for t of <[ Integer Float Boolean Object Array Function ]> if type.startsWith t.toLowerCase() - console.log "parse#t ->", @["parse#t"] unless @["parse#t"] + # console.log "parse#t ->", @["parse#t"] unless @["parse#t"] return @["parse#t"] @parseString diff --git a/lib/underscore/object.co b/lib/underscore/object.co index 22f7fe1..b47d650 100644 --- a/lib/underscore/object.co +++ b/lib/underscore/object.co @@ -60,8 +60,8 @@ _obj = do {} /** - * @returns {Object} Copies and flattens any sub-objects into namespaced keys on the parent object, - * such that `{ "foo":{ "bar":1 } }` becomes `{ "foo.bar":1 }`. + * Copies and flattens any sub-objects into namespaced keys on the parent object, such + * that `{ "foo":{ "bar":1 } }` becomes `{ "foo.bar":1 }`. */ collapseObject: (obj, parent={}, prefix='') -> prefix += '.' if prefix @@ -72,6 +72,10 @@ _obj = do parent[prefix+k] = v parent + /** + * Inverse of `.collapseObject()` -- copies and expands any dot-namespaced keys in the object, such + * that `{ "foo.bar":1 }` becomes `{ "foo":{ "bar":1 }}`. + */ uncollapseObject: (obj) -> _.reduce do obj diff --git a/www/modules.yaml b/www/modules.yaml index 58f267f..4a56d7d 100644 --- a/www/modules.yaml +++ b/www/modules.yaml @@ -4,17 +4,17 @@ all: - vendor: - es5-shim.min - modernizr.min - - browserify - - require - json2.min - jquery.min - jquery.history.min - jquery.hotkeys.min - jquery.isotope.min - - jquery.tipsy.min + # - jquery.tipsy.min - spin.min - jquery.spin.min - bootstrap.min + - browserify + - require - underscore.mod - underscore.string.mod - backbone