luca 0.8 → 0.8.2

data/CHANGELOG

@@ -1,3 +1,7 @@
 0.7.3:
   - Models being loaded by the FormView will now call
-    beforeFormLoad methods if they exist on those models
+    beforeFormLoad methods if they exist on those models
+0.8.1
+  - Adds many style fixes for GridView
+  - Fixes style conflicts for Bootstrap grid-* css selectors
+  - Adds getForm() and getModel() methods to Luca.Field classes that belong to a form

data/lib/luca/rails/version.rb

@@ -1,6 +1,6 @@
 module Luca
   module Rails
-    VERSION = "0.8"
+    VERSION = "0.8.2"
   end
 end
 

data/src/components/fields/button_field.coffee

@@ -1,9 +1,9 @@
 Luca.fields.ButtonField = Luca.core.Field.extend
   form_field: true
-  
+
   readOnly: true
 
-  events: 
+  events:
     "click input" : "click_handler"
 
   hooks:[
@@ -11,7 +11,7 @@ Luca.fields.ButtonField = Luca.core.Field.extend
   ]
 
   className: 'luca-ui-field luca-ui-button-field'
-  
+
   template: 'fields/button_field'
 
   click_handler: (e)->
@@ -34,6 +34,7 @@ Luca.fields.ButtonField = Luca.core.Field.extend
     @input_class ||= @class
     @icon_class ||= ""
     @icon_class = "icon-#{ @icon_class }" if @icon_class.length and !@icon_class.match(/^icon-/)
+    @icon_class += " icon-white" if @white
 
   setValue: ()-> true
 

data/src/components/fields/checkbox_array.coffee

@@ -0,0 +1,64 @@
+Luca.fields.CheckboxArray = Luca.core.Field.extend
+  
+  template: "fields/checkbox_array"
+
+  events:
+    "click input" : "clickHandler"
+
+  initialize: (@options={})->
+    _.extend @, @options
+    _.extend @, Luca.modules.Deferrable
+    _.bindAll @, "populateCheckboxes", "clickHandler", "_updateModel"
+
+    Luca.core.Field::initialize.apply @, arguments
+
+    @input_id ||= _.uniqueId('field') 
+    @input_name ||= @name 
+    @label ||= @name
+    @valueField ||= "id"
+    @displayField ||= "name"
+    @selectedItems = []
+
+  afterInitialize: (@options={})->
+    try
+      @configure_collection()
+    catch e
+      console.log "Error Configuring Collection", @, e.message
+
+    @collection.bind "reset", @populateCheckboxes
+
+  afterRender: ()->
+    if @collection?.models?.length > 0
+      @populateCheckboxes()
+    else
+      @collection.trigger("reset")
+
+  clickHandler: (event)->
+    checkbox = event.target
+    if checkbox.checked
+      @selectedItems.push(checkbox.value)
+    else
+      if @selectedItems.indexOf(checkbox.value) isnt -1
+        @selectedItems = _.without(@selectedItems, [checkbox.value]) 
+    
+    @_updateModel()
+
+  populateCheckboxes: ()->
+    controls = $(@el).find('.controls')
+    controls.empty()
+    @selectedItems = @getModel().get(@name)
+    @collection.each (model)=>
+      value = model.get(@valueField)
+      label = model.get(@displayField)
+      input_id = _.uniqueId('field')
+      controls.append(Luca.templates["fields/checkbox_array_item"]({label: label, value: value, input_id: input_id, input_name: @input_name}))
+      @$("##{input_id}").attr("checked", "checked") unless @selectedItems.indexOf(value) is -1
+    
+    $(@container).append(@$el)
+
+  _updateModel: ()->
+    attributes = {}
+    attributes[@name] = @selectedItems
+    @getModel().set(attributes)
+
+Luca.register "checkbox_array", "Luca.fields.CheckboxArray"

data/src/components/form_view.coffee

@@ -93,8 +93,15 @@ Luca.components.FormView = Luca.core.Container.extend
     _( @components ).each (component)->
       component.container = container
 
+  afterComponents: ()->
+    Luca.core.Container::afterComponents?.apply(@, arguments)
+    @eachField (field)=>
+      field.getForm = ()=> @
+      field.getModel = ()=> @currentModel()
+
   render: ()->
     $( @container ).append( @$el )
+    @
 
   wrapper: ()->
     @$el.parents('.luca-ui-form-view-wrapper')
