luca 0.9.2 → 0.9.4

data/docs/event_binding_helpers.md

@@ -0,0 +1,164 @@
+## Event Binding Syntactic Sugar
+
+`Luca.Events` provides you with some additional event binding sugar.
+
+**once**
+
+`once` is how you would run one function in response to an event, but only once.
+
+```coffeescript
+  view = new Luca.View()
+
+  view.once "event:gets:triggered", ()->
+    alert('sup baby')
+
+  view.trigger("event:gets:triggered")
+```
+
+**defer until**
+
+`defer` is similar to `once`, but with syntax I like a little better:
+
+```coffeescript
+  _.def("MyView").extends("Luca.View").with
+    initialize: ()->
+      @defer(@setup).until("event:gets:triggered")
+```
+
+If you want to defer a callback until an event gets triggered on some other object:
+
+```coffeescript
+
+  _.def("MyView").extends("Luca.View").with
+  
+    initialize:()->
+  	  @defer(@setup).until(@someObject,"triggers:an:event")
+        
+    setup: ()->
+        
+```
+
+## Component Bindings
+
+Luca provides a number of configuration API for its components
+which facilitate the binding of a component's methods to events that
+occur on instances of the CollectionManager and Application objects. 
+
+For Luca.core.Container classes there is also a component events 
+binding API that allows you to declare in your container which events
+to listen for on that container's components  
+
+## Auto Context Binding For Event Handlers
+
+By setting the @bindAllEvents property to true on your prototype definitions,
+all event handler methods on your view will automatically be bound to the context
+of the view.  
+
+```coffeescript
+  _.def('MyApp.views.AutoBoundView').extends('Luca.View').with
+  
+    bindAllEvents: true
+    
+    events:
+      "click a.btn" : "clickHandler"
+      "click a.btn.btn-danger" : "dangerHandler"
+      
+    initialize:()->
+      # You no longer need to do this
+      # if you want to have these handlers run
+      # in the context of this view
+      _.bindAll @, "clickHandler", "dangerHandler"
+
+```
+
+## Collection Manager Event Binding
+
+Luca Applications which use the Luca.CollectionManager have the benefit of
+a declarative event binding syntax which allows you bind to events on collections
+by their name.  This saves you from having to create a reference to the collection
+in some method, and setup a callback binding.  By simply providing a @collectionEvents
+configuration property on your views, you can eliminate a lot of boilerplate in your components.
+
+The format of the @collectionEvents hash is a key which is made up of the collection's name and the event
+separated by a space, and either a function or a name of a method on your view.
+
+```coffeescript
+  SamplesCollection = Backbone.Collection.extend
+    name: "samples"
+    url: "/api/v1/samples"
+
+  _.def("MyView").extends("Luca.View").with
+    # NOTE: you may omit this property and
+    # it will use Luca.CollectionManager.get() to 
+    # get the main instance.
+    collectionManager: "main"
+
+    collectionEvents:
+      "samples reset" : "samplesResetHandler"
+
+    samplesResetHandler: (collection)->
+      if collection.length > 1
+        @doSomething() 
+```
+## Application Event Binding
+
+Similar to the CollectionManager event binding API, there is a similar API for binding to the global application
+object. Most applications will have a single application instance, that is either available on the global object
+or through a call to `Luca.getApplication()`.
+
+It is in the Application instance that global state tracking should occur.  Should your views want to respond to changes
+in global application state, you can provide an @applicationEvents configuration property. The format is a key value
+pair, where the key represents the event being triggered by the application, and the value is a name of a method on 
+your view or an anonymous function.
+
+```coffeescript
+  App = new Luca.Application
+    name: "main"
+
+    defaultState:
+      currentMode: "solid"
+
+  _.def("AppBoundView").extends("Luca.View").with
+    # NOTE: you may omit this and it will use Luca.getApplication()
+    app: "main"
+
+    applicationEvents:
+      "change:currentMode" : "modeChangeHandler"
+
+    modeChangeHandler: ()->
+      @doSomething()
+```
+
+## Luca.core.Container Component Events
+
+Containers are special views whose only purpose is to render multiple components in a specified configuration, and handle
+all of the communication between the components.  This is what allows Luca components to be extremely re-usable, because they
+never know about views that exist outside of them.
+
+By providing a @componentEvents configuration property on your container, you can bind to events on the components in your container
+and relay information about them to other members of the container. The format is a key value pair where the key is a string which
+contains the name of the component and the event it triggers, separated by a space.  The value is a name of a method on your view or an anonymous function.
+
+```coffeescript
+  # ctype = component_one
+  _.def("ComponentOne").extends("Luca.View").with
+    name:"one"
+    eventHandler: ()->
+      @trigger "custom:event"
+
+  # ctype = component_two
+  _.def("ComponentTwo").extends("ComponentOne").with
+    name:"two"
+    eventHandler: ()->
+      @trigger "some:other:event"
+
+  _.def("MyContainer").extends("Luca.core.Container").with
+    components:["component_two","component_one"]
+    componentEvents:
+      "one custom:event" : "customEventHandler"
+
+    # when component named one fires an event
+    # we can handle it here, pass it to two, whatever
+    customEventHandler: ()->
+      Luca('two').eventHandler()
+```

