" : "\n" : this.HTML ? " " : " "; - }, - // extra can be a number, shortcut for increasing-calling-decreasing - indent: function( extra ) { - if ( !this.multiline ) { - return ""; - } - var chr = this.indentChar; - if ( this.HTML ) { - chr = chr.replace( /\t/g, " " ).replace( / /g, " " ); - } - return new Array( this.depth + ( extra || 0 ) ).join(chr); - }, - up: function( a ) { - this.depth += a || 1; - }, - down: function( a ) { - this.depth -= a || 1; - }, - setParser: function( name, parser ) { - this.parsers[name] = parser; - }, - // The next 3 are exposed so you can use them - quote: quote, - literal: literal, - join: join, - // - depth: 1, - // This is the list of parsers, to modify them, use jsDump.setParser - parsers: { - window: "[Window]", - document: "[Document]", - error: function(error) { - return "Error(\"" + error.message + "\")"; - }, - unknown: "[Unknown]", - "null": "null", - "undefined": "undefined", - "function": function( fn ) { - var ret = "function", - // functions never have name in IE - name = "name" in fn ? fn.name : (reName.exec(fn) || [])[1]; - - if ( name ) { - ret += " " + name; - } - ret += "( "; - - ret = [ ret, QUnit.jsDump.parse( fn, "functionArgs" ), "){" ].join( "" ); - return join( ret, QUnit.jsDump.parse(fn,"functionCode" ), "}" ); - }, - array: array, - nodelist: array, - "arguments": array, - object: function( map, stack ) { - /*jshint forin:false */ - var ret = [ ], keys, key, val, i; - QUnit.jsDump.up(); - keys = []; - for ( key in map ) { - keys.push( key ); - } - keys.sort(); - for ( i = 0; i < keys.length; i++ ) { - key = keys[ i ]; - val = map[ key ]; - ret.push( QUnit.jsDump.parse( key, "key" ) + ": " + QUnit.jsDump.parse( val, undefined, stack ) ); - } - QUnit.jsDump.down(); - return join( "{", ret, "}" ); - }, - node: function( node ) { - var len, i, val, - open = QUnit.jsDump.HTML ? "<" : "<", - close = QUnit.jsDump.HTML ? ">" : ">", - tag = node.nodeName.toLowerCase(), - ret = open + tag, - attrs = node.attributes; - - if ( attrs ) { - for ( i = 0, len = attrs.length; i < len; i++ ) { - val = attrs[i].nodeValue; - // IE6 includes all attributes in .attributes, even ones not explicitly set. - // Those have values like undefined, null, 0, false, "" or "inherit". - if ( val && val !== "inherit" ) { - ret += " " + attrs[i].nodeName + "=" + QUnit.jsDump.parse( val, "attribute" ); - } - } - } - ret += close; - - // Show content of TextNode or CDATASection - if ( node.nodeType === 3 || node.nodeType === 4 ) { - ret += node.nodeValue; - } - - return ret + open + "/" + tag + close; - }, - // function calls it internally, it's the arguments part of the function - functionArgs: function( fn ) { - var args, - l = fn.length; - - if ( !l ) { - return ""; - } - - args = new Array(l); - while ( l-- ) { - // 97 is 'a' - args[l] = String.fromCharCode(97+l); - } - return " " + args.join( ", " ) + " "; - }, - // object calls it internally, the key part of an item in a map - key: quote, - // function calls it internally, it's the content of the function - functionCode: "[code]", - // node calls it internally, it's an html attribute value - attribute: quote, - string: quote, - date: quote, - regexp: literal, - number: literal, - "boolean": literal - }, - // if true, entities are escaped ( <, >, \t, space and \n ) - HTML: false, - // indentation unit - indentChar: " ", - // if true, items in a collection, are separated by a \n, else just a space. - multiline: true - }; - - return jsDump; -}()); - -// from jquery.js -function inArray( elem, array ) { - if ( array.indexOf ) { - return array.indexOf( elem ); - } - - for ( var i = 0, length = array.length; i < length; i++ ) { - if ( array[ i ] === elem ) { - return i; - } - } - - return -1; -} - -/* - * Javascript Diff Algorithm - * By John Resig (http://ejohn.org/) - * Modified by Chu Alan "sprite" - * - * Released under the MIT license. - * - * More Info: - * http://ejohn.org/projects/javascript-diff-algorithm/ - * - * Usage: QUnit.diff(expected, actual) - * - * QUnit.diff( "the quick brown fox jumped over", "the quick fox jumps over" ) == "the quick
I am the template
- ```
-
- Within an Ember application is more common to define a Handlebars templates as
- part of a page:
-
- ```html
-
- ```
-
- And associate it by name using a view's `templateName` property:
-
- ```javascript
- AView = Ember.View.extend({
- templateName: 'some-template'
- });
- ```
-
- Using a value for `templateName` that does not have a Handlebars template
- with a matching `data-template-name` attribute will throw an error.
-
- For views classes that may have a template later defined (e.g. as the block
- portion of a `{{view}}` Handlebars helper call in another template or in
- a subclass), you can provide a `defaultTemplate` property set to compiled
- template function. If a template is not later provided for the view instance
- the `defaultTemplate` value will be used:
-
- ```javascript
- AView = Ember.View.extend({
- defaultTemplate: Ember.Handlebars.compile('I was the default'),
- template: null,
- templateName: null
- });
- ```
-
- Will result in instances with an HTML representation of:
-
- ```html
- I was the default
- ```
-
- If a `template` or `templateName` is provided it will take precedence over
- `defaultTemplate`:
-
- ```javascript
- AView = Ember.View.extend({
- defaultTemplate: Ember.Handlebars.compile('I was the default')
- });
-
- aView = AView.create({
- template: Ember.Handlebars.compile('I was the template, not default')
- });
- ```
-
- Will result in the following HTML representation when rendered:
-
- ```html
- I was the template, not default
- ```
-
- ## View Context
-
- The default context of the compiled template is the view's controller:
-
- ```javascript
- AView = Ember.View.extend({
- template: Ember.Handlebars.compile('Hello {{excitedGreeting}}')
- });
-
- aController = Ember.Object.create({
- firstName: 'Barry',
- excitedGreeting: function() {
- return this.get("content.firstName") + "!!!"
- }.property()
- });
-
- aView = AView.create({
- controller: aController,
- });
- ```
-
- Will result in an HTML representation of:
-
- ```html
- Hello Barry!!!
- ```
-
- A context can also be explicitly supplied through the view's `context`
- property. If the view has neither `context` nor `controller` properties, the
- `parentView`'s context will be used.
-
- ## Layouts
-
- Views can have a secondary template that wraps their main template. Like
- primary templates, layouts can be any function that accepts an optional
- context parameter and returns a string of HTML that will be inserted inside
- view's tag. Views whose HTML element is self closing (e.g. ``)
- cannot have a layout and this property will be ignored.
-
- Most typically in Ember a layout will be a compiled `Ember.Handlebars`
- template.
-
- A view's layout can be set directly with the `layout` property or reference
- an existing Handlebars template by name with the `layoutName` property.
-
- A template used as a layout must contain a single use of the Handlebars
- `{{yield}}` helper. The HTML contents of a view's rendered `template` will be
- inserted at this location:
-
- ```javascript
- AViewWithLayout = Ember.View.extend({
- layout: Ember.Handlebars.compile("{{yield}}
")
- template: Ember.Handlebars.compile("I got wrapped"),
- });
- ```
-
- Will result in view instances with an HTML representation of:
-
- ```html
-
-
- ```
-
- See [Ember.Handlebars.helpers.yield](/api/classes/Ember.Handlebars.helpers.html#method_yield)
- for more information.
-
- ## Responding to Browser Events
-
- Views can respond to user-initiated events in one of three ways: method
- implementation, through an event manager, and through `{{action}}` helper use
- in their template or layout.
-
- ### Method Implementation
-
- Views can respond to user-initiated events by implementing a method that
- matches the event name. A `jQuery.Event` object will be passed as the
- argument to this method.
-
- ```javascript
- AView = Ember.View.extend({
- click: function(event) {
- // will be called when when an instance's
- // rendered element is clicked
- }
- });
- ```
-
- ### Event Managers
-
- Views can define an object as their `eventManager` property. This object can
- then implement methods that match the desired event names. Matching events
- that occur on the view's rendered HTML or the rendered HTML of any of its DOM
- descendants will trigger this method. A `jQuery.Event` object will be passed
- as the first argument to the method and an `Ember.View` object as the
- second. The `Ember.View` will be the view whose rendered HTML was interacted
- with. This may be the view with the `eventManager` property or one of its
- descendent views.
-
- ```javascript
- AView = Ember.View.extend({
- eventManager: Ember.Object.create({
- doubleClick: function(event, view) {
- // will be called when when an instance's
- // rendered element or any rendering
- // of this views's descendent
- // elements is clicked
- }
- })
- });
- ```
-
- An event defined for an event manager takes precedence over events of the
- same name handled through methods on the view.
-
- ```javascript
- AView = Ember.View.extend({
- mouseEnter: function(event) {
- // will never trigger.
- },
- eventManager: Ember.Object.create({
- mouseEnter: function(event, view) {
- // takes precedence over AView#mouseEnter
- }
- })
- });
- ```
-
- Similarly a view's event manager will take precedence for events of any views
- rendered as a descendent. A method name that matches an event name will not
- be called if the view instance was rendered inside the HTML representation of
- a view that has an `eventManager` property defined that handles events of the
- name. Events not handled by the event manager will still trigger method calls
- on the descendent.
-
- ```javascript
- OuterView = Ember.View.extend({
- template: Ember.Handlebars.compile("outer {{#view InnerView}}inner{{/view}} outer"),
- eventManager: Ember.Object.create({
- mouseEnter: function(event, view) {
- // view might be instance of either
- // OuterView or InnerView depending on
- // where on the page the user interaction occured
- }
- })
- });
-
- InnerView = Ember.View.extend({
- click: function(event) {
- // will be called if rendered inside
- // an OuterView because OuterView's
- // eventManager doesn't handle click events
- },
- mouseEnter: function(event) {
- // will never be called if rendered inside
- // an OuterView.
- }
- });
- ```
-
- ### Handlebars `{{action}}` Helper
-
- See [Handlebars.helpers.action](/api/classes/Ember.Handlebars.helpers.html#method_action).
-
- ### Event Names
-
- All of the event handling approaches described above respond to the same set
- of events. The names of the built-in events are listed below. (The hash of
- built-in events exists in `Ember.EventDispatcher`.) Additional, custom events
- can be registered by using `Ember.Application.customEvents`.
-
- Touch events:
-
- * `touchStart`
- * `touchMove`
- * `touchEnd`
- * `touchCancel`
-
- Keyboard events
-
- * `keyDown`
- * `keyUp`
- * `keyPress`
-
- Mouse events
-
- * `mouseDown`
- * `mouseUp`
- * `contextMenu`
- * `click`
- * `doubleClick`
- * `mouseMove`
- * `focusIn`
- * `focusOut`
- * `mouseEnter`
- * `mouseLeave`
-
- Form events:
-
- * `submit`
- * `change`
- * `focusIn`
- * `focusOut`
- * `input`
-
- HTML5 drag and drop events:
-
- * `dragStart`
- * `drag`
- * `dragEnter`
- * `dragLeave`
- * `drop`
- * `dragEnd`
-
- ## Handlebars `{{view}}` Helper
-
- Other `Ember.View` instances can be included as part of a view's template by
- using the `{{view}}` Handlebars helper. See [Ember.Handlebars.helpers.view](/api/classes/Ember.Handlebars.helpers.html#method_view)
- for additional information.
-
- @class View
- @namespace Ember
- @extends Ember.CoreView
-*/
-Ember.View = Ember.CoreView.extend(
-/** @scope Ember.View.prototype */ {
-
- concatenatedProperties: ['classNames', 'classNameBindings', 'attributeBindings'],
-
- /**
- @property isView
- @type Boolean
- @default true
- @final
- */
- isView: true,
-
- // ..........................................................
- // TEMPLATE SUPPORT
- //
-
- /**
- The name of the template to lookup if no template is provided.
-
- By default `Ember.View` will lookup a template with this name in
- `Ember.TEMPLATES` (a shared global object).
-
- @property templateName
- @type String
- @default null
- */
- templateName: null,
-
- /**
- The name of the layout to lookup if no layout is provided.
-
- By default `Ember.View` will lookup a template with this name in
- `Ember.TEMPLATES` (a shared global object).
-
- @property layoutName
- @type String
- @default null
- */
- layoutName: null,
-
- /**
- The template used to render the view. This should be a function that
- accepts an optional context parameter and returns a string of HTML that
- will be inserted into the DOM relative to its parent view.
-
- In general, you should set the `templateName` property instead of setting
- the template yourself.
-
- @property template
- @type Function
- */
- template: Ember.computed(function(key, value) {
- if (value !== undefined) { return value; }
-
- var templateName = get(this, 'templateName'),
- template = this.templateForName(templateName, 'template');
-
- Ember.assert("You specified the templateName " + templateName + " for " + this + ", but it did not exist.", !templateName || template);
-
- return template || get(this, 'defaultTemplate');
- }).property('templateName'),
-
- /**
- The controller managing this view. If this property is set, it will be
- made available for use by the template.
-
- @property controller
- @type Object
- */
- controller: Ember.computed(function(key) {
- var parentView = get(this, '_parentView');
- return parentView ? get(parentView, 'controller') : null;
- }).property('_parentView'),
-
- /**
- A view may contain a layout. A layout is a regular template but
- supersedes the `template` property during rendering. It is the
- responsibility of the layout template to retrieve the `template`
- property from the view (or alternatively, call `Handlebars.helpers.yield`,
- `{{yield}}`) to render it in the correct location.
-
- This is useful for a view that has a shared wrapper, but which delegates
- the rendering of the contents of the wrapper to the `template` property
- on a subclass.
-
- @property layout
- @type Function
- */
- layout: Ember.computed(function(key) {
- var layoutName = get(this, 'layoutName'),
- layout = this.templateForName(layoutName, 'layout');
-
- Ember.assert("You specified the layoutName " + layoutName + " for " + this + ", but it did not exist.", !layoutName || layout);
-
- return layout || get(this, 'defaultLayout');
- }).property('layoutName'),
-
- _yield: function(context, options) {
- var template = get(this, 'template');
- if (template) { template(context, options); }
- },
-
- templateForName: function(name, type) {
- if (!name) { return; }
- Ember.assert("templateNames are not allowed to contain periods: "+name, name.indexOf('.') === -1);
-
- // the defaultContainer is deprecated
- var container = this.container || (Ember.Container && Ember.Container.defaultContainer);
- return container && container.lookup('template:' + name);
- },
-
- /**
- The object from which templates should access properties.
-
- This object will be passed to the template function each time the render
- method is called, but it is up to the individual function to decide what
- to do with it.
-
- By default, this will be the view's controller.
-
- @property context
- @type Object
- */
- context: Ember.computed(function(key, value) {
- if (arguments.length === 2) {
- set(this, '_context', value);
- return value;
- } else {
- return get(this, '_context');
- }
- }).volatile(),
-
- /**
- @private
-
- Private copy of the view's template context. This can be set directly
- by Handlebars without triggering the observer that causes the view
- to be re-rendered.
-
- The context of a view is looked up as follows:
-
- 1. Supplied context (usually by Handlebars)
- 2. Specified controller
- 3. `parentView`'s context (for a child of a ContainerView)
-
- The code in Handlebars that overrides the `_context` property first
- checks to see whether the view has a specified controller. This is
- something of a hack and should be revisited.
-
- @property _context
- */
- _context: Ember.computed(function(key) {
- var parentView, controller;
-
- if (controller = get(this, 'controller')) {
- return controller;
- }
-
- parentView = this._parentView;
- if (parentView) {
- return get(parentView, '_context');
- }
-
- return null;
- }),
-
- /**
- @private
-
- If a value that affects template rendering changes, the view should be
- re-rendered to reflect the new value.
-
- @method _contextDidChange
- */
- _contextDidChange: Ember.observer('context', function() {
- this.rerender();
- }),
-
- /**
- If `false`, the view will appear hidden in DOM.
-
- @property isVisible
- @type Boolean
- @default null
- */
- isVisible: true,
-
- /**
- @private
-
- Array of child views. You should never edit this array directly.
- Instead, use `appendChild` and `removeFromParent`.
-
- @property childViews
- @type Array
- @default []
- */
- childViews: childViewsProperty,
-
- _childViews: EMPTY_ARRAY,
-
- // When it's a virtual view, we need to notify the parent that their
- // childViews will change.
- _childViewsWillChange: Ember.beforeObserver('childViews', function() {
- if (this.isVirtual) {
- var parentView = get(this, 'parentView');
- if (parentView) { Ember.propertyWillChange(parentView, 'childViews'); }
- }
- }),
-
- // When it's a virtual view, we need to notify the parent that their
- // childViews did change.
- _childViewsDidChange: Ember.observer('childViews', function() {
- if (this.isVirtual) {
- var parentView = get(this, 'parentView');
- if (parentView) { Ember.propertyDidChange(parentView, 'childViews'); }
- }
- }),
-
- /**
- Return the nearest ancestor that is an instance of the provided
- class.
-
- @property nearestInstanceOf
- @param {Class} klass Subclass of Ember.View (or Ember.View itself)
- @return Ember.View
- @deprecated
- */
- nearestInstanceOf: function(klass) {
- Ember.deprecate("nearestInstanceOf is deprecated and will be removed from future releases. Use nearestOfType.");
- var view = get(this, 'parentView');
-
- while (view) {
- if (view instanceof klass) { return view; }
- view = get(view, 'parentView');
- }
- },
-
- /**
- Return the nearest ancestor that is an instance of the provided
- class or mixin.
-
- @property nearestOfType
- @param {Class,Mixin} klass Subclass of Ember.View (or Ember.View itself),
- or an instance of Ember.Mixin.
- @return Ember.View
- */
- nearestOfType: function(klass) {
- var view = get(this, 'parentView'),
- isOfType = klass instanceof Ember.Mixin ?
- function(view) { return klass.detect(view); } :
- function(view) { return klass.detect(view.constructor); };
-
- while (view) {
- if (isOfType(view)) { return view; }
- view = get(view, 'parentView');
- }
- },
-
- /**
- Return the nearest ancestor that has a given property.
-
- @property nearestWithProperty
- @param {String} property A property name
- @return Ember.View
- */
- nearestWithProperty: function(property) {
- var view = get(this, 'parentView');
-
- while (view) {
- if (property in view) { return view; }
- view = get(view, 'parentView');
- }
- },
-
- /**
- Return the nearest ancestor whose parent is an instance of
- `klass`.
-
- @property nearestChildOf
- @param {Class} klass Subclass of Ember.View (or Ember.View itself)
- @return Ember.View
- */
- nearestChildOf: function(klass) {
- var view = get(this, 'parentView');
-
- while (view) {
- if (get(view, 'parentView') instanceof klass) { return view; }
- view = get(view, 'parentView');
- }
- },
-
- /**
- @private
-
- When the parent view changes, recursively invalidate `controller`
-
- @method _parentViewDidChange
- */
- _parentViewDidChange: Ember.observer('_parentView', function() {
- if (this.isDestroying) { return; }
-
- this.trigger('parentViewDidChange');
-
- if (get(this, 'parentView.controller') && !get(this, 'controller')) {
- this.notifyPropertyChange('controller');
- }
- }),
-
- _controllerDidChange: Ember.observer('controller', function() {
- if (this.isDestroying) { return; }
-
- this.rerender();
-
- this.forEachChildView(function(view) {
- view.propertyDidChange('controller');
- });
- }),
-
- cloneKeywords: function() {
- var templateData = get(this, 'templateData');
-
- var keywords = templateData ? Ember.copy(templateData.keywords) : {};
- set(keywords, 'view', get(this, 'concreteView'));
- set(keywords, '_view', this);
- set(keywords, 'controller', get(this, 'controller'));
-
- return keywords;
- },
-
- /**
- Called on your view when it should push strings of HTML into a
- `Ember.RenderBuffer`. Most users will want to override the `template`
- or `templateName` properties instead of this method.
-
- By default, `Ember.View` will look for a function in the `template`
- property and invoke it with the value of `context`. The value of
- `context` will be the view's controller unless you override it.
-
- @method render
- @param {Ember.RenderBuffer} buffer The render buffer
- */
- render: function(buffer) {
- // If this view has a layout, it is the responsibility of the
- // the layout to render the view's template. Otherwise, render the template
- // directly.
- var template = get(this, 'layout') || get(this, 'template');
-
- if (template) {
- var context = get(this, 'context');
- var keywords = this.cloneKeywords();
- var output;
-
- var data = {
- view: this,
- buffer: buffer,
- isRenderData: true,
- keywords: keywords,
- insideGroup: get(this, 'templateData.insideGroup')
- };
-
- // Invoke the template with the provided template context, which
- // is the view's controller by default. A hash of data is also passed that provides
- // the template with access to the view and render buffer.
-
- Ember.assert('template must be a function. Did you mean to call Ember.Handlebars.compile("...") or specify templateName instead?', typeof template === 'function');
- // The template should write directly to the render buffer instead
- // of returning a string.
- output = template(context, { data: data });
-
- // If the template returned a string instead of writing to the buffer,
- // push the string onto the buffer.
- if (output !== undefined) { buffer.push(output); }
- }
- },
-
- /**
- Renders the view again. This will work regardless of whether the
- view is already in the DOM or not. If the view is in the DOM, the
- rendering process will be deferred to give bindings a chance
- to synchronize.
-
- If children were added during the rendering process using `appendChild`,
- `rerender` will remove them, because they will be added again
- if needed by the next `render`.
-
- In general, if the display of your view changes, you should modify
- the DOM element directly instead of manually calling `rerender`, which can
- be slow.
-
- @method rerender
- */
- rerender: function() {
- return this.currentState.rerender(this);
- },
-
- clearRenderedChildren: function() {
- var lengthBefore = this.lengthBeforeRender,
- lengthAfter = this.lengthAfterRender;
-
- // If there were child views created during the last call to render(),
- // remove them under the assumption that they will be re-created when
- // we re-render.
-
- // VIEW-TODO: Unit test this path.
- var childViews = this._childViews;
- for (var i=lengthAfter-1; i>=lengthBefore; i--) {
- if (childViews[i]) { childViews[i].destroy(); }
- }
- },
-
- /**
- @private
-
- Iterates over the view's `classNameBindings` array, inserts the value
- of the specified property into the `classNames` array, then creates an
- observer to update the view's element if the bound property ever changes
- in the future.
-
- @method _applyClassNameBindings
- */
- _applyClassNameBindings: function(classBindings) {
- var classNames = this.classNames,
- elem, newClass, dasherizedClass;
-
- // Loop through all of the configured bindings. These will be either
- // property names ('isUrgent') or property paths relative to the view
- // ('content.isUrgent')
- a_forEach(classBindings, function(binding) {
-
- // Variable in which the old class value is saved. The observer function
- // closes over this variable, so it knows which string to remove when
- // the property changes.
- var oldClass;
- // Extract just the property name from bindings like 'foo:bar'
- var parsedPath = Ember.View._parsePropertyPath(binding);
-
- // Set up an observer on the context. If the property changes, toggle the
- // class name.
- var observer = function() {
- // Get the current value of the property
- newClass = this._classStringForProperty(binding);
- elem = this.$();
-
- // If we had previously added a class to the element, remove it.
- if (oldClass) {
- elem.removeClass(oldClass);
- // Also remove from classNames so that if the view gets rerendered,
- // the class doesn't get added back to the DOM.
- classNames.removeObject(oldClass);
- }
-
- // If necessary, add a new class. Make sure we keep track of it so
- // it can be removed in the future.
- if (newClass) {
- elem.addClass(newClass);
- oldClass = newClass;
- } else {
- oldClass = null;
- }
- };
-
- // Get the class name for the property at its current value
- dasherizedClass = this._classStringForProperty(binding);
-
- if (dasherizedClass) {
- // Ensure that it gets into the classNames array
- // so it is displayed when we render.
- a_addObject(classNames, dasherizedClass);
-
- // Save a reference to the class name so we can remove it
- // if the observer fires. Remember that this variable has
- // been closed over by the observer.
- oldClass = dasherizedClass;
- }
-
- this.registerObserver(this, parsedPath.path, observer);
- // Remove className so when the view is rerendered,
- // the className is added based on binding reevaluation
- this.one('willClearRender', function() {
- if (oldClass) {
- classNames.removeObject(oldClass);
- oldClass = null;
- }
- });
-
- }, this);
- },
-
- /**
- @private
-
- Iterates through the view's attribute bindings, sets up observers for each,
- then applies the current value of the attributes to the passed render buffer.
-
- @method _applyAttributeBindings
- @param {Ember.RenderBuffer} buffer
- */
- _applyAttributeBindings: function(buffer, attributeBindings) {
- var attributeValue, elem;
-
- a_forEach(attributeBindings, function(binding) {
- var split = binding.split(':'),
- property = split[0],
- attributeName = split[1] || property;
-
- // Create an observer to add/remove/change the attribute if the
- // JavaScript property changes.
- var observer = function() {
- elem = this.$();
-
- attributeValue = get(this, property);
-
- Ember.View.applyAttributeBindings(elem, attributeName, attributeValue);
- };
-
- this.registerObserver(this, property, observer);
-
- // Determine the current value and add it to the render buffer
- // if necessary.
- attributeValue = get(this, property);
- Ember.View.applyAttributeBindings(buffer, attributeName, attributeValue);
- }, this);
- },
-
- /**
- @private
-
- Given a property name, returns a dasherized version of that
- property name if the property evaluates to a non-falsy value.
-
- For example, if the view has property `isUrgent` that evaluates to true,
- passing `isUrgent` to this method will return `"is-urgent"`.
-
- @method _classStringForProperty
- @param property
- */
- _classStringForProperty: function(property) {
- var parsedPath = Ember.View._parsePropertyPath(property);
- var path = parsedPath.path;
-
- var val = get(this, path);
- if (val === undefined && Ember.isGlobalPath(path)) {
- val = get(Ember.lookup, path);
- }
-
- return Ember.View._classStringForValue(path, val, parsedPath.className, parsedPath.falsyClassName);
- },
-
- // ..........................................................
- // ELEMENT SUPPORT
- //
-
- /**
- Returns the current DOM element for the view.
-
- @property element
- @type DOMElement
- */
- element: Ember.computed(function(key, value) {
- if (value !== undefined) {
- return this.currentState.setElement(this, value);
- } else {
- return this.currentState.getElement(this);
- }
- }).property('_parentView'),
-
- /**
- Returns a jQuery object for this view's element. If you pass in a selector
- string, this method will return a jQuery object, using the current element
- as its buffer.
-
- For example, calling `view.$('li')` will return a jQuery object containing
- all of the `li` elements inside the DOM element of this view.
-
- @method $
- @param {String} [selector] a jQuery-compatible selector string
- @return {jQuery} the jQuery object for the DOM node
- */
- $: function(sel) {
- return this.currentState.$(this, sel);
- },
-
- mutateChildViews: function(callback) {
- var childViews = this._childViews,
- idx = childViews.length,
- view;
-
- while(--idx >= 0) {
- view = childViews[idx];
- callback(this, view, idx);
- }
-
- return this;
- },
-
- forEachChildView: function(callback) {
- var childViews = this._childViews;
-
- if (!childViews) { return this; }
-
- var len = childViews.length,
- view, idx;
-
- for (idx = 0; idx < len; idx++) {
- view = childViews[idx];
- callback(view);
- }
-
- return this;
- },
-
- /**
- Appends the view's element to the specified parent element.
-
- If the view does not have an HTML representation yet, `createElement()`
- will be called automatically.
-
- Note that this method just schedules the view to be appended; the DOM
- element will not be appended to the given element until all bindings have
- finished synchronizing.
-
- This is not typically a function that you will need to call directly when
- building your application. You might consider using `Ember.ContainerView`
- instead. If you do need to use `appendTo`, be sure that the target element
- you are providing is associated with an `Ember.Application` and does not
- have an ancestor element that is associated with an Ember view.
-
- @method appendTo
- @param {String|DOMElement|jQuery} A selector, element, HTML string, or jQuery object
- @return {Ember.View} receiver
- */
- appendTo: function(target) {
- // Schedule the DOM element to be created and appended to the given
- // element after bindings have synchronized.
- this._insertElementLater(function() {
- Ember.assert("You tried to append to (" + target + ") but that isn't in the DOM", Ember.$(target).length > 0);
- Ember.assert("You cannot append to an existing Ember.View. Consider using Ember.ContainerView instead.", !Ember.$(target).is('.ember-view') && !Ember.$(target).parents().is('.ember-view'));
- this.$().appendTo(target);
- });
-
- return this;
- },
-
- /**
- Replaces the content of the specified parent element with this view's
- element. If the view does not have an HTML representation yet,
- `createElement()` will be called automatically.
-
- Note that this method just schedules the view to be appended; the DOM
- element will not be appended to the given element until all bindings have
- finished synchronizing
-
- @method replaceIn
- @param {String|DOMElement|jQuery} A selector, element, HTML string, or jQuery object
- @return {Ember.View} received
- */
- replaceIn: function(target) {
- Ember.assert("You tried to replace in (" + target + ") but that isn't in the DOM", Ember.$(target).length > 0);
- Ember.assert("You cannot replace an existing Ember.View. Consider using Ember.ContainerView instead.", !Ember.$(target).is('.ember-view') && !Ember.$(target).parents().is('.ember-view'));
-
- this._insertElementLater(function() {
- Ember.$(target).empty();
- this.$().appendTo(target);
- });
-
- return this;
- },
-
- /**
- @private
-
- Schedules a DOM operation to occur during the next render phase. This
- ensures that all bindings have finished synchronizing before the view is
- rendered.
-
- To use, pass a function that performs a DOM operation.
-
- Before your function is called, this view and all child views will receive
- the `willInsertElement` event. After your function is invoked, this view
- and all of its child views will receive the `didInsertElement` event.
-
- ```javascript
- view._insertElementLater(function() {
- this.createElement();
- this.$().appendTo('body');
- });
- ```
-
- @method _insertElementLater
- @param {Function} fn the function that inserts the element into the DOM
- */
- _insertElementLater: function(fn) {
- this._scheduledInsert = Ember.run.scheduleOnce('render', this, '_insertElement', fn);
- },
-
- _insertElement: function (fn) {
- this._scheduledInsert = null;
- this.currentState.insertElement(this, fn);
- },
-
- /**
- Appends the view's element to the document body. If the view does
- not have an HTML representation yet, `createElement()` will be called
- automatically.
-
- If your application uses the `rootElement` property, you must append
- the view within that element. Rendering views outside of the `rootElement`
- is not supported.
-
- Note that this method just schedules the view to be appended; the DOM
- element will not be appended to the document body until all bindings have
- finished synchronizing.
-
- @method append
- @return {Ember.View} receiver
- */
- append: function() {
- return this.appendTo(document.body);
- },
-
- /**
- Removes the view's element from the element to which it is attached.
-
- @method remove
- @return {Ember.View} receiver
- */
- remove: function() {
- // What we should really do here is wait until the end of the run loop
- // to determine if the element has been re-appended to a different
- // element.
- // In the interim, we will just re-render if that happens. It is more
- // important than elements get garbage collected.
- if (!this.removedFromDOM) { this.destroyElement(); }
- this.invokeRecursively(function(view) {
- if (view.clearRenderedChildren) { view.clearRenderedChildren(); }
- });
- },
-
- elementId: null,
-
- /**
- Attempts to discover the element in the parent element. The default
- implementation looks for an element with an ID of `elementId` (or the
- view's guid if `elementId` is null). You can override this method to
- provide your own form of lookup. For example, if you want to discover your
- element using a CSS class name instead of an ID.
-
- @method findElementInParentElement
- @param {DOMElement} parentElement The parent's DOM element
- @return {DOMElement} The discovered element
- */
- findElementInParentElement: function(parentElem) {
- var id = "#" + this.elementId;
- return Ember.$(id)[0] || Ember.$(id, parentElem)[0];
- },
-
- /**
- Creates a DOM representation of the view and all of its
- child views by recursively calling the `render()` method.
-
- After the element has been created, `didInsertElement` will
- be called on this view and all of its child views.
-
- @method createElement
- @return {Ember.View} receiver
- */
- createElement: function() {
- if (get(this, 'element')) { return this; }
-
- var buffer = this.renderToBuffer();
- set(this, 'element', buffer.element());
-
- return this;
- },
-
- /**
- Called when a view is going to insert an element into the DOM.
-
- @event willInsertElement
- */
- willInsertElement: Ember.K,
-
- /**
- Called when the element of the view has been inserted into the DOM
- or after the view was re-rendered. Override this function to do any
- set up that requires an element in the document body.
-
- @event didInsertElement
- */
- didInsertElement: Ember.K,
-
- /**
- Called when the view is about to rerender, but before anything has
- been torn down. This is a good opportunity to tear down any manual
- observers you have installed based on the DOM state
-
- @event willClearRender
- */
- willClearRender: Ember.K,
-
- /**
- @private
-
- Run this callback on the current view (unless includeSelf is false) and recursively on child views.
-
- @method invokeRecursively
- @param fn {Function}
- @param includeSelf (optional, default true)
- */
- invokeRecursively: function(fn, includeSelf) {
- var childViews = (includeSelf === false) ? this._childViews : [this];
- var currentViews, view, currentChildViews;
-
- while (childViews.length) {
- currentViews = childViews.slice();
- childViews = [];
-
- for (var i=0, l=currentViews.length; i
- I got wrapped
-
-
- Ember.View.extend({
- attributeBindings: ['type'],
- type: 'button'
- });
- ```
-
- If the value of the property is a Boolean, the name of that property is
- added as an attribute.
-
- ```javascript
- // Renders something like
- Ember.View.extend({
- attributeBindings: ['enabled'],
- enabled: true
- });
- ```
-
- @property attributeBindings
- */
- attributeBindings: EMPTY_ARRAY,
-
- // .......................................................
- // CORE DISPLAY METHODS
- //
-
- /**
- @private
-
- Setup a view, but do not finish waking it up.
- - configure `childViews`
- - register the view with the global views hash, which is used for event
- dispatch
-
- @method init
- */
- init: function() {
- this.elementId = this.elementId || guidFor(this);
-
- this._super();
-
- // setup child views. be sure to clone the child views array first
- this._childViews = this._childViews.slice();
-
- Ember.assert("Only arrays are allowed for 'classNameBindings'", Ember.typeOf(this.classNameBindings) === 'array');
- this.classNameBindings = Ember.A(this.classNameBindings.slice());
-
- Ember.assert("Only arrays are allowed for 'classNames'", Ember.typeOf(this.classNames) === 'array');
- this.classNames = Ember.A(this.classNames.slice());
- },
-
- appendChild: function(view, options) {
- return this.currentState.appendChild(this, view, options);
- },
-
- /**
- Removes the child view from the parent view.
-
- @method removeChild
- @param {Ember.View} view
- @return {Ember.View} receiver
- */
- removeChild: function(view) {
- // If we're destroying, the entire subtree will be
- // freed, and the DOM will be handled separately,
- // so no need to mess with childViews.
- if (this.isDestroying) { return; }
-
- // update parent node
- set(view, '_parentView', null);
-
- // remove view from childViews array.
- var childViews = this._childViews;
-
- Ember.EnumerableUtils.removeObject(childViews, view);
-
- this.propertyDidChange('childViews'); // HUH?! what happened to will change?
-
- return this;
- },
-
- /**
- Removes all children from the `parentView`.
-
- @method removeAllChildren
- @return {Ember.View} receiver
- */
- removeAllChildren: function() {
- return this.mutateChildViews(function(parentView, view) {
- parentView.removeChild(view);
- });
- },
-
- destroyAllChildren: function() {
- return this.mutateChildViews(function(parentView, view) {
- view.destroy();
- });
- },
-
- /**
- Removes the view from its `parentView`, if one is found. Otherwise
- does nothing.
-
- @method removeFromParent
- @return {Ember.View} receiver
- */
- removeFromParent: function() {
- var parent = this._parentView;
-
- // Remove DOM element from parent
- this.remove();
-
- if (parent) { parent.removeChild(this); }
- return this;
- },
-
- /**
- You must call `destroy` on a view to destroy the view (and all of its
- child views). This will remove the view from any parent node, then make
- sure that the DOM element managed by the view can be released by the
- memory manager.
-
- @method destroy
- */
- destroy: function() {
- var childViews = this._childViews,
- // get parentView before calling super because it'll be destroyed
- nonVirtualParentView = get(this, 'parentView'),
- viewName = this.viewName,
- childLen, i;
-
- if (!this._super()) { return; }
-
- childLen = childViews.length;
- for (i=childLen-1; i>=0; i--) {
- childViews[i].removedFromDOM = true;
- }
-
- // remove from non-virtual parent view if viewName was specified
- if (viewName && nonVirtualParentView) {
- nonVirtualParentView.set(viewName, null);
- }
-
- childLen = childViews.length;
- for (i=childLen-1; i>=0; i--) {
- childViews[i].destroy();
- }
-
- return this;
- },
-
- /**
- Instantiates a view to be added to the childViews array during view
- initialization. You generally will not call this method directly unless
- you are overriding `createChildViews()`. Note that this method will
- automatically configure the correct settings on the new view instance to
- act as a child of the parent.
-
- @method createChildView
- @param {Class|String} viewClass
- @param {Hash} [attrs] Attributes to add
- @return {Ember.View} new instance
- */
- createChildView: function(view, attrs) {
- if (!view) {
- throw new TypeError("createChildViews first argument must exist");
- }
-
- if (view.isView && view._parentView === this && view.container === this.container) {
- return view;
- }
-
- attrs = attrs || {};
- attrs._parentView = this;
-
- if (Ember.CoreView.detect(view)) {
- attrs.templateData = attrs.templateData || get(this, 'templateData');
-
- attrs.container = this.container;
- view = view.create(attrs);
-
- // don't set the property on a virtual view, as they are invisible to
- // consumers of the view API
- if (view.viewName) {
- set(get(this, 'concreteView'), view.viewName, view);
- }
- } else if ('string' === typeof view) {
- var fullName = 'view:' + view;
- var View = this.container.lookupFactory(fullName);
-
- Ember.assert("Could not find view: '" + fullName + "'", !!View);
-
- attrs.templateData = get(this, 'templateData');
- view = View.create(attrs);
- } else {
- Ember.assert('You must pass instance or subclass of View', view.isView);
- attrs.container = this.container;
-
- if (!get(view, 'templateData')) {
- attrs.templateData = get(this, 'templateData');
- }
-
- Ember.setProperties(view, attrs);
-
- }
-
- return view;
- },
-
- becameVisible: Ember.K,
- becameHidden: Ember.K,
-
- /**
- @private
-
- When the view's `isVisible` property changes, toggle the visibility
- element of the actual DOM element.
-
- @method _isVisibleDidChange
- */
- _isVisibleDidChange: Ember.observer('isVisible', function() {
- var $el = this.$();
- if (!$el) { return; }
-
- var isVisible = get(this, 'isVisible');
-
- $el.toggle(isVisible);
-
- if (this._isAncestorHidden()) { return; }
-
- if (isVisible) {
- this._notifyBecameVisible();
- } else {
- this._notifyBecameHidden();
- }
- }),
-
- _notifyBecameVisible: function() {
- this.trigger('becameVisible');
-
- this.forEachChildView(function(view) {
- var isVisible = get(view, 'isVisible');
-
- if (isVisible || isVisible === null) {
- view._notifyBecameVisible();
- }
- });
- },
-
- _notifyBecameHidden: function() {
- this.trigger('becameHidden');
- this.forEachChildView(function(view) {
- var isVisible = get(view, 'isVisible');
-
- if (isVisible || isVisible === null) {
- view._notifyBecameHidden();
- }
- });
- },
-
- _isAncestorHidden: function() {
- var parent = get(this, 'parentView');
-
- while (parent) {
- if (get(parent, 'isVisible') === false) { return true; }
-
- parent = get(parent, 'parentView');
- }
-
- return false;
- },
-
- clearBuffer: function() {
- this.invokeRecursively(function(view) {
- view.buffer = null;
- });
- },
-
- transitionTo: function(state, children) {
- var priorState = this.currentState,
- currentState = this.currentState = this.states[state];
- this.state = state;
-
- if (priorState && priorState.exit) { priorState.exit(this); }
- if (currentState.enter) { currentState.enter(this); }
- if (state === 'inDOM') { delete Ember.meta(this).cache.element; }
-
- if (children !== false) {
- this.forEachChildView(function(view) {
- view.transitionTo(state);
- });
- }
- },
-
- // .......................................................
- // EVENT HANDLING
- //
-
- /**
- @private
-
- Handle events from `Ember.EventDispatcher`
-
- @method handleEvent
- @param eventName {String}
- @param evt {Event}
- */
- handleEvent: function(eventName, evt) {
- return this.currentState.handleEvent(this, eventName, evt);
- },
-
- registerObserver: function(root, path, target, observer) {
- if (!observer && 'function' === typeof target) {
- observer = target;
- target = null;
- }
-
- if (!root || typeof root !== 'object') {
- return;
- }
-
- var view = this,
- stateCheckedObserver = function() {
- view.currentState.invokeObserver(this, observer);
- },
- scheduledObserver = function() {
- Ember.run.scheduleOnce('render', this, stateCheckedObserver);
- };
-
- Ember.addObserver(root, path, target, scheduledObserver);
-
- this.one('willClearRender', function() {
- Ember.removeObserver(root, path, target, scheduledObserver);
- });
- }
-
-});
-
-/*
- Describe how the specified actions should behave in the various
- states that a view can exist in. Possible states:
-
- * preRender: when a view is first instantiated, and after its
- element was destroyed, it is in the preRender state
- * inBuffer: once a view has been rendered, but before it has
- been inserted into the DOM, it is in the inBuffer state
- * inDOM: once a view has been inserted into the DOM it is in
- the inDOM state. A view spends the vast majority of its
- existence in this state.
- * destroyed: once a view has been destroyed (using the destroy
- method), it is in this state. No further actions can be invoked
- on a destroyed view.
-*/
-
- // in the destroyed state, everything is illegal
-
- // before rendering has begun, all legal manipulations are noops.
-
- // inside the buffer, legal manipulations are done on the buffer
-
- // once the view has been inserted into the DOM, legal manipulations
- // are done on the DOM element.
-
-function notifyMutationListeners() {
- Ember.run.once(Ember.View, 'notifyMutationListeners');
-}
-
-var DOMManager = {
- prepend: function(view, html) {
- view.$().prepend(html);
- notifyMutationListeners();
- },
-
- after: function(view, html) {
- view.$().after(html);
- notifyMutationListeners();
- },
-
- html: function(view, html) {
- view.$().html(html);
- notifyMutationListeners();
- },
-
- replace: function(view) {
- var element = get(view, 'element');
-
- set(view, 'element', null);
-
- view._insertElementLater(function() {
- Ember.$(element).replaceWith(get(view, 'element'));
- notifyMutationListeners();
- });
- },
-
- remove: function(view) {
- view.$().remove();
- notifyMutationListeners();
- },
-
- empty: function(view) {
- view.$().empty();
- notifyMutationListeners();
- }
-};
-
-Ember.View.reopen({
- domManager: DOMManager
-});
-
-Ember.View.reopenClass({
-
- /**
- @private
-
- Parse a path and return an object which holds the parsed properties.
-
- For example a path like "content.isEnabled:enabled:disabled" will return the
- following object:
-
- ```javascript
- {
- path: "content.isEnabled",
- className: "enabled",
- falsyClassName: "disabled",
- classNames: ":enabled:disabled"
- }
- ```
-
- @method _parsePropertyPath
- @static
- */
- _parsePropertyPath: function(path) {
- var split = path.split(':'),
- propertyPath = split[0],
- classNames = "",
- className,
- falsyClassName;
-
- // check if the property is defined as prop:class or prop:trueClass:falseClass
- if (split.length > 1) {
- className = split[1];
- if (split.length === 3) { falsyClassName = split[2]; }
-
- classNames = ':' + className;
- if (falsyClassName) { classNames += ":" + falsyClassName; }
- }
-
- return {
- path: propertyPath,
- classNames: classNames,
- className: (className === '') ? undefined : className,
- falsyClassName: falsyClassName
- };
- },
-
- /**
- @private
-
- Get the class name for a given value, based on the path, optional
- `className` and optional `falsyClassName`.
-
- - if a `className` or `falsyClassName` has been specified:
- - if the value is truthy and `className` has been specified,
- `className` is returned
- - if the value is falsy and `falsyClassName` has been specified,
- `falsyClassName` is returned
- - otherwise `null` is returned
- - if the value is `true`, the dasherized last part of the supplied path
- is returned
- - if the value is not `false`, `undefined` or `null`, the `value`
- is returned
- - if none of the above rules apply, `null` is returned
-
- @method _classStringForValue
- @param path
- @param val
- @param className
- @param falsyClassName
- @static
- */
- _classStringForValue: function(path, val, className, falsyClassName) {
- // When using the colon syntax, evaluate the truthiness or falsiness
- // of the value to determine which className to return
- if (className || falsyClassName) {
- if (className && !!val) {
- return className;
-
- } else if (falsyClassName && !val) {
- return falsyClassName;
-
- } else {
- return null;
- }
-
- // If value is a Boolean and true, return the dasherized property
- // name.
- } else if (val === true) {
- // Normalize property path to be suitable for use
- // as a class name. For exaple, content.foo.barBaz
- // becomes bar-baz.
- var parts = path.split('.');
- return Ember.String.dasherize(parts[parts.length-1]);
-
- // If the value is not false, undefined, or null, return the current
- // value of the property.
- } else if (val !== false && val != null) {
- return val;
-
- // Nothing to display. Return null so that the old class is removed
- // but no new class is added.
- } else {
- return null;
- }
- }
-});
-
-var mutation = Ember.Object.extend(Ember.Evented).create();
-
-Ember.View.addMutationListener = function(callback) {
- mutation.on('change', callback);
-};
-
-Ember.View.removeMutationListener = function(callback) {
- mutation.off('change', callback);
-};
-
-Ember.View.notifyMutationListeners = function() {
- mutation.trigger('change');
-};
-
-/**
- Global views hash
-
- @property views
- @static
- @type Hash
-*/
-Ember.View.views = {};
-
-// If someone overrides the child views computed property when
-// defining their class, we want to be able to process the user's
-// supplied childViews and then restore the original computed property
-// at view initialization time. This happens in Ember.ContainerView's init
-// method.
-Ember.View.childViewsProperty = childViewsProperty;
-
-Ember.View.applyAttributeBindings = function(elem, name, value) {
- var type = Ember.typeOf(value);
-
- // if this changes, also change the logic in ember-handlebars/lib/helpers/binding.js
- if (name !== 'value' && (type === 'string' || (type === 'number' && !isNaN(value)))) {
- if (value !== elem.attr(name)) {
- elem.attr(name, value);
- }
- } else if (name === 'value' || type === 'boolean') {
- // We can't set properties to undefined or null
- if (Ember.isNone(value)) { value = ''; }
-
- if (value !== elem.prop(name)) {
- // value and booleans should always be properties
- elem.prop(name, value);
- }
- } else if (!value) {
- elem.removeAttr(name);
- }
-};
-
-Ember.View.states = states;
-
-})();
-
-
-
-(function() {
-/**
-@module ember
-@submodule ember-views
-*/
-
-var get = Ember.get, set = Ember.set;
-
-Ember.View.states._default = {
- // appendChild is only legal while rendering the buffer.
- appendChild: function() {
- throw "You can't use appendChild outside of the rendering process";
- },
-
- $: function() {
- return undefined;
- },
-
- getElement: function() {
- return null;
- },
-
- // Handle events from `Ember.EventDispatcher`
- handleEvent: function() {
- return true; // continue event propagation
- },
-
- destroyElement: function(view) {
- set(view, 'element', null);
- if (view._scheduledInsert) {
- Ember.run.cancel(view._scheduledInsert);
- view._scheduledInsert = null;
- }
- return view;
- },
-
- renderToBufferIfNeeded: function () {
- return false;
- },
-
- rerender: Ember.K,
- invokeObserver: Ember.K
-};
-
-})();
-
-
-
-(function() {
-/**
-@module ember
-@submodule ember-views
-*/
-
-var preRender = Ember.View.states.preRender = Ember.create(Ember.View.states._default);
-
-Ember.merge(preRender, {
- // a view leaves the preRender state once its element has been
- // created (createElement).
- insertElement: function(view, fn) {
- view.createElement();
- var viewCollection = view.viewHierarchyCollection();
-
- viewCollection.trigger('willInsertElement');
-
- fn.call(view);
-
- // We transition to `inDOM` if the element exists in the DOM
- var element = view.get('element');
- while (element = element.parentNode) {
- if (element === document) {
- viewCollection.transitionTo('inDOM', false);
- viewCollection.trigger('didInsertElement');
- }
- }
-
- },
-
- renderToBufferIfNeeded: function(view, buffer) {
- view.renderToBuffer(buffer);
- return true;
- },
-
- empty: Ember.K,
-
- setElement: function(view, value) {
- if (value !== null) {
- view.transitionTo('hasElement');
- }
- return value;
- }
-});
-
-})();
-
-
-
-(function() {
-/**
-@module ember
-@submodule ember-views
-*/
-
-var get = Ember.get, set = Ember.set;
-
-var inBuffer = Ember.View.states.inBuffer = Ember.create(Ember.View.states._default);
-
-Ember.merge(inBuffer, {
- $: function(view, sel) {
- // if we don't have an element yet, someone calling this.$() is
- // trying to update an element that isn't in the DOM. Instead,
- // rerender the view to allow the render method to reflect the
- // changes.
- view.rerender();
- return Ember.$();
- },
-
- // when a view is rendered in a buffer, rerendering it simply
- // replaces the existing buffer with a new one
- rerender: function(view) {
- throw new Ember.Error("Something you did caused a view to re-render after it rendered but before it was inserted into the DOM.");
- },
-
- // when a view is rendered in a buffer, appending a child
- // view will render that view and append the resulting
- // buffer into its buffer.
- appendChild: function(view, childView, options) {
- var buffer = view.buffer, _childViews = view._childViews;
-
- childView = view.createChildView(childView, options);
- if (!_childViews.length) { _childViews = view._childViews = _childViews.slice(); }
- _childViews.push(childView);
-
- childView.renderToBuffer(buffer);
-
- view.propertyDidChange('childViews');
-
- return childView;
- },
-
- // when a view is rendered in a buffer, destroying the
- // element will simply destroy the buffer and put the
- // state back into the preRender state.
- destroyElement: function(view) {
- view.clearBuffer();
- var viewCollection = view._notifyWillDestroyElement();
- viewCollection.transitionTo('preRender', false);
-
- return view;
- },
-
- empty: function() {
- Ember.assert("Emptying a view in the inBuffer state is not allowed and should not happen under normal circumstances. Most likely there is a bug in your application. This may be due to excessive property change notifications.");
- },
-
- renderToBufferIfNeeded: function (view, buffer) {
- return false;
- },
-
- // It should be impossible for a rendered view to be scheduled for
- // insertion.
- insertElement: function() {
- throw "You can't insert an element that has already been rendered";
- },
-
- setElement: function(view, value) {
- if (value === null) {
- view.transitionTo('preRender');
- } else {
- view.clearBuffer();
- view.transitionTo('hasElement');
- }
-
- return value;
- },
-
- invokeObserver: function(target, observer) {
- observer.call(target);
- }
-});
-
-
-})();
-
-
-
-(function() {
-/**
-@module ember
-@submodule ember-views
-*/
-
-var get = Ember.get, set = Ember.set;
-
-var hasElement = Ember.View.states.hasElement = Ember.create(Ember.View.states._default);
-
-Ember.merge(hasElement, {
- $: function(view, sel) {
- var elem = get(view, 'element');
- return sel ? Ember.$(sel, elem) : Ember.$(elem);
- },
-
- getElement: function(view) {
- var parent = get(view, 'parentView');
- if (parent) { parent = get(parent, 'element'); }
- if (parent) { return view.findElementInParentElement(parent); }
- return Ember.$("#" + get(view, 'elementId'))[0];
- },
-
- setElement: function(view, value) {
- if (value === null) {
- view.transitionTo('preRender');
- } else {
- throw "You cannot set an element to a non-null value when the element is already in the DOM.";
- }
-
- return value;
- },
-
- // once the view has been inserted into the DOM, rerendering is
- // deferred to allow bindings to synchronize.
- rerender: function(view) {
- view.triggerRecursively('willClearRender');
-
- view.clearRenderedChildren();
-
- view.domManager.replace(view);
- return view;
- },
-
- // once the view is already in the DOM, destroying it removes it
- // from the DOM, nukes its element, and puts it back into the
- // preRender state if inDOM.
-
- destroyElement: function(view) {
- view._notifyWillDestroyElement();
- view.domManager.remove(view);
- set(view, 'element', null);
- if (view._scheduledInsert) {
- Ember.run.cancel(view._scheduledInsert);
- view._scheduledInsert = null;
- }
- return view;
- },
-
- empty: function(view) {
- var _childViews = view._childViews, len, idx;
- if (_childViews) {
- len = _childViews.length;
- for (idx = 0; idx < len; idx++) {
- _childViews[idx]._notifyWillDestroyElement();
- }
- }
- view.domManager.empty(view);
- },
-
- // Handle events from `Ember.EventDispatcher`
- handleEvent: function(view, eventName, evt) {
- if (view.has(eventName)) {
- // Handler should be able to re-dispatch events, so we don't
- // preventDefault or stopPropagation.
- return view.trigger(eventName, evt);
- } else {
- return true; // continue event propagation
- }
- },
-
- invokeObserver: function(target, observer) {
- observer.call(target);
- }
-});
-
-var inDOM = Ember.View.states.inDOM = Ember.create(hasElement);
-
-Ember.merge(inDOM, {
- enter: function(view) {
- // Register the view for event handling. This hash is used by
- // Ember.EventDispatcher to dispatch incoming events.
- if (!view.isVirtual) {
- Ember.assert("Attempted to register a view with an id already in use: "+view.elementId, !Ember.View.views[view.elementId]);
- Ember.View.views[view.elementId] = view;
- }
-
- view.addBeforeObserver('elementId', function() {
- throw new Ember.Error("Changing a view's elementId after creation is not allowed");
- });
- },
-
- exit: function(view) {
- if (!this.isVirtual) delete Ember.View.views[view.elementId];
- },
-
- insertElement: function(view, fn) {
- throw "You can't insert an element into the DOM that has already been inserted";
- }
-});
-
-})();
-
-
-
-(function() {
-/**
-@module ember
-@submodule ember-views
-*/
-
-var destroyingError = "You can't call %@ on a view being destroyed", fmt = Ember.String.fmt;
-
-var destroying = Ember.View.states.destroying = Ember.create(Ember.View.states._default);
-
-Ember.merge(destroying, {
- appendChild: function() {
- throw fmt(destroyingError, ['appendChild']);
- },
- rerender: function() {
- throw fmt(destroyingError, ['rerender']);
- },
- destroyElement: function() {
- throw fmt(destroyingError, ['destroyElement']);
- },
- empty: function() {
- throw fmt(destroyingError, ['empty']);
- },
-
- setElement: function() {
- throw fmt(destroyingError, ["set('element', ...)"]);
- },
-
- renderToBufferIfNeeded: function() {
- return false;
- },
-
- // Since element insertion is scheduled, don't do anything if
- // the view has been destroyed between scheduling and execution
- insertElement: Ember.K
-});
-
-
-})();
-
-
-
-(function() {
-Ember.View.cloneStates = function(from) {
- var into = {};
-
- into._default = {};
- into.preRender = Ember.create(into._default);
- into.destroying = Ember.create(into._default);
- into.inBuffer = Ember.create(into._default);
- into.hasElement = Ember.create(into._default);
- into.inDOM = Ember.create(into.hasElement);
-
- for (var stateName in from) {
- if (!from.hasOwnProperty(stateName)) { continue; }
- Ember.merge(into[stateName], from[stateName]);
- }
-
- return into;
-};
-
-})();
-
-
-
-(function() {
-var states = Ember.View.cloneStates(Ember.View.states);
-
-/**
-@module ember
-@submodule ember-views
-*/
-
-var get = Ember.get, set = Ember.set;
-var forEach = Ember.EnumerableUtils.forEach;
-var ViewCollection = Ember._ViewCollection;
-
-/**
- A `ContainerView` is an `Ember.View` subclass that implements `Ember.MutableArray`
- allowing programatic management of its child views.
-
- ## Setting Initial Child Views
-
- The initial array of child views can be set in one of two ways. You can
- provide a `childViews` property at creation time that contains instance of
- `Ember.View`:
-
- ```javascript
- aContainer = Ember.ContainerView.create({
- childViews: [Ember.View.create(), Ember.View.create()]
- });
- ```
-
- You can also provide a list of property names whose values are instances of
- `Ember.View`:
-
- ```javascript
- aContainer = Ember.ContainerView.create({
- childViews: ['aView', 'bView', 'cView'],
- aView: Ember.View.create(),
- bView: Ember.View.create(),
- cView: Ember.View.create()
- });
- ```
-
- The two strategies can be combined:
-
- ```javascript
- aContainer = Ember.ContainerView.create({
- childViews: ['aView', Ember.View.create()],
- aView: Ember.View.create()
- });
- ```
-
- Each child view's rendering will be inserted into the container's rendered
- HTML in the same order as its position in the `childViews` property.
-
- ## Adding and Removing Child Views
-
- The container view implements `Ember.MutableArray` allowing programatic management of its child views.
-
- To remove a view, pass that view into a `removeObject` call on the container view.
-
- Given an empty `` the following code
-
- ```javascript
- aContainer = Ember.ContainerView.create({
- classNames: ['the-container'],
- childViews: ['aView', 'bView'],
- aView: Ember.View.create({
- template: Ember.Handlebars.compile("A")
- }),
- bView: Ember.View.create({
- template: Ember.Handlebars.compile("B")
- })
- });
-
- aContainer.appendTo('body');
- ```
-
- Results in the HTML
-
- ```html
- ]
- ```
-
- Will result in the following HTML
-
- ```html
- ` and the following code:
-
- ```javascript
- someItemsView = Ember.CollectionView.create({
- classNames: ['a-collection'],
- content: ['A','B','C'],
- itemViewClass: Ember.View.extend({
- template: Ember.Handlebars.compile("the letter: {{view.content}}")
- })
- });
-
- someItemsView.appendTo('body');
- ```
-
- Will result in the following HTML structure
-
- ```html
- 
- hi . Other browsers create it
- * before the first node, no matter what.
- *
- * This means the the following code:
- *
- * div = document.createElement("div");
- * div.innerHTML = "
- *
- * Generates the following DOM in IE:
- *
- * + div
- * + table
- * - script id='first'
- * + tbody
- * + tr
- * + td
- * - "hi"
- * - script id='last'
- *
- * Which means that the two script tags, even though they were
- * inserted at the same point in the hierarchy in the original
- * HTML, now have different parents.
- *
- * This code reparents the first script tag by making it the tbody's
- * first child.
- *
- */
- var fixParentage = function(start, end) {
- if (start.parentNode !== end.parentNode) {
- end.parentNode.insertBefore(start, end.parentNode.firstChild);
- }
- };
-
- htmlFunc = function(html, outerToo) {
- // get the real starting node. see realNode for details.
- var start = realNode(document.getElementById(this.start));
- var end = document.getElementById(this.end);
- var parentNode = end.parentNode;
- var node, nextSibling, last;
-
- // make sure that the start and end nodes share the same
- // parent. If not, fix it.
- fixParentage(start, end);
-
- // remove all of the nodes after the starting placeholder and
- // before the ending placeholder.
- node = start.nextSibling;
- while (node) {
- nextSibling = node.nextSibling;
- last = node === end;
-
- // if this is the last node, and we want to remove it as well,
- // set the `end` node to the next sibling. This is because
- // for the rest of the function, we insert the new nodes
- // before the end (note that insertBefore(node, null) is
- // the same as appendChild(node)).
- //
- // if we do not want to remove it, just break.
- if (last) {
- if (outerToo) { end = node.nextSibling; } else { break; }
- }
-
- node.parentNode.removeChild(node);
-
- // if this is the last node and we didn't break before
- // (because we wanted to remove the outer nodes), break
- // now.
- if (last) { break; }
-
- node = nextSibling;
- }
-
- // get the first node for the HTML string, even in cases like
- // tables and lists where a simple innerHTML on a div would
- // swallow some of the content.
- node = firstNodeFor(start.parentNode, html);
-
- // copy the nodes for the HTML between the starting and ending
- // placeholder.
- while (node) {
- nextSibling = node.nextSibling;
- parentNode.insertBefore(node, end);
- node = nextSibling;
- }
- };
-
- // remove the nodes in the DOM representing this metamorph.
- //
- // this includes the starting and ending placeholders.
- removeFunc = function() {
- var start = realNode(document.getElementById(this.start));
- var end = document.getElementById(this.end);
-
- this.html('');
- start.parentNode.removeChild(start);
- end.parentNode.removeChild(end);
- };
-
- appendToFunc = function(parentNode) {
- var node = firstNodeFor(parentNode, this.outerHTML());
- var nextSibling;
-
- while (node) {
- nextSibling = node.nextSibling;
- parentNode.appendChild(node);
- node = nextSibling;
- }
- };
-
- afterFunc = function(html) {
- // get the real starting node. see realNode for details.
- var end = document.getElementById(this.end);
- var insertBefore = end.nextSibling;
- var parentNode = end.parentNode;
- var nextSibling;
- var node;
-
- // get the first node for the HTML string, even in cases like
- // tables and lists where a simple innerHTML on a div would
- // swallow some of the content.
- node = firstNodeFor(parentNode, html);
-
- // copy the nodes for the HTML between the starting and ending
- // placeholder.
- while (node) {
- nextSibling = node.nextSibling;
- parentNode.insertBefore(node, insertBefore);
- node = nextSibling;
- }
- };
-
- prependFunc = function(html) {
- var start = document.getElementById(this.start);
- var parentNode = start.parentNode;
- var nextSibling;
- var node;
-
- node = firstNodeFor(parentNode, html);
- var insertBefore = start.nextSibling;
-
- while (node) {
- nextSibling = node.nextSibling;
- parentNode.insertBefore(node, insertBefore);
- node = nextSibling;
- }
- };
- }
-
- Metamorph.prototype.html = function(html) {
- this.checkRemoved();
- if (html === undefined) { return this.innerHTML; }
-
- htmlFunc.call(this, html);
-
- this.innerHTML = html;
- };
-
- Metamorph.prototype.replaceWith = function(html) {
- this.checkRemoved();
- htmlFunc.call(this, html, true);
- };
-
- Metamorph.prototype.remove = removeFunc;
- Metamorph.prototype.outerHTML = outerHTMLFunc;
- Metamorph.prototype.appendTo = appendToFunc;
- Metamorph.prototype.after = afterFunc;
- Metamorph.prototype.prepend = prependFunc;
- Metamorph.prototype.startTag = startTagFunc;
- Metamorph.prototype.endTag = endTagFunc;
-
- Metamorph.prototype.isRemoved = function() {
- var before = document.getElementById(this.start);
- var after = document.getElementById(this.end);
-
- return !before || !after;
- };
-
- Metamorph.prototype.checkRemoved = function() {
- if (this.isRemoved()) {
- throw new Error("Cannot perform operations on a Metamorph that is not in the DOM.");
- }
- };
-
- return Metamorph;
- });
-
-})();
-
-(function() {
-/**
-@module ember
-@submodule ember-handlebars-compiler
-*/
-
-// Eliminate dependency on any Ember to simplify precompilation workflow
-var objectCreate = Object.create || function(parent) {
- function F() {}
- F.prototype = parent;
- return new F();
-};
-
-var Handlebars = this.Handlebars || (Ember.imports && Ember.imports.Handlebars);
-if (!Handlebars && typeof require === 'function') {
- Handlebars = require('handlebars');
-}
-
-Ember.assert("Ember Handlebars requires Handlebars version 1.0 or 1.1. Include a SCRIPT tag in the HTML HEAD linking to the Handlebars file before you link to Ember.", Handlebars);
-Ember.assert("Ember Handlebars requires Handlebars version 1.0 or 1.1, COMPILER_REVISION expected: 4, got: " + Handlebars.COMPILER_REVISION + " - Please note: Builds of master may have other COMPILER_REVISION values.", Handlebars.COMPILER_REVISION === 4);
-
-/**
- Prepares the Handlebars templating library for use inside Ember's view
- system.
-
- The `Ember.Handlebars` object is the standard Handlebars library, extended to
- use Ember's `get()` method instead of direct property access, which allows
- computed properties to be used inside templates.
-
- To create an `Ember.Handlebars` template, call `Ember.Handlebars.compile()`.
- This will return a function that can be used by `Ember.View` for rendering.
-
- @class Handlebars
- @namespace Ember
-*/
-Ember.Handlebars = objectCreate(Handlebars);
-
-/**
- Register a bound helper or custom view helper.
-
- ## Simple bound helper example
-
- ```javascript
- Ember.Handlebars.helper('capitalize', function(value) {
- return value.toUpperCase();
- });
- ```
-
- The above bound helper can be used inside of templates as follows:
-
- ```handlebars
- {{capitalize name}}
- ```
-
- In this case, when the `name` property of the template's context changes,
- the rendered value of the helper will update to reflect this change.
-
- For more examples of bound helpers, see documentation for
- `Ember.Handlebars.registerBoundHelper`.
-
- ## Custom view helper example
-
- Assuming a view subclass named `App.CalendarView` were defined, a helper
- for rendering instances of this view could be registered as follows:
-
- ```javascript
- Ember.Handlebars.helper('calendar', App.CalendarView):
- ```
-
- The above bound helper can be used inside of templates as follows:
-
- ```handlebars
- {{calendar}}
- ```
-
- Which is functionally equivalent to:
-
- ```handlebars
- {{view App.CalendarView}}
- ```
-
- Options in the helper will be passed to the view in exactly the same
- manner as with the `view` helper.
-
- @method helper
- @for Ember.Handlebars
- @param {String} name
- @param {Function|Ember.View} function or view class constructor
- @param {String} dependentKeys*
-*/
-Ember.Handlebars.helper = function(name, value) {
- Ember.assert("You tried to register a component named '" + name + "', but component names must include a '-'", !Ember.Component.detect(value) || name.match(/-/));
-
- if (Ember.View.detect(value)) {
- Ember.Handlebars.registerHelper(name, Ember.Handlebars.makeViewHelper(value));
- } else {
- Ember.Handlebars.registerBoundHelper.apply(null, arguments);
- }
-};
-
-/**
- @private
-
- Returns a helper function that renders the provided ViewClass.
-
- Used internally by Ember.Handlebars.helper and other methods
- involving helper/component registration.
-
- @method helper
- @for Ember.Handlebars
- @param {Function} ViewClass view class constructor
-*/
-Ember.Handlebars.makeViewHelper = function(ViewClass) {
- return function(options) {
- Ember.assert("You can only pass attributes (such as name=value) not bare values to a helper for a View", arguments.length < 2);
- return Ember.Handlebars.helpers.view.call(this, ViewClass, options);
- };
-};
-
-/**
-@class helpers
-@namespace Ember.Handlebars
-*/
-Ember.Handlebars.helpers = objectCreate(Handlebars.helpers);
-
-/**
- Override the the opcode compiler and JavaScript compiler for Handlebars.
-
- @class Compiler
- @namespace Ember.Handlebars
- @private
- @constructor
-*/
-Ember.Handlebars.Compiler = function() {};
-
-// Handlebars.Compiler doesn't exist in runtime-only
-if (Handlebars.Compiler) {
- Ember.Handlebars.Compiler.prototype = objectCreate(Handlebars.Compiler.prototype);
-}
-
-Ember.Handlebars.Compiler.prototype.compiler = Ember.Handlebars.Compiler;
-
-/**
- @class JavaScriptCompiler
- @namespace Ember.Handlebars
- @private
- @constructor
-*/
-Ember.Handlebars.JavaScriptCompiler = function() {};
-
-// Handlebars.JavaScriptCompiler doesn't exist in runtime-only
-if (Handlebars.JavaScriptCompiler) {
- Ember.Handlebars.JavaScriptCompiler.prototype = objectCreate(Handlebars.JavaScriptCompiler.prototype);
- Ember.Handlebars.JavaScriptCompiler.prototype.compiler = Ember.Handlebars.JavaScriptCompiler;
-}
-
-
-Ember.Handlebars.JavaScriptCompiler.prototype.namespace = "Ember.Handlebars";
-
-Ember.Handlebars.JavaScriptCompiler.prototype.initializeBuffer = function() {
- return "''";
-};
-
-/**
- @private
-
- Override the default buffer for Ember Handlebars. By default, Handlebars
- creates an empty String at the beginning of each invocation and appends to
- it. Ember's Handlebars overrides this to append to a single shared buffer.
-
- @method appendToBuffer
- @param string {String}
-*/
-Ember.Handlebars.JavaScriptCompiler.prototype.appendToBuffer = function(string) {
- return "data.buffer.push("+string+");";
-};
-
-// Hacks ahead:
-// Handlebars presently has a bug where the `blockHelperMissing` hook
-// doesn't get passed the name of the missing helper name, but rather
-// gets passed the value of that missing helper evaluated on the current
-// context, which is most likely `undefined` and totally useless.
-//
-// So we alter the compiled template function to pass the name of the helper
-// instead, as expected.
-//
-// This can go away once the following is closed:
-// https://github.com/wycats/handlebars.js/issues/617
-
-var DOT_LOOKUP_REGEX = /helpers\.(.*?)\)/,
- BRACKET_STRING_LOOKUP_REGEX = /helpers\['(.*?)'/,
- INVOCATION_SPLITTING_REGEX = /(.*blockHelperMissing\.call\(.*)(stack[0-9]+)(,.*)/;
-
-Ember.Handlebars.JavaScriptCompiler.stringifyLastBlockHelperMissingInvocation = function(source) {
- var helperInvocation = source[source.length - 1],
- helperName = (DOT_LOOKUP_REGEX.exec(helperInvocation) || BRACKET_STRING_LOOKUP_REGEX.exec(helperInvocation))[1],
- matches = INVOCATION_SPLITTING_REGEX.exec(helperInvocation);
-
- source[source.length - 1] = matches[1] + "'" + helperName + "'" + matches[3];
-}
-var stringifyBlockHelperMissing = Ember.Handlebars.JavaScriptCompiler.stringifyLastBlockHelperMissingInvocation;
-
-var originalBlockValue = Ember.Handlebars.JavaScriptCompiler.prototype.blockValue;
-Ember.Handlebars.JavaScriptCompiler.prototype.blockValue = function() {
- originalBlockValue.apply(this, arguments);
- stringifyBlockHelperMissing(this.source);
-};
-
-var originalAmbiguousBlockValue = Ember.Handlebars.JavaScriptCompiler.prototype.ambiguousBlockValue;
-Ember.Handlebars.JavaScriptCompiler.prototype.ambiguousBlockValue = function() {
- originalAmbiguousBlockValue.apply(this, arguments);
- stringifyBlockHelperMissing(this.source);
-};
-
-var prefix = "ember" + (+new Date()), incr = 1;
-
-/**
- @private
-
- Rewrite simple mustaches from `{{foo}}` to `{{bind "foo"}}`. This means that
- all simple mustaches in Ember's Handlebars will also set up an observer to
- keep the DOM up to date when the underlying property changes.
-
- @method mustache
- @for Ember.Handlebars.Compiler
- @param mustache
-*/
-Ember.Handlebars.Compiler.prototype.mustache = function(mustache) {
- if (mustache.isHelper && mustache.id.string === 'control') {
- mustache.hash = mustache.hash || new Handlebars.AST.HashNode([]);
- mustache.hash.pairs.push(["controlID", new Handlebars.AST.StringNode(prefix + incr++)]);
- } else if (mustache.params.length || mustache.hash) {
- // no changes required
- } else {
- var id = new Handlebars.AST.IdNode([{ part: '_triageMustache' }]);
-
- // Update the mustache node to include a hash value indicating whether the original node
- // was escaped. This will allow us to properly escape values when the underlying value
- // changes and we need to re-render the value.
- if (!mustache.escaped) {
- mustache.hash = mustache.hash || new Handlebars.AST.HashNode([]);
- mustache.hash.pairs.push(["unescaped", new Handlebars.AST.StringNode("true")]);
- }
- mustache = new Handlebars.AST.MustacheNode([id].concat([mustache.id]), mustache.hash, !mustache.escaped);
- }
-
- return Handlebars.Compiler.prototype.mustache.call(this, mustache);
-};
-
-/**
- Used for precompilation of Ember Handlebars templates. This will not be used
- during normal app execution.
-
- @method precompile
- @for Ember.Handlebars
- @static
- @param {String} string The template to precompile
-*/
-Ember.Handlebars.precompile = function(string) {
- var ast = Handlebars.parse(string);
-
- var options = {
- knownHelpers: {
- action: true,
- unbound: true,
- bindAttr: true,
- template: true,
- view: true,
- _triageMustache: true
- },
- data: true,
- stringParams: true
- };
-
- var environment = new Ember.Handlebars.Compiler().compile(ast, options);
- return new Ember.Handlebars.JavaScriptCompiler().compile(environment, options, undefined, true);
-};
-
-// We don't support this for Handlebars runtime-only
-if (Handlebars.compile) {
- /**
- The entry point for Ember Handlebars. This replaces the default
- `Handlebars.compile` and turns on template-local data and String
- parameters.
-
- @method compile
- @for Ember.Handlebars
- @static
- @param {String} string The template to compile
- @return {Function}
- */
- Ember.Handlebars.compile = function(string) {
- var ast = Handlebars.parse(string);
- var options = { data: true, stringParams: true };
- var environment = new Ember.Handlebars.Compiler().compile(ast, options);
- var templateSpec = new Ember.Handlebars.JavaScriptCompiler().compile(environment, options, undefined, true);
-
- var template = Ember.Handlebars.template(templateSpec);
- template.isMethod = false; //Make sure we don't wrap templates with ._super
-
- return template;
- };
-}
-
-
-})();
-
-(function() {
-var slice = Array.prototype.slice,
- originalTemplate = Ember.Handlebars.template;
-
-/**
- @private
-
- If a path starts with a reserved keyword, returns the root
- that should be used.
-
- @method normalizePath
- @for Ember
- @param root {Object}
- @param path {String}
- @param data {Hash}
-*/
-var normalizePath = Ember.Handlebars.normalizePath = function(root, path, data) {
- var keywords = (data && data.keywords) || {},
- keyword, isKeyword;
-
- // Get the first segment of the path. For example, if the
- // path is "foo.bar.baz", returns "foo".
- keyword = path.split('.', 1)[0];
-
- // Test to see if the first path is a keyword that has been
- // passed along in the view's data hash. If so, we will treat
- // that object as the new root.
- if (keywords.hasOwnProperty(keyword)) {
- // Look up the value in the template's data hash.
- root = keywords[keyword];
- isKeyword = true;
-
- // Handle cases where the entire path is the reserved
- // word. In that case, return the object itself.
- if (path === keyword) {
- path = '';
- } else {
- // Strip the keyword from the path and look up
- // the remainder from the newly found root.
- path = path.substr(keyword.length+1);
- }
- }
-
- return { root: root, path: path, isKeyword: isKeyword };
-};
-
-
-/**
- Lookup both on root and on window. If the path starts with
- a keyword, the corresponding object will be looked up in the
- template's data hash and used to resolve the path.
-
- @method get
- @for Ember.Handlebars
- @param {Object} root The object to look up the property on
- @param {String} path The path to be lookedup
- @param {Object} options The template's option hash
-*/
-var handlebarsGet = Ember.Handlebars.get = function(root, path, options) {
- var data = options && options.data,
- normalizedPath = normalizePath(root, path, data),
- value;
-
- // In cases where the path begins with a keyword, change the
- // root to the value represented by that keyword, and ensure
- // the path is relative to it.
- root = normalizedPath.root;
- path = normalizedPath.path;
-
- value = Ember.get(root, path);
-
- // If the path starts with a capital letter, look it up on Ember.lookup,
- // which defaults to the `window` object in browsers.
- if (value === undefined && root !== Ember.lookup && Ember.isGlobalPath(path)) {
- value = Ember.get(Ember.lookup, path);
- }
- return value;
-};
-
-Ember.Handlebars.resolveParams = function(context, params, options) {
- var resolvedParams = [], types = options.types, param, type;
-
- for (var i=0, l=params.length; isomeString')
- ```
-
- @method htmlSafe
- @for Ember.String
- @static
- @return {Handlebars.SafeString} a string that will not be html escaped by Handlebars
-*/
-Ember.String.htmlSafe = function(str) {
- return new Handlebars.SafeString(str);
-};
-
-var htmlSafe = Ember.String.htmlSafe;
-
-if (Ember.EXTEND_PROTOTYPES === true || Ember.EXTEND_PROTOTYPES.String) {
-
- /**
- Mark a string as being safe for unescaped output with Handlebars.
-
- ```javascript
- '
- ```
-
- The above handlebars template will fill the `![]()
`'s `src` attribute will
- the value of the property referenced with `"imageUrl"` and its `alt`
- attribute with the value of the property referenced with `"imageTitle"`.
-
- If the rendering context of this template is the following object:
-
- ```javascript
- {
- imageUrl: 'http://lolcats.info/haz-a-funny',
- imageTitle: 'A humorous image of a cat'
- }
- ```
-
- The resulting HTML output will be:
-
- ```html
- 
- ```
-
- `bind-attr` cannot redeclare existing DOM element attributes. The use of `src`
- in the following `bind-attr` example will be ignored and the hard coded value
- of `src="/failwhale.gif"` will take precedence:
-
- ```handlebars
- 
- ```
-
- ### `bind-attr` and the `class` attribute
-
- `bind-attr` supports a special syntax for handling a number of cases unique
- to the `class` DOM element attribute. The `class` attribute combines
- multiple discrete values into a single attribute as a space-delimited
- list of strings. Each string can be:
-
- * a string return value of an object's property.
- * a boolean return value of an object's property
- * a hard-coded value
-
- A string return value works identically to other uses of `bind-attr`. The
- return value of the property will become the value of the attribute. For
- example, the following view and template:
-
- ```javascript
- AView = Ember.View.extend({
- someProperty: function() {
- return "aValue";
- }.property()
- })
- ```
-
- ```handlebars
- ![]()
- ```
-
- A boolean return value will insert a specified class name if the property
- returns `true` and remove the class name if the property returns `false`.
-
- A class name is provided via the syntax
- `somePropertyName:class-name-if-true`.
-
- ```javascript
- AView = Ember.View.extend({
- someBool: true
- })
- ```
-
- ```handlebars
- ![]()
- ```
-
- Result in the following rendered output:
-
- ```html
- ![]()
- ```
-
- An additional section of the binding can be provided if you want to
- replace the existing class instead of removing it when the boolean
- value changes:
-
- ```handlebars
- ![]()
- ```
-
- A hard-coded value can be used by prepending `:` to the desired
- class name: `:class-name-to-always-apply`.
-
- ```handlebars
- ![]()
- ```
-
- Results in the following rendered output:
-
- ```html
- ![]()
- ```
-
- All three strategies - string return value, boolean return value, and
- hard-coded value – can be combined in a single declaration:
-
- ```handlebars
- ![]()
- ```
-
- @method bind-attr
- @for Ember.Handlebars.helpers
- @param {Hash} options
- @return {String} HTML string
-*/
-EmberHandlebars.registerHelper('bind-attr', function(options) {
-
- var attrs = options.hash;
-
- Ember.assert("You must specify at least one hash argument to bind-attr", !!Ember.keys(attrs).length);
-
- var view = options.data.view;
- var ret = [];
- var ctx = this;
-
- // Generate a unique id for this element. This will be added as a
- // data attribute to the element so it can be looked up when
- // the bound property changes.
- var dataId = ++Ember.uuid;
-
- // Handle classes differently, as we can bind multiple classes
- var classBindings = attrs['class'];
- if (classBindings != null) {
- var classResults = EmberHandlebars.bindClasses(this, classBindings, view, dataId, options);
-
- ret.push('class="' + Handlebars.Utils.escapeExpression(classResults.join(' ')) + '"');
- delete attrs['class'];
- }
-
- var attrKeys = Ember.keys(attrs);
-
- // For each attribute passed, create an observer and emit the
- // current value of the property as an attribute.
- forEach.call(attrKeys, function(attr) {
- var path = attrs[attr],
- normalized;
-
- Ember.assert(fmt("You must provide an expression as the value of bound attribute. You specified: %@=%@", [attr, path]), typeof path === 'string');
-
- normalized = normalizePath(ctx, path, options.data);
-
- var value = (path === 'this') ? normalized.root : handlebarsGet(ctx, path, options),
- type = Ember.typeOf(value);
-
- Ember.assert(fmt("Attributes must be numbers, strings or booleans, not %@", [value]), value === null || value === undefined || type === 'number' || type === 'string' || type === 'boolean');
-
- var observer, invoker;
-
- observer = function observer() {
- var result = handlebarsGet(ctx, path, options);
-
- Ember.assert(fmt("Attributes must be numbers, strings or booleans, not %@", [result]), result === null || result === undefined || typeof result === 'number' || typeof result === 'string' || typeof result === 'boolean');
-
- var elem = view.$("[data-bindattr-" + dataId + "='" + dataId + "']");
-
- // If we aren't able to find the element, it means the element
- // to which we were bound has been removed from the view.
- // In that case, we can assume the template has been re-rendered
- // and we need to clean up the observer.
- if (!elem || elem.length === 0) {
- Ember.removeObserver(normalized.root, normalized.path, invoker);
- return;
- }
-
- Ember.View.applyAttributeBindings(elem, attr, result);
- };
-
- // Add an observer to the view for when the property changes.
- // When the observer fires, find the element using the
- // unique data id and update the attribute to the new value.
- // Note: don't add observer when path is 'this' or path
- // is whole keyword e.g. {{#each x in list}} ... {{bind-attr attr="x"}}
- if (path !== 'this' && !(normalized.isKeyword && normalized.path === '' )) {
- view.registerObserver(normalized.root, normalized.path, observer);
- }
-
- // if this changes, also change the logic in ember-views/lib/views/view.js
- if ((type === 'string' || (type === 'number' && !isNaN(value)))) {
- ret.push(attr + '="' + Handlebars.Utils.escapeExpression(value) + '"');
- } else if (value && type === 'boolean') {
- // The developer controls the attr name, so it should always be safe
- ret.push(attr + '="' + attr + '"');
- }
- }, this);
-
- // Add the unique identifier
- // NOTE: We use all lower-case since Firefox has problems with mixed case in SVG
- ret.push('data-bindattr-' + dataId + '="' + dataId + '"');
- return new EmberHandlebars.SafeString(ret.join(' '));
-});
-
-/**
- See `bind-attr`
-
- @method bindAttr
- @for Ember.Handlebars.helpers
- @deprecated
- @param {Function} context
- @param {Hash} options
- @return {String} HTML string
-*/
-EmberHandlebars.registerHelper('bindAttr', EmberHandlebars.helpers['bind-attr']);
-
-/**
- @private
-
- Helper that, given a space-separated string of property paths and a context,
- returns an array of class names. Calling this method also has the side
- effect of setting up observers at those property paths, such that if they
- change, the correct class name will be reapplied to the DOM element.
-
- For example, if you pass the string "fooBar", it will first look up the
- "fooBar" value of the context. If that value is true, it will add the
- "foo-bar" class to the current element (i.e., the dasherized form of
- "fooBar"). If the value is a string, it will add that string as the class.
- Otherwise, it will not add any new class name.
-
- @method bindClasses
- @for Ember.Handlebars
- @param {Ember.Object} context The context from which to lookup properties
- @param {String} classBindings A string, space-separated, of class bindings
- to use
- @param {Ember.View} view The view in which observers should look for the
- element to update
- @param {Srting} bindAttrId Optional bindAttr id used to lookup elements
- @return {Array} An array of class names to add
-*/
-EmberHandlebars.bindClasses = function(context, classBindings, view, bindAttrId, options) {
- var ret = [], newClass, value, elem;
-
- // Helper method to retrieve the property from the context and
- // determine which class string to return, based on whether it is
- // a Boolean or not.
- var classStringForPath = function(root, parsedPath, options) {
- var val,
- path = parsedPath.path;
-
- if (path === 'this') {
- val = root;
- } else if (path === '') {
- val = true;
- } else {
- val = handlebarsGet(root, path, options);
- }
-
- return Ember.View._classStringForValue(path, val, parsedPath.className, parsedPath.falsyClassName);
- };
-
- // For each property passed, loop through and setup
- // an observer.
- forEach.call(classBindings.split(' '), function(binding) {
-
- // Variable in which the old class value is saved. The observer function
- // closes over this variable, so it knows which string to remove when
- // the property changes.
- var oldClass;
-
- var observer, invoker;
-
- var parsedPath = Ember.View._parsePropertyPath(binding),
- path = parsedPath.path,
- pathRoot = context,
- normalized;
-
- if (path !== '' && path !== 'this') {
- normalized = normalizePath(context, path, options.data);
-
- pathRoot = normalized.root;
- path = normalized.path;
- }
-
- // Set up an observer on the context. If the property changes, toggle the
- // class name.
- observer = function() {
- // Get the current value of the property
- newClass = classStringForPath(context, parsedPath, options);
- elem = bindAttrId ? view.$("[data-bindattr-" + bindAttrId + "='" + bindAttrId + "']") : view.$();
-
- // If we can't find the element anymore, a parent template has been
- // re-rendered and we've been nuked. Remove the observer.
- if (!elem || elem.length === 0) {
- Ember.removeObserver(pathRoot, path, invoker);
- } else {
- // If we had previously added a class to the element, remove it.
- if (oldClass) {
- elem.removeClass(oldClass);
- }
-
- // If necessary, add a new class. Make sure we keep track of it so
- // it can be removed in the future.
- if (newClass) {
- elem.addClass(newClass);
- oldClass = newClass;
- } else {
- oldClass = null;
- }
- }
- };
-
- if (path !== '' && path !== 'this') {
- view.registerObserver(pathRoot, path, observer);
- }
-
- // We've already setup the observer; now we just need to figure out the
- // correct behavior right now on the first pass through.
- value = classStringForPath(context, parsedPath, options);
-
- if (value) {
- ret.push(value);
-
- // Make sure we save the current value so that it can be removed if the
- // observer fires.
- oldClass = value;
- }
- });
-
- return ret;
-};
-
-
-})();
-
-
-
-(function() {
-/*globals Handlebars */
-
-// TODO: Don't require the entire module
-/**
-@module ember
-@submodule ember-handlebars
-*/
-
-var get = Ember.get, set = Ember.set;
-var EmberHandlebars = Ember.Handlebars;
-var LOWERCASE_A_Z = /^[a-z]/;
-var VIEW_PREFIX = /^view\./;
-
-function makeBindings(thisContext, options) {
- var hash = options.hash,
- hashType = options.hashTypes;
-
- for (var prop in hash) {
- if (hashType[prop] === 'ID') {
-
- var value = hash[prop];
-
- if (Ember.IS_BINDING.test(prop)) {
- Ember.warn("You're attempting to render a view by passing " + prop + "=" + value + " to a view helper, but this syntax is ambiguous. You should either surround " + value + " in quotes or remove `Binding` from " + prop + ".");
- } else {
- hash[prop + 'Binding'] = value;
- hashType[prop + 'Binding'] = 'STRING';
- delete hash[prop];
- delete hashType[prop];
- }
- }
- }
-
- if (hash.hasOwnProperty('idBinding')) {
- // id can't be bound, so just perform one-time lookup.
- hash.id = EmberHandlebars.get(thisContext, hash.idBinding, options);
- hashType.id = 'STRING';
- delete hash.idBinding;
- delete hashType.idBinding;
- }
-}
-
-EmberHandlebars.ViewHelper = Ember.Object.create({
-
- propertiesFromHTMLOptions: function(options) {
- var hash = options.hash, data = options.data;
- var extensions = {},
- classes = hash['class'],
- dup = false;
-
- if (hash.id) {
- extensions.elementId = hash.id;
- dup = true;
- }
-
- if (hash.tag) {
- extensions.tagName = hash.tag;
- dup = true;
- }
-
- if (classes) {
- classes = classes.split(' ');
- extensions.classNames = classes;
- dup = true;
- }
-
- if (hash.classBinding) {
- extensions.classNameBindings = hash.classBinding.split(' ');
- dup = true;
- }
-
- if (hash.classNameBindings) {
- if (extensions.classNameBindings === undefined) extensions.classNameBindings = [];
- extensions.classNameBindings = extensions.classNameBindings.concat(hash.classNameBindings.split(' '));
- dup = true;
- }
-
- if (hash.attributeBindings) {
- Ember.assert("Setting 'attributeBindings' via Handlebars is not allowed. Please subclass Ember.View and set it there instead.");
- extensions.attributeBindings = null;
- dup = true;
- }
-
- if (dup) {
- hash = Ember.$.extend({}, hash);
- delete hash.id;
- delete hash.tag;
- delete hash['class'];
- delete hash.classBinding;
- }
-
- // Set the proper context for all bindings passed to the helper. This applies to regular attribute bindings
- // as well as class name bindings. If the bindings are local, make them relative to the current context
- // instead of the view.
- var path;
-
- // Evaluate the context of regular attribute bindings:
- for (var prop in hash) {
- if (!hash.hasOwnProperty(prop)) { continue; }
-
- // Test if the property ends in "Binding"
- if (Ember.IS_BINDING.test(prop) && typeof hash[prop] === 'string') {
- path = this.contextualizeBindingPath(hash[prop], data);
- if (path) { hash[prop] = path; }
- }
- }
-
- // Evaluate the context of class name bindings:
- if (extensions.classNameBindings) {
- for (var b in extensions.classNameBindings) {
- var full = extensions.classNameBindings[b];
- if (typeof full === 'string') {
- // Contextualize the path of classNameBinding so this:
- //
- // classNameBinding="isGreen:green"
- //
- // is converted to this:
- //
- // classNameBinding="_parentView.context.isGreen:green"
- var parsedPath = Ember.View._parsePropertyPath(full);
- path = this.contextualizeBindingPath(parsedPath.path, data);
- if (path) { extensions.classNameBindings[b] = path + parsedPath.classNames; }
- }
- }
- }
-
- return Ember.$.extend(hash, extensions);
- },
-
- // Transform bindings from the current context to a context that can be evaluated within the view.
- // Returns null if the path shouldn't be changed.
- //
- // TODO: consider the addition of a prefix that would allow this method to return `path`.
- contextualizeBindingPath: function(path, data) {
- var normalized = Ember.Handlebars.normalizePath(null, path, data);
- if (normalized.isKeyword) {
- return 'templateData.keywords.' + path;
- } else if (Ember.isGlobalPath(path)) {
- return null;
- } else if (path === 'this') {
- return '_parentView.context';
- } else {
- return '_parentView.context.' + path;
- }
- },
-
- helper: function(thisContext, path, options) {
- var data = options.data,
- fn = options.fn,
- newView;
-
- makeBindings(thisContext, options);
-
- if ('string' === typeof path) {
-
- // TODO: this is a lame conditional, this should likely change
- // but something along these lines will likely need to be added
- // as deprecation warnings
- //
- if (options.types[0] === 'STRING' && LOWERCASE_A_Z.test(path) && !VIEW_PREFIX.test(path)) {
- Ember.assert("View requires a container", !!data.view.container);
- newView = data.view.container.lookupFactory('view:' + path);
- } else {
- newView = EmberHandlebars.get(thisContext, path, options);
- }
-
- Ember.assert("Unable to find view at path '" + path + "'", !!newView);
- } else {
- newView = path;
- }
-
- Ember.assert(Ember.String.fmt('You must pass a view to the #view helper, not %@ (%@)', [path, newView]), Ember.View.detect(newView) || Ember.View.detectInstance(newView));
-
- var viewOptions = this.propertiesFromHTMLOptions(options, thisContext);
- var currentView = data.view;
- viewOptions.templateData = data;
- var newViewProto = newView.proto ? newView.proto() : newView;
-
- if (fn) {
- Ember.assert("You cannot provide a template block if you also specified a templateName", !get(viewOptions, 'templateName') && !get(newViewProto, 'templateName'));
- viewOptions.template = fn;
- }
-
- // We only want to override the `_context` computed property if there is
- // no specified controller. See View#_context for more information.
- if (!newViewProto.controller && !newViewProto.controllerBinding && !viewOptions.controller && !viewOptions.controllerBinding) {
- viewOptions._context = thisContext;
- }
-
- currentView.appendChild(newView, viewOptions);
- }
-});
-
-/**
- `{{view}}` inserts a new instance of `Ember.View` into a template passing its
- options to the `Ember.View`'s `create` method and using the supplied block as
- the view's own template.
-
- An empty `` and the following template:
-
- ```handlebars
- A span:
- {{#view tagName="span"}}
- hello.
- {{/view}}
- ```
-
- Will result in HTML structure:
-
- ```html
-
-
-
-
-
- ```
-
- Removing a view
-
- ```javascript
- aContainer.toArray(); // [aContainer.aView, aContainer.bView]
- aContainer.removeObject(aContainer.get('bView'));
- aContainer.toArray(); // [aContainer.aView]
- ```
-
- Will result in the following HTML
-
- ```html
- A
- B
-
-
- ```
-
- Similarly, adding a child view is accomplished by adding `Ember.View` instances to the
- container view.
-
- Given an empty `` the following code
-
- ```javascript
- aContainer = Ember.ContainerView.create({
- classNames: ['the-container'],
- childViews: ['aView', 'bView'],
- aView: Ember.View.create({
- template: Ember.Handlebars.compile("A")
- }),
- bView: Ember.View.create({
- template: Ember.Handlebars.compile("B")
- })
- });
-
- aContainer.appendTo('body');
- ```
-
- Results in the HTML
-
- ```html
- A
-
-
- ```
-
- Adding a view
-
- ```javascript
- AnotherViewClass = Ember.View.extend({
- template: Ember.Handlebars.compile("Another view")
- });
-
- aContainer.toArray(); // [aContainer.aView, aContainer.bView]
- aContainer.pushObject(AnotherViewClass.create());
- aContainer.toArray(); // [aContainer.aView, aContainer.bView, A
- B
-
-
- ```
-
- ## Templates and Layout
-
- A `template`, `templateName`, `defaultTemplate`, `layout`, `layoutName` or
- `defaultLayout` property on a container view will not result in the template
- or layout being rendered. The HTML contents of a `Ember.ContainerView`'s DOM
- representation will only be the rendered HTML of its child views.
-
- @class ContainerView
- @namespace Ember
- @extends Ember.View
-*/
-Ember.ContainerView = Ember.View.extend(Ember.MutableArray, {
- states: states,
-
- init: function() {
- this._super();
-
- var childViews = get(this, 'childViews');
-
- // redefine view's childViews property that was obliterated
- Ember.defineProperty(this, 'childViews', Ember.View.childViewsProperty);
-
- var _childViews = this._childViews;
-
- forEach(childViews, function(viewName, idx) {
- var view;
-
- if ('string' === typeof viewName) {
- view = get(this, viewName);
- view = this.createChildView(view);
- set(this, viewName, view);
- } else {
- view = this.createChildView(viewName);
- }
-
- _childViews[idx] = view;
- }, this);
-
- var currentView = get(this, 'currentView');
- if (currentView) {
- if (!_childViews.length) { _childViews = this._childViews = this._childViews.slice(); }
- _childViews.push(this.createChildView(currentView));
- }
- },
-
- replace: function(idx, removedCount, addedViews) {
- var addedCount = addedViews ? get(addedViews, 'length') : 0;
- var self = this;
- Ember.assert("You can't add a child to a container that is already a child of another view", Ember.A(addedViews).every(function(item) { return !get(item, '_parentView') || get(item, '_parentView') === self; }));
-
- this.arrayContentWillChange(idx, removedCount, addedCount);
- this.childViewsWillChange(this._childViews, idx, removedCount);
-
- if (addedCount === 0) {
- this._childViews.splice(idx, removedCount) ;
- } else {
- var args = [idx, removedCount].concat(addedViews);
- if (addedViews.length && !this._childViews.length) { this._childViews = this._childViews.slice(); }
- this._childViews.splice.apply(this._childViews, args);
- }
-
- this.arrayContentDidChange(idx, removedCount, addedCount);
- this.childViewsDidChange(this._childViews, idx, removedCount, addedCount);
-
- return this;
- },
-
- objectAt: function(idx) {
- return this._childViews[idx];
- },
-
- length: Ember.computed(function () {
- return this._childViews.length;
- }).volatile(),
-
- /**
- @private
-
- Instructs each child view to render to the passed render buffer.
-
- @method render
- @param {Ember.RenderBuffer} buffer the buffer to render to
- */
- render: function(buffer) {
- this.forEachChildView(function(view) {
- view.renderToBuffer(buffer);
- });
- },
-
- instrumentName: 'container',
-
- /**
- @private
-
- When a child view is removed, destroy its element so that
- it is removed from the DOM.
-
- The array observer that triggers this action is set up in the
- `renderToBuffer` method.
-
- @method childViewsWillChange
- @param {Ember.Array} views the child views array before mutation
- @param {Number} start the start position of the mutation
- @param {Number} removed the number of child views removed
- **/
- childViewsWillChange: function(views, start, removed) {
- this.propertyWillChange('childViews');
-
- if (removed > 0) {
- var changedViews = views.slice(start, start+removed);
- // transition to preRender before clearing parentView
- this.currentState.childViewsWillChange(this, views, start, removed);
- this.initializeViews(changedViews, null, null);
- }
- },
-
- removeChild: function(child) {
- this.removeObject(child);
- return this;
- },
-
- /**
- @private
-
- When a child view is added, make sure the DOM gets updated appropriately.
-
- If the view has already rendered an element, we tell the child view to
- create an element and insert it into the DOM. If the enclosing container
- view has already written to a buffer, but not yet converted that buffer
- into an element, we insert the string representation of the child into the
- appropriate place in the buffer.
-
- @method childViewsDidChange
- @param {Ember.Array} views the array of child views afte the mutation has occurred
- @param {Number} start the start position of the mutation
- @param {Number} removed the number of child views removed
- @param {Number} the number of child views added
- */
- childViewsDidChange: function(views, start, removed, added) {
- if (added > 0) {
- var changedViews = views.slice(start, start+added);
- this.initializeViews(changedViews, this, get(this, 'templateData'));
- this.currentState.childViewsDidChange(this, views, start, added);
- }
- this.propertyDidChange('childViews');
- },
-
- initializeViews: function(views, parentView, templateData) {
- forEach(views, function(view) {
- set(view, '_parentView', parentView);
-
- if (!view.container && parentView) {
- set(view, 'container', parentView.container);
- }
-
- if (!get(view, 'templateData')) {
- set(view, 'templateData', templateData);
- }
- });
- },
-
- currentView: null,
-
- _currentViewWillChange: Ember.beforeObserver('currentView', function() {
- var currentView = get(this, 'currentView');
- if (currentView) {
- currentView.destroy();
- }
- }),
-
- _currentViewDidChange: Ember.observer('currentView', function() {
- var currentView = get(this, 'currentView');
- if (currentView) {
- Ember.assert("You tried to set a current view that already has a parent. Make sure you don't have multiple outlets in the same view.", !get(currentView, '_parentView'));
- this.pushObject(currentView);
- }
- }),
-
- _ensureChildrenAreInDOM: function () {
- this.currentState.ensureChildrenAreInDOM(this);
- }
-});
-
-Ember.merge(states._default, {
- childViewsWillChange: Ember.K,
- childViewsDidChange: Ember.K,
- ensureChildrenAreInDOM: Ember.K
-});
-
-Ember.merge(states.inBuffer, {
- childViewsDidChange: function(parentView, views, start, added) {
- throw new Ember.Error('You cannot modify child views while in the inBuffer state');
- }
-});
-
-Ember.merge(states.hasElement, {
- childViewsWillChange: function(view, views, start, removed) {
- for (var i=start; iA
- B
- Another view
-
-
- ```
-
- ## Automatic matching of parent/child tagNames
-
- Setting the `tagName` property of a `CollectionView` to any of
- "ul", "ol", "table", "thead", "tbody", "tfoot", "tr", or "select" will result
- in the item views receiving an appropriately matched `tagName` property.
-
- Given an empty `` and the following code:
-
- ```javascript
- anUndorderedListView = Ember.CollectionView.create({
- tagName: 'ul',
- content: ['A','B','C'],
- itemViewClass: Ember.View.extend({
- template: Ember.Handlebars.compile("the letter: {{view.content}}")
- })
- });
-
- anUndorderedListView.appendTo('body');
- ```
-
- Will result in the following HTML structure
-
- ```html
- the letter: A
- the letter: B
- the letter: C
- -
-
- the letter: A -
- the letter: B -
- the letter: C -
-
- ```
-
- ## Adding and Removing items
-
- The `childViews` property of a `CollectionView` should not be directly
- manipulated. Instead, add, remove, replace items from its `content` property.
- This will trigger appropriate changes to its rendered HTML.
-
-
- @class CollectionView
- @namespace Ember
- @extends Ember.ContainerView
- @since Ember 0.9
-*/
-Ember.CollectionView = Ember.ContainerView.extend(/** @scope Ember.CollectionView.prototype */ {
-
- /**
- A list of items to be displayed by the `Ember.CollectionView`.
-
- @property content
- @type Ember.Array
- @default null
- */
- content: null,
-
- /**
- @private
-
- This provides metadata about what kind of empty view class this
- collection would like if it is being instantiated from another
- system (like Handlebars)
-
- @property emptyViewClass
- */
- emptyViewClass: Ember.View,
-
- /**
- An optional view to display if content is set to an empty array.
-
- @property emptyView
- @type Ember.View
- @default null
- */
- emptyView: null,
-
- /**
- @property itemViewClass
- @type Ember.View
- @default Ember.View
- */
- itemViewClass: Ember.View,
-
- /**
- Setup a CollectionView
-
- @method init
- */
- init: function() {
- var ret = this._super();
- this._contentDidChange();
- return ret;
- },
-
- /**
- @private
-
- Invoked when the content property is about to change. Notifies observers that the
- entire array content will change.
-
- @method _contentWillChange
- */
- _contentWillChange: Ember.beforeObserver('content', function() {
- var content = this.get('content');
-
- if (content) { content.removeArrayObserver(this); }
- var len = content ? get(content, 'length') : 0;
- this.arrayWillChange(content, 0, len);
- }),
-
- /**
- @private
-
- Check to make sure that the content has changed, and if so,
- update the children directly. This is always scheduled
- asynchronously, to allow the element to be created before
- bindings have synchronized and vice versa.
-
- @method _contentDidChange
- */
- _contentDidChange: Ember.observer('content', function() {
- var content = get(this, 'content');
-
- if (content) {
- this._assertArrayLike(content);
- content.addArrayObserver(this);
- }
-
- var len = content ? get(content, 'length') : 0;
- this.arrayDidChange(content, 0, null, len);
- }),
-
- /**
- @private
-
- Ensure that the content implements Ember.Array
-
- @method _assertArrayLike
- */
- _assertArrayLike: function(content) {
- Ember.assert(fmt("an Ember.CollectionView's content must implement Ember.Array. You passed %@", [content]), Ember.Array.detect(content));
- },
-
- /**
- Removes the content and content observers.
-
- @method destroy
- */
- destroy: function() {
- if (!this._super()) { return; }
-
- var content = get(this, 'content');
- if (content) { content.removeArrayObserver(this); }
-
- if (this._createdEmptyView) {
- this._createdEmptyView.destroy();
- }
-
- return this;
- },
-
- /**
- Called when a mutation to the underlying content array will occur.
-
- This method will remove any views that are no longer in the underlying
- content array.
-
- Invokes whenever the content array itself will change.
-
- @method arrayWillChange
- @param {Array} content the managed collection of objects
- @param {Number} start the index at which the changes will occurr
- @param {Number} removed number of object to be removed from content
- */
- arrayWillChange: function(content, start, removedCount) {
- // If the contents were empty before and this template collection has an
- // empty view remove it now.
- var emptyView = get(this, 'emptyView');
- if (emptyView && emptyView instanceof Ember.View) {
- emptyView.removeFromParent();
- }
-
- // Loop through child views that correspond with the removed items.
- // Note that we loop from the end of the array to the beginning because
- // we are mutating it as we go.
- var childViews = this._childViews, childView, idx, len;
-
- len = this._childViews.length;
-
- var removingAll = removedCount === len;
-
- if (removingAll) {
- this.currentState.empty(this);
- this.invokeRecursively(function(view) {
- view.removedFromDOM = true;
- }, false);
- }
-
- for (idx = start + removedCount - 1; idx >= start; idx--) {
- childView = childViews[idx];
- childView.destroy();
- }
- },
-
- /**
- Called when a mutation to the underlying content array occurs.
-
- This method will replay that mutation against the views that compose the
- `Ember.CollectionView`, ensuring that the view reflects the model.
-
- This array observer is added in `contentDidChange`.
-
- @method arrayDidChange
- @param {Array} content the managed collection of objects
- @param {Number} start the index at which the changes occurred
- @param {Number} removed number of object removed from content
- @param {Number} added number of object added to content
- */
- arrayDidChange: function(content, start, removed, added) {
- var addedViews = [], view, item, idx, len, itemViewClass,
- emptyView;
-
- len = content ? get(content, 'length') : 0;
-
- if (len) {
- itemViewClass = get(this, 'itemViewClass');
-
- if ('string' === typeof itemViewClass) {
- itemViewClass = get(itemViewClass) || itemViewClass;
- }
-
- Ember.assert(fmt("itemViewClass must be a subclass of Ember.View, not %@", [itemViewClass]), 'string' === typeof itemViewClass || Ember.View.detect(itemViewClass));
-
- for (idx = start; idx < start+added; idx++) {
- item = content.objectAt(idx);
-
- view = this.createChildView(itemViewClass, {
- content: item,
- contentIndex: idx
- });
-
- addedViews.push(view);
- }
- } else {
- emptyView = get(this, 'emptyView');
-
- if (!emptyView) { return; }
-
- if ('string' === typeof emptyView) {
- emptyView = get(emptyView) || emptyView;
- }
-
- emptyView = this.createChildView(emptyView);
- addedViews.push(emptyView);
- set(this, 'emptyView', emptyView);
-
- if (Ember.CoreView.detect(emptyView)) {
- this._createdEmptyView = emptyView;
- }
- }
-
- this.replace(start, 0, addedViews);
- },
-
- /**
- Instantiates a view to be added to the childViews array during view
- initialization. You generally will not call this method directly unless
- you are overriding `createChildViews()`. Note that this method will
- automatically configure the correct settings on the new view instance to
- act as a child of the parent.
-
- The tag name for the view will be set to the tagName of the viewClass
- passed in.
-
- @method createChildView
- @param {Class} viewClass
- @param {Hash} [attrs] Attributes to add
- @return {Ember.View} new instance
- */
- createChildView: function(view, attrs) {
- view = this._super(view, attrs);
-
- var itemTagName = get(view, 'tagName');
-
- if (itemTagName === null || itemTagName === undefined) {
- itemTagName = Ember.CollectionView.CONTAINER_MAP[get(this, 'tagName')];
- set(view, 'tagName', itemTagName);
- }
-
- return view;
- }
-});
-
-/**
- A map of parent tags to their default child tags. You can add
- additional parent tags if you want collection views that use
- a particular parent tag to default to a child tag.
-
- @property CONTAINER_MAP
- @type Hash
- @static
- @final
-*/
-Ember.CollectionView.CONTAINER_MAP = {
- ul: 'li',
- ol: 'li',
- table: 'tr',
- thead: 'tr',
- tbody: 'tr',
- tfoot: 'tr',
- tr: 'td',
- select: 'option'
-};
-
-})();
-
-
-
-(function() {
-var get = Ember.get, set = Ember.set, isNone = Ember.isNone,
- a_slice = Array.prototype.slice;
-
-
-/**
-@module ember
-@submodule ember-views
-*/
-
-/**
- An `Ember.Component` is a view that is completely
- isolated. Property access in its templates go
- to the view object and actions are targeted at
- the view object. There is no access to the
- surrounding context or outer controller; all
- contextual information is passed in.
-
- The easiest way to create an `Ember.Component` is via
- a template. If you name a template
- `components/my-foo`, you will be able to use
- `{{my-foo}}` in other templates, which will make
- an instance of the isolated component.
-
- ```html
- {{app-profile person=currentUser}}
- ```
-
- ```html
-
-
- The collection is empty
-
- {{person.title}}
-{{person.signature}}
- ``` - - You can also use `yield` inside a template to - include the **contents** of the custom tag: - - ```html - {{#app-profile person=currentUser}} -Admin mode
- {{/app-profile}} - ``` - - ```html - -{{person.title}}
- {{yield}} - ``` - - If you want to customize the component, in order to - handle events or actions, you implement a subclass - of `Ember.Component` named after the name of the - component. Note that `Component` needs to be appended to the name of - your subclass like `AppProfileComponent`. - - For example, you could implement the action - `hello` for the `app-profile` component: - - ```javascript - App.AppProfileComponent = Ember.Component.extend({ - actions: { - hello: function(name) { - console.log("Hello", name); - } - } - }); - ``` - - And then use it in the component's template: - - ```html - - -{{person.title}}
- {{yield}} - - - ``` - - Components must have a `-` in their name to avoid - conflicts with built-in controls that wrap HTML - elements. This is consistent with the same - requirement in web components. - - @class Component - @namespace Ember - @extends Ember.View -*/ -Ember.Component = Ember.View.extend(Ember.TargetActionSupport, { - init: function() { - this._super(); - set(this, 'context', this); - set(this, 'controller', this); - }, - - // during render, isolate keywords - cloneKeywords: function() { - return { - view: this, - controller: this - }; - }, - - _yield: function(context, options) { - var view = options.data.view, - parentView = this._parentView, - template = get(this, 'template'); - - if (template) { - Ember.assert("A Component must have a parent view in order to yield.", parentView); - - view.appendChild(Ember.View, { - isVirtual: true, - tagName: '', - _contextView: parentView, - template: template, - context: get(parentView, 'context'), - controller: get(parentView, 'controller'), - templateData: { keywords: parentView.cloneKeywords() } - }); - } - }, - - /** - If the component is currently inserted into the DOM of a parent view, this - property will point to the controller of the parent view. - - @property targetObject - @type Ember.Controller - @default null - */ - targetObject: Ember.computed(function(key) { - var parentView = get(this, '_parentView'); - return parentView ? get(parentView, 'controller') : null; - }).property('_parentView'), - - /** - Triggers a named action on the controller context where the component is used if - this controller has registered for notifications of the action. - - For example a component for playing or pausing music may translate click events - into action notifications of "play" or "stop" depending on some internal state - of the component: - - - ```javascript - App.PlayButtonComponent = Ember.Component.extend({ - click: function(){ - if (this.get('isPlaying')) { - this.triggerAction('play'); - } else { - this.triggerAction('stop'); - } - } - }); - ``` - - When used inside a template these component actions are configured to - trigger actions in the outer application context: - - ```handlebars - {{! application.hbs }} - {{play-button play="musicStarted" stop="musicStopped"}} - ``` - - When the component receives a browser `click` event it translate this - interaction into application-specific semantics ("play" or "stop") and - triggers the specified action name on the controller for the template - where the component is used: - - - ```javascript - App.ApplicationController = Ember.Controller.extend({ - actions: { - musicStarted: function(){ - // called when the play button is clicked - // and the music started playing - }, - musicStopped: function(){ - // called when the play button is clicked - // and the music stopped playing - } - } - }); - ``` - - If no action name is passed to `sendAction` a default name of "action" - is assumed. - - ```javascript - App.NextButtonComponent = Ember.Component.extend({ - click: function(){ - this.sendAction(); - } - }); - ``` - - ```handlebars - {{! application.hbs }} - {{next-button action="playNextSongInAlbum"}} - ``` - - ```javascript - App.ApplicationController = Ember.Controller.extend({ - actions: { - playNextSongInAlbum: function(){ - ... - } - } - }); - ``` - - @method sendAction - @param [action] {String} the action to trigger - @param [context] {*} a context to send with the action - */ - sendAction: function(action) { - var actionName, - contexts = a_slice.call(arguments, 1); - - // Send the default action - if (action === undefined) { - actionName = get(this, 'action'); - Ember.assert("The default action was triggered on the component " + this.toString() + ", but the action name (" + actionName + ") was not a string.", isNone(actionName) || typeof actionName === 'string'); - } else { - actionName = get(this, action); - Ember.assert("The " + action + " action was triggered on the component " + this.toString() + ", but the action name (" + actionName + ") was not a string.", isNone(actionName) || typeof actionName === 'string'); - } - - // If no action name for that action could be found, just abort. - if (actionName === undefined) { return; } - - this.triggerAction({ - action: actionName, - actionContext: contexts - }); - } -}); - -})(); - - - -(function() { - -})(); - - - -(function() { -/** -`Ember.ViewTargetActionSupport` is a mixin that can be included in a -view class to add a `triggerAction` method with semantics similar to -the Handlebars `{{action}}` helper. It provides intelligent defaults -for the action's target: the view's controller; and the context that is -sent with the action: the view's context. - -Note: In normal Ember usage, the `{{action}}` helper is usually the best -choice. This mixin is most often useful when you are doing more complex -event handling in custom View subclasses. - -For example: - -```javascript -App.SaveButtonView = Ember.View.extend(Ember.ViewTargetActionSupport, { - action: 'save', - click: function() { - this.triggerAction(); // Sends the `save` action, along with the current context - // to the current controller - } -}); -``` - -The `action` can be provided as properties of an optional object argument -to `triggerAction` as well. - -```javascript -App.SaveButtonView = Ember.View.extend(Ember.ViewTargetActionSupport, { - click: function() { - this.triggerAction({ - action: 'save' - }); // Sends the `save` action, along with the current context - // to the current controller - } -}); -``` - -@class ViewTargetActionSupport -@namespace Ember -@extends Ember.TargetActionSupport -*/ -Ember.ViewTargetActionSupport = Ember.Mixin.create(Ember.TargetActionSupport, { - /** - @property target - */ - target: Ember.computed.alias('controller'), - /** - @property actionContext - */ - actionContext: Ember.computed.alias('context') -}); - -})(); - - - -(function() { - -})(); - - - -(function() { -/** -Ember Views - -@module ember -@submodule ember-views -@requires ember-runtime -@main ember-views -*/ - -})(); - -(function() { -define("metamorph", - [], - function() { - "use strict"; - // ========================================================================== - // Project: metamorph - // Copyright: ©2011 My Company Inc. All rights reserved. - // ========================================================================== - - var K = function() {}, - guid = 0, - document = this.document, - disableRange = ('undefined' === typeof ENV ? {} : ENV).DISABLE_RANGE_API, - - // Feature-detect the W3C range API, the extended check is for IE9 which only partially supports ranges - supportsRange = (!disableRange) && document && ('createRange' in document) && (typeof Range !== 'undefined') && Range.prototype.createContextualFragment, - - // Internet Explorer prior to 9 does not allow setting innerHTML if the first element - // is a "zero-scope" element. This problem can be worked around by making - // the first node an invisible text node. We, like Modernizr, use - needsShy = document && (function() { - var testEl = document.createElement('div'); - testEl.innerHTML = ""; - testEl.firstChild.innerHTML = ""; - return testEl.firstChild.innerHTML === ''; - })(), - - - // IE 8 (and likely earlier) likes to move whitespace preceeding - // a script tag to appear after it. This means that we can - // accidentally remove whitespace when updating a morph. - movesWhitespace = document && (function() { - var testEl = document.createElement('div'); - testEl.innerHTML = "Test: Value"; - return testEl.childNodes[0].nodeValue === 'Test:' && - testEl.childNodes[2].nodeValue === ' Value'; - })(); - - // Constructor that supports either Metamorph('foo') or new - // Metamorph('foo'); - // - // Takes a string of HTML as the argument. - - var Metamorph = function(html) { - var self; - - if (this instanceof Metamorph) { - self = this; - } else { - self = new K(); - } - - self.innerHTML = html; - var myGuid = 'metamorph-'+(guid++); - self.start = myGuid + '-start'; - self.end = myGuid + '-end'; - - return self; - }; - - K.prototype = Metamorph.prototype; - - var rangeFor, htmlFunc, removeFunc, outerHTMLFunc, appendToFunc, afterFunc, prependFunc, startTagFunc, endTagFunc; - - outerHTMLFunc = function() { - return this.startTag() + this.innerHTML + this.endTag(); - }; - - startTagFunc = function() { - /* - * We replace chevron by its hex code in order to prevent escaping problems. - * Check this thread for more explaination: - * http://stackoverflow.com/questions/8231048/why-use-x3c-instead-of-when-generating-html-from-javascript - */ - return "| hi |
someString
'.htmlSafe()
- ```
-
- See [Ember.String.htmlSafe](/api/classes/Ember.String.html#method_htmlSafe).
-
- @method htmlSafe
- @for String
- @return {Handlebars.SafeString} a string that will not be html escaped by Handlebars
- */
- String.prototype.htmlSafe = function() {
- return htmlSafe(this);
- };
-}
-
-})();
-
-
-
-(function() {
-Ember.Handlebars.resolvePaths = function(options) {
- var ret = [],
- contexts = options.contexts,
- roots = options.roots,
- data = options.data;
-
- for (var i=0, l=contexts.length; i
- ```
-
- ### `bind-attr` and the `class` attribute
-
- `bind-attr` supports a special syntax for handling a number of cases unique
- to the `class` DOM element attribute. The `class` attribute combines
- multiple discrete values into a single attribute as a space-delimited
- list of strings. Each string can be:
-
- * a string return value of an object's property.
- * a boolean return value of an object's property
- * a hard-coded value
-
- A string return value works identically to other uses of `bind-attr`. The
- return value of the property will become the value of the attribute. For
- example, the following view and template:
-
- ```javascript
- AView = Ember.View.extend({
- someProperty: function() {
- return "aValue";
- }.property()
- })
- ```
-
- ```handlebars
-
- A span:
-
- Hello.
-
-
-
- ```
-
- ### `parentView` setting
-
- The `parentView` property of the new `Ember.View` instance created through
- `{{view}}` will be set to the `Ember.View` instance of the template where
- `{{view}}` was called.
-
- ```javascript
- aView = Ember.View.create({
- template: Ember.Handlebars.compile("{{#view}} my parent: {{parentView.elementId}} {{/view}}")
- });
-
- aView.appendTo('body');
- ```
-
- Will result in HTML structure:
-
- ```html
-
-
- ```
-
- ### Setting CSS id and class attributes
-
- The HTML `id` attribute can be set on the `{{view}}`'s resulting element with
- the `id` option. This option will _not_ be passed to `Ember.View.create`.
-
- ```handlebars
- {{#view tagName="span" id="a-custom-id"}}
- hello.
- {{/view}}
- ```
-
- Results in the following HTML structure:
-
- ```html
-
- my parent: ember1
-
-
-
- hello.
-
-
- ```
-
- The HTML `class` attribute can be set on the `{{view}}`'s resulting element
- with the `class` or `classNameBindings` options. The `class` option will
- directly set the CSS `class` attribute and will not be passed to
- `Ember.View.create`. `classNameBindings` will be passed to `create` and use
- `Ember.View`'s class name binding functionality:
-
- ```handlebars
- {{#view tagName="span" class="a-custom-class"}}
- hello.
- {{/view}}
- ```
-
- Results in the following HTML structure:
-
- ```html
-
-
- hello.
-
-
- ```
-
- ### Supplying a different view class
-
- `{{view}}` can take an optional first argument before its supplied options to
- specify a path to a custom view class.
-
- ```handlebars
- {{#view "MyApp.CustomView"}}
- hello.
- {{/view}}
- ```
-
- The first argument can also be a relative path accessible from the current
- context.
-
- ```javascript
- MyApp = Ember.Application.create({});
- MyApp.OuterView = Ember.View.extend({
- innerViewClass: Ember.View.extend({
- classNames: ['a-custom-view-class-as-property']
- }),
- template: Ember.Handlebars.compile('{{#view "view.innerViewClass"}} hi {{/view}}')
- });
-
- MyApp.OuterView.create().appendTo('body');
- ```
-
- Will result in the following HTML:
-
- ```html
-
-
- ```
-
- ### Blockless use
-
- If you supply a custom `Ember.View` subclass that specifies its own template
- or provide a `templateName` option to `{{view}}` it can be used without
- supplying a block. Attempts to use both a `templateName` option and supply a
- block will throw an error.
-
- ```handlebars
- {{view "MyApp.ViewWithATemplateDefined"}}
- ```
-
- ### `viewName` property
-
- You can supply a `viewName` option to `{{view}}`. The `Ember.View` instance
- will be referenced as a property of its parent view by this name.
-
- ```javascript
- aView = Ember.View.create({
- template: Ember.Handlebars.compile('{{#view viewName="aChildByName"}} hi {{/view}}')
- });
-
- aView.appendTo('body');
- aView.get('aChildByName') // the instance of Ember.View created by {{view}} helper
- ```
-
- @method view
- @for Ember.Handlebars.helpers
- @param {String} path
- @param {Hash} options
- @return {String} HTML string
-*/
-EmberHandlebars.registerHelper('view', function(path, options) {
- Ember.assert("The view helper only takes a single argument", arguments.length <= 2);
-
- // If no path is provided, treat path param as options.
- if (path && path.data && path.data.isRenderData) {
- options = path;
- path = "Ember.View";
- }
-
- return EmberHandlebars.ViewHelper.helper(this, path, options);
-});
-
-
-})();
-
-
-
-(function() {
-/*globals Handlebars */
-
-// TODO: Don't require all of this module
-/**
-@module ember
-@submodule ember-handlebars
-*/
-
-var get = Ember.get, handlebarsGet = Ember.Handlebars.get, fmt = Ember.String.fmt;
-
-/**
- `{{collection}}` is a `Ember.Handlebars` helper for adding instances of
- `Ember.CollectionView` to a template. See [Ember.CollectionView](/api/classes/Ember.CollectionView.html)
- for additional information on how a `CollectionView` functions.
-
- `{{collection}}`'s primary use is as a block helper with a `contentBinding`
- option pointing towards an `Ember.Array`-compatible object. An `Ember.View`
- instance will be created for each item in its `content` property. Each view
- will have its own `content` property set to the appropriate item in the
- collection.
-
- The provided block will be applied as the template for each item's view.
-
- Given an empty `` the following template:
-
- ```handlebars
- {{#collection contentBinding="App.items"}}
- Hi {{view.content.name}}
- {{/collection}}
- ```
-
- And the following application code
-
- ```javascript
- App = Ember.Application.create()
- App.items = [
- Ember.Object.create({name: 'Dave'}),
- Ember.Object.create({name: 'Mary'}),
- Ember.Object.create({name: 'Sara'})
- ]
- ```
-
- Will result in the HTML structure below
-
- ```html
-
- hi
-
-
-
- ```
-
- ### Blockless Use
-
- If you provide an `itemViewClass` option that has its own `template` you can
- omit the block.
-
- The following template:
-
- ```handlebars
- {{collection contentBinding="App.items" itemViewClass="App.AnItemView"}}
- ```
-
- And application code
-
- ```javascript
- App = Ember.Application.create();
- App.items = [
- Ember.Object.create({name: 'Dave'}),
- Ember.Object.create({name: 'Mary'}),
- Ember.Object.create({name: 'Sara'})
- ];
-
- App.AnItemView = Ember.View.extend({
- template: Ember.Handlebars.compile("Greetings {{view.content.name}}")
- });
- ```
-
- Will result in the HTML structure below
-
- ```html
- Hi Dave
- Hi Mary
- Hi Sara
-
-
- ```
-
- ### Specifying a CollectionView subclass
-
- By default the `{{collection}}` helper will create an instance of
- `Ember.CollectionView`. You can supply a `Ember.CollectionView` subclass to
- the helper by passing it as the first argument:
-
- ```handlebars
- {{#collection App.MyCustomCollectionClass contentBinding="App.items"}}
- Hi {{view.content.name}}
- {{/collection}}
- ```
-
- ### Forwarded `item.*`-named Options
-
- As with the `{{view}}`, helper options passed to the `{{collection}}` will be
- set on the resulting `Ember.CollectionView` as properties. Additionally,
- options prefixed with `item` will be applied to the views rendered for each
- item (note the camelcasing):
-
- ```handlebars
- {{#collection contentBinding="App.items"
- itemTagName="p"
- itemClassNames="greeting"}}
- Howdy {{view.content.name}}
- {{/collection}}
- ```
-
- Will result in the following HTML structure:
-
- ```html
- Greetings Dave
- Greetings Mary
- Greetings Sara
-
-
- ```
-
- @method collection
- @for Ember.Handlebars.helpers
- @param {String} path
- @param {Hash} options
- @return {String} HTML string
- @deprecated Use `{{each}}` helper instead.
-*/
-Ember.Handlebars.registerHelper('collection', function(path, options) {
- Ember.deprecate("Using the {{collection}} helper without specifying a class has been deprecated as the {{each}} helper now supports the same functionality.", path !== 'collection');
-
- // If no path is provided, treat path param as options.
- if (path && path.data && path.data.isRenderData) {
- options = path;
- path = undefined;
- Ember.assert("You cannot pass more than one argument to the collection helper", arguments.length === 1);
- } else {
- Ember.assert("You cannot pass more than one argument to the collection helper", arguments.length === 2);
- }
-
- var fn = options.fn;
- var data = options.data;
- var inverse = options.inverse;
- var view = options.data.view;
-
- // If passed a path string, convert that into an object.
- // Otherwise, just default to the standard class.
- var collectionClass;
- collectionClass = path ? handlebarsGet(this, path, options) : Ember.CollectionView;
- Ember.assert(fmt("%@ #collection: Could not find collection class %@", [data.view, path]), !!collectionClass);
-
- var hash = options.hash, itemHash = {}, match;
-
- // Extract item view class if provided else default to the standard class
- var collectionPrototype = collectionClass.proto(),
- itemViewClass;
-
- if (hash.itemView) {
- var controller = data.keywords.controller;
- Ember.assert('You specified an itemView, but the current context has no container to look the itemView up in. This probably means that you created a view manually, instead of through the container. Instead, use container.lookup("view:viewName"), which will properly instantiate your view.', controller && controller.container);
- var container = controller.container;
- itemViewClass = container.resolve('view:' + hash.itemView);
- Ember.assert('You specified the itemView ' + hash.itemView + ", but it was not found at " + container.describe("view:" + hash.itemView) + " (and it was not registered in the container)", !!itemViewClass);
- } else if (hash.itemViewClass) {
- itemViewClass = handlebarsGet(collectionPrototype, hash.itemViewClass, options);
- } else {
- itemViewClass = collectionPrototype.itemViewClass;
- }
-
- Ember.assert(fmt("%@ #collection: Could not find itemViewClass %@", [data.view, itemViewClass]), !!itemViewClass);
-
- delete hash.itemViewClass;
- delete hash.itemView;
-
- // Go through options passed to the {{collection}} helper and extract options
- // that configure item views instead of the collection itself.
- for (var prop in hash) {
- if (hash.hasOwnProperty(prop)) {
- match = prop.match(/^item(.)(.*)$/);
-
- if (match && prop !== 'itemController') {
- // Convert itemShouldFoo -> shouldFoo
- itemHash[match[1].toLowerCase() + match[2]] = hash[prop];
- // Delete from hash as this will end up getting passed to the
- // {{view}} helper method.
- delete hash[prop];
- }
- }
- }
-
- if (fn) {
- itemHash.template = fn;
- delete options.fn;
- }
-
- var emptyViewClass;
- if (inverse && inverse !== Handlebars.VM.noop) {
- emptyViewClass = get(collectionPrototype, 'emptyViewClass');
- emptyViewClass = emptyViewClass.extend({
- template: inverse,
- tagName: itemHash.tagName
- });
- } else if (hash.emptyViewClass) {
- emptyViewClass = handlebarsGet(this, hash.emptyViewClass, options);
- }
- if (emptyViewClass) { hash.emptyView = emptyViewClass; }
-
- if (!hash.keyword) {
- itemHash._context = Ember.computed.alias('content');
- }
-
- var viewOptions = Ember.Handlebars.ViewHelper.propertiesFromHTMLOptions({ data: data, hash: itemHash }, this);
- hash.itemViewClass = itemViewClass.extend(viewOptions);
-
- return Ember.Handlebars.helpers.view.call(this, collectionClass, options);
-});
-
-
-})();
-
-
-
-(function() {
-/*globals Handlebars */
-/**
-@module ember
-@submodule ember-handlebars
-*/
-
-var handlebarsGet = Ember.Handlebars.get;
-
-/**
- `unbound` allows you to output a property without binding. *Important:* The
- output will not be updated if the property changes. Use with caution.
-
- ```handlebars
- Howdy Dave
-Howdy Mary
-Howdy Sara
-{{unbound somePropertyThatDoesntChange}}
- ```
-
- `unbound` can also be used in conjunction with a bound helper to
- render it in its unbound form:
-
- ```handlebars
- {{unbound helperName somePropertyThatDoesntChange}}
- ```
-
- @method unbound
- @for Ember.Handlebars.helpers
- @param {String} property
- @return {String} HTML string
-*/
-Ember.Handlebars.registerHelper('unbound', function(property, fn) {
- var options = arguments[arguments.length - 1], helper, context, out;
-
- if (arguments.length > 2) {
- // Unbound helper call.
- options.data.isUnbound = true;
- helper = Ember.Handlebars.helpers[arguments[0]] || Ember.Handlebars.helperMissing;
- out = helper.apply(this, Array.prototype.slice.call(arguments, 1));
- delete options.data.isUnbound;
- return out;
- }
-
- context = (fn.contexts && fn.contexts.length) ? fn.contexts[0] : this;
- return handlebarsGet(context, property, fn);
-});
-
-})();
-
-
-
-(function() {
-/*jshint debug:true*/
-/**
-@module ember
-@submodule ember-handlebars
-*/
-
-var handlebarsGet = Ember.Handlebars.get, normalizePath = Ember.Handlebars.normalizePath;
-
-/**
- `log` allows you to output the value of a variable in the current rendering
- context.
-
- ```handlebars
- {{log myVariable}}
- ```
-
- @method log
- @for Ember.Handlebars.helpers
- @param {String} property
-*/
-Ember.Handlebars.registerHelper('log', function(property, options) {
- var context = (options.contexts && options.contexts.length) ? options.contexts[0] : this,
- normalized = normalizePath(context, property, options.data),
- pathRoot = normalized.root,
- path = normalized.path,
- value = (path === 'this') ? pathRoot : handlebarsGet(pathRoot, path, options);
- Ember.Logger.log(value);
-});
-
-/**
- Execute the `debugger` statement in the current context.
-
- ```handlebars
- {{debugger}}
- ```
-
- @method debugger
- @for Ember.Handlebars.helpers
- @param {String} property
-*/
-Ember.Handlebars.registerHelper('debugger', function(options) {
- debugger;
-});
-
-})();
-
-
-
-(function() {
-/**
-@module ember
-@submodule ember-handlebars
-*/
-
-var get = Ember.get, set = Ember.set;
-
-Ember.Handlebars.EachView = Ember.CollectionView.extend(Ember._Metamorph, {
- init: function() {
- var itemController = get(this, 'itemController');
- var binding;
-
- if (itemController) {
- var controller = get(this, 'controller.container').lookupFactory('controller:array').create({
- parentController: get(this, 'controller'),
- itemController: itemController,
- target: get(this, 'controller'),
- _eachView: this
- });
-
- this.disableContentObservers(function() {
- set(this, 'content', controller);
- binding = new Ember.Binding('content', '_eachView.dataSource').oneWay();
- binding.connect(controller);
- });
-
- set(this, '_arrayController', controller);
- } else {
- this.disableContentObservers(function() {
- binding = new Ember.Binding('content', 'dataSource').oneWay();
- binding.connect(this);
- });
- }
-
- return this._super();
- },
-
- _assertArrayLike: function(content) {
- Ember.assert("The value that #each loops over must be an Array. You passed " + content.constructor + ", but it should have been an ArrayController", !Ember.ControllerMixin.detect(content) || (content && content.isGenerated) || content instanceof Ember.ArrayController);
- Ember.assert("The value that #each loops over must be an Array. You passed " + ((Ember.ControllerMixin.detect(content) && content.get('model') !== undefined) ? ("" + content.get('model') + " (wrapped in " + content + ")") : ("" + content)), Ember.Array.detect(content));
- },
-
- disableContentObservers: function(callback) {
- Ember.removeBeforeObserver(this, 'content', null, '_contentWillChange');
- Ember.removeObserver(this, 'content', null, '_contentDidChange');
-
- callback.call(this);
-
- Ember.addBeforeObserver(this, 'content', null, '_contentWillChange');
- Ember.addObserver(this, 'content', null, '_contentDidChange');
- },
-
- itemViewClass: Ember._MetamorphView,
- emptyViewClass: Ember._MetamorphView,
-
- createChildView: function(view, attrs) {
- view = this._super(view, attrs);
-
- // At the moment, if a container view subclass wants
- // to insert keywords, it is responsible for cloning
- // the keywords hash. This will be fixed momentarily.
- var keyword = get(this, 'keyword');
- var content = get(view, 'content');
-
- if (keyword) {
- var data = get(view, 'templateData');
-
- data = Ember.copy(data);
- data.keywords = view.cloneKeywords();
- set(view, 'templateData', data);
-
- // In this case, we do not bind, because the `content` of
- // a #each item cannot change.
- data.keywords[keyword] = content;
- }
-
- // If {{#each}} is looping over an array of controllers,
- // point each child view at their respective controller.
- if (content && get(content, 'isController')) {
- set(view, 'controller', content);
- }
-
- return view;
- },
-
- destroy: function() {
- if (!this._super()) { return; }
-
- var arrayController = get(this, '_arrayController');
-
- if (arrayController) {
- arrayController.destroy();
- }
-
- return this;
- }
-});
-
-var GroupedEach = Ember.Handlebars.GroupedEach = function(context, path, options) {
- var self = this,
- normalized = Ember.Handlebars.normalizePath(context, path, options.data);
-
- this.context = context;
- this.path = path;
- this.options = options;
- this.template = options.fn;
- this.containingView = options.data.view;
- this.normalizedRoot = normalized.root;
- this.normalizedPath = normalized.path;
- this.content = this.lookupContent();
-
- this.addContentObservers();
- this.addArrayObservers();
-
- this.containingView.on('willClearRender', function() {
- self.destroy();
- });
-};
-
-GroupedEach.prototype = {
- contentWillChange: function() {
- this.removeArrayObservers();
- },
-
- contentDidChange: function() {
- this.content = this.lookupContent();
- this.addArrayObservers();
- this.rerenderContainingView();
- },
-
- contentArrayWillChange: Ember.K,
-
- contentArrayDidChange: function() {
- this.rerenderContainingView();
- },
-
- lookupContent: function() {
- return Ember.Handlebars.get(this.normalizedRoot, this.normalizedPath, this.options);
- },
-
- addArrayObservers: function() {
- if (!this.content) { return; }
-
- this.content.addArrayObserver(this, {
- willChange: 'contentArrayWillChange',
- didChange: 'contentArrayDidChange'
- });
- },
-
- removeArrayObservers: function() {
- if (!this.content) { return; }
-
- this.content.removeArrayObserver(this, {
- willChange: 'contentArrayWillChange',
- didChange: 'contentArrayDidChange'
- });
- },
-
- addContentObservers: function() {
- Ember.addBeforeObserver(this.normalizedRoot, this.normalizedPath, this, this.contentWillChange);
- Ember.addObserver(this.normalizedRoot, this.normalizedPath, this, this.contentDidChange);
- },
-
- removeContentObservers: function() {
- Ember.removeBeforeObserver(this.normalizedRoot, this.normalizedPath, this.contentWillChange);
- Ember.removeObserver(this.normalizedRoot, this.normalizedPath, this.contentDidChange);
- },
-
- render: function() {
- if (!this.content) { return; }
-
- var content = this.content,
- contentLength = get(content, 'length'),
- data = this.options.data,
- template = this.template;
-
- data.insideEach = true;
- for (var i = 0; i < contentLength; i++) {
- template(content.objectAt(i), { data: data });
- }
- },
-
- rerenderContainingView: function() {
- var self = this;
- Ember.run.scheduleOnce('render', this, function() {
- // It's possible it's been destroyed after we enqueued a re-render call.
- if (!self.destroyed) {
- self.containingView.rerender();
- }
- });
- },
-
- destroy: function() {
- this.removeContentObservers();
- if (this.content) {
- this.removeArrayObservers();
- }
- this.destroyed = true;
- }
-};
-
-/**
- The `{{#each}}` helper loops over elements in a collection, rendering its
- block once for each item. It is an extension of the base Handlebars `{{#each}}`
- helper:
-
- ```javascript
- Developers = [{name: 'Yehuda'},{name: 'Tom'}, {name: 'Paul'}];
- ```
-
- ```handlebars
- {{#each Developers}}
- {{name}}
- {{/each}}
- ```
-
- `{{each}}` supports an alternative syntax with element naming:
-
- ```handlebars
- {{#each person in Developers}}
- {{person.name}}
- {{/each}}
- ```
-
- When looping over objects that do not have properties, `{{this}}` can be used
- to render the object:
-
- ```javascript
- DeveloperNames = ['Yehuda', 'Tom', 'Paul']
- ```
-
- ```handlebars
- {{#each DeveloperNames}}
- {{this}}
- {{/each}}
- ```
- ### {{else}} condition
- `{{#each}}` can have a matching `{{else}}`. The contents of this block will render
- if the collection is empty.
-
- ```
- {{#each person in Developers}}
- {{person.name}}
- {{else}}
- Sorry, nobody is available for this task.
- {{/each}} - ``` - ### Specifying a View class for items - If you provide an `itemViewClass` option that references a view class - with its own `template` you can omit the block. - - The following template: - - ```handlebars - {{#view App.MyView }} - {{each view.items itemViewClass="App.AnItemView"}} - {{/view}} - ``` - - And application code - - ```javascript - App = Ember.Application.create({ - MyView: Ember.View.extend({ - items: [ - Ember.Object.create({name: 'Dave'}), - Ember.Object.create({name: 'Mary'}), - Ember.Object.create({name: 'Sara'}) - ] - }) - }); - - App.AnItemView = Ember.View.extend({ - template: Ember.Handlebars.compile("Greetings {{name}}") - }); - ``` - - Will result in the HTML structure below - - ```html -
-
- ```
-
- If an `itemViewClass` is defined on the helper, and therefore the helper is not
- being used as a block, an `emptyViewClass` can also be provided optionally.
- The `emptyViewClass` will match the behavior of the `{{else}}` condition
- described above. That is, the `emptyViewClass` will render if the collection
- is empty.
-
- ### Representing each item with a Controller.
- By default the controller lookup within an `{{#each}}` block will be
- the controller of the template where the `{{#each}}` was used. If each
- item needs to be presented by a custom controller you can provide a
- `itemController` option which references a controller by lookup name.
- Each item in the loop will be wrapped in an instance of this controller
- and the item itself will be set to the `content` property of that controller.
-
- This is useful in cases where properties of model objects need transformation
- or synthesis for display:
-
- ```javascript
- App.DeveloperController = Ember.ObjectController.extend({
- isAvailableForHire: function() {
- return !this.get('content.isEmployed') && this.get('content.isSeekingWork');
- }.property('isEmployed', 'isSeekingWork')
- })
- ```
-
- ```handlebars
- {{#each person in developers itemController="developer"}}
- {{person.name}} {{#if person.isAvailableForHire}}Hire me!{{/if}}
- {{/each}}
- ```
-
- Each itemController will receive a reference to the current controller as
- a `parentController` property.
-
- ### (Experimental) Grouped Each
-
- When used in conjunction with the experimental [group helper](https://github.com/emberjs/group-helper),
- you can inform Handlebars to re-render an entire group of items instead of
- re-rendering them one at a time (in the event that they are changed en masse
- or an item is added/removed).
-
- ```handlebars
- {{#group}}
- {{#each people}}
- {{firstName}} {{lastName}}
- {{/each}}
- {{/group}}
- ```
-
- This can be faster than the normal way that Handlebars re-renders items
- in some cases.
-
- If for some reason you have a group with more than one `#each`, you can make
- one of the collections be updated in normal (non-grouped) fashion by setting
- the option `groupedRows=true` (counter-intuitive, I know).
-
- For example,
-
- ```handlebars
- {{dealershipName}}
-
- {{#group}}
- {{#each dealers}}
- {{firstName}} {{lastName}}
- {{/each}}
-
- {{#each car in cars groupedRows=true}}
- {{car.make}} {{car.model}} {{car.color}}
- {{/each}}
- {{/group}}
- ```
- Any change to `dealershipName` or the `dealers` collection will cause the
- entire group to be re-rendered. However, changes to the `cars` collection
- will be re-rendered individually (as normal).
-
- Note that `group` behavior is also disabled by specifying an `itemViewClass`.
-
- @method each
- @for Ember.Handlebars.helpers
- @param [name] {String} name for item (used with `in`)
- @param [path] {String} path
- @param [options] {Object} Handlebars key/value pairs of options
- @param [options.itemViewClass] {String} a path to a view class used for each item
- @param [options.itemController] {String} name of a controller to be created for each item
- @param [options.groupedRows] {boolean} enable normal item-by-item rendering when inside a `#group` helper
-*/
-Ember.Handlebars.registerHelper('each', function(path, options) {
- if (arguments.length === 4) {
- Ember.assert("If you pass more than one argument to the each helper, it must be in the form #each foo in bar", arguments[1] === "in");
-
- var keywordName = arguments[0];
-
- options = arguments[3];
- path = arguments[2];
- if (path === '') { path = "this"; }
-
- options.hash.keyword = keywordName;
- }
-
- if (arguments.length === 1) {
- options = path;
- path = 'this';
- }
-
- options.hash.dataSourceBinding = path;
- // Set up emptyView as a metamorph with no tag
- //options.hash.emptyViewClass = Ember._MetamorphView;
-
- if (options.data.insideGroup && !options.hash.groupedRows && !options.hash.itemViewClass) {
- new Ember.Handlebars.GroupedEach(this, path, options).render();
- } else {
- return Ember.Handlebars.helpers.collection.call(this, 'Ember.Handlebars.EachView', options);
- }
-});
-
-})();
-
-
-
-(function() {
-/**
-@module ember
-@submodule ember-handlebars
-*/
-
-/**
- `template` allows you to render a template from inside another template.
- This allows you to re-use the same template in multiple places. For example:
-
- ```html
-
- ```
-
- ```html
-
- ```
-
- ```handlebars
- {{#if isUser}}
- {{template "user_info"}}
- {{else}}
- {{template "unlogged_user_info"}}
- {{/if}}
- ```
-
- This helper looks for templates in the global `Ember.TEMPLATES` hash. If you
- add `
- ```
-
- Take note that `"welcome"` is a string and not an object
- reference.
-
- @method loc
- @for Ember.Handlebars.helpers
- @param {String} str The string to format
-*/
-
-Ember.Handlebars.registerHelper('loc', function(str) {
- return Ember.String.loc(str);
-});
-
-})();
-
-
-
-(function() {
-
-})();
-
-
-
-(function() {
-
-})();
-
-
-
-(function() {
-/**
-@module ember
-@submodule ember-handlebars
-*/
-
-var set = Ember.set, get = Ember.get;
-
-/**
- The internal class used to create text inputs when the `{{input}}`
- helper is used with `type` of `checkbox`.
-
- See Handlebars.helpers.input for usage details.
-
- ## Direct manipulation of `checked`
-
- The `checked` attribute of an `Ember.Checkbox` object should always be set
- through the Ember object or by interacting with its rendered element
- representation via the mouse, keyboard, or touch. Updating the value of the
- checkbox via jQuery will result in the checked value of the object and its
- element losing synchronization.
-
- ## Layout and LayoutName properties
-
- Because HTML `input` elements are self closing `layout` and `layoutName`
- properties will not be applied. See [Ember.View](/api/classes/Ember.View.html)'s
- layout section for more information.
-
- @class Checkbox
- @namespace Ember
- @extends Ember.View
-*/
-Ember.Checkbox = Ember.View.extend({
- classNames: ['ember-checkbox'],
-
- tagName: 'input',
-
- attributeBindings: ['type', 'checked', 'indeterminate', 'disabled', 'tabindex', 'name'],
-
- type: "checkbox",
- checked: false,
- disabled: false,
- indeterminate: false,
-
- init: function() {
- this._super();
- this.on("change", this, this._updateElementValue);
- },
-
- didInsertElement: function() {
- this._super();
- this.get('element').indeterminate = !!this.get('indeterminate');
- },
-
- _updateElementValue: function() {
- set(this, 'checked', this.$().prop('checked'));
- }
-});
-
-})();
-
-
-
-(function() {
-/**
-@module ember
-@submodule ember-handlebars
-*/
-
-var get = Ember.get, set = Ember.set;
-
-/**
- Shared mixin used by `Ember.TextField` and `Ember.TextArea`.
-
- @class TextSupport
- @namespace Ember
- @private
-*/
-Ember.TextSupport = Ember.Mixin.create({
- value: "",
-
- attributeBindings: ['placeholder', 'disabled', 'maxlength', 'tabindex', 'readonly'],
- placeholder: null,
- disabled: false,
- maxlength: null,
-
- init: function() {
- this._super();
- this.on("focusOut", this, this._elementValueDidChange);
- this.on("change", this, this._elementValueDidChange);
- this.on("paste", this, this._elementValueDidChange);
- this.on("cut", this, this._elementValueDidChange);
- this.on("input", this, this._elementValueDidChange);
- this.on("keyUp", this, this.interpretKeyEvents);
- },
-
- /**
- The action to be sent when the user presses the return key.
-
- This is similar to the `{{action}}` helper, but is fired when
- the user presses the return key when editing a text field, and sends
- the value of the field as the context.
-
- @property action
- @type String
- @default null
- */
- action: null,
-
- /**
- The event that should send the action.
-
- Options are:
-
- * `enter`: the user pressed enter
- * `keyPress`: the user pressed a key
-
- @property onEvent
- @type String
- @default enter
- */
- onEvent: 'enter',
-
- /**
- Whether they `keyUp` event that triggers an `action` to be sent continues
- propagating to other views.
-
- By default, when the user presses the return key on their keyboard and
- the text field has an `action` set, the action will be sent to the view's
- controller and the key event will stop propagating.
-
- If you would like parent views to receive the `keyUp` event even after an
- action has been dispatched, set `bubbles` to true.
-
- @property bubbles
- @type Boolean
- @default false
- */
- bubbles: false,
-
- interpretKeyEvents: function(event) {
- var map = Ember.TextSupport.KEY_EVENTS;
- var method = map[event.keyCode];
-
- this._elementValueDidChange();
- if (method) { return this[method](event); }
- },
-
- _elementValueDidChange: function() {
- set(this, 'value', this.$().val());
- },
-
- /**
- The action to be sent when the user inserts a new line.
-
- Called by the `Ember.TextSupport` mixin on keyUp if keycode matches 13.
- Uses sendAction to send the `enter` action to the controller.
-
- @method insertNewline
- @param {Event} event
- */
- insertNewline: function(event) {
- sendAction('enter', this, event);
- sendAction('insert-newline', this, event);
- },
-
- /**
- Called when the user hits escape.
-
- Called by the `Ember.TextSupport` mixin on keyUp if keycode matches 27.
- Uses sendAction to send the `escape-press` action to the controller.
-
- @method cancel
- @param {Event} event
- */
- cancel: function(event) {
- sendAction('escape-press', this, event);
- },
-
- /**
- Called when the text area is focused.
-
- @method focusIn
- @param {Event} event
- */
- focusIn: function(event) {
- sendAction('focus-in', this, event);
- },
-
- /**
- Called when the text area is blurred.
-
- @method focusOut
- @param {Event} event
- */
- focusOut: function(event) {
- sendAction('focus-out', this, event);
- },
-
- /**
- The action to be sent when the user presses a key. Enabled by setting
- the `onEvent` property to `keyPress`.
-
- Uses sendAction to send the `keyPress` action to the controller.
-
- @method keyPress
- @param {Event} event
- */
- keyPress: function(event) {
- sendAction('key-press', this, event);
- }
-
-});
-
-Ember.TextSupport.KEY_EVENTS = {
- 13: 'insertNewline',
- 27: 'cancel'
-};
-
-// In principle, this shouldn't be necessary, but the legacy
-// sectionAction semantics for TextField are different from
-// the component semantics so this method normalizes them.
-function sendAction(eventName, view, event) {
- var action = get(view, eventName),
- on = get(view, 'onEvent'),
- value = get(view, 'value');
-
- // back-compat support for keyPress as an event name even though
- // it's also a method name that consumes the event (and therefore
- // incompatible with sendAction semantics).
- if (on === eventName || (on === 'keyPress' && eventName === 'key-press')) {
- view.sendAction('action', value);
- }
-
- view.sendAction(eventName, value);
-
- if (action || on === eventName) {
- if(!get(view, 'bubbles')) {
- event.stopPropagation();
- }
- }
-}
-
-})();
-
-
-
-(function() {
-/**
-@module ember
-@submodule ember-handlebars
-*/
-
-var get = Ember.get, set = Ember.set;
-
-/**
-
- The internal class used to create text inputs when the `{{input}}`
- helper is used with `type` of `text`.
-
- See [handlebars.helpers.input](Ember.Handlebars.helpers.html#method_input) for usage details.
-
- ## Layout and LayoutName properties
-
- Because HTML `input` elements are self closing `layout` and `layoutName`
- properties will not be applied. See [Ember.View](/api/classes/Ember.View.html)'s
- layout section for more information.
-
- @class TextField
- @namespace Ember
- @extends Ember.Component
- @uses Ember.TextSupport
-*/
-Ember.TextField = Ember.Component.extend(Ember.TextSupport,
- /** @scope Ember.TextField.prototype */ {
-
- classNames: ['ember-text-field'],
- tagName: "input",
- attributeBindings: ['type', 'value', 'size', 'pattern', 'name'],
-
- /**
- The `value` attribute of the input element. As the user inputs text, this
- property is updated live.
-
- @property value
- @type String
- @default ""
- */
- value: "",
-
- /**
- The `type` attribute of the input element.
-
- @property type
- @type String
- @default "text"
- */
- type: "text",
-
- /**
- The `size` of the text field in characters.
-
- @property size
- @type String
- @default null
- */
- size: null,
-
- /**
- The `pattern` the pattern attribute of input element.
-
- @property pattern
- @type String
- @default null
- */
- pattern: null
-});
-
-})();
-
-
-
-(function() {
-/*
-@module ember
-@submodule ember-handlebars
-*/
-
-var get = Ember.get, set = Ember.set;
-
-/*
- @class Button
- @namespace Ember
- @extends Ember.View
- @uses Ember.TargetActionSupport
- @deprecated
-*/
-Ember.Button = Ember.View.extend(Ember.TargetActionSupport, {
- classNames: ['ember-button'],
- classNameBindings: ['isActive'],
-
- tagName: 'button',
-
- propagateEvents: false,
-
- attributeBindings: ['type', 'disabled', 'href', 'tabindex'],
-
- /*
- @private
-
- Overrides `TargetActionSupport`'s `targetObject` computed
- property to use Handlebars-specific path resolution.
-
- @property targetObject
- */
- targetObject: Ember.computed(function() {
- var target = get(this, 'target'),
- root = get(this, 'context'),
- data = get(this, 'templateData');
-
- if (typeof target !== 'string') { return target; }
-
- return Ember.Handlebars.get(root, target, { data: data });
- }).property('target'),
-
- // Defaults to 'button' if tagName is 'input' or 'button'
- type: Ember.computed(function(key) {
- var tagName = this.tagName;
- if (tagName === 'input' || tagName === 'button') { return 'button'; }
- }),
-
- disabled: false,
-
- // Allow 'a' tags to act like buttons
- href: Ember.computed(function() {
- return this.tagName === 'a' ? '#' : null;
- }),
-
- mouseDown: function() {
- if (!get(this, 'disabled')) {
- set(this, 'isActive', true);
- this._mouseDown = true;
- this._mouseEntered = true;
- }
- return get(this, 'propagateEvents');
- },
-
- mouseLeave: function() {
- if (this._mouseDown) {
- set(this, 'isActive', false);
- this._mouseEntered = false;
- }
- },
-
- mouseEnter: function() {
- if (this._mouseDown) {
- set(this, 'isActive', true);
- this._mouseEntered = true;
- }
- },
-
- mouseUp: function(event) {
- if (get(this, 'isActive')) {
- // Actually invoke the button's target and action.
- // This method comes from the Ember.TargetActionSupport mixin.
- this.triggerAction();
- set(this, 'isActive', false);
- }
-
- this._mouseDown = false;
- this._mouseEntered = false;
- return get(this, 'propagateEvents');
- },
-
- keyDown: function(event) {
- // Handle space or enter
- if (event.keyCode === 13 || event.keyCode === 32) {
- this.mouseDown();
- }
- },
-
- keyUp: function(event) {
- // Handle space or enter
- if (event.keyCode === 13 || event.keyCode === 32) {
- this.mouseUp();
- }
- },
-
- // TODO: Handle proper touch behavior. Including should make inactive when
- // finger moves more than 20x outside of the edge of the button (vs mouse
- // which goes inactive as soon as mouse goes out of edges.)
-
- touchStart: function(touch) {
- return this.mouseDown(touch);
- },
-
- touchEnd: function(touch) {
- return this.mouseUp(touch);
- },
-
- init: function() {
- Ember.deprecate("Ember.Button is deprecated and will be removed from future releases. Consider using the `{{action}}` helper.");
- this._super();
- }
-});
-
-})();
-
-
-
-(function() {
-/**
-@module ember
-@submodule ember-handlebars
-*/
-
-var get = Ember.get, set = Ember.set;
-
-/**
- The internal class used to create textarea element when the `{{textarea}}`
- helper is used.
-
- See [handlebars.helpers.textarea](/api/classes/Ember.Handlebars.helpers.html#method_textarea) for usage details.
-
- ## Layout and LayoutName properties
-
- Because HTML `textarea` elements do not contain inner HTML the `layout` and
- `layoutName` properties will not be applied. See [Ember.View](/api/classes/Ember.View.html)'s
- layout section for more information.
-
- @class TextArea
- @namespace Ember
- @extends Ember.Component
- @uses Ember.TextSupport
-*/
-Ember.TextArea = Ember.Component.extend(Ember.TextSupport, {
- classNames: ['ember-text-area'],
-
- tagName: "textarea",
- attributeBindings: ['rows', 'cols', 'name'],
- rows: null,
- cols: null,
-
- _updateElementValue: Ember.observer('value', function() {
- // We do this check so cursor position doesn't get affected in IE
- var value = get(this, 'value'),
- $el = this.$();
- if ($el && value !== $el.val()) {
- $el.val(value);
- }
- }),
-
- init: function() {
- this._super();
- this.on("didInsertElement", this, this._updateElementValue);
- }
-
-});
-
-})();
-
-
-
-(function() {
-/*jshint eqeqeq:false */
-
-/**
-@module ember
-@submodule ember-handlebars
-*/
-
-var set = Ember.set,
- get = Ember.get,
- indexOf = Ember.EnumerableUtils.indexOf,
- indexesOf = Ember.EnumerableUtils.indexesOf,
- forEach = Ember.EnumerableUtils.forEach,
- replace = Ember.EnumerableUtils.replace,
- isArray = Ember.isArray,
- precompileTemplate = Ember.Handlebars.compile;
-
-Ember.SelectOption = Ember.View.extend({
- tagName: 'option',
- attributeBindings: ['value', 'selected'],
-
- defaultTemplate: function(context, options) {
- options = { data: options.data, hash: {} };
- Ember.Handlebars.helpers.bind.call(context, "view.label", options);
- },
-
- init: function() {
- this.labelPathDidChange();
- this.valuePathDidChange();
-
- this._super();
- },
-
- selected: Ember.computed(function() {
- var content = get(this, 'content'),
- selection = get(this, 'parentView.selection');
- if (get(this, 'parentView.multiple')) {
- return selection && indexOf(selection, content.valueOf()) > -1;
- } else {
- // Primitives get passed through bindings as objects... since
- // `new Number(4) !== 4`, we use `==` below
- return content == selection;
- }
- }).property('content', 'parentView.selection'),
-
- labelPathDidChange: Ember.observer('parentView.optionLabelPath', function() {
- var labelPath = get(this, 'parentView.optionLabelPath');
-
- if (!labelPath) { return; }
-
- Ember.defineProperty(this, 'label', Ember.computed(function() {
- return get(this, labelPath);
- }).property(labelPath));
- }),
-
- valuePathDidChange: Ember.observer('parentView.optionValuePath', function() {
- var valuePath = get(this, 'parentView.optionValuePath');
-
- if (!valuePath) { return; }
-
- Ember.defineProperty(this, 'value', Ember.computed(function() {
- return get(this, valuePath);
- }).property(valuePath));
- })
-});
-
-Ember.SelectOptgroup = Ember.CollectionView.extend({
- tagName: 'optgroup',
- attributeBindings: ['label'],
-
- selectionBinding: 'parentView.selection',
- multipleBinding: 'parentView.multiple',
- optionLabelPathBinding: 'parentView.optionLabelPath',
- optionValuePathBinding: 'parentView.optionValuePath',
-
- itemViewClassBinding: 'parentView.optionView'
-});
-
-/**
- The `Ember.Select` view class renders a
- [select](https://developer.mozilla.org/en/HTML/Element/select) HTML element,
- allowing the user to choose from a list of options.
-
- The text and `value` property of each `Greetings Dave
- Greetings Mary
- Greetings Sara
-