Adds directory indices, code comments.

diff --git a/kraken-ui.tmproj b/kraken-ui.tmproj
index 39eb08a..66b50f6 100644 (file)
--- a/kraken-ui.tmproj
+++ b/kraken-ui.tmproj
@@ -12,9 +12,9 @@
                        <key>name</key>
                        <string>kraken-ui</string>
                        <key>regexFileFilter</key>
-                       <string>!(?x: lib/version.js|package\.json |license\.md|paver-minilib\.zip|\.([oa]|dylib|fla|py[co]|mako\.py|pch|cm[oix]|cache|(xcode)proj)|(fish(_read)?_history|fishd\..*)|/Icon\r|/svn-commit(\.[2-9])?\.tmp|/\.(?!(git|svn|npm)ignore|htaccess|gitmodules)[^/]*)$</string>
+                       <string>!(?x: lib/version.js|package\.json |license\.md | \.(png|jpg|gif|ico|psd|ai|zip|tar|gz | [oa]|dylib|fla|py[co]|mako\.py|pch|cm[oix]|cache|(tm|xcode)proj)|(fish(_read)?_history|fishd\..*)|/Icon\r|/svn-commit(\.[2-9])?\.tmp|/\.(?!(git|svn|npm)ignore|htaccess|gitmodules)[^/]*)$</string>
                        <key>regexFolderFilter</key>
-                       <string>!.*/(?x: tmp/dygraphs | data | static/vendor|www/js/kraken-ui | var|target|node_modules|html-template|bin-debug | \.((?!git-hooks)[^/]+) | .*\.(egg-info|framework|app|(pbx?|xcode)proj|xcode|bundle) | CVS|_darcs|_MTN|\{arch\}|blib | .*~\.nib )$</string>
+                       <string>!.*/(?x: tmp/dygraphs | data | static/(vendor|tmp)|www/js/kraken | var|target|node_modules|html-template|bin-debug | \.((?!git-hooks)[^/]+) | .*\.(egg-info|framework|app|(pbx?|xcode)proj|xcode|bundle) | CVS|_darcs|_MTN|\{arch\}|blib | .*~\.nib )$</string>
                        <key>selected</key>
                        <true/>
                        <key>sourceDirectory</key>

diff --git a/lib/graph.co b/lib/graph.co
index 4b1ee61..0d23855 100644 (file)
--- a/lib/graph.co
+++ b/lib/graph.co
@@ -1,5 +1,5 @@
 _ = require 'kraken/underscore'