data/docs/method_caching_and_computed_properties.md

@@ -0,0 +1,77 @@
+# Method Caching and Computed Properties on Luca Collection and Model
+
+The concept of computed properties ( on the model ) or cached methods ( on the collection )
+optimizes for cases where you call a method that performs calculations or some other operations
+whose value is dependent on the model and its underlying attributes.
+
+## Cached Methods on Luca.Collection
+
+Luca provides a configuration API for Luca.Collection where you specify the method whose value
+you wish to cache, and the change events which get bubbled up from the models that would change
+the value, in essence expiring the cache.  In addition to change events, standard events on the
+collection for when a model is added or removed will expire the cached value.
+
+```coffeescript
+  _.def("MyCollection").extends("Luca.Collection").with
+    name:"my_collection"
+
+    cachedMethods:[
+      "expensiveMethod:attributeOne,attributeTwo",
+      "anotherExpensiveMethod"
+    ] 
+
+    expensiveMethod: ()->
+      @map (model)-> model.get('attributeOne') + model.getAttribute('two')
+
+    anotherExpensiveMethod: ()->
+      @map (model)-> model.value()
+```
+
+In the example above, the `expensiveMethod` is dependent on the `attributeOne` and `attributeTwo` attributes
+on each of the models in the collection, therefor if any of these values change, the cache needs to be expired and new value recalculated.
+
+The `anotherExpensiveMethod` call is not dependent on any specific values, so will only expire any time a new model
+is added or removed, or the collection is reset.
+
+
+Example: 
+
+```coffeescript
+  _.def("Users").extends("Luca.Collection").with
+    name: 'users'
+    
+    cachedMethods: [
+	  "averageAge:age"
+    ]
+    
+    averageAge: ()->
+      sum = @reduce (acc, user) -> 
+      	acc + user.get('age')
+      , 0
+      Math.floor(sum / @size)
+```
+An `averageAge` will be cached and recalculated only when either
+membership of the collection will change or `age` attribute on either member
+
+## Computed Properties on Luca.Model
+
+```coffeescript
+  _.def("MyModel").extends("Luca.Model").with
+    computed:
+      "expensive" : ["dependencyOne","dependencyTwo"]
+
+    expensive: ()->
+      @get("dependencyOne") + @get("dependencyTwo")
+```
+
+In the example above, `expensive` method will be converted to the `expensive` property which is be computed/updated on initialization and every time any of its dependent properties will change. That `expensive` property will act as any other attribute on the model (responds to `get` operations, can be available in `toJSON()` etc).
+
+Example:
+
+```coffeescript
+  _.def("User").extends("Luca.Model").with
+    computed:
+      "fullName": ["firstName","lastName"]
+    fullName: ()->
+      @get("firstName") + @get("lastName")
+```

data/docs/view.md