@@ -108,6 +115,9 @@ Luca.components.FormView = Luca.core.Container.extend
         toolbar = Luca.util.lazyComponent(toolbar)
         toolbar.render()
 
+  eachField: (iterator)->
+    _( @getFields() ).map( iterator )
+
   getField: (name)->
     _( @getFields('name', name) ).first()
 

data/src/components/grid_view.coffee

@@ -1,13 +1,15 @@
 Luca.components.GridView = Luca.View.extend
+  autoBindEventHandlers: true
+
   events:
-    "dblclick .grid-view-row" : "double_click_handler"
-    "click .grid-view-row": "click_handler"
+    "dblclick .luca-ui-g-row" : "double_click_handler"
+    "click .luca-ui-g-row": "click_handler"
 
-  className: 'luca-ui-grid-view'
+  className: 'luca-ui-g-view'
 
   scrollable: true
 
-  emptyText: 'No Results To display'
+  emptyText: 'No Results To display.'
 
   # available options are striped, condensed, bordered
   # or any combination of these, split up by space
@@ -23,6 +25,8 @@ Luca.components.GridView = Luca.View.extend
     "after:collection:load"
   ]
 
+  rowClass: "luca-ui-g-row"
+
   initialize: (@options={})->
     _.extend @, @options
     _.extend @, Luca.modules.Deferrable
@@ -40,11 +44,11 @@ Luca.components.GridView = Luca.View.extend
   beforeRender: ()->
     @trigger "before:grid:render", @
 
-    @$el.addClass 'scrollable-grid-view' if @scrollable
+    @$el.addClass 'scrollable-g-view' if @scrollable
 
     @$el.html Luca.templates["components/grid_view"]()
 
-    @table  = $('table.luca-ui-grid-view', @el)
+    @table  = $('table.luca-ui-g-view', @el)
     @header = $("thead", @table)
     @body   = $("tbody", @table)
     @footer = $("tfoot", @table)
@@ -74,19 +78,24 @@ Luca.components.GridView = Luca.View.extend
       toolbar.container = @toolbarContainers( toolbar.position )
       toolbar.render()
 
+  defaultWidth: 756
+  defaultHeight: 285
+
   setDimensions: (offset)->
-    @height ||= 285
+    @height ||= @defaultHeight
 
-    $('.grid-view-body', @el).height( @height )
+    $('.luca-ui-g-view-body', @el).height( @height )
     $('tbody.scrollable', @el).height( @height - 23 )
 
     @container_width = do => $(@container).width()
-    @width = if @container_width > 0 then @container_width else 756
+
+    @width = if @container_width > 0 then @container_width else @defaultWidth
+    @width = _([@width, (@maxWidth || @width)]).max()
 
     #@width += offset if offset
 
-    $('.grid-view-body', @el).width( @width )
-    $('.grid-view-body table', @el).width( @width )
+    $('.luca-ui-g-view-body', @el).width( @width )
+    $('.luca-ui-g-view-body table', @el).width( @width )
 
     @setDefaultColumnWidths()
 
@@ -94,8 +103,8 @@ Luca.components.GridView = Luca.View.extend
     difference = newWidth - @width
     @width = newWidth
 
-    $('.grid-view-body', @el).width( @width )
-    $('.grid-view-body table', @el).width( @width )
+    $('.luca-ui-g-view-body', @el).width( @width )
+    $('.luca-ui-g-view-body table', @el).width( @width )
 
     if @columns.length > 0
       distribution = difference / @columns.length
@@ -167,6 +176,8 @@ Luca.components.GridView = Luca.View.extend
     @$ "[data-record-id=#{ id }]", 'table'
 
   render_row: (row,row_index)->
+    rowClass = @rowClass
+
     model_id = if row?.get and row?.attributes then row.get('id') else ''
 
     @trigger "before:render:row", row, row_index
@@ -183,7 +194,7 @@ Luca.components.GridView = Luca.View.extend
     if @alternateRowClasses
       altClass = if row_index % 2 is 0 then "even" else "odd"
 
-    @body?.append("<tr data-record-id='#{ model_id }' data-row-index='#{ row_index }' class='grid-view-row #{ altClass }' id='row-#{ row_index }'>#{ cells }</tr>")
+    @body?.append("<tr data-record-id='#{ model_id }' data-row-index='#{ row_index }' class='#{ rowClass } #{ altClass }' id='row-#{ row_index }'>#{ cells }</tr>")
 
   cell_renderer: (row, column, columnIndex )->
     if _.isFunction column.renderer
