Booleans now render as checkboxes, and objects/arrays/functions as textareas.

diff --git a/lib/graph.co b/lib/graph.co
index 17d0356..5f24b30 100644 (file)
--- a/lib/graph.co
+++ b/lib/graph.co
@@ -32,22 +32,6 @@ GraphOptionList = exports.GraphOptionList = FieldList.extend do # {{{
         @categories  = {}
     
     
-    # reset: ->
-    #     FieldList::reset ...
-    #     console.log "#this.reset!"
-    #     
-    #     n = 0
-    #     cats = @categories
-    #     @forEach (field) ->
-    #         cat = field.get('tags', [])[0]
-    #         unless cats[cat]?
-    #             cats[cat] = n++
-    #         field.set 'category', "category_#{cats[cat]}", {+silent}
-    #     
-    #     setTimeout do
-    #         ~> _ _.pluck(@models, 'view') .invoke 'render'
-    #         10
-    #     this
 # }}}
 
 
@@ -67,14 +51,10 @@ GraphOptionView = exports.GraphOptionView = FieldView.extend do # {{{
         'blur .value'                   : 'update'
         'submit .value'                 : 'update'
         'click .close'                  : 'toggleCollapsed'
-        'click'                         : 'onClick'
+        'click h3'                      : 'toggleCollapsed'
+        'click .collapsed'              : 'onClick'
     
     
-    # initialize: ->
-    #     console.log "#this.initialize!"
-    #     FieldView::initialize ...
-    #     
-    
     update: ->
         val     = @$el.find('.value').val()
         current = @model.get 'value'

diff --git a/lib/main.co b/lib/main.co
index c995cc4..ce96a23 100644 (file)
--- a/lib/main.co
+++ b/lib/main.co
@@ -14,7 +14,7 @@ main = ->
     graph = root.graph = new GraphView {
         graph_spec: CHART_OPTIONS_SPEC
     }
-    $ '#content' .append graph.el
+    $ '#content .inner' .append graph.el
 
 
 jQuery.ajax do

diff --git a/lib/scaffold/model.co b/lib/scaffold/model.co
index 48d3a71..c9a08d1 100644 (file)
--- a/lib/scaffold/model.co
+++ b/lib/scaffold/model.co
@@ -6,7 +6,7 @@ Hash = require 'hashish'
 
 ### Scaffold Models
 
-class exports.Tags extends Array
+class exports.TagSet extends Array
     tags : {}
     
     (values=[]) ->
@@ -32,7 +32,7 @@ class exports.Tags extends Array
     toString: -> "Tags(length=#{@length}, values=[\"#{@join '", "'}\"])"
 
 
-KNOWN_TAGS = exports.KNOWN_TAGS = new Tags()
+KNOWN_TAGS = exports.KNOWN_TAGS = new TagSet()
 
 Field = exports.Field = Backbone.Model.extend do # {{{
     ctorName    : 'Field'

diff --git a/lib/server/server.co b/lib/server/server.co
index 1dded9e..3fe8f7a 100755 (executable)
--- a/lib/server/server.co
+++ b/lib/server/server.co
@@ -115,6 +115,9 @@ app.get '/', (req, res) ->
 
 YAML_EXT_PAT = /\.ya?ml$/i
 
+/**
+ * Returns a JSON listing of the datasource metadata files.
+ */
 app.get '/data/list', (req, res, next) ->
     fs.readdir "#CWD/data", (err, files) ->
         res.send do

diff --git a/lib/template/graph-option.jade b/lib/template/graph-option.jade
index dec60ba..2c6755a 100644 (file)
--- a/lib/template/graph-option.jade
+++ b/lib/template/graph-option.jade
@@ -1,21 +1,29 @@
 include browser-helpers
-- var option_id    = _.domize('option', id);
-- var value_id     = _.domize('value', id);
-- var category_cls = _.domize('category', model.getCategoryIndex()) + ' ' + _.domize('category', model.getCategory());
-- var tags_cls     = tags.map(_.domize('tag')).join(' ');
-- var type_cls     = _.domize('type', type); 
+- var option_id    = _.domize('option', id)
+
+- var value_id     = _.domize('value', id)
+- var type_cls     = _.domize('type', type)
+
+- var category_cls = _.domize('category', model.getCategoryIndex()) + ' ' + _.domize('category', model.getCategory())
+- var tags_cls     = tags.map(_.domize('tag')).join(' ')
+
 
 .field.option(id=option_id, class="#{category_cls} #{tags_cls}")
