From 5cbcc853dac3b9fedb1f3053cee13736a7e6a4ef Mon Sep 17 00:00:00 2001 From: dsc Date: Fri, 13 Apr 2012 10:30:04 -0700 Subject: [PATCH] Data UI now renders and responds to most events. Propagation of changes needs cleanup. --- lib/base/base-model.co | 11 +++++++---- lib/base/base-view.co | 8 ++++++++ lib/dataset/data-view.co | 36 +++++++++++++++++++----------------- lib/dataset/dataset-model.co | 11 +++++++++-- lib/dataset/dataset-view.co | 22 +++++++++++++++++++--- lib/dataset/datasource-model.co | 37 ++++++++++++++++++++++++++++++++----- lib/dataset/metric-model.co | 2 ++ lib/graph/graph-edit-view.co | 11 ++++++++++- lib/graph/graph-model.co | 10 +++++----- lib/template/graph-edit.jade | 6 +++--- www/css/data.styl | 2 +- 11 files changed, 115 insertions(+), 41 deletions(-) diff --git a/lib/base/base-model.co b/lib/base/base-model.co index 229f29e..f26b8b3 100644 --- a/lib/base/base-model.co +++ b/lib/base/base-model.co @@ -144,10 +144,13 @@ BaseList = exports.BaseList = Backbone.Collection.extend mixinBase do # {{{ "?#{@toKV ...}" toString: -> - modelIds = @models - .map -> "\"#{it.id ? it.cid}\"" - .join ', ' - "#{@getClassName()}[#{@length}](#modelIds)" + "#{@getClassName()}[#{@length}]" + + # toString: -> + # modelIds = @models + # .map -> "\"#{it.id ? it.cid}\"" + # .join ', ' + # "#{@getClassName()}[#{@length}](#modelIds)" # }}} diff --git a/lib/base/base-view.co b/lib/base/base-view.co index 2378094..8172727 100644 --- a/lib/base/base-view.co +++ b/lib/base/base-view.co @@ -70,6 +70,9 @@ BaseView = exports.BaseView = Backbone.View.extend mixinBase do # {{{ hasSubview: (view) -> _.any @subviews, ([v]) -> v is view + invokeSubviews: -> + _ _.pluck(@subviews, 0) .invoke ...arguments + attachSubviews: -> for [view, selector] of @subviews return unless view @@ -82,6 +85,11 @@ BaseView = exports.BaseView = Backbone.View.extend mixinBase do # {{{ view.delegateEvents() this + removeAllSubviews: -> + @invokeSubviews 'remove' + _.pluck @subviews, 0 .forEach @removeSubview, this + this + ### Rendering Chain diff --git a/lib/dataset/data-view.co b/lib/dataset/data-view.co index 4685e5b..cc6c781 100644 --- a/lib/dataset/data-view.co +++ b/lib/dataset/data-view.co @@ -31,6 +31,22 @@ DataView = exports.DataView = BaseView.extend do # {{{ @on 'ready', @onReady, this @load() + onReady: -> + dataset = @model + @metric_edit_view = @addSubview new MetricEditView {@graph_id, dataset, @datasources} + @metric_edit_view + .on 'update', @onUpdateMetric, this + + @dataset_view = @addSubview new DataSetView {@model, @graph_id, dataset, @datasources} + @dataset_view + .on 'add-metric', @onMetricsChanged, this + .on 'remove-metric', @onMetricsChanged, this + .on 'edit-metric', @editMetric, this + + @attachSubviews() + this + + load: -> @wait() @@ -63,22 +79,6 @@ DataView = exports.DataView = BaseView.extend do # {{{ ds - onReady: -> - dataset = @model - @metric_edit_view = @addSubview new MetricEditView {@graph_id, dataset, @datasources} - @metric_edit_view - .on 'update', @onUpdateMetric, this - - @dataset_view = @addSubview new DataSetView {@model, @graph_id, dataset, @datasources} - @dataset_view - .on 'add-metric', @onMetricsChanged, this - .on 'remove-metric', @onMetricsChanged, this - .on 'edit-metric', @editMetric, this - - @attachSubviews() - this - - toTemplateLocals: -> attrs = _.clone @model.attributes { $, _, op, @model, view:this, @graph_id, @datasources, } import attrs @@ -97,9 +97,11 @@ DataView = exports.DataView = BaseView.extend do # {{{ editMetric: (metric) -> @metric_edit_view.editMetric metric + @onMetricsChanged() onMetricsChanged: -> - @$el.css 'min-height', @dataset_view.$el.height() + # console.log 'onMetricsChanged!' + @$el.css 'min-height', Math.max @dataset_view.$el.height(), @metric_edit_view.$el.height() onUpdateMetric: -> @renderSubviews() diff --git a/lib/dataset/dataset-model.co b/lib/dataset/dataset-model.co index 9cd82d3..fc8983c 100644 --- a/lib/dataset/dataset-model.co +++ b/lib/dataset/dataset-model.co @@ -36,8 +36,9 @@ DataSet = exports.DataSet = BaseModel.extend do # {{{ initialize : -> BaseModel::initialize ... @sources = new DataSourceList - if @attributes.metrics - @metrics = that.columns = new MetricList that.columns + mx = @attributes.metrics or= {} + @metrics = new MetricList mx.columns + @on 'change:metrics', @onMetricChange, this defaults : -> @@ -72,5 +73,11 @@ DataSet = exports.DataSet = BaseModel.extend do # {{{ m + onMetricChange: -> + mx = @get 'metrics' + cols = mx.columns.map (col) -> + _.clone(col) import mx.defaults + @metrics.reset cols + # }}} diff --git a/lib/dataset/dataset-view.co b/lib/dataset/dataset-view.co index b98169c..aeb6910 100644 --- a/lib/dataset/dataset-view.co +++ b/lib/dataset/dataset-view.co @@ -24,10 +24,13 @@ DataSetView = exports.DataSetView = BaseView.extend do # {{{ BaseView ... initialize: -> - @graph_id = @options.graph_id + {@graph_id, @datasources, @dataset} = @options BaseView::initialize ... @views_by_cid = {} - @model.metrics.on 'add', @addMetric, this + @addAllMetrics() + @model.metrics.on 'add', @addMetric, this + @model.metrics.on 'remove', @removeMetric, this + @model.metrics.on 'reset', @addAllMetrics, this newMetric: -> @@ -39,7 +42,7 @@ DataSetView = exports.DataSetView = BaseView.extend do # {{{ addMetric: (metric) -> console.log "#this.addMetric!", metric if metric.view - @removeSubview metric.view + @removeSubview metric.view.remove() delete @views_by_cid[metric.cid] view = @addSubview new DataSetMetricView {model:metric, @graph_id} @@ -50,6 +53,19 @@ DataSetView = exports.DataSetView = BaseView.extend do # {{{ @trigger 'add-metric', metric, view, this view + removeMetric: (metric) -> + console.log "#this.removeMetric!", metric + if view = metric.view + @removeSubview view.remove() + delete @views_by_cid[metric.cid] + @trigger 'remove-metric', metric, view, this + metric.view + + addAllMetrics: -> + @removeAllSubviews() + @model.metrics.each @addMetric, this + this + editMetric: (metric) -> console.log "#this.editMetric!", metric if metric instanceof [jQuery.Event, Event] diff --git a/lib/dataset/datasource-model.co b/lib/dataset/datasource-model.co index d51b904..61a9660 100644 --- a/lib/dataset/datasource-model.co +++ b/lib/dataset/datasource-model.co @@ -55,11 +55,38 @@ DataSourceList = exports.DataSourceList = BaseList.extend do # {{{ urlRoot : '/datasources' model : DataSource - constructor: function DataSourceList - BaseList ... - - initialize : -> - BaseList::initialize ... + constructor: function DataSourceList then BaseList ... + initialize : -> BaseList::initialize ... # }}} + + +/* * * * DataSource Cache * * * */ + +DataSource import do + CACHE : new DataSourceList + + register: (model) -> + # console.log "#{@CACHE}.register(#{model.id or model.get('id')})", model + if @CACHE.contains model + @CACHE.remove model, {+silent} + @CACHE.add model + model + + get: (id) -> + @CACHE.get id + + lookup: (id, cb) -> + # console.log "#{@CACHE}.lookup(#id, #{typeof cb})" + if @CACHE.get id + cb null, that + else + Cls = this + @register new Cls {id} + .on 'ready', -> cb null, it + + +_.bindAll DataSource, 'register', 'get', 'lookup' + + diff --git a/lib/dataset/metric-model.co b/lib/dataset/metric-model.co index dcaa418..b3630bd 100644 --- a/lib/dataset/metric-model.co +++ b/lib/dataset/metric-model.co @@ -68,4 +68,6 @@ MetricList = exports.MetricList = BaseList.extend do # {{{ model : Metric constructor: function MetricList then BaseList ... + initialize: -> BaseList::initialize ... + # }}} diff --git a/lib/graph/graph-edit-view.co b/lib/graph/graph-edit-view.co index 67fd78d..526598a 100644 --- a/lib/graph/graph-edit-view.co +++ b/lib/graph/graph-edit-view.co @@ -29,7 +29,8 @@ GraphEditView = exports.GraphEditView = BaseView.extend do # {{{ __bind__ : <[ render renderAll stopAndRender stopAndRenderAll resizeViewport wait unwait checkWaiting numberFormatter numberFormatterHTML - onReady onSync onModelChange onScaffoldChange onFirstClickRenderOptionsTab + onReady onSync onModelChange onScaffoldChange + onFirstClickRenderOptionsTab onFirstClickRenderDataTab ]> __debounce__: <[ render renderAll ]> tagName : 'section' @@ -104,6 +105,8 @@ GraphEditView = exports.GraphEditView = BaseView.extend do # {{{ @scaffold.on 'change', @onScaffoldChange @chartOptions @model.getOptions(), {+silent} + @$el.on 'click', '.graph-data-tab', @onFirstClickRenderDataTab + # Rerender the options boxes once the tab is visible # Can't use @events because we need to bind before registering @$el.on 'click', '.graph-options-tab', @onFirstClickRenderOptionsTab @@ -465,6 +468,12 @@ GraphEditView = exports.GraphEditView = BaseView.extend do # {{{ @$el.off 'click', '.graph-options-tab', @onFirstClickRenderOptionsTab @scaffold.render() + onFirstClickRenderDataTab: -> + # @$el.off 'click', '.graph-data-tab', @onFirstClickRenderDataTab + _.delay do + ~> @data.onMetricsChanged() + 100 + onKeypress: (evt) -> $(evt.target).submit() if evt.keyCode is 13 diff --git a/lib/graph/graph-model.co b/lib/graph/graph-model.co index 8e007ac..d0cfa09 100644 --- a/lib/graph/graph-model.co +++ b/lib/graph/graph-model.co @@ -91,8 +91,8 @@ Graph = exports.Graph = BaseModel.extend do # {{{ @chartType = ChartType.lookup @get('chartType') # Insert submodels in place of JSON - # @get('dataset') - @set 'data', new DataSet(@get('data')), {+silent} + # data = @get('data') or @get('dataset') + @set 'data', @dataset = new DataSet(@get('data')), {+silent} @trigger 'init', this @load() if opts.autoload @@ -115,6 +115,7 @@ Graph = exports.Graph = BaseModel.extend do # {{{ next.ok() success : @unwaitAnd (model, res) ~> # console.log "#{this}.fetch() --> success!", res + @dataset.set @get('data') next.ok res .seq_ (next) ~> next.ok @get('parents') @@ -268,6 +269,7 @@ Graph = exports.Graph = BaseModel.extend do # {{{ kvo = @toJSON opts kvo.parents = JSON.stringify kvo.parents delete kvo.slug unless opts.keepSlug + delete kvo.data # console.group 'toKVPairs' # console.log '[IN]', JSON.stringify kvo @@ -323,10 +325,8 @@ GraphList = exports.GraphList = BaseList.extend do # {{{ /* * * * Visualization Cache for parent-lookup * * * {{{ */ -GRAPH_CACHE = exports.GRAPH_CACHE = new GraphList - Graph import do - CACHE : GRAPH_CACHE + CACHE : new GraphList register: (model) -> # console.log "#{@CACHE}.register(#{model.id or model.get('id')})", model diff --git a/lib/template/graph-edit.jade b/lib/template/graph-edit.jade index 580e728..04dd3cc 100644 --- a/lib/template/graph-edit.jade +++ b/lib/template/graph-edit.jade @@ -34,9 +34,9 @@ section.graph.graph-edit(id=graph_id) li .graph-spinner h3 Graph - li.active: a(href="##{graph_id}-tab-info", data-toggle="tab") Info - li: a(href="##{graph_id}-tab-data", data-toggle="tab") Data - li: a.graph-options-tab(href="##{graph_id}-tab-options", data-toggle="tab") Options + li.active: a.graph-info-tab(href="##{graph_id}-tab-info", data-toggle="tab") Info + li: a.graph-data-tab(href="##{graph_id}-tab-data", data-toggle="tab") Data + li: a.graph-options-tab(href="##{graph_id}-tab-options", data-toggle="tab") Options //--- Tab Panes ---// diff --git a/www/css/data.styl b/www/css/data.styl index 9ab1258..3016561 100644 --- a/www/css/data.styl +++ b/www/css/data.styl @@ -183,7 +183,7 @@ section.graph section.data-ui height 100% display table-cell float none - max-width 200px + width 200px .datasource-sources-details display table-cell -- 1.7.0.4