@@ -206,7 +217,7 @@ Luca.components.GridView = Luca.View.extend
     record = @collection.at( rowIndex )
     @trigger "row:click", @, record, rowIndex
 
-    $('.grid-view-row', @body ).removeClass('selected-row')
+    $(".#{ @rowClass }", @body ).removeClass('selected-row')
     me.addClass('selected-row')
 
 Luca.register "grid_view","Luca.components.GridView"

data/src/core/container.coffee

@@ -182,6 +182,7 @@ Luca.core.Container = Luca.View.extend
         console.log "Error Rendering Component #{ component.name || component.cid }", component
         console.log e.message
         console.log e.stack
+        throw e unless Luca.silenceRenderErrors? is true
 
   #### Container Activation
   #

data/src/framework.coffee

@@ -1,13 +1,13 @@
 _.mixin( _.string )
 
 window.Luca =
-  VERSION: "0.8"
+  VERSION: "0.8.2"
   core: {}
   containers: {}
   components: {}
   modules: {}
-  fields: {}
   util: {}
+  fields: {}
   registry:
     classes: {}
     namespaces:["Luca.containers","Luca.components"]

data/src/stylesheets/components/grid_view.scss

@@ -1,17 +1,17 @@
 
-.scrollable-grid-view {
+.scrollable-g-view {
   /* define height and width of scrollable area. Add 16px to width for scrollbar          */
-  .grid-view-body {
+  .luca-ui-g-view-body {
     clear: both;
     overflow: auto;
   }
 
   /* Reset overflow value to hidden for all non-IE browsers. */
-  .grid-view-body {
+  .luca-ui-g-view-body {
     overflow: hidden;
   }
-  
-  .grid-view-body .empty-text-wrapper {
+
+  .luca-ui-g-view-body .empty-text-wrapper {
     display: block;
     margin: 10px auto;
     width: 30%;
@@ -22,12 +22,12 @@
     }
   }
   /* define width of table. IE browsers only                 */
-  .grid-view-body table {
+  .luca-ui-g-view-body table {
   }
 
   /* define width of table. Add 16px to width for scrollbar.           */
   /* All other non-IE browsers.                                        */
-  .grid-view-body table {
+  .luca-ui-g-view-body table {
   }
 
   /* set table header to a fixed position. WinIE 6.x only                                       */
@@ -93,7 +93,7 @@
 
 }
 
-.grid-view-footer {
+.luca-ui-g-view-footer {
   .toolbar-container {
     float: left;
     width: 100%;

data/src/stylesheets/containers/tab_view.scss

@@ -15,6 +15,10 @@
 
 .luca-ui-tab-view.tabs-left {
   .tab-selector-container {
+    ul.nav-tabs {
+      padding: 0px;
+    }
+
     float: left;
   }
   .tab-content {

data/src/templates/components/grid_view.luca

@@ -1,9 +1,9 @@
-.luca-ui-grid-view-wrapper
-  .grid-view-header
+.luca-ui-g-view-wrapper
+  .g-view-header
     .toolbar-container.top
-  .grid-view-body
-    %table.luca-ui-grid-view.scrollable-table{:width=>"100%",:cellpadding=>0,:cellspacing=>0}
+  .luca-ui-g-view-body
+    %table.luca-ui-g-view.scrollable-table{:width=>"100%",:cellpadding=>0,:cellspacing=>0}
       %thead.fixed
       %tbody.scrollable
-  .grid-view-footer
+  .luca-ui-g-view-footer
     .toolbar-container.bottom

data/src/templates/fields/checkbox_array.luca

@@ -0,0 +1,5 @@
+.form-horizontal
+  .control-group
+    %label{:for=>"<%= input_id %>"}
+      <%= label %>
+    .controls

data/src/templates/fields/checkbox_array_item.luca

@@ -0,0 +1,4 @@
+%label{:for => "<%= input_id %>"}
+  %input{:id => "<%= input_id %>", :type => "checkbox", :name => "<%= input_name %>", :value => "<%= value %>"}
+  <%= label %>
+  

data/vendor/assets/javascripts/luca-ui-base.js

@@ -3,13 +3,13 @@
   _.mixin(_.string);
 
   window.Luca = {
-    VERSION: "0.8",
+    VERSION: "0.8.2",
     core: {},
     containers: {},
     components: {},
     modules: {},
-    fields: {},
     util: {},
+    fields: {},
     registry: {
       classes: {},
       namespaces: ["Luca.containers", "Luca.components"]
@@ -236,7 +236,7 @@
 }).call(this);
 (function() {
   Luca.templates || (Luca.templates = {});
-  Luca.templates["components/grid_view"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<div class=\'luca-ui-grid-view-wrapper\'>\n  <div class=\'grid-view-header\'>\n    <div class=\'toolbar-container top\'></div>\n  </div>\n  <div class=\'grid-view-body\'>\n    <table cellpadding=\'0\' cellspacing=\'0\' class=\'luca-ui-grid-view scrollable-table\' width=\'100%\'>\n      <thead class=\'fixed\'></thead>\n      <tbody class=\'scrollable\'></tbody>\n    </table>\n  </div>\n  <div class=\'grid-view-footer\'>\n    <div class=\'toolbar-container bottom\'></div>\n  </div>\n</div>\n');}return __p.join('');};
+  Luca.templates["components/grid_view"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<div class=\'luca-ui-g-view-wrapper\'>\n  <div class=\'g-view-header\'>\n    <div class=\'toolbar-container top\'></div>\n  </div>\n  <div class=\'luca-ui-g-view-body\'>\n    <table cellpadding=\'0\' cellspacing=\'0\' class=\'luca-ui-g-view scrollable-table\' width=\'100%\'>\n      <thead class=\'fixed\'></thead>\n      <tbody class=\'scrollable\'></tbody>\n    </table>\n  </div>\n  <div class=\'luca-ui-g-view-footer\'>\n    <div class=\'toolbar-container bottom\'></div>\n  </div>\n</div>\n');}return __p.join('');};
 }).call(this);
 (function() {
   Luca.templates || (Luca.templates = {});
@@ -266,6 +266,14 @@
   Luca.templates || (Luca.templates = {});
   Luca.templates["fields/button_field_link"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<a class=\'btn ', input_class ,'\'>\n  '); if(icon_class.length) { __p.push('\n  <i class=\'', icon_class ,'\'></i>\n  '); } __p.push('\n  ', input_value ,'\n</a>\n');}return __p.join('');};
 }).call(this);
+(function() {
+  Luca.templates || (Luca.templates = {});
+  Luca.templates["fields/checkbox_array"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<div class=\'form-horizontal\'>\n  <div class=\'control-group\'>\n    <label for=\'', input_id ,'\'>\n      ', label ,'\n    </label>\n    <div class=\'controls\'></div>\n  </div>\n</div>\n');}return __p.join('');};
+}).call(this);
+(function() {
+  Luca.templates || (Luca.templates = {});
+  Luca.templates["fields/checkbox_array_item"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<label for=\'', input_id ,'\'>\n  <input id=\'', input_id ,'\' name=\'', input_name ,'\' type=\'checkbox\' value=\'', value ,'\' />\n  ', label ,'\n</label>\n');}return __p.join('');};
+}).call(this);
 (function() {
   Luca.templates || (Luca.templates = {});
   Luca.templates["fields/checkbox_field"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<label for=\'', input_id ,'\'>\n  ', label ,'\n  <input name=\'', input_name ,'\' style=\'', inputStyles ,'\' type=\'checkbox\' value=\'', input_value ,'\' />\n</label>\n'); if(helperText) { __p.push('\n<p class=\'helper-text help-block\'>\n  ', helperText ,'\n</p>\n'); } __p.push('\n');}return __p.join('');};