-    a.close ×
+    a.close(title="Click to collapse") ×
     
+    h3.shortname(title="Click to collapse") #{name}
     //- h3.shortname #{_.shortname(name)}
-    h3.shortname #{name}
+    
     label.name(for=value_id) #{name}
-    input.value(type="text", id=value_id, name=name, class=type_cls, value=value)
+    
+    if ( /object|array|function/i.test(type) )
+        textarea.value(id=value_id, name=name, class=type_cls) #{value}
+    else
+        - var input_type = (/boolean/i.test(type) ? 'checkbox' : 'text');
+        input.value(type=input_type, id=value_id, name=name, class=type_cls, value=value)
     
     .type(class=type_cls) #{type}
     .default(class=type_cls, title="Default: #{def} (#{type})") #{def}
-    
     .desc
         != jade.filters.markdown(desc)
     

diff --git a/www/css/graph.styl b/www/css/graph.styl
index 8558dc5..f9a37b6 100644 (file)
--- a/www/css/graph.styl
+++ b/www/css/graph.styl
@@ -2,6 +2,11 @@
 @import 'nib'
 
 section.graph
+    position relative
+    
+    *
+        position relative
+    
     .graph-label
         position relative
     
@@ -23,52 +28,47 @@ section.graph
         float left
         z-index 3
         padding 0.5em
-        margin 0.5em
-        width 200px
-        min-height 2em
+        margin 0.4em
+        min-width 200px
+        max-width 250px
+        min-height 1.5em
+        line-height 1.5
         overflow hidden
         
         border-radius 5px
         background-color #ccc
         font-size 90%
         
-        *
-            position relative
         
-        .close
-            z-index 10
-            // absolute top 0.5em right 0.5em
-            absolute top 0.25em right 0.25em
+        h3
+            font-size 14px
+            line-height 1.3
             cursor pointer
-            
+        
+        .close
+            absolute top right 0.1em
             width 1em
             height 1em
+            line-height 1.2em
             text-align center
-            // border-radius 50%
-            
-            // text-decoration none
-            // border 1px solid #afafaf
-            // background-color #ccc
-            
-            // opacity 1
-            // color rgba(51,51,51, 0.4)
-        
-        // .close:hover
-        //     color rgba(51,51,51, 1)
-        //     border 1px solid #999
+            text-decoration none
+            z-index 10
+            cursor pointer
+            opacity 0.3
+            &:hover
+                opacity 0.6
         
         .shortname
-            // z-index -1
-            // absolute bottom 0.5em right 0.5em
             font-weight bold
             color white
+            min-height 1.5em
         .name
             display none
             font-weight bold
             // line-height 1.5
             // font-size 100%
-        .value
-            width auto
+        input.value
+            width 240px
             font-family menlo, monospace
         .type
             &::before
@@ -109,20 +109,21 @@ section.graph
             z-index 2
             width auto
             min-width 50px
-            min-height 2em
+            min-height 1.5em
+            line-height 1.5
             
-            line-height 2em
-            text-align center
             cursor pointer
+            text-align center
             
             *
                 display none
             .shortname
-                display inline
-                position static
+                display inline-block
+                min-width 50px
+                min-height auto
         
         
-        /* Category Colors {{{ */
+        /* Category/Tag Colors {{{ */
         for i in 0...length($hilites)
             $bg_color    = $hilites[i]
             $tag_color   = $bg_color + contrast_direction($bg_color) * 50%
@@ -143,12 +144,7 @@ section.graph
                 color $fg_color
                 background-color $bg_color
         
-    
-    
-    
-    
-    
-    // }}}
+        /* }}} */
 
 
 

diff --git a/www/css/layout.styl b/www/css/layout.styl
index 39ef922..39cffae 100644 (file)
--- a/www/css/layout.styl
+++ b/www/css/layout.styl
@@ -13,6 +13,11 @@ header, footer, #content
     background-color $page_bgcolor
     box-shadow 0px 0px 6px 2px rgba(0,0,0,0.4)
     
+    & > .inner
+        position relative
+        width 80%
+        margin 0 auto
+    
     // .spacer offsets #content to pad for header
     .spacer
         font-size 250%

diff --git a/www/layout.jade b/www/layout.jade
index 4f64153..a76e3ee 100644 (file)
--- a/www/layout.jade
+++ b/www/layout.jade
@@ -31,8 +31,8 @@ html
             
             section#content
                 .spacer
-                
-                block content
+                .inner
+                    block content
             
             footer
                 block footer