Updates tag tracking.
authordsc <dsc@less.ly>
Thu, 23 Feb 2012 20:26:59 +0000 (12:26 -0800)
committerdsc <dsc@less.ly>
Thu, 23 Feb 2012 20:26:59 +0000 (12:26 -0800)
lib/scaffold/model.co
lib/server/server.co
lib/template/graph-option.jade
package.co
package.json
www/css/colors.styl
www/css/graph.styl

index a98bd41..af6a85f 100644 (file)
@@ -1,19 +1,55 @@
-_  = require 'kraken/underscore'
-op = require 'kraken/util/op'
+_    = require 'kraken/underscore'
+op   = require 'kraken/util/op'
+Hash = require 'hashish'
 
 
 
 ### Scaffold Models
 
+class exports.Tags extends Array
+    tags : {}
+    
+    (values=[]) ->
+        @tags = {}
+        @add values if values?.length
+    
+    has: (tag) ->
+        @tags[tag]?
+    
+    get: (tag) ->
+        return -1 unless tag
+        unless @tags[tag]?
+            @tags[tag] = @length
+            @push tag
+        @tags[tag]
+    
+    update: (tags) ->
+        is_single = typeof tags is 'string'
+        tags      = [tags] if is_single
+        indices   = ( for tag of tags then @get tag )
+        if is_single then indices[0] else indices
+    
+    toString: -> "Tags(length=#{@length}, values=[\"#{@join '", "'}\"])"
+
+
+KNOWN_TAGS = exports.KNOWN_TAGS = new Tags()
+
 Field = exports.Field = Backbone.Model.extend do # {{{
-    ctorName : 'Field'
+    ctorName    : 'Field'
     idAttribute : 'name'
     
+    
     initialize: ->
         @set 'value', @get('default'), {+silent} if not @has 'value'
         
         # console.log "#this.initialize!"
+        @on 'all', (evt) ~> console.log "#this.trigger(#evt)"
+        
+        # Notify Tag indexer of category when created, to ensure all category-tags
+        # get indices with colors :P
+        KNOWN_TAGS.update @getCategory()
     
+    # Model defaults
     defaults: ->
         {
             name     : ''
@@ -25,6 +61,41 @@ Field = exports.Field = Backbone.Model.extend do # {{{
             examples : []
         }
     
+    # Wrapper to ensure @set('tags') is called, as tags.push()
+    # will not trigger the 'changed:tags' event.
+    addTag: (tag) ->
+        return this unless tag
+        tags = @get('tags', [])
+        tags.push tag
+        @set 'tags', tags
+        this
+    
+    # Wrapper to ensure @set('tags') is called, as tags.push()
+    # will not trigger the 'changed:tags' event.
+    removeTag: (tag) ->
+        return this unless tag
+        tags = @get('tags', [])
+        _.remove tags, tag
+        @set 'tags', tags
+        this
+    
+    # Keep tag list up to date
+    onTagUpdate: ->
+        KNOWN_TAGS.update @get 'tags'
+        this
+    
+    getTagIndex: (tag) ->
+        KNOWN_TAGS.get tag
+    
+    # A field's category is its first tag.
+    getCategory: ->
+        @get('tags', [])[0]
+    
+    getCategoryIndex: ->
+        @getTagIndex @getCategory()
+    
+    
+    
     getParser: (type) ->
         type or= @get 'type'
         t = _ type.toLowerCase()
@@ -44,7 +115,7 @@ Field = exports.Field = Backbone.Model.extend do # {{{
         # TODO: handle 'or' by returning an array of parsers
         parser
     
-    
+        
     getValue: (def) ->
         @getParser() @get 'value', def
     
@@ -62,6 +133,7 @@ Field = exports.Field = Backbone.Model.extend do # {{{
     isDefault: ->
         @get('value') is @get('default')
     
+    
     toJSON: ->
         {id:@id} import do
             _.clone(@attributes) import { value:@getValue(), def:@get('default') }
index d9a6c44..2f7ff0d 100755 (executable)
@@ -85,7 +85,7 @@ app.configure ->
         log_level : LOG_LEVEL
     app.use require('browserify') do
         mount   : '/vendor/browserify.js'
-        require : <[ events seq ]>
+        require : <[ events seq hashish ]>
     
     # Serve static files
     app.use express.static WWW
index 92fee6e..20494dc 100644 (file)
@@ -1,11 +1,11 @@
 include browser-helpers
 - var option_id    = _.domize('option', id);
 - var value_id     = _.domize('value', id);
-//- - var category_cls = _.domize('category', category);
+- 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); 
 
-.field.option(id=option_id, class="#{category} #{tags_cls}")
+.field.option(id=option_id, class="#{category_cls} #{tags_cls}")
     a.close &times;
     
     h3.shortname #{_.shortname(name)}
@@ -21,7 +21,7 @@ include browser-helpers
     //- .tags(data-toggle="collapse", data-target="##{option_id} .tags ul"): ul.collapse
     .tags
         for tag in tags
-            span.tag(class=_.domize('tag', tag)) #{tag}
+            span.tag(class=_.domize('tag', tag)+' '+_.domize('category', model.getTagIndex(tag))) #{tag}
             |  
     .examples(data-toggle="collapse", data-target="##{option_id} .examples ul"): ul.collapse
         for example in examples
index b3d6547..6e7b0f4 100644 (file)
@@ -22,6 +22,7 @@ dependencies                    :
     'underscore'                : '>= 1.3.1'
     'underscore.string'         : '>= 2.0.0'
     'js-yaml'                   : '>= 0.3.5'
+    'hashish'                   : '>= 0.0.4'
     'backbone'                  : '>= 0.9.1'
 devDependencies                 : 
     'buildtools'                : 'https://github.com/dsc/node-buildtools/tarball/master'
index e3df6ae..aeae543 100644 (file)
@@ -26,6 +26,7 @@
     "underscore": ">= 1.3.1",
     "underscore.string": ">= 2.0.0",
     "js-yaml": ">= 0.3.5",
+    "hashish": ">= 0.0.4",
     "backbone": ">= 0.9.1"
   },
   "devDependencies": {
index 6fd557b..82a3e5d 100644 (file)
@@ -1,26 +1,31 @@
 /** Project Colors **/
 
-$dark           = #333
-$light          = #eee
+$dark               = #333
+$light              = #eee
 
 /* spot colors */
-$hilite_dkblue     = #182B53
-$hilite_ltblue     = #4596FF
-$hilite_steelblue  = #A6D9FF
-$hilite_teal       = #00FFBC
-$hilite_green      = #83BB32
-$hilite_lime       = #B1E43B
-$hilite_yellow     = #F1D950
-$hilite_squash     = #EF8158
-$hilite_orange     = #DC3522
-$hilite_red        = #AD3238
-$hilite_pink       = #FF87FF
-$hilite_magenta    = #FF0097
-$hilite_purple     = #553DC9
-$hilite_periwinkle = #9DA5FF
-
-
-$hilites = ($hilite_dkblue $hilite_ltblue $hilite_steelblue $hilite_teal $hilite_green $hilite_lime $hilite_yellow $hilite_squash $hilite_orange $hilite_red $hilite_pink $hilite_magenta $hilite_purple $hilite_periwinkle)
+$hilite_dkblue      = #182B53
+$hilite_sky         = #0080FF
+$hilite_ltblue      = #4596FF
+$hilite_steelblue   = #A6D9FF
+$hilite_cyan        = #00FFBC
+$hilite_hurricane   = #254A59
+$hilite_tourquoise  = #32938A
+$hilite_green       = #83BB32
+$hilite_lime        = #B1E43B
+$hilite_yellow      = #F1D950
+$hilite_squash      = #EF8158
+$hilite_orange      = #DC3522
+$hilite_watermelon  = #C9313D
+$hilite_red         = #AD3238
+$hilite_pink        = #FF87FF
+$hilite_magenta     = #FF0097
+$hilite_purple      = #553DC9
+$hilite_periwinkle  = #9DA5FF
+$hilite_lavender    = #9323FF
+
+$hilites = ($hilite_dkblue $hilite_sky $hilite_ltblue $hilite_steelblue $hilite_cyan $hilite_hurricane $hilite_tourquoise $hilite_green $hilite_lime $hilite_yellow $hilite_squash $hilite_orange $hilite_watermelon $hilite_red $hilite_pink $hilite_magenta $hilite_purple $hilite_periwinkle $hilite_lavender)
+
 
 
 /* background colors */
index 30f4b2c..cdd2b77 100644 (file)
@@ -124,14 +124,19 @@ section.graph
         
         /* Category Colors {{{ */
         for i in 0...length($hilites)
+            $bg_color = $hilites[i]
+            $fg_color = light($bg_color) ? $dark : $light
+            
             &.category_{i}
-                $bg_color = $hilites[i]
-                $fg_color = light($bg_color) ? $dark : $light
-                
-                background-color $bg_color
                 color $fg_color
+                background-color $bg_color
                 label, h1, h2, h3, .shortname, .name, .close
                     color $fg_color
+            
+            .tag{i}
+                color $fg_color
+                background-color $bg_color
+                border 1px solid $fg_color