luca 0.8.599 → 0.9.0

data/src/core/core.coffee

@@ -0,0 +1,181 @@
+# Component Definition Helpers
+#
+#
+# We have customized the core Backbone.extend process to use a slightly
+# different syntax, which allows us to intercept the component definition at
+# various points, and maintain information about classes being defined, and
+# the relationships between inherited classes, etc.
+
+# _.def, or Luca.define returns a chainable object which allows you to define
+# your components with a readable syntax.  For example:
+
+# _.def("Luca.View").extends("Backbone.View").with the_good:"shit"
+# _.def("MyView").extends("Luca.View").with the_custom:"shit"
+
+Luca.define = (componentName)->
+  new DefineProxy(componentName)
+
+Luca.component = Luca.define
+
+# The define proxy chain sets up a call to Luca.extend, which is a wrapper around Luca and Backbone component class' extend function.
+class DefineProxy
+  constructor:(componentName)->
+    @namespace = Luca.util.namespace()
+    @componentId = @componentName = componentName
+
+    if componentName.match(/\./)
+      @namespaced = true
+      parts = componentName.split('.')
+      @componentId = parts.pop()
+      @namespace = parts.join('.')
+
+      # automatically add the namespace to the namespace registry
+      Luca.registry.addNamespace( parts.join('.') )
+
+  # allow for specifying the namespace
+  in: (@namespace)-> @
+
+  # allow for multiple ways of saying the same thing for readability purposes
+  from: (@superClassName)-> @
+  extends: (@superClassName)-> @
+  extend: (@superClassName)-> @
+
+  # an alias for with, or a readability helper in multi-line definitions
+  enhance: (properties)->
+    return @with(properties) if properties?
+    @
+
+  # which properties, methods, etc will you be extending the base class with?
+  with: (properties)->
+    at = if @namespaced
+      Luca.util.resolve(@namespace, (window || global))
+    else
+      (window||global)
+
+    # automatically create the namespace
+    if @namespaced and not at?
+      eval("(window||global).#{ @namespace } = {}")
+      at = Luca.util.resolve(@namespace,(window || global))
+
+    at[@componentId] = Luca.extend(@superClassName,@componentName, properties)
+
+    # automatically register this with the component registry
+    Luca.register( _.string.underscored(@componentId), @componentName)
+
+    at[@componentId]
+
+# The last method of the DefineProxy chain is always going to result in
+# a call to Luca.extend.  Luca.extend wraps the call to Luca.View.extend,
+# or Backbone.Collection.extend, and accepts the names of the extending,
+# and extended classes as strings.  This allows us to maintain information
+# and references to the classes and their prototypes, mainly for the purposes
+# of introspection and development tools
+Luca.extend = (superClassName, childName, properties={})->
+  superClass = Luca.util.resolve( superClassName, (window || global) )
+
+  unless _.isFunction(superClass?.extend)
+    throw "#{ superClassName } is not a valid component to extend from"
+
+  properties.displayName = childName
+
+  properties._superClass = ()->
+    superClass.displayName ||= superClassName
+    superClass
+
+  properties._super = (method, context, args)->
+    @_superClass().prototype[method]?.apply(context, args)
+
+  superClass.extend(properties)
+
+_.mixin
+  def: Luca.define
+
+
+# Luca.Events
+#
+# These helpers will get mixed into Luca.Collection, Luca.View, and Luca.Model.
+#
+# They allow for syntactic sugar like:
+#
+# view.defer("someMethodOnTheView").until("collection","fetch")
+#
+# or
+#
+# view.defer( myCallback ).until("triggered:event")
+class DeferredBindingProxy
+  constructor: (@object, operation, wrapWithUnderscore=true)->
+    if _.isFunction(operation)
+      fn = operation
+
+    else if _.isString(operation) and _.isFunction(@object[operation])
+      fn = @object[operation]
+
+    unless _.isFunction(fn)
+      throw "Must pass a function or a string representing one"
+
+    if wrapWithUnderscore is true
+      @fn = ()=>
+        _.defer(fn)
+    else
+      @fn = fn
+
+    @
+
+  # until accepts an object to bind to, and a trigger to bind with
+  # if you just pass a trigger, the object getting bound to
+  # will implicitly be @object
+  until: (watch, trigger)->
+    if watch? and not trigger?
+      trigger = watch
+      watch = @object
+
+    watch.once(trigger, @fn)
+
+    @object
+
+Luca.Events =
+  defer: (operation, wrapWithUnderscore=true)->
+    new DeferredBindingProxy(@, operation, wrapWithUnderscore)
+
+  once: (trigger, callback, context)->
+    context ||= @
+
+    onceFn = ()->
+      callback.apply(context, arguments)
+      @unbind(trigger, onceFn)
+
+    @bind trigger, onceFn
+
+class Luca.ScriptLoader
+  @loaded: {}
+
+  constructor: (options={})->
+    _.extend(@, Backbone.Events, Luca.Events)
+    @autoStart = options.autoStart is true
+    @scripts = options.scripts
+
+    ready = ()-> @trigger("ready")
+
+    @ready = _.after( @scripts.length, ready)
+
+    _.bindAll @, "load", "ready"
+
+    @defer("load").until(@, "start")
+
+    if @autoStart is true
+      @trigger("start")
+
+    @bind "ready", @onReady
+
+  applyPrefix: (script)->
+    script
+
+  onReady: ()->
+    console.log "All dependencies loaded"
+
+  start: ()->
+    @trigger("start")
+
+  load: ()->
+    Luca.util.loadScript( @applyPrefix(script), @ready ) for script in @scripts
+

data/src/core/field.coffee

@@ -1,4 +1,4 @@
-_.component('Luca.core.Field').extends('Luca.View').with
+_.def('Luca.core.Field').extends('Luca.View').with
 
   className: 'luca-ui-text-field luca-ui-field'
 
@@ -23,10 +23,10 @@ _.component('Luca.core.Field').extends('Luca.View').with
 
   initialize: (@options={})->
     _.extend @, @options
-    Luca.View::initialize.apply(@, arguments)
 
     @input_id ||= _.uniqueId('field')
     @input_name ||= @name
+    @input_class ||= ""
     @helperText ||= ""
     @label ||= "*#{ @label }" if @required and not @label?.match(/^\*/)
     @inputStyles ||= ""
@@ -36,6 +36,8 @@ _.component('Luca.core.Field').extends('Luca.View').with
     @updateState( @state )
     @placeHolder ||= ""
 
+    Luca.View::initialize.apply(@, arguments)
+
   beforeRender: ()->
     if Luca.enableBootstrap
       @$el.addClass('control-group')

data/src/core/model.coffee

@@ -4,7 +4,7 @@
 # few useful patterns:
 #
 #   - computed properties support
-_.component('Luca.Model').extends('Backbone.Model').with
+_.def('Luca.Model').extends('Backbone.Model').with
   initialize: ()->
     Backbone.Model::initialize @, arguments
 

data/src/core/observer.coffee

@@ -4,10 +4,10 @@ class Luca.Observer
     @type = @options.type
 
     if @options.debugAll
-      @bind "event", (t, args...)=>
-        console.log "Observed #{ @type } #{ (t.name || t.id || t.cid) }", t, _(args).flatten()
-
+      @bind "all", (trigger, one, two)=>
+        console.log "ALL", trigger, one, two
   relay: (triggerer, args...)->
+    console.log "Relaying", trigger, args
     @trigger "event", triggerer, args
     @trigger "event:#{ args[0] }", triggerer, args.slice(1)
 

data/src/core/panel.coffee

@@ -0,0 +1,143 @@
+# This is a helper for creating the DOM element that go along with
+# a given component, if it is configured to use one via the topToolbar
+# and bottomToolbar properties
+attachToolbar = (config={})->
+  config.orientation ||= "top"
+  config.ctype ||= @toolbarType || "panel_toolbar"
+
+  id = "#{ @cid }-tbc-#{ config.orientation }"
+
+  toolbar = Luca.util.lazyComponent( config )
+
+  container = @make "div",
+    class:"toolbar-container #{ config.orientation }",
+    id: id
+  ,
+    toolbar.render().el
+
+  hasBody = @bodyClassName or @bodyTagName
+
+  # there will be a body panel inside of the views $el
+  # so just place the toolbar before, or after the body
+  action = switch config.orientation
+    when "top", "left"
+      if hasBody then "before" else "prepend"
+    when "bottom", "right"
+      if hasBody then "after" else "append"
+
+  @$bodyEl()[action]( container )
+
+# A Panel is a basic Luca.View but with Toolbar extensions
+#
+# In general other components should inherit from the panel class.
+
+_.def("Luca.components.Panel").extends("Luca.View").with
+
+  topToolbar: undefined
+
+  bottomToolbar: undefined
+
+  # Load Mask will apply a transparent overlay over the form
+  # upon submission, with a moving progress bar which will be
+  # hidden upon successful response
+  loadMask: false
+  loadMaskTemplate: ["components/load_mask"]
+
+  initialize: (@options={})->
+    Luca.View::initialize.apply(@, arguments)
+
+    if @loadMask is true
+      @defer ()=>
+        @$el.addClass('with-mask')
+
+        if @$('.load-mask').length is 0
+          @loadMaskTarget().prepend Luca.template(@loadMaskTemplate, @)
+          @$('.load-mask').hide()
+      .until("after:render")
+
+      @on "enable:loadmask", @applyLoadMask
+      @on "disable:loadmask", @applyLoadMask
+
+  loadMaskTarget: ()->
+    if @loadMaskEl? then @$(@loadMaskEl) else @$bodyEl()
+
+  applyLoadMask: ()->
+    if @$('.load-mask').is(":visible")
+      @$('.load-mask .bar').css("width","100%")
+      @$('.load-mask').hide()
+      clearInterval(@loadMaskInterval)
+    else
+      @$('.load-mask').show().find('.bar').css("width","0%")
+      maxWidth = @$('.load-mask .progress').width()
+      if maxWidth < 20 and (maxWidth = @$el.width()) < 20
+        maxWidth = @$el.parent().width()
+
+      @loadMaskInterval = setInterval ()=>
+        currentWidth = @$('.load-mask .bar').width()
+        newWidth = currentWidth + 12
+        @$('.load-mask .bar').css('width', newWidth)
+      , 200
+
+  applyStyles: (styles={},body=false)->
+
+    target = if body then @$bodyEl() else @$el
+
+    for setting, value  of styles
+      target.css(setting,value)
+
+    @
+
+  beforeRender: ()->
+    Luca.View::beforeRender?.apply(@, arguments)
+    @applyStyles( @styles ) if @styles?
+    @applyStyles( @bodyStyles, true ) if @bodyStyles?
+    @renderToolbars?()
+
+  $bodyEl: ()->
+    element = @bodyTagName || "div"
+    className = @bodyClassName || "view-body"
+
+    @bodyEl ||= "#{ element }.#{ className }"
+
+    bodyEl = @$(@bodyEl)
+
+    return bodyEl if bodyEl.length > 0
+
+    # if we've been configured to have one, and it doesn't exist
+    # then we should append it to ourselves
+    if bodyEl.length is 0 and (@bodyClassName? || @bodyTagName?)
+      newElement = @make(element,class:className,"data-auto-appended":true)
+      $(@el).append( newElement )
+      return @$(@bodyEl)
+
+
+    $(@el)
+
+  $wrap: (wrapper)->
+    if !wrapper.match(/[<>]/)
+      wrapper = @make("div",class:wrapper)
+
+    @$el.wrap( wrapper )
+
+  $template: (template, variables={})->
+    @$html( Luca.template(template,variables) )
+
+  $html: (content)->
+    @$bodyEl().html( content )
+
+  $append: (content)->
+    @$bodyEl().append(content)
+
+  # Luca containers can have toolbars,
+  # these will get injected before or after the bodyEl, or at the top
+  # or bottom of the $el
+  renderToolbars: ()->
+    _( ["top","left","right","bottom"] ).each (orientation)=>
+      if config = @["#{ orientation }Toolbar"]
+        @renderToolbar( orientation, config)
+
+  renderToolbar: (orientation="top", config={})->
+    config.parent = @
+    config.orientation = orientation
+
+    attachToolbar.call(@, config)

data/src/core/registry.coffee

@@ -0,0 +1,104 @@
+registry =
+  classes:{}
+  namespaces:['Luca.containers','Luca.components']
+
+component_cache =
+  cid_index: {}
+  name_index: {}
+
+# For container views, if a component is defined with no ctype
+# then we will pick this one when using
+Luca.defaultComponentType = 'view'
+
+
+# When you use _.def to define a component, you say
+# which class it extends() from, and with() which enhancements.
+
+# We register that component class for you:
+Luca.register = (component, prototypeName)->
+  Luca.trigger "component:registered", component, prototypeName
+  registry.classes[ component ] = prototypeName
+
+Luca.development_mode_register = (component, prototypeName)->
+  existing = registry.classes[component]
+
+  if Luca.enableDevelopmentTools is true and existing?
+    prototypeDefinition = Luca.util.resolve( existing, window)
+
+    liveInstances = Luca.registry.findInstancesByClassName( prototypeName )
+
+    _( liveInstances ).each (instance)->
+      instance?.refreshCode?.call(instance, prototypeDefinition)
+
+  Luca.register( component, prototypeName )
+
+# We create a @ctype alias for this component definition, and register
+# the class in a registry.
+
+# If you use a custom namespace like MyApp.views.ListView,
+# then we will register MyApp.views as a namespace.  You can
+# do this yourself too.
+Luca.registry.addNamespace = (identifier)->
+  registry.namespaces.push( identifier )
+  registry.namespaces = _( registry.namespaces ).uniq()
+
+# This allows us to declare relationships between objects at definition time
+# and have the instances of these objects be created at runtime when they
+# are available.
+#
+# it also allows us to build tools to monitor what is going on inside of an
+# application, which makes testing and debugging easier, and also serves as
+# the basis of Luca's in browser development tools.
+Luca.registry.namespaces = (resolve=true)->
+  _( registry.namespaces ).map (namespace)->
+    if resolve then Luca.util.resolve( namespace ) else namespace
+
+# Lookup a component in the Luca component registry
+# by it's ctype identifier.  If it doesn't exist,
+# check any other registered namespace
+Luca.registry.lookup = (ctype)->
+  c = registry.classes[ctype]
+
+  return c if c?
+
+  className = Luca.util.classify(ctype)
+
+  parents = Luca.registry.namespaces()
+
+  fullPath = _( parents ).chain().map((parent)->
+    parent[className]).compact().value()?[0]
+
+Luca.registry.findInstancesByClassName = (className)->
+  instances = _( component_cache.cid_index ).values()
+  _( instances ).select (instance)->
+    instance.displayName is className or instance._superClass?()?.displayName is className
+
+Luca.registry.classes = (toString=false)->
+  _( registry.classes ).map (className, ctype)->
+    if toString
+      className
+    else
+      className: className
+      ctype: ctype
+
+Luca.cache = (needle, component)->
+  component_cache.cid_index[ needle ] = component if component?
+
+  component = component_cache.cid_index[ needle ]
+
+  # optionally, cache it by tying its name to its cid for easier lookups
+  if component?.component_name?
+    Luca.trigger "component:created:#{ component.component_name }", component
+    component_cache.name_index[ component.component_name ] = component.cid
+  else if component?.name?
+    Luca.trigger "component:created:#{ component.component_name }", component
+    component_cache.name_index[ component.name ] = component.cid
+
+  return component if component?
+
+  # perform a lookup by name if the component_id didn't turn anything
+  lookup_id = component_cache.name_index[ needle ]
+
+  component_cache.cid_index[ lookup_id ]
+
+

data/src/core/util.coffee

@@ -0,0 +1,82 @@
+# Takes an string like "deep.nested.value" and an object like window
+# and returns the value of window.deep.nested.value.  useful for defining
+# references on objects which don't yet exist, as strings, which get
+# evaluated at runtime when such references will be available
+Luca.util.resolve = (accessor, source_object)->
+  source_object ||= (window || global)
+  _( accessor.split(/\./) ).inject (obj,key)->
+    obj = obj?[key]
+  , source_object
+
+# A better name for Luca.util.nestedValue
+Luca.util.nestedValue = Luca.util.resolve
+
+# turns a word like form_view into FormView
+Luca.util.classify = (string="")->
+  _.string.camelize( _.string.capitalize( string ) )
+
+# looks up a method on an object by its event trigger
+# in the format of what:ever => whatEver
+Luca.util.hook = (eventId="")->
+  parts = eventId.split(':')
+  prefix = parts.shift()
+
+  parts = _( parts ).map (p)-> _.string.capitalize(p)
+  fn = prefix + parts.join('')
+
+Luca.util.isIE = ()->
+  try
+    Object.defineProperty({}, '', {})
+    return false
+  catch e
+    return true
+
+currentNamespace = (window || global)
+
+Luca.util.namespace = (namespace)->
+  return currentNamespace unless namespace?
+  currentNamespace = if _.isString(namespace) then Luca.util.resolve(namespace,(window||global)) else namespace
+
+  if currentNamespace?
+    return currentNamespace
+
+  currentNamespace = eval("(window||global).#{ namespace } = {}")
+
+# one of the main benefits of Luca is the ability to structure your app as
+# large blocks of JSON configuration.  In order to convert an object into
+# a Luca component, we lookup the object's class by converting its ctype / type
+# property into a class that has been registered in the component registry
+Luca.util.lazyComponent = (config)->
+  if _.isObject(config)
+    ctype = config.ctype || config.type
+
+  if _.isString(config)
+    ctype = config
+
+  componentClass = Luca.registry.lookup( ctype )
+
+  throw "Invalid Component Type: #{ ctype }.  Did you forget to register it?" unless componentClass
+
+  constructor = eval( componentClass )
+
+  new constructor(config)
+
+Luca.util.selectProperties = (iterator, object, context)->
+  values = _( object ).values()
+  _( values ).select( iterator )
+
+Luca.util.loadScript = (url, callback) ->
+  script = document.createElement("script")
+  script.type = "text/javascript"
+
+  if (script.readyState)
+    script.onreadystatechange = ()->
+      if script.readyState == "loaded" || script.readyState == "complete"
+        script.onreadystatechange = null
+        callback()
+      else
+        script.onload = ()->
+          callback()
+
+  script.src = url
+  document.body.appendChild(script)