luca 0.9.8 → 0.9.9

data/app/assets/javascripts/luca/components/grid_layout_view.coffee

@@ -0,0 +1,42 @@
+gridView = Luca.register    "Luca.components.GridLayoutView"
+gridView.extends            "Luca.CollectionView"
+
+gridView.publicConfiguration
+  # how many items do you wish to render per row?
+  # assuming a 12 column grid, each item will receive
+  # an equal amount of grid span/columns.
+  itemsPerRow: 3
+
+gridView.privateConfiguration
+  className: "grid-layout-view"
+  tagName: "div"
+  itemTagName: "div"
+
+gridView.privateMethods
+  # adds the bootstrap span class to each collection-item,
+  # where span class is equal to the 12 column grid / @itemsPerRow.
+  # for example, each item would receive a span4 class when @itemsPerRow = 3
+  attributesForItem: ()->
+    base = Luca.CollectionView::attributesForItem.apply(@, arguments)
+    @itemsPerRow = 3 unless _.isNumber(@itemsPerRow) and @itemsPerRow > 1
+    columns = parseInt(12 / @itemsPerRow)
+    base.class += " span#{ columns }"
+
+    base
+
+  # wraps every N number of rows, where N = @itemsPerRow
+  # in a row-fluid wrapper, and appends it to the view
+  renderModels: (models)->
+    index = 0
+    rowIndex = 0
+
+    rows = for model in models
+      row = @make("div", class:"row-fluid") if rowIndex++ is 0
+      $(row).append @makeItem(model,index++)
+      rowIndex = 0 if index > 0 and index % @itemsPerRow is 0
+      row
+
+    for row in rows
+      @$append(row) 
+
+gridView.register()

data/app/assets/javascripts/luca/components/index.coffee

@@ -1 +1,7 @@
+#= require ./collection_view
+#= require ./simple_collection_view
+#= require ./grid_layout_view
+#= require ./table_view
+#= require ./multi_collection_view
+#= require ./table_view_scrollable
 #= require_tree .

data/app/assets/javascripts/luca/components/nav_bar.coffee

@@ -1,26 +1,80 @@
+# A Twitter Bootstrap compatible navigation bar.  The Luca.Application
+# and Luca.containers.Viewport class both have configuration options for
+# creating navbar components in the header and footer of the viewport.
+#
+# #### Example of an Application with a Navbar
+# ##### Component Definition
+#       # Navigation Component
+#       navBar = Luca.register  "App.views.TopNavigation"
+#       navBar.extends          "Luca.components.NavBar"
+#       navBar.defines
+#         brand: "My App"
+#         # for white on black
+#         inverse: true
+#
+# We are able to reference the component we just defined in the
+# configuration of the Application, simply by using it's 
+# type alias `top_navigation`
+#
+#       # Application Component
+#       app = Luca.register       "App.Application"
+#       app.extends               "Luca.Application"
+#       app.defines
+#         topNav: "top_navigation"
+#
 navBar = Luca.register "Luca.components.NavBar"
-
 navBar.extends         "Luca.View"
 
-navBar.defines
+navBar.publicConfiguration
+  # Specify whether the navbar is supposed to be fixed
+  # the way Twitter bootstrap navbar can be.
   fixed: true
+
+  # Valid options are 'top', 'bottom'.  Only valid when `@fixed is true`
   position: 'top'
-  className: 'navbar'
+
+  # Specify whether the navbar should use the fluid grid. 
+  # Usually the same as your Viewport setting.
+  fluid: undefined
+
+  # What content do you want to show in the logo area of the
+  # standard bootstrap nav
   brand: "Luca.js"
+
+  # Specifies an optional template to use for the navigation menu
+  # content.  Whatever you specify will be rendered inside of the 
+  # collapsible container inside of the standard bootstrap nav.
+  template: undefined
+
+navBar.privateConfiguration
+  className: 'navbar'
   bodyTemplate: 'nav_bar'
   bodyClassName: 'luca-ui-navbar-body'
 
   beforeRender: ()->
     @$el.addClass "navbar-fixed-#{ @position }" if @fixed
+    @$el.addClass "navbar-inverse" if @inverse is true
 
     if @brand?
-      @content().append("<a class='brand' href='#'>#{ @brand }</a>")
+      @$('.brand').attr('href', @homeLink || '#')
+      @$('.brand').html(@brand)
 
     if @template
-      @content().append Luca.template(@template, @)
+      @navContainer().html Luca.template(@template, @)
+
+    if !!(@fluid || Luca.getApplication()?.fluid)
+      @content().addClass( Luca.config.fluidWrapperClass )
+    else
+      @content().addClass( Luca.config.wrapperClass )
 
   render: ()->
     @
 
+  navContainer: ()->
+    @$('.luca-ui-navbar-body .nav-collapse')
+
   content: ()->
-    @$('.container').eq(0)
+    @$('.luca-ui-navbar-body').eq(0)
+
+
+navBar.register()

data/app/assets/javascripts/luca/components/page.coffee

@@ -0,0 +1,70 @@
+# The `Page` is a type of `Container` that has
+# all of its subcomponents visible at one time, 
+# and assigned to various `@regions` that exist
+# in the `@layout` template which provide its 
+# internal dom structure.
+#
+# #### Example Template (haml):
+#       .page.layout.row-fluid{"data-layout"=>"layouts/left_nav_grid"}
+#         .span3.region{"data-region"=>"left"}
+#         .span9.region{"data-region"=>"right"}
+#
+# ### Example Page Configuration
+#     page = new Luca.components.Page
+#       layout: "layouts/left_nav_grid"
+#       regions:
+#         left: 
+#           type: "navigation"
+#         right:
+#           type: "details"
+#
+page = Luca.register       "Luca.components.Page"
+page.extends               "Luca.Container"
+
+page.privateMethods
+  # `Page`s are typically instantiated by a `Luca.components.Controller`
+  initialize: (@options={})->
+    @assignComponentsToRegions()
+    @bodyTemplate = @options.layout || @layout
+    @bodyTemplate ||= @options.template || @template
+    Luca.Container::initialize.apply(@, arguments)
+
+  # Takes the configuration specified in @regions
+  # and creates a components hash out of them.
+  assignComponentsToRegions: ()->
+    @components ||= []
+
+    assigned = for regionId, regionAssignment of @regions
+      if _.isString(regionAssignment) and componentClass = Luca.registry.lookup( regionAssignment )
+        regionAssignment = 
+          component: regionAssignment
+      else if _.isString(regionAssignment) and Luca.template(regionAssignment)
+        regionAssignment = 
+          bodyTemplate: regionAssignment
+
+      _.extend(regionAssignment, container: "[data-region='#{ regionId }']")
+
+    @components = assigned
+
+page.publicConfiguration
+  # The `@layout` property is the equivalent to specifying @bodyTemplate
+  # but more semantic.  A `@layout` template is expected to contain DOM 
+  # elements with a data attribute named `region` on it.  
+
+  layout: undefined
+  # The @regions property assigns containers ( by their type alias )
+  # to DOM elements identified as regions within a layout template.
+  #
+  # #### Example:
+  #     new Luca.components.Page
+  #       regions: 
+  #         left: "my_component"
+  #         right: 
+  #           type: "my_other_component"
+  #           role: "component_role"
+  #
+  #   This will render an instance of MyComponent to this
+  #   page's @$('[data-region-id="right"]') DOM element.
+  regions: {}
+
+page.register()

data/app/assets/javascripts/luca/components/simple_collection_view.coffee

@@ -0,0 +1,10 @@
+# The SimpleCollectionView class is a CollectionView without any of the
+# bells and whistles ( filtering, pagination, sorting, etc )
+simple = Luca.register    "Luca.components.SimpleCollectionView"
+simple.extends            "Luca.CollectionView"
+
+simple.defines
+  filterable: false
+  paginatable: false
+  sortable: false
+  loadMask: false

data/app/assets/javascripts/luca/components/table_view.coffee

@@ -1,5 +1,5 @@
 tableView = Luca.register     "Luca.components.TableView"
-tableView.extends             "Luca.components.CollectionView"
+tableView.extends             "Luca.CollectionView"
 
 tableView.publicConfiguration
   widths: []
@@ -17,6 +17,10 @@ tableView.privateConfiguration
   observeChanges: true
 
 tableView.privateMethods
+
+  lastColumn: ()->
+    @columns[ @columns.length - 1 ]
+
   eachColumn: (fn, scope=@)->
     index = 0
     for col in @columns  
@@ -63,7 +67,7 @@ tableView.classMethods
       content = column.header 
       content = "<a class='link'>#{ column.header }</a>" if column.sortable
 
-      @$(targetElement).append( Backbone.View::make "th", attrs, content )
+      @$(targetElement).find('tr').append( Luca.View::make "th", attrs, content )
 
 
     index = 0
@@ -84,6 +88,6 @@ tableView.classMethods
     if _.isFunction( column.renderer )
       cellValue = column.renderer.call @, cellValue, model, column 
 
-    Backbone.View::make("td", {"data-col-index":index}, cellValue)
+    Luca.View::make("td", {"data-col-index":index}, cellValue)
 
 tableView.register()

data/app/assets/javascripts/luca/components/table_view_scrollable.coffee

@@ -0,0 +1,23 @@
+scrollable = Luca.register      'Luca.components.ScrollableTable'
+
+scrollable.extends              'Luca.components.TableView'
+
+scrollable.replaces             'Luca.components.GridView'
+
+scrollable.publicConfiguration
+  maxHeight: undefined
+
+scrollable.privateMethods
+  $scrollableWrapperEl: ()->
+    @$el.parent('.scrollable-wrapper')
+
+  setMaxHeight: ()->
+    parent = @$scrollableWrapperEl()
+    parent.css('overflow':'auto', 'max-height': @maxHeight)
+
+  afterRender: ()->
+    @$wrap 'scrollable-wrapper'
+    @setMaxHeight()
+
+scrollable.defines
+  version: 1

data/app/assets/javascripts/luca/concerns/collection_event_bindings.coffee

@@ -1,6 +1,9 @@
 Luca.concerns.CollectionEventBindings = 
   __initializer: ()->
-    Luca.concerns.CollectionEventBindings.__setup.call(@)
+
+    @defer ()=>
+      Luca.concerns.CollectionEventBindings.__setup.call(@)
+    .until("after:initialize")
 
     unless @collectionEventBindingsSetup is true
       if Luca.isBackboneCollection(@collection)

data/app/assets/javascripts/luca/concerns/development_tool_helpers.coffee

@@ -1,21 +1,30 @@
 Luca.concerns.DevelopmentToolHelpers = 
-  refreshCode: ()->
+  refreshEventBindings: ()->
     view = @
 
-    _( @eventHandlerProperties() ).each (prop)->
-      view[ prop ] = view.definitionClass()[prop]
+    console.log "Refreshing Event Bindings ON ", view.name || view.cid
 
-    if @autoBindEventHandlers is true
-      @bindAllEventHandlers()
+    view.undelegateEvents()
 
-    @delegateEvents()
+    domEvents = view.definitionClass?()?.events || view.events
 
-  eventHandlerProperties: ()->
-    handlerIds = _( @events ).values()
-    _( handlerIds ).select (v)->
-      _.isString(v)
+    for eventSignature, eventName of domEvents when _.isString(eventName) is true
+      defaultEventHandler = view.definitionClass?()?[ eventName ]
+      console.log "Rebinding dom event", eventSignature, eventName, defaultEventHandler
+      view.events[ eventSignature ] = defaultEventHandler
 
-  eventHandlerFunctions: ()->
-    handlerIds = _( @events ).values()
-    _( handlerIds ).map (handlerId)=>
-      if _.isFunction(handlerId) then handlerId else @[handlerId]  
+    if view.state? and view.stateful?
+      Luca.concerns.StateModel.__setupModelBindings.call(view, "off")
+      Luca.concerns.StateModel.__setupModelBindings.call(view, "on")
+
+    if view.isContainer is true and not _.isEmpty(view.componentEvents)
+      Luca.Container::registerComponentEvents.call(@,undefined,"off")
+      newBindings = view.definitionClass?()?.componentEvents
+
+      Luca.Container::registerComponentEvents.call(@,newBindings,"on")
+
+
+    #if @autoBindEventHandlers is true
+    #  @bindAllEventHandlers()
+
+    view.delegateEvents()

data/app/assets/javascripts/luca/concerns/dom_helpers.coffee

@@ -46,10 +46,10 @@ Luca.concerns.DomHelpers =
       console.log "Error in $template: #{ template } #{ @identifier?() ? @name || @cid }"
 
   $html: (content)->
-    @$el.html( content )
+    if content? then @$el.html(content) else @$el.html()
 
   $append: (content)->
-    @$el.append( content )
+    @$el.append(content)
 
   $attach: ()->
     @$container().append( @el )

data/app/assets/javascripts/luca/concerns/filterable.coffee

@@ -1,18 +1,16 @@
-Luca.concerns.Filterable = 
+Luca.concerns.Filterable =
   classMethods:
     prepare: ()->
-      filter = _.clone( @getQuery() )
-      options = _.clone( @getQueryOptions() )
+      @trigger "data:refresh"
+      return unless @isRemote()
+
+      filter = _.clone(@getRemoteQuery())
+      options = _.clone(@getQueryOptions())
 
       prepared = @prepareRemoteFilter(filter, options)
 
-      @debug "Preparing filterable call", prepared, @isRemote()
+      @collection.applyFilter(prepared, remote: true)
 
-      if @isRemote()  
-        @collection.applyFilter(prepared, remote: true)
-      else
-        @trigger "data:refresh" 
-  
   __included: (component, module)->
     _.extend(Luca.Collection::, __filters:{})
 
@@ -75,8 +73,7 @@ Luca.concerns.Filterable =
 
   applyFilter: (query={}, options={})->
     options = _.defaults(options, @getQueryOptions())
-    query = _.defaults(query, @getQuery())
-    @getFilterState().clear(silent:false)
+    @getFilterState().clear(silent: true)
     @getFilterState().set({query,options}, options)
 
 class FilterModel extends Backbone.Model

data/app/assets/javascripts/luca/concerns/form_model_bindings.coffee

@@ -0,0 +1,20 @@
+Luca.concerns.FormModelBindings = 
+  __initializer: ()->
+    return unless @trackModelChanges is true
+
+    @on "state:change:currentModel", @onStateChangeCurrentModel, @
+
+    _.bindAll(@, "onStateChangeCurrentModel", "unbindFromModel", "onModelChange", "bindToModel")
+
+  onStateChangeCurrentModel: (state, current, previous)->
+    @unbindFromModel(previous) if Luca.isBackboneModel(previous)
+    @bindToModel(current) if Luca.isBackboneModel(current)
+
+  unbindFromModel: (model)->
+    (model || @currentModel())?.unbind("change", @onModelChange)  
+
+  onModelChange: (model)->
+    @setValues(model, modelChange: true)
+
+  bindToModel: (model)->
+    (model || @currentModel())?.bind("change", @onModelChange, @)  

data/app/assets/javascripts/luca/concerns/modal_view.coffee

@@ -1,4 +1,6 @@
 Luca.concerns.ModalView = 
+  version: 3
+
   closeOnEscape: true
 
   showOnInitialize: false
@@ -6,12 +8,24 @@ Luca.concerns.ModalView =
   backdrop: false
 
   __initializer: ()->
-    @$el.addClass("modal")
+    return unless @modal is true
 
-    @on "before:render", applyModalConfig, @
+    @on "before:render", @applyModalConfig, @
     
     @
 
+  applyModalConfig: ()->
+    @$el.addClass 'modal'
+    @$el.addClass 'fade' if @fade is true
+
+    @$el.modal
+      backdrop: @backdrop is true
+      keyboard: @closeOnEscape is true
+      show: @showOnInitialize is true
+
+    @$el.css('display','none') unless @showOnInitialize is true
+    @      
+ 
   container: ()->
     $('body')
 
@@ -19,20 +33,31 @@ Luca.concerns.ModalView =
     @$el.modal('toggle')
 
   show: ()->
+    @render() unless @rendered is true
+    @trigger "before:show"
     @$el.modal('show')
+    @trigger "after:show"
 
   hide: ()->
+    @trigger "before:hide"
     @$el.modal('hide')
-
-applyModalConfig = ()->
-  @$el.addClass 'modal'
-  @$el.addClass 'fade' if @fade is true
-
-  $('body').append( @$el )
-  
-  @$el.modal
-    backdrop: @backdrop is true
-    keyboard: @closeOnEscape is true
-    show: @showOnInitialize is true
-
-  @  
+    @trigger "after:hide"
+
+  setModalDimensions: (height, width)->
+    if _.isObject(height)
+      {height,width} = height
+
+    @setModalHeight( height ) if height?
+    @setModalWidth( width ) if width?
+
+  setModalWidth: (width)->
+    @$el.css
+      "width": width
+      "max-width": width
+      "margin-left": width * 0.5 * -1
+
+  setModalHeight: (height)->
+    @$el.css
+      "max-height": height
+      "margin-top": height * 0.5 * -1
+      "height": height