@@ -913,7 +921,8 @@
         } catch (e) {
           console.log("Error Rendering Component " + (component.name || component.cid), component);
           console.log(e.message);
-          return console.log(e.stack);
+          console.log(e.stack);
+          if ((Luca.silenceRenderErrors != null) !== true) throw e;
         }
       });
     },

data/vendor/assets/javascripts/luca-ui-spec.js

@@ -3,13 +3,13 @@
   _.mixin(_.string);
 
   window.Luca = {
-    VERSION: "0.8",
+    VERSION: "0.8.2",
     core: {},
     containers: {},
     components: {},
     modules: {},
-    fields: {},
     util: {},
+    fields: {},
     registry: {
       classes: {},
       namespaces: ["Luca.containers", "Luca.components"]
@@ -236,7 +236,7 @@
 }).call(this);
 (function() {
   Luca.templates || (Luca.templates = {});
-  Luca.templates["components/grid_view"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<div class=\'luca-ui-grid-view-wrapper\'>\n  <div class=\'grid-view-header\'>\n    <div class=\'toolbar-container top\'></div>\n  </div>\n  <div class=\'grid-view-body\'>\n    <table cellpadding=\'0\' cellspacing=\'0\' class=\'luca-ui-grid-view scrollable-table\' width=\'100%\'>\n      <thead class=\'fixed\'></thead>\n      <tbody class=\'scrollable\'></tbody>\n    </table>\n  </div>\n  <div class=\'grid-view-footer\'>\n    <div class=\'toolbar-container bottom\'></div>\n  </div>\n</div>\n');}return __p.join('');};
+  Luca.templates["components/grid_view"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<div class=\'luca-ui-g-view-wrapper\'>\n  <div class=\'g-view-header\'>\n    <div class=\'toolbar-container top\'></div>\n  </div>\n  <div class=\'luca-ui-g-view-body\'>\n    <table cellpadding=\'0\' cellspacing=\'0\' class=\'luca-ui-g-view scrollable-table\' width=\'100%\'>\n      <thead class=\'fixed\'></thead>\n      <tbody class=\'scrollable\'></tbody>\n    </table>\n  </div>\n  <div class=\'luca-ui-g-view-footer\'>\n    <div class=\'toolbar-container bottom\'></div>\n  </div>\n</div>\n');}return __p.join('');};
 }).call(this);
 (function() {
   Luca.templates || (Luca.templates = {});
@@ -266,6 +266,14 @@
   Luca.templates || (Luca.templates = {});
   Luca.templates["fields/button_field_link"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<a class=\'btn ', input_class ,'\'>\n  '); if(icon_class.length) { __p.push('\n  <i class=\'', icon_class ,'\'></i>\n  '); } __p.push('\n  ', input_value ,'\n</a>\n');}return __p.join('');};
 }).call(this);
+(function() {
+  Luca.templates || (Luca.templates = {});
+  Luca.templates["fields/checkbox_array"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<div class=\'form-horizontal\'>\n  <div class=\'control-group\'>\n    <label for=\'', input_id ,'\'>\n      ', label ,'\n    </label>\n    <div class=\'controls\'></div>\n  </div>\n</div>\n');}return __p.join('');};
+}).call(this);
+(function() {
+  Luca.templates || (Luca.templates = {});
+  Luca.templates["fields/checkbox_array_item"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<label for=\'', input_id ,'\'>\n  <input id=\'', input_id ,'\' name=\'', input_name ,'\' type=\'checkbox\' value=\'', value ,'\' />\n  ', label ,'\n</label>\n');}return __p.join('');};
+}).call(this);
 (function() {
   Luca.templates || (Luca.templates = {});
   Luca.templates["fields/checkbox_field"] = function(obj){var __p=[],print=function(){__p.push.apply(__p,arguments);};with(obj||{}){__p.push('<label for=\'', input_id ,'\'>\n  ', label ,'\n  <input name=\'', input_name ,'\' style=\'', inputStyles ,'\' type=\'checkbox\' value=\'', input_value ,'\' />\n</label>\n'); if(helperText) { __p.push('\n<p class=\'helper-text help-block\'>\n  ', helperText ,'\n</p>\n'); } __p.push('\n');}return __p.join('');};
@@ -913,7 +921,8 @@
         } catch (e) {
           console.log("Error Rendering Component " + (component.name || component.cid), component);
           console.log(e.message);
-          return console.log(e.stack);
+          console.log(e.stack);
+          if ((Luca.silenceRenderErrors != null) !== true) throw e;
         }
       });
     },
@@ -1917,8 +1926,9 @@
       this.input_class || (this.input_class = this["class"]);
       this.icon_class || (this.icon_class = "");
       if (this.icon_class.length && !this.icon_class.match(/^icon-/)) {
-        return this.icon_class = "icon-" + this.icon_class;
+        this.icon_class = "icon-" + this.icon_class;
       }
+      if (this.white) return this.icon_class += " icon-white";
     },
     setValue: function() {
       return true;
@@ -1927,6 +1937,89 @@
 
   Luca.register("button_field", "Luca.fields.ButtonField");
 
+}).call(this);
+(function() {
+
+  Luca.fields.CheckboxArray = Luca.core.Field.extend({
+    template: "fields/checkbox_array",
+    events: {
+      "click input": "clickHandler"
+    },
+    initialize: function(options) {
+      this.options = options != null ? options : {};
+      _.extend(this, this.options);
+      _.extend(this, Luca.modules.Deferrable);
+      _.bindAll(this, "populateCheckboxes", "clickHandler", "_updateModel");
+      Luca.core.Field.prototype.initialize.apply(this, arguments);
+      this.input_id || (this.input_id = _.uniqueId('field'));
+      this.input_name || (this.input_name = this.name);
+      this.label || (this.label = this.name);
+      this.valueField || (this.valueField = "id");
+      this.displayField || (this.displayField = "name");
+      return this.selectedItems = [];
+    },
+    afterInitialize: function(options) {
+      this.options = options != null ? options : {};
+      try {
+        this.configure_collection();
+      } catch (e) {
+        console.log("Error Configuring Collection", this, e.message);
+      }
+      return this.collection.bind("reset", this.populateCheckboxes);
+    },
+    afterRender: function() {
+      var _ref, _ref2;
+      if (((_ref = this.collection) != null ? (_ref2 = _ref.models) != null ? _ref2.length : void 0 : void 0) > 0) {
+        return this.populateCheckboxes();
+      } else {
+        return this.collection.trigger("reset");
+      }
+    },
+    clickHandler: function(event) {
+      var checkbox;
+      checkbox = event.target;
+      if (checkbox.checked) {
+        this.selectedItems.push(checkbox.value);
+      } else {
+        if (this.selectedItems.indexOf(checkbox.value) !== -1) {
+          this.selectedItems = _.without(this.selectedItems, [checkbox.value]);
+        }
+      }
+      return this._updateModel();
+    },
+    populateCheckboxes: function() {
+      var controls,
+        _this = this;
+      controls = $(this.el).find('.controls');
+      controls.empty();
+      this.selectedItems = this.getModel().get(this.name);
+      this.collection.each(function(model) {
+        var input_id, label, value;
+        value = model.get(_this.valueField);
+        label = model.get(_this.displayField);
+        input_id = _.uniqueId('field');
+        controls.append(Luca.templates["fields/checkbox_array_item"]({
+          label: label,
+          value: value,
+          input_id: input_id,
+          input_name: _this.input_name
+        }));
+        if (_this.selectedItems.indexOf(value) !== -1) {
+          return _this.$("#" + input_id).attr("checked", "checked");
+        }
+      });
+      return $(this.container).append(this.$el);
+    },
+    _updateModel: function() {
+      var attributes;
+      attributes = {};
+      attributes[this.name] = this.selectedItems;
+      return this.getModel().set(attributes);
+    }
+  });
+
+  Luca.register("checkbox_array", "Luca.fields.CheckboxArray");
+
 }).call(this);
 (function() {
 
@@ -2334,8 +2427,24 @@
         return component.container = container;
       });
     },
+    afterComponents: function() {
+      var _ref,
+        _this = this;
+      if ((_ref = Luca.core.Container.prototype.afterComponents) != null) {
+        _ref.apply(this, arguments);
+      }
+      return this.eachField(function(field) {
+        field.getForm = function() {
+          return _this;
+        };
+        return field.getModel = function() {
+          return _this.currentModel();
+        };
+      });
+    },
     render: function() {
-      return $(this.container).append(this.$el);
+      $(this.container).append(this.$el);
+      return this;
     },
     wrapper: function() {
       return this.$el.parents('.luca-ui-form-view-wrapper');
@@ -2352,6 +2461,9 @@
         return toolbar.render();
       });
     },
+    eachField: function(iterator) {
+      return _(this.getFields()).map(iterator);
+    },
     getField: function(name) {
       return _(this.getFields('name', name)).first();
     },
@@ -2482,15 +2594,17 @@
 (function() {
 
   Luca.components.GridView = Luca.View.extend({
+    autoBindEventHandlers: true,
     events: {
-      "dblclick .grid-view-row": "double_click_handler",
-      "click .grid-view-row": "click_handler"
+      "dblclick .luca-ui-g-row": "double_click_handler",
+      "click .luca-ui-g-row": "click_handler"
     },
-    className: 'luca-ui-grid-view',
+    className: 'luca-ui-g-view',
     scrollable: true,
-    emptyText: 'No Results To display',
+    emptyText: 'No Results To display.',
     tableStyle: 'striped',
     hooks: ["before:grid:render", "before:render:header", "before:render:row", "after:grid:render", "row:double:click", "row:click", "after:collection:load"],
+    rowClass: "luca-ui-g-row",
     initialize: function(options) {
       var _this = this;
       this.options = options != null ? options : {};
@@ -2508,9 +2622,9 @@
       var _ref,
         _this = this;
       this.trigger("before:grid:render", this);
-      if (this.scrollable) this.$el.addClass('scrollable-grid-view');
+      if (this.scrollable) this.$el.addClass('scrollable-g-view');
       this.$el.html(Luca.templates["components/grid_view"]());
-      this.table = $('table.luca-ui-grid-view', this.el);
+      this.table = $('table.luca-ui-g-view', this.el);
       this.header = $("thead", this.table);
       this.body = $("tbody", this.table);
       this.footer = $("tfoot", this.table);
@@ -2536,17 +2650,20 @@
         return toolbar.render();
       });
     },
+    defaultWidth: 756,
+    defaultHeight: 285,
     setDimensions: function(offset) {
       var _this = this;
-      this.height || (this.height = 285);
-      $('.grid-view-body', this.el).height(this.height);
+      this.height || (this.height = this.defaultHeight);
+      $('.luca-ui-g-view-body', this.el).height(this.height);
       $('tbody.scrollable', this.el).height(this.height - 23);
       this.container_width = (function() {
         return $(_this.container).width();
       })();
-      this.width = this.container_width > 0 ? this.container_width : 756;
-      $('.grid-view-body', this.el).width(this.width);
-      $('.grid-view-body table', this.el).width(this.width);
+      this.width = this.container_width > 0 ? this.container_width : this.defaultWidth;
+      this.width = _([this.width, this.maxWidth || this.width]).max();
+      $('.luca-ui-g-view-body', this.el).width(this.width);
+      $('.luca-ui-g-view-body table', this.el).width(this.width);
       return this.setDefaultColumnWidths();
     },
     resize: function(newWidth) {
@@ -2554,8 +2671,8 @@
         _this = this;
       difference = newWidth - this.width;
       this.width = newWidth;
-      $('.grid-view-body', this.el).width(this.width);
-      $('.grid-view-body table', this.el).width(this.width);
+      $('.luca-ui-g-view-body', this.el).width(this.width);
+      $('.luca-ui-g-view-body table', this.el).width(this.width);
       if (this.columns.length > 0) {
         distribution = difference / this.columns.length;
         return _(this.columns).each(function(col, index) {
@@ -2636,8 +2753,9 @@
       return this.$("[data-record-id=" + id + "]", 'table');
     },
     render_row: function(row, row_index) {
-      var altClass, cells, model_id, _ref,
+      var altClass, cells, model_id, rowClass, _ref,
         _this = this;
+      rowClass = this.rowClass;
       model_id = (row != null ? row.get : void 0) && (row != null ? row.attributes : void 0) ? row.get('id') : '';
       this.trigger("before:render:row", row, row_index);
       cells = _(this.columns).map(function(column, col_index) {
@@ -2651,7 +2769,7 @@
       if (this.alternateRowClasses) {
         altClass = row_index % 2 === 0 ? "even" : "odd";
       }
-      return (_ref = this.body) != null ? _ref.append("<tr data-record-id='" + model_id + "' data-row-index='" + row_index + "' class='grid-view-row " + altClass + "' id='row-" + row_index + "'>" + cells + "</tr>") : void 0;
+      return (_ref = this.body) != null ? _ref.append("<tr data-record-id='" + model_id + "' data-row-index='" + row_index + "' class='" + rowClass + " " + altClass + "' id='row-" + row_index + "'>" + cells + "</tr>") : void 0;
     },
     cell_renderer: function(row, column, columnIndex) {
       var source;
@@ -2677,7 +2795,7 @@
       rowIndex = my.data('row-index');
       record = this.collection.at(rowIndex);
       this.trigger("row:click", this, record, rowIndex);
-      $('.grid-view-row', this.body).removeClass('selected-row');
+      $("." + this.rowClass, this.body).removeClass('selected-row');
       return me.addClass('selected-row');
     }
   });