-{ Field, FieldList, FieldView, Scaffold
+{ Field, FieldList, BaseView, FieldView, Scaffold
 } = require 'kraken/scaffold'
 
 
@@ -11,6 +11,13 @@ GraphOption = exports.GraphOption = Field.extend do # {{{
     # initialize : ->
     #     # console.log "#this.initialize!"
     #     Field::initialize ...
+    
+    toJSON: ->
+        o = Field::toJSON ...
+        for k, v in o
+            o[k] = '' if v!?
+        o
+    
 # }}}
 
 
@@ -53,11 +60,13 @@ GraphOptionView = exports.GraphOptionView = FieldView.extend do # {{{
         @model.setValue val, {+silent}
     
     render: ->
-        outer = $ @template @model.toJSON()
-        @$el.html outer.html()
-            .attr do
-                id    : outer.attr 'id'
-                class : outer.attr('class') + if @isCollapsed then ' collapsed' else ''
+        FieldView::render.call this
+        @$el.addClass 'collapsed' if @isCollapsed
+        # outer = $ @template @model.toJSON()
+        # @$el.html outer.html()
+        #     .attr do
+        #         id    : outer.attr 'id'
+        #         class : outer.attr('class') + if @isCollapsed then ' collapsed' else ''
         this
     
     toggleCollapsed: ->
@@ -71,18 +80,23 @@ GraphOptionView = exports.GraphOptionView = FieldView.extend do # {{{
 
 GraphOptionsScaffold = exports.GraphOptionsScaffold = Scaffold.extend do # {{{
     ctorName       : 'GraphOptionsScaffold'
+    tagName        : 'form'
     className      : 'options scaffold'
     collectionType : GraphOptionList
     subviewType    : GraphOptionView
     
     # initialize : ->
     #     Scaffold::initialize ...
-    #     @$el.isotope do
-    #         itemSelector    : '.field.option'
-    #         layoutMode      : 'masonry'
-    #         masonry         : columnWidth : 10
-    #         animationEngine : 'jquery'
-    #     
+    
+    render: ->
+        @__super__.render ...
+        @$el.isotope do
+            itemSelector    : '.field.option'
+            layoutMode      : 'masonry'
+            masonry         : columnWidth : 100
+            # animationEngine : 'jquery'
+            itemPositionDataEnabled : true
+        
     
 # }}}
 
@@ -113,8 +127,8 @@ GraphModel = exports.GraphModel = Backbone.Model.extend do # {{{
 # }}}
 
 
-GraphView = exports.GraphView = Backbone.View.extend do # {{{
-    ctorName  : 'Graph'
+GraphView = exports.GraphView = BaseView.extend do # {{{
+    ctorName  : 'GraphView'
     tagName   : 'section'
     className : 'graph'
     template  : require 'kraken/template/graph'
@@ -125,19 +139,22 @@ GraphView = exports.GraphView = Backbone.View.extend do # {{{
     
     
     initialize : (o={}) ->
-        {graph_spec} = o
         @model or= new GraphModel
+        BaseView::initialize ...
         
-        @$el.data { model:@model, view:this }
         @model.on 'change',  @render, this
         @model.on 'destroy', @remove, this
         
+        @build()
         @viewport = @$el.find '.viewport'
-        @scaffold = new GraphOptionsScaffold do
-            el: @$el.find 'form.settings'
-        @scaffold.collection.reset graph_spec
         
-        @render()
+        @scaffold = new GraphOptionsScaffold
+        @$el.find 'fieldset' .append @scaffold.el
+        @scaffold.collection.reset that if o.graph_spec
+        
+        setTimeout do
+            ~> @render()
+            50
     
     
     chartOptions: (values) ->
@@ -155,23 +172,36 @@ GraphView = exports.GraphView = Backbone.View.extend do # {{{
             options.values()
     
     render: ->
-        @viewport.empty()
+        # BaseView::render ...
+        
+        options = @chartOptions()
+        w = options.width  or= @scaffold.get 'width'  .getValue() or 480
+        h = options.height or= @scaffold.get 'height' .getValue() or 320
+        @viewport.css { width:w, height:h }
         
         # 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'
-        console.log '  .options:', JSON.stringify @chartOptions()
+            @viewport
+        console.log '  .options:', JSON.stringify options
         
-        @chart?.destroy()
-        @chart = new Dygraph do
-            @viewport.0
-            @model.get 'dataset'
-            @chartOptions()
+        # @chart?.destroy()
+        unless @chart
+            @chart = new Dygraph do
+                @viewport.0
+                @model.get 'dataset'
+                options
+        else
+            @chart.updateOptions options
+            @chart.resize w, h
+        
+        this
     
     onKeypress: (evt) ->
         $(evt.target).submit() if evt.keyCode is 13

diff --git a/lib/main.co b/lib/main.co
index cda2b9b..c995cc4 100644 (file)
--- a/lib/main.co
+++ b/lib/main.co
@@ -1,5 +1,5 @@
-_       = require 'kraken/underscore'
-{   Field, FieldList, FieldView, Scaffold
+{_, op} = require 'kraken/util'
+{   Field, FieldList, BaseView, FieldView, Scaffold
 }       = require 'kraken/scaffold'
 {   GraphView, GraphModel,
     GraphOption, GraphOptionList, GraphOptionView,
@@ -11,10 +11,10 @@ root = do -> this
 
 # Create the Graph Scaffold
 main = ->
-    graph = root.graph = new GraphView { 
+    graph = root.graph = new GraphView {
         graph_spec: CHART_OPTIONS_SPEC
-        el: $ 'section.graph' .eq 0
     }
+    $ '#content' .append graph.el
 
 
 jQuery.ajax do

diff --git a/lib/scaffold.co b/lib/scaffold.co
index 7bf758f..474ff3c 100644 (file)
--- a/lib/scaffold.co
+++ b/lib/scaffold.co
@@ -3,6 +3,8 @@ op = require 'kraken/util/op'
 
 
 
+### Scaffold Models
+
 Field = exports.Field = Backbone.Model.extend do # {{{
     ctorName : 'Field'
     idAttribute : 'name'
@@ -18,6 +20,7 @@ Field = exports.Field = Backbone.Model.extend do # {{{
             default  : null
             desc     : ''
             category : 'General'
+            include  : 'diff'
             tags     : []
             examples : []
         }
@@ -42,8 +45,8 @@ Field = exports.Field = Backbone.Model.extend do # {{{
         parser
     
     
-    getValue: ->
-        @getParser() @get 'value'
+    getValue: (def) ->
+        @getParser() @get 'value', def
     
     setValue: (v, options) ->
         def = @get 'default'
@@ -63,7 +66,7 @@ Field = exports.Field = Backbone.Model.extend do # {{{
         {id:@id} import do
             _.clone(@attributes) import { value:@getValue(), def:@get('default') }
     
-    toString: -> "#{@ctorName}(id=#{@id}, value=#{@get 'value'})"
+    toString: -> "(#{@id}: #{@get 'value'})"
 # }}}
 
 
@@ -84,9 +87,73 @@ FieldList = exports.FieldList = Backbone.Collection.extend do # {{{
 # }}}
 
 
+
+
 ### Views
 
-FieldView = exports.FieldView = Backbone.View.extend do # {{{
+BaseView = exports.BaseView = Backbone.View.extend do # {{{
+    # List of methods to bind on initialize; set on subclass
+    __bind__ : []
+    
+    
+    initialize: ->
+        _.bindAll this, ...@__bind__
+        @__super__ = @constructor.__super__
+        Backbone.View::initialize ...
+        
+        @model.view = this
+        @$el.data { @model, view:this }
+        @model.on 'change',  @render, this
+        @model.on 'destroy', @remove, this
+    
+    
+    toTemplateLocals: ->
+        { $, _, op, @model, view:this } import @model.toJSON()
+    
+    $template: (locals={}) ->
+        $ @template @toTemplateLocals() import locals
+    
+    build: ->
+        return this unless @template
+        
+        outer = @$template()
+        @$el.html outer.html()
+            .attr do
+                id    : outer.attr 'id'
+                class : outer.attr('class')
+        
+        # @$parent = p if (p = @$el.parent()).length
+        this
+    
+    render: ->
+        @build()
+    
+    hide   : -> @$el.hide();      this
+    show   : -> @$el.show();      this
+    remove : -> @$el.remove();    this
+    clear  : -> @model.destroy(); @remove()
+    
+    
+    # remove : ->
+    #     if (p = @$el.parent()).length
+    #         @$parent or= p
+    #         # @parent_index = p.children().indexOf @$el
+    #     @$el.remove()
+    #     this
+    # 
+    # reparent : (parent=@$parent) ->
+    #     parent = $ parent
+    #     @$el.appendTo parent if parent?.length
+    #     this
+    
+    toString : -> "#{@ctorName}(model=#{@model})"
+
+
+# }}}
+
+
+
+FieldView = exports.FieldView = BaseView.extend do # {{{
     tagName   : 'div'
     className : 'field'
     
@@ -97,10 +164,7 @@ FieldView = exports.FieldView = Backbone.View.extend do # {{{
     
     initialize: ->
         # console.log "#this.initialize!"
-        @model.view = this
-        @$el.data { model:@model, view:this }
-        @model.on 'change',  @render, this
-        @model.on 'destroy', @remove, this
+        BaseView::initialize ...
     
     onUIChange: ->
         val     = @$el.find('.value').val()
@@ -110,37 +174,30 @@ FieldView = exports.FieldView = Backbone.View.extend do # {{{
         @model.setValue val, {+silent}
     
     render: ->
-        if @template
-            t = $ @template @model.toJSON()
-            @$el.html t.html()
-                .attr { id:t.attr('id'), class:t.attr('class') }
-            return this
-        
         return @remove() if @model.get 'hidden'
+        return BaseView::render ... if @template
         
         name  = @model.get 'name'
         id    = _.camelize name
         label = name
-        # label = _.humanize name
+        value = @model.get 'value'
+        value = '' if value!?
+        
         @$el.html """
             <label class="name" for="#id">#label</label>
-            <input class="value" type="text" id="#id" name="#id">
+            <input class="value" type="text" id="#id" name="#id" value="#value">
         """
-        # @$el.find '.value' .attr 'value', @model.get 'value'
-        @$el.find '.value' .val @model.get 'value'
+        
         this
     
-    remove   : -> @$el.remove();        this
-    clear    : -> @model.destroy();     this
-    toString : -> "#{@ctorName}(model=#{@model})"
-    
 # }}}
 
 
 # There are several special options that, if passed, will be attached directly to the view:
 #   model, collection, el, id, className, tagName, attributes
 
-Scaffold = exports.Scaffold = Backbone.View.extend do # {{{
+Scaffold = exports.Scaffold = BaseView.extend do # {{{
+    __bind__       : <[ addOne addAll ]>
     tagName        : 'form'
     className      : 'scaffold'
     
@@ -149,11 +206,12 @@ Scaffold = exports.Scaffold = Backbone.View.extend do # {{{
     
     
     initialize: ->
-        _.bindAll this, 'addOne', 'addAll'
         @subviews = []
-        
         CollectionType = @collectionType
         @model = @collection or= new CollectionType
+        
+        BaseView::initialize ...
+        
         @collection.on 'add',   @addOne
         @collection.on 'reset', @addAll
         

diff --git a/lib/server/server.co b/lib/server/server.co
index c933e63..d9a6c44 100755 (executable)
--- a/lib/server/server.co
+++ b/lib/server/server.co
@@ -45,23 +45,26 @@ app.start = ->
 app.configure ->
     mime.define 'text/plain' : <[ jade co styl stylus ]>
     
+    # Set up 
     app.set 'views', WWW
     app.set 'view engine', 'jade'
     app.set 'view options', {
         layout  : false
         pretty  : true
         version : VERSION
-        WWW     : WWW
-        VAR     : VAR
-        STATIC  : STATIC
     } import require './view-helpers'
     
     app.use express.logger() if LOG_LEVEL is 'DEBUG'
+    
+    # Parse form submits into req.params
     app.use express.bodyParser()
+    
+    # Allow "spoofing" HTTP methods that IE doesn't support
     app.use express.methodOverride()
     
+    # Transparently recompile modules that have changed
     app.use compiler do
-        enabled : <[ stylus coco jade-browser yaml ]>
+        enabled : <[ coco jade-browser stylus yaml ]>
         src     : WWW
         dest    : VAR
         options : stylus : { nib:true, include:"#WWW/css" }
@@ -80,17 +83,23 @@ app.configure ->
         dest    : VAR
         options : commonjs : { drop_path_parts:1, drop_full_ext:true }
         log_level : LOG_LEVEL
-    
     app.use require('browserify') do
         mount   : '/vendor/browserify.js'
         require : <[ events seq ]>
     
+    # Serve static files
     app.use express.static WWW
     app.use express.static VAR
     app.use express.static STATIC
     
+    # Route to the web services
     app.use app.router
     
+    # Serve directory listings
+    app.use express.directory WWW
+    app.use express.directory VAR
+    app.use express.directory STATIC
+    
     app.use express.errorHandler do
         dumpExceptions : true
         showStack      : true

diff --git a/lib/server/view-helpers.co b/lib/server/view-helpers.co