@@ -0,0 +1,119 @@
+# Luca.View
+
+The `Luca.View` class is the base class for Luca components. A number of patterns and optimizations that are helpful in your view classes have been extracted into the base class.
+
+## Hooks
+
+In Backbone, views trigger events, and we can bind to them as normally, and that this is good.  Often we are binding our view's methods to events that get triggered.  In Luca, hooks are events you can declare on your component definition which will be automatically called if events get triggered with names which match the pattern.  This saves you the work of having to set up event binding logic manually.
+
+For example:
+
+```coffeescript
+  _.def("Luca.View").extends("Backbone.View").with
+    hooks:[
+      "after:initialize"   # => will call the @afterInitialize method if it exists
+      "before:render"      # => @beforeRender
+      "after:render"       # => @afterRender
+      "first:activation"   # => @firstActivation
+      "activation"         # => @activation
+      "deactivation"       # => @deactivation
+    ]
+```
+
+**Note on extending hook methods**
+
+If you want to maintain the functionality of the component you are extending from, you will have to remember to call the prototype method like such:
+
+```coffeescript
+  _.def("MyView").extends("Luca.View").with
+    beforeRender: ()->
+      @_super("beforeRender", @, arguments)
+      
+      # or, if you prefer 
+      Luca.View::beforeRender?.apply(@, arguments)
+```
+
+## The @render() method
+
+The default implementation of @render() simply appends the view's `@$el` to the DOM element represented by the `$(@container)` property on the view.
+
+Whatever method you choose to implement for your `@render()` call should behave similar to how the Backbone.View::render() expects, in that it should return an instance of the view.
+
+Additionally, the call to `@render()` will trigger `before:render` and `after:render` as which, on a Luca.View is configured as a hook.  So any `@beforeRender()` and `@afterRender()` method will get called as well, if they exist.
+
+## Before Render
+
+Since in Luca, the actual render method just attaches the view to its container, setup related methods for building your view's content are best put in the `beforeRender()` method.  In addition to this, there are other options available for filling the content of the view, like `@bodyTemplate`.
+
+## Luca.template helper
+
+`Luca.template()` is a util function which allows you reference your client side template system.  It accepts a name of a template ( which, if not found, it will attempt to match one for you ) and an object of interpolations to pass to the template function
+
+`Luca.available_templates()` is a util function, useful for debugging, to see which templates are available to you.
+
+## Configuration Options
+
+- `@additionalClassNames` - an array of CSS classes to apply to the view's `@$el`.  This is helpful for inheritance of views.
+
+- `@name` - Setting a name property on your view, will allow you to reference the instance of that view later.
+
+```coffeescript
+  view = new Luca.View(name:"my_view")
+  
+  Luca("my_view") is view # => true
+
+```
+
+- `@wrapperClass` - automatically wraps the view with a div with this as the CSS class.
+
+- `@bodyTemplate` - will apply the content of the template to your view 
+
+- `@bindAllEvents` - true or false automatically bind all event handler methods to the context of your view's instance
+
+- `@applicationEvents` - configuration similar to the DOM `@events` configuration on Backbone.View.  Used to bind to events triggered by the `Luca.Application.get()` object.  You can customize which application you use by setting `@app` to either reference the app, or to the name of a given application.
+
+- `@collectionEvents` - configuration similar to the DOM `@events` configuration on Backbone.View.  Used to bind to events triggered by the `Luca.CollectionManager.get()` object.  
+
+## Luca.View::$bodyEl() 
+
+In your `Luca.View` definitions, If you set the `@bodyTemplate` property to one of the available templates, then on `initialize` the view will set the HTML of its DOM element to the contents of the template.
+
+This is useful in cases where there is a fair amount of structural, or otherwise static DOM content in your view, and one of the standard `Luca.core.Container` components is not suited for what you want to do.  The `Luca.components.Panel` view is basically just a `Luca.View` which has additional DOM containers for footers and headers.  It accomplishes this through the use of the `@bodyClassName` and `@bodyTagName` properties.  
+
+`@bodyClassName` and `@bodyTagName` work the same way the `@className` and `@tagName` properties work on standard Backbone views.  They are used to create a DOM element via `Backbone.View.prototype.make(@bodyTagName,class:@bodyClassName,id:@bodyId` 
+
+If you use `view.$bodyEl()` instead of the standard `view.$el()` that ships with Backbone, all of the standard DOM manipulation methods available will be scoped to the CSS selector that corresponds to the actual body element of your view.
+
+## Deferrable Rendering
+
+The jury is still out as to whether or not deferrable rendering is a useful pattern, or whether it is too complex. The use case it was trying to optimize is for views which can only be rendered in response to an event being fired on another object.  Such as `Backbone.Collection::fetch`.  
+
+If this is what you are doing, then this feature is for you.
+
+The options available for views which use the `@deferrable` property are as follows:
+
+- `@deferrable` - if you set a reference to an object, such as a collection, on the @deferrable property, then the call to `view.render()` will actually just set up an event binding to the `reset` event of your collection, and it will automatically call `fetch` for you on that collection.  
+
+If you set `@deferrable` to true then the view will expect a `@collection` property.
+
+- `@deferrable_method`  - a call to `@render()` on a `@deferrable` view will automatically call this method on the `@deferrable` object.
+
+- `@deferrable_trigger` - if you use the deferrable system , by default, it will automatically call the `@deferrable_method` on your `@deferrable` object when you call `@render()`.  However, if you want to defer this method being fired even later, just set the `@deferrable_trigger` property to whatever trigger your view will listen for.
+
+A useful example would be for views which get rendered hidden, and activated if and only if the user does a specific action.  ( For example, a TabView activating a secondary tab ).  If that action triggers an event, and you want to delay the render process if and only if that event is triggered.
+
+## Helpers
+
+- `view.$template` calls `view.$.html()` on your view, with whatever is returned from the template.  Delegates to `Luca.template(templateName, customizationHash)`
+
+- `view.$wrap` the same as `view.$el.wrap()` -- accepts a CSS class name string, or a DOM element
+
+- `view.$append` the same as `view.$el.append()`
+
+- `view.$container` - references `$( view.container )`.  Note: the @container property is set on a view when it belongs to the `@components` property of a `Luca.core.Container` instance.  It is just a standard CSS selector.
+
+- `view.registerEvent()` manipulates your `@events` configuration on your Backbone.View and then calls `@delegateEvents` to make sure they are live.
+
+## Backbone Component Helpers
+
+Views which have properties on them referencing other views, models, or collections, can access those objects by calling `view.models()` or `view.views()` or `view.collections()`.  This is mainly useful for introspection, debugging, or what not.

data/lib/luca/rails/version.rb

@@ -1,6 +1,6 @@
 module Luca
   module Rails
-    VERSION = "0.9.2"
+    VERSION = "0.9.4"
   end
 end
 

data/lib/luca/template.rb

@@ -2,7 +2,11 @@ require 'tilt'
 
 module Luca
   class Template < Tilt::Template
-    attr_accessor :namespace
+
+    def self.namespace
+      'JST'
+    end
+
     def self.default_mime_type
       'application/javascript'
     end
@@ -20,7 +24,6 @@ module Luca
     def prepare
       options = @options.merge(:filename => eval_file, :line => line, :escape_attrs => false)
       @engine = ::Haml::Engine.new(data, options)
-      self.namespace = "window.JST"
     end
 
     def evaluate(scope, locals, &block)
@@ -28,15 +31,12 @@ module Luca
       code = EJS.compile(compiled)
       tmpl = scope.logical_path 
 
-      tmpl.gsub! /^.*\/templates\//, ''
+      namespace = self.class.namespace 
 
+      tmpl.gsub! /^.*\/templates\//, ''
+      
       <<-JST
-
-(function() {
-  #{namespace} || (#{namespace} = {});
-  #{namespace}[#{ tmpl.inspect }] = #{indent(code)};
-}).call(this);
-
+(function() {#{namespace} || (#{namespace} = {}); #{namespace}[#{ tmpl.inspect }] = #{indent(code)}; }).call(this);
       JST
     end
 

data/site/assets/bootstrap.min.js

@@ -0,0 +1,7 @@
+/**
+* Bootstrap.js by @fat & @mdo
+* plugins: bootstrap-transition.js, bootstrap-modal.js, bootstrap-dropdown.js, bootstrap-tooltip.js, bootstrap-popover.js, bootstrap-alert.js, bootstrap-button.js, bootstrap-collapse.js, bootstrap-typeahead.js
+* Copyright 2012 Twitter, Inc.
+* http://www.apache.org/licenses/LICENSE-2.0.txt
+*/
+!function(a){a(function(){a.support.transition=function(){var a=function(){var a=document.createElement("bootstrap"),b={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd",msTransition:"MSTransitionEnd",transition:"transitionend"},c;for(c in b)if(a.style[c]!==undefined)return b[c]}();return a&&{end:a}}()})}(window.jQuery),!function(a){function c(){var b=this,c=setTimeout(function(){b.$element.off(a.support.transition.end),d.call(b)},500);this.$element.one(a.support.transition.end,function(){clearTimeout(c),d.call(b)})}function d(a){this.$element.hide().trigger("hidden"),e.call(this)}function e(b){var c=this,d=this.$element.hasClass("fade")?"fade":"";if(this.isShown&&this.options.backdrop){var e=a.support.transition&&d;this.$backdrop=a('<div class="modal-backdrop '+d+'" />').appendTo(document.body),this.options.backdrop!="static"&&this.$backdrop.click(a.proxy(this.hide,this)),e&&this.$backdrop[0].offsetWidth,this.$backdrop.addClass("in"),e?this.$backdrop.one(a.support.transition.end,b):b()}else!this.isShown&&this.$backdrop?(this.$backdrop.removeClass("in"),a.support.transition&&this.$element.hasClass("fade")?this.$backdrop.one(a.support.transition.end,a.proxy(f,this)):f.call(this)):b&&b()}function f(){this.$backdrop.remove(),this.$backdrop=null}function g(){var b=this;this.isShown&&this.options.keyboard?a(document).on("keyup.dismiss.modal",function(a){a.which==27&&b.hide()}):this.isShown||a(document).off("keyup.dismiss.modal")}var b=function(b,c){this.options=c,this.$element=a(b).delegate('[data-dismiss="modal"]',"click.dismiss.modal",a.proxy(this.hide,this))};b.prototype={constructor:b,toggle:function(){return this[this.isShown?"hide":"show"]()},show:function(){var b=this,c=a.Event("show");this.$element.trigger(c);if(this.isShown||c.isDefaultPrevented())return;a("body").addClass("modal-open"),this.isShown=!0,g.call(this),e.call(this,function(){var c=a.support.transition&&b.$element.hasClass("fade");b.$element.parent().length||b.$element.appendTo(document.body),b.$element.show(),c&&b.$element[0].offsetWidth,b.$element.addClass("in"),c?b.$element.one(a.support.transition.end,function(){b.$element.trigger("shown")}):b.$element.trigger("shown")})},hide:function(b){b&&b.preventDefault();var e=this;b=a.Event("hide"),this.$element.trigger(b);if(!this.isShown||b.isDefaultPrevented())return;this.isShown=!1,a("body").removeClass("modal-open"),g.call(this),this.$element.removeClass("in"),a.support.transition&&this.$element.hasClass("fade")?c.call(this):d.call(this)}},a.fn.modal=function(c){return this.each(function(){var d=a(this),e=d.data("modal"),f=a.extend({},a.fn.modal.defaults,d.data(),typeof c=="object"&&c);e||d.data("modal",e=new b(this,f)),typeof c=="string"?e[c]():f.show&&e.show()})},a.fn.modal.defaults={backdrop:!0,keyboard:!0,show:!0},a.fn.modal.Constructor=b,a(function(){a("body").on("click.modal.data-api",'[data-toggle="modal"]',function(b){var c=a(this),d,e=a(c.attr("data-target")||(d=c.attr("href"))&&d.replace(/.*(?=#[^\s]+$)/,"")),f=e.data("modal")?"toggle":a.extend({},e.data(),c.data());b.preventDefault(),e.modal(f)})})}(window.jQuery),!function(a){function d(){a(b).parent().removeClass("open")}var b='[data-toggle="dropdown"]',c=function(b){var c=a(b).on("click.dropdown.data-api",this.toggle);a("html").on("click.dropdown.data-api",function(){c.parent().removeClass("open")})};c.prototype={constructor:c,toggle:function(b){var c=a(this),e,f,g;if(c.is(".disabled, :disabled"))return;return f=c.attr("data-target"),f||(f=c.attr("href"),f=f&&f.replace(/.*(?=#[^\s]*$)/,"")),e=a(f),e.length||(e=c.parent()),g=e.hasClass("open"),d(),g||e.toggleClass("open"),!1}},a.fn.dropdown=function(b){return this.each(function(){var d=a(this),e=d.data("dropdown");e||d.data("dropdown",e=new c(this)),typeof b=="string"&&e[b].call(d)})},a.fn.dropdown.Constructor=c,a(function(){a("html").on("click.dropdown.data-api",d),a("body").on("click.dropdown",".dropdown form",function(a){a.stopPropagation()}).on("click.dropdown.data-api",b,c.prototype.toggle)})}(window.jQuery),!function(a){var b=function(a,b){this.init("tooltip",a,b)};b.prototype={constructor:b,init:function(b,c,d){var e,f;this.type=b,this.$element=a(c),this.options=this.getOptions(d),this.enabled=!0,this.options.trigger!="manual"&&(e=this.options.trigger=="hover"?"mouseenter":"focus",f=this.options.trigger=="hover"?"mouseleave":"blur",this.$element.on(e,this.options.selector,a.proxy(this.enter,this)),this.$element.on(f,this.options.selector,a.proxy(this.leave,this))),this.options.selector?this._options=a.extend({},this.options,{trigger:"manual",selector:""}):this.fixTitle()},getOptions:function(b){return b=a.extend({},a.fn[this.type].defaults,b,this.$element.data()),b.delay&&typeof b.delay=="number"&&(b.delay={show:b.delay,hide:b.delay}),b},enter:function(b){var c=a(b.currentTarget)[this.type](this._options).data(this.type);if(!c.options.delay||!c.options.delay.show)return c.show();clearTimeout(this.timeout),c.hoverState="in",this.timeout=setTimeout(function(){c.hoverState=="in"&&c.show()},c.options.delay.show)},leave:function(b){var c=a(b.currentTarget)[this.type](this._options).data(this.type);if(!c.options.delay||!c.options.delay.hide)return c.hide();clearTimeout(this.timeout),c.hoverState="out",this.timeout=setTimeout(function(){c.hoverState=="out"&&c.hide()},c.options.delay.hide)},show:function(){var a,b,c,d,e,f,g;if(this.hasContent()&&this.enabled){a=this.tip(),this.setContent(),this.options.animation&&a.addClass("fade"),f=typeof this.options.placement=="function"?this.options.placement.call(this,a[0],this.$element[0]):this.options.placement,b=/in/.test(f),a.remove().css({top:0,left:0,display:"block"}).appendTo(b?this.$element:document.body),c=this.getPosition(b),d=a[0].offsetWidth,e=a[0].offsetHeight;switch(b?f.split(" ")[1]:f){case"bottom":g={top:c.top+c.height,left:c.left+c.width/2-d/2};break;case"top":g={top:c.top-e,left:c.left+c.width/2-d/2};break;case"left":g={top:c.top+c.height/2-e/2,left:c.left-d};break;case"right":g={top:c.top+c.height/2-e/2,left:c.left+c.width}}a.css(g).addClass(f).addClass("in")}},isHTML:function(a){return typeof a!="string"||a.charAt(0)==="<"&&a.charAt(a.length-1)===">"&&a.length>=3||/^(?:[^<]*<[\w\W]+>[^>]*$)/.exec(a)},setContent:function(){var a=this.tip(),b=this.getTitle();a.find(".tooltip-inner")[this.isHTML(b)?"html":"text"](b),a.removeClass("fade in top bottom left right")},hide:function(){function d(){var b=setTimeout(function(){c.off(a.support.transition.end).remove()},500);c.one(a.support.transition.end,function(){clearTimeout(b),c.remove()})}var b=this,c=this.tip();c.removeClass("in"),a.support.transition&&this.$tip.hasClass("fade")?d():c.remove()},fixTitle:function(){var a=this.$element;(a.attr("title")||typeof a.attr("data-original-title")!="string")&&a.attr("data-original-title",a.attr("title")||"").removeAttr("title")},hasContent:function(){return this.getTitle()},getPosition:function(b){return a.extend({},b?{top:0,left:0}:this.$element.offset(),{width:this.$element[0].offsetWidth,height:this.$element[0].offsetHeight})},getTitle:function(){var a,b=this.$element,c=this.options;return a=b.attr("data-original-title")||(typeof c.title=="function"?c.title.call(b[0]):c.title),a},tip:function(){return this.$tip=this.$tip||a(this.options.template)},validate:function(){this.$element[0].parentNode||(this.hide(),this.$element=null,this.options=null)},enable:function(){this.enabled=!0},disable:function(){this.enabled=!1},toggleEnabled:function(){this.enabled=!this.enabled},toggle:function(){this[this.tip().hasClass("in")?"hide":"show"]()}},a.fn.tooltip=function(c){return this.each(function(){var d=a(this),e=d.data("tooltip"),f=typeof c=="object"&&c;e||d.data("tooltip",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.tooltip.Constructor=b,a.fn.tooltip.defaults={animation:!0,placement:"top",selector:!1,template:'<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',trigger:"hover",title:"",delay:0}}(window.jQuery),!function(a){var b=function(a,b){this.init("popover",a,b)};b.prototype=a.extend({},a.fn.tooltip.Constructor.prototype,{constructor:b,setContent:function(){var a=this.tip(),b=this.getTitle(),c=this.getContent();a.find(".popover-title")[this.isHTML(b)?"html":"text"](b),a.find(".popover-content > *")[this.isHTML(c)?"html":"text"](c),a.removeClass("fade top bottom left right in")},hasContent:function(){return this.getTitle()||this.getContent()},getContent:function(){var a,b=this.$element,c=this.options;return a=b.attr("data-content")||(typeof c.content=="function"?c.content.call(b[0]):c.content),a},tip:function(){return this.$tip||(this.$tip=a(this.options.template)),this.$tip}}),a.fn.popover=function(c){return this.each(function(){var d=a(this),e=d.data("popover"),f=typeof c=="object"&&c;e||d.data("popover",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.popover.Constructor=b,a.fn.popover.defaults=a.extend({},a.fn.tooltip.defaults,{placement:"right",content:"",template:'<div class="popover"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div></div></div>'})}(window.jQuery),!function(a){var b='[data-dismiss="alert"]',c=function(c){a(c).on("click",b,this.close)};c.prototype.close=function(b){function f(){e.trigger("closed").remove()}var c=a(this),d=c.attr("data-target"),e;d||(d=c.attr("href"),d=d&&d.replace(/.*(?=#[^\s]*$)/,"")),e=a(d),b&&b.preventDefault(),e.length||(e=c.hasClass("alert")?c:c.parent()),e.trigger(b=a.Event("close"));if(b.isDefaultPrevented())return;e.removeClass("in"),a.support.transition&&e.hasClass("fade")?e.on(a.support.transition.end,f):f()},a.fn.alert=function(b){return this.each(function(){var d=a(this),e=d.data("alert");e||d.data("alert",e=new c(this)),typeof b=="string"&&e[b].call(d)})},a.fn.alert.Constructor=c,a(function(){a("body").on("click.alert.data-api",b,c.prototype.close)})}(window.jQuery),!function(a){var b=function(b,c){this.$element=a(b),this.options=a.extend({},a.fn.button.defaults,c)};b.prototype.setState=function(a){var b="disabled",c=this.$element,d=c.data(),e=c.is("input")?"val":"html";a+="Text",d.resetText||c.data("resetText",c[e]()),c[e](d[a]||this.options[a]),setTimeout(function(){a=="loadingText"?c.addClass(b).attr(b,b):c.removeClass(b).removeAttr(b)},0)},b.prototype.toggle=function(){var a=this.$element.parent('[data-toggle="buttons-radio"]');a&&a.find(".active").removeClass("active"),this.$element.toggleClass("active")},a.fn.button=function(c){return this.each(function(){var d=a(this),e=d.data("button"),f=typeof c=="object"&&c;e||d.data("button",e=new b(this,f)),c=="toggle"?e.toggle():c&&e.setState(c)})},a.fn.button.defaults={loadingText:"loading..."},a.fn.button.Constructor=b,a(function(){a("body").on("click.button.data-api","[data-toggle^=button]",function(b){var c=a(b.target);c.hasClass("btn")||(c=c.closest(".btn")),c.button("toggle")})})}(window.jQuery),!function(a){var b=function(b,c){this.$element=a(b),this.options=a.extend({},a.fn.collapse.defaults,c),this.options.parent&&(this.$parent=a(this.options.parent)),this.options.toggle&&this.toggle()};b.prototype={constructor:b,dimension:function(){var a=this.$element.hasClass("width");return a?"width":"height"},show:function(){var b,c,d,e;if(this.transitioning)return;b=this.dimension(),c=a.camelCase(["scroll",b].join("-")),d=this.$parent&&this.$parent.find("> .accordion-group > .in");if(d&&d.length){e=d.data("collapse");if(e&&e.transitioning)return;d.collapse("hide"),e||d.data("collapse",null)}this.$element[b](0),this.transition("addClass",a.Event("show"),"shown"),this.$element[b](this.$element[0][c])},hide:function(){var b;if(this.transitioning)return;b=this.dimension(),this.reset(this.$element[b]()),this.transition("removeClass",a.Event("hide"),"hidden"),this.$element[b](0)},reset:function(a){var b=this.dimension();return this.$element.removeClass("collapse")[b](a||"auto")[0].offsetWidth,this.$element[a!==null?"addClass":"removeClass"]("collapse"),this},transition:function(b,c,d){var e=this,f=function(){c.type=="show"&&e.reset(),e.transitioning=0,e.$element.trigger(d)};this.$element.trigger(c);if(c.isDefaultPrevented())return;this.transitioning=1,this.$element[b]("in"),a.support.transition&&this.$element.hasClass("collapse")?this.$element.one(a.support.transition.end,f):f()},toggle:function(){this[this.$element.hasClass("in")?"hide":"show"]()}},a.fn.collapse=function(c){return this.each(function(){var d=a(this),e=d.data("collapse"),f=typeof c=="object"&&c;e||d.data("collapse",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.collapse.defaults={toggle:!0},a.fn.collapse.Constructor=b,a(function(){a("body").on("click.collapse.data-api","[data-toggle=collapse]",function(b){var c=a(this),d,e=c.attr("data-target")||b.preventDefault()||(d=c.attr("href"))&&d.replace(/.*(?=#[^\s]+$)/,""),f=a(e).data("collapse")?"toggle":c.data();a(e).collapse(f)})})}(window.jQuery),!function(a){var b=function(b,c){this.$element=a(b),this.options=a.extend({},a.fn.typeahead.defaults,c),this.matcher=this.options.matcher||this.matcher,this.sorter=this.options.sorter||this.sorter,this.highlighter=this.options.highlighter||this.highlighter,this.updater=this.options.updater||this.updater,this.$menu=a(this.options.menu).appendTo("body"),this.source=this.options.source,this.shown=!1,this.listen()};b.prototype={constructor:b,select:function(){var a=this.$menu.find(".active").attr("data-value");return this.$element.val(this.updater(a)).change(),this.hide()},updater:function(a){return a},show:function(){var b=a.extend({},this.$element.offset(),{height:this.$element[0].offsetHeight});return this.$menu.css({top:b.top+b.height,left:b.left}),this.$menu.show(),this.shown=!0,this},hide:function(){return this.$menu.hide(),this.shown=!1,this},lookup:function(b){var c=this,d,e;return this.query=this.$element.val(),this.query?(d=a.grep(this.source,function(a){return c.matcher(a)}),d=this.sorter(d),d.length?this.render(d.slice(0,this.options.items)).show():this.shown?this.hide():this):this.shown?this.hide():this},matcher:function(a){return~a.toLowerCase().indexOf(this.query.toLowerCase())},sorter:function(a){var b=[],c=[],d=[],e;while(e=a.shift())e.toLowerCase().indexOf(this.query.toLowerCase())?~e.indexOf(this.query)?c.push(e):d.push(e):b.push(e);return b.concat(c,d)},highlighter:function(a){var b=this.query.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g,"\\$&");return a.replace(new RegExp("("+b+")","ig"),function(a,b){return"<strong>"+b+"</strong>"})},render:function(b){var c=this;return b=a(b).map(function(b,d){return b=a(c.options.item).attr("data-value",d),b.find("a").html(c.highlighter(d)),b[0]}),b.first().addClass("active"),this.$menu.html(b),this},next:function(b){var c=this.$menu.find(".active").removeClass("active"),d=c.next();d.length||(d=a(this.$menu.find("li")[0])),d.addClass("active")},prev:function(a){var b=this.$menu.find(".active").removeClass("active"),c=b.prev();c.length||(c=this.$menu.find("li").last()),c.addClass("active")},listen:function(){this.$element.on("blur",a.proxy(this.blur,this)).on("keypress",a.proxy(this.keypress,this)).on("keyup",a.proxy(this.keyup,this)),(a.browser.webkit||a.browser.msie)&&this.$element.on("keydown",a.proxy(this.keypress,this)),this.$menu.on("click",a.proxy(this.click,this)).on("mouseenter","li",a.proxy(this.mouseenter,this))},keyup:function(a){switch(a.keyCode){case 40:case 38:break;case 9:case 13:if(!this.shown)return;this.select();break;case 27:if(!this.shown)return;this.hide();break;default:this.lookup()}a.stopPropagation(),a.preventDefault()},keypress:function(a){if(!this.shown)return;switch(a.keyCode){case 9:case 13:case 27:a.preventDefault();break;case 38:if(a.type!="keydown")break;a.preventDefault(),this.prev();break;case 40:if(a.type!="keydown")break;a.preventDefault(),this.next()}a.stopPropagation()},blur:function(a){var b=this;setTimeout(function(){b.hide()},150)},click:function(a){a.stopPropagation(),a.preventDefault(),this.select()},mouseenter:function(b){this.$menu.find(".active").removeClass("active"),a(b.currentTarget).addClass("active")}},a.fn.typeahead=function(c){return this.each(function(){var d=a(this),e=d.data("typeahead"),f=typeof c=="object"&&c;e||d.data("typeahead",e=new b(this,f)),typeof c=="string"&&e[c]()})},a.fn.typeahead.defaults={source:[],items:8,menu:'<ul class="typeahead dropdown-menu"></ul>',item:'<li><a href="#"></a></li>'},a.fn.typeahead.Constructor=b,a(function(){a("body").on("focus.typeahead.data-api",'[data-provide="typeahead"]',function(b){var c=a(this);if(c.data("typeahead"))return;b.preventDefault(),c.typeahead(c.data())})})}(window.jQuery)

data/site/assets/luca-ui-bootstrap.css

@@ -847,8 +847,16 @@ button.close{padding:0;cursor:pointer;background:transparent;border:0;-webkit-ap
     .with-mask .load-mask .progress {
       margin: 50px auto;
       width: 50%; }
+html.luca-ui-fullscreen, body.luca-ui-fullscreen {
+  height: 100%; }
+
+.luca-ui-fullscreen .fluid-viewport-wrapper {
+  padding-top: 40px; }
+.luca-ui-fullscreen .luca-ui-viewport, .luca-ui-fullscreen .fullscreen-container {
+  min-height: 100%;
+  height: auto !important;
+  height: 100%; }
 .toolbar-container {
-  overflow: hidden;
   clear: both; }
 
 .toolbar-container.top {
@@ -1286,6 +1294,16 @@ ul.typeahead.dropdown-menu {
 .font-large .CodeMirror {
   font-size: 18px;
   line-height: 1.7; }
+
+#component_tester #editor_container .toolbar-container.bottom {
+  margin: 0px; }
+  #component_tester #editor_container .toolbar-container.bottom .luca-ui-toolbar {
+    margin: 0px;
+    padding: 0px; }
+#component_tester [data-luca-owner="component_detail"] {
+  max-height: 600px;
+  overflow: scroll;
+  min-height: 400px; }
 .luca-ui-console .CodeMirror {
   font-family: "Monaco";
   font-size: 14px;

data/site/assets/luca-ui-development-tools.css

@@ -196,6 +196,16 @@ ul.typeahead.dropdown-menu {
 .font-large .CodeMirror {
   font-size: 18px;
   line-height: 1.7; }
+
+#component_tester #editor_container .toolbar-container.bottom {
+  margin: 0px; }
+  #component_tester #editor_container .toolbar-container.bottom .luca-ui-toolbar {
+    margin: 0px;
+    padding: 0px; }
+#component_tester [data-luca-owner="component_detail"] {
+  max-height: 600px;
+  overflow: scroll;
+  min-height: 400px; }
 .luca-ui-console .CodeMirror {
   font-family: "Monaco";
   font-size: 14px;