/*! * @overview Ember - JavaScript Application Framework * @copyright Copyright 2011-2014 Tilde Inc. and contributors * Portions Copyright 2006-2011 Strobe Inc. * Portions Copyright 2008-2011 Apple Inc. All rights reserved. * @license Licensed under MIT license * See https://raw.github.com/emberjs/ember.js/master/LICENSE * @version 1.7.1 */ (function() { var define, requireModule, require, requirejs, Ember; (function() { Ember = this.Ember = this.Ember || {}; if (typeof Ember === 'undefined') { Ember = {} }; if (typeof Ember.__loader === 'undefined') { var registry = {}, seen = {}; define = function(name, deps, callback) { registry[name] = { deps: deps, callback: callback }; }; requirejs = require = requireModule = function(name) { if (seen.hasOwnProperty(name)) { return seen[name]; } seen[name] = {}; if (!registry[name]) { throw new Error("Could not find module " + name); } var mod = registry[name], deps = mod.deps, callback = mod.callback, reified = [], exports; for (var i=0, l=deps.length; i 3 ? slice.call(arguments, 3) : undefined; if (!this.currentInstance) { createAutorun(this); } return this.currentInstance.schedule(queueName, target, method, args, false, stack); }, deferOnce: function(queueName, target, method /* , args */) { if (!method) { method = target; target = null; } if (isString(method)) { method = target[method]; } var stack = this.DEBUG ? new Error() : undefined, args = arguments.length > 3 ? slice.call(arguments, 3) : undefined; if (!this.currentInstance) { createAutorun(this); } return this.currentInstance.schedule(queueName, target, method, args, true, stack); }, setTimeout: function() { var args = slice.call(arguments), length = args.length, method, wait, target, methodOrTarget, methodOrWait, methodOrArgs; if (length === 0) { return; } else if (length === 1) { method = args.shift(); wait = 0; } else if (length === 2) { methodOrTarget = args[0]; methodOrWait = args[1]; if (isFunction(methodOrWait) || isFunction(methodOrTarget[methodOrWait])) { target = args.shift(); method = args.shift(); wait = 0; } else if (isCoercableNumber(methodOrWait)) { method = args.shift(); wait = args.shift(); } else { method = args.shift(); wait = 0; } } else { var last = args[args.length - 1]; if (isCoercableNumber(last)) { wait = args.pop(); } else { wait = 0; } methodOrTarget = args[0]; methodOrArgs = args[1]; if (isFunction(methodOrArgs) || (isString(methodOrArgs) && methodOrTarget !== null && methodOrArgs in methodOrTarget)) { target = args.shift(); method = args.shift(); } else { method = args.shift(); } } var executeAt = (+new Date()) + parseInt(wait, 10); if (isString(method)) { method = target[method]; } var onError = getOnError(this.options); function fn() { if (onError) { try { method.apply(target, args); } catch (e) { onError(e); } } else { method.apply(target, args); } } // find position to insert var i = searchTimer(executeAt, timers); timers.splice(i, 0, executeAt, fn); updateLaterTimer(this, executeAt, wait); return fn; }, throttle: function(target, method /* , args, wait, [immediate] */) { var self = this, args = arguments, immediate = pop.call(args), wait, throttler, index, timer; if (isNumber(immediate) || isString(immediate)) { wait = immediate; immediate = true; } else { wait = pop.call(args); } wait = parseInt(wait, 10); index = findThrottler(target, method, this._throttlers); if (index > -1) { return this._throttlers[index]; } // throttled timer = global.setTimeout(function() { if (!immediate) { self.run.apply(self, args); } var index = findThrottler(target, method, self._throttlers); if (index > -1) { self._throttlers.splice(index, 1); } }, wait); if (immediate) { self.run.apply(self, args); } throttler = [target, method, timer]; this._throttlers.push(throttler); return throttler; }, debounce: function(target, method /* , args, wait, [immediate] */) { var self = this, args = arguments, immediate = pop.call(args), wait, index, debouncee, timer; if (isNumber(immediate) || isString(immediate)) { wait = immediate; immediate = false; } else { wait = pop.call(args); } wait = parseInt(wait, 10); // Remove debouncee index = findDebouncee(target, method, this._debouncees); if (index > -1) { debouncee = this._debouncees[index]; this._debouncees.splice(index, 1); clearTimeout(debouncee[2]); } timer = global.setTimeout(function() { if (!immediate) { self.run.apply(self, args); } var index = findDebouncee(target, method, self._debouncees); if (index > -1) { self._debouncees.splice(index, 1); } }, wait); if (immediate && index === -1) { self.run.apply(self, args); } debouncee = [target, method, timer]; self._debouncees.push(debouncee); return debouncee; }, cancelTimers: function() { var clearItems = function(item) { clearTimeout(item[2]); }; each(this._throttlers, clearItems); this._throttlers = []; each(this._debouncees, clearItems); this._debouncees = []; if (this._laterTimer) { clearTimeout(this._laterTimer); this._laterTimer = null; } timers = []; if (this._autorun) { clearTimeout(this._autorun); this._autorun = null; } }, hasTimers: function() { return !!timers.length || !!this._debouncees.length || !!this._throttlers.length || this._autorun; }, cancel: function(timer) { var timerType = typeof timer; if (timer && timerType === 'object' && timer.queue && timer.method) { // we're cancelling a deferOnce return timer.queue.cancel(timer); } else if (timerType === 'function') { // we're cancelling a setTimeout for (var i = 0, l = timers.length; i < l; i += 2) { if (timers[i + 1] === timer) { timers.splice(i, 2); // remove the two elements return true; } } } else if (Object.prototype.toString.call(timer) === "[object Array]"){ // we're cancelling a throttle or debounce return this._cancelItem(findThrottler, this._throttlers, timer) || this._cancelItem(findDebouncee, this._debouncees, timer); } else { return; // timer was null or not a timer } }, _cancelItem: function(findMethod, array, timer){ var item, index; if (timer.length < 3) { return false; } index = findMethod(timer[0], timer[1], array); if(index > -1) { item = array[index]; if(item[2] === timer[2]){ array.splice(index, 1); clearTimeout(timer[2]); return true; } } return false; } }; Backburner.prototype.schedule = Backburner.prototype.defer; Backburner.prototype.scheduleOnce = Backburner.prototype.deferOnce; Backburner.prototype.later = Backburner.prototype.setTimeout; if (needsIETryCatchFix) { var originalRun = Backburner.prototype.run; Backburner.prototype.run = wrapInTryCatch(originalRun); var originalEnd = Backburner.prototype.end; Backburner.prototype.end = wrapInTryCatch(originalEnd); } function wrapInTryCatch(func) { return function () { try { return func.apply(this, arguments); } catch (e) { throw e; } }; } function getOnError(options) { return options.onError || (options.onErrorTarget && options.onErrorTarget[options.onErrorMethod]); } function createAutorun(backburner) { backburner.begin(); backburner._autorun = global.setTimeout(function() { backburner._autorun = null; backburner.end(); }); } function updateLaterTimer(self, executeAt, wait) { if (!self._laterTimer || executeAt < self._laterTimerExpiresAt) { self._laterTimer = global.setTimeout(function() { self._laterTimer = null; self._laterTimerExpiresAt = null; executeTimers(self); }, wait); self._laterTimerExpiresAt = executeAt; } } function executeTimers(self) { var now = +new Date(), time, fns, i, l; self.run(function() { i = searchTimer(now, timers); fns = timers.splice(0, i); for (i = 1, l = fns.length; i < l; i += 2) { self.schedule(self.options.defaultQueue, null, fns[i]); } }); if (timers.length) { updateLaterTimer(self, timers[0], timers[0] - now); } } function findDebouncee(target, method, debouncees) { return findItem(target, method, debouncees); } function findThrottler(target, method, throttlers) { return findItem(target, method, throttlers); } function findItem(target, method, collection) { var item, index = -1; for (var i = 0, l = collection.length; i < l; i++) { item = collection[i]; if (item[0] === target && item[1] === method) { index = i; break; } } return index; } function searchTimer(time, timers) { var start = 0, end = timers.length - 2, middle, l; while (start < end) { // since timers is an array of pairs 'l' will always // be an integer l = (end - start) / 2; // compensate for the index in case even number // of pairs inside timers middle = start + l - (l % 2); if (time >= timers[middle]) { start = middle + 2; } else { end = middle; } } return (time >= timers[start]) ? start + 2 : start; } __exports__.Backburner = Backburner; }); define("backburner/deferred_action_queues", ["backburner/utils","backburner/queue","exports"], function(__dependency1__, __dependency2__, __exports__) { "use strict"; var Utils = __dependency1__["default"]; var Queue = __dependency2__.Queue; var each = Utils.each, isString = Utils.isString; function DeferredActionQueues(queueNames, options) { var queues = this.queues = {}; this.queueNames = queueNames = queueNames || []; this.options = options; each(queueNames, function(queueName) { queues[queueName] = new Queue(this, queueName, options); }); } DeferredActionQueues.prototype = { queueNames: null, queues: null, options: null, schedule: function(queueName, target, method, args, onceFlag, stack) { var queues = this.queues, queue = queues[queueName]; if (!queue) { throw new Error("You attempted to schedule an action in a queue (" + queueName + ") that doesn't exist"); } if (onceFlag) { return queue.pushUnique(target, method, args, stack); } else { return queue.push(target, method, args, stack); } }, invoke: function(target, method, args, _) { if (args && args.length > 0) { method.apply(target, args); } else { method.call(target); } }, invokeWithOnError: function(target, method, args, onError) { try { if (args && args.length > 0) { method.apply(target, args); } else { method.call(target); } } catch(error) { onError(error); } }, flush: function() { var queues = this.queues, queueNames = this.queueNames, queueName, queue, queueItems, priorQueueNameIndex, queueNameIndex = 0, numberOfQueues = queueNames.length, options = this.options, onError = options.onError || (options.onErrorTarget && options.onErrorTarget[options.onErrorMethod]), invoke = onError ? this.invokeWithOnError : this.invoke; outerloop: while (queueNameIndex < numberOfQueues) { queueName = queueNames[queueNameIndex]; queue = queues[queueName]; queueItems = queue._queueBeingFlushed = queue._queue.slice(); queue._queue = []; var queueOptions = queue.options, // TODO: write a test for this before = queueOptions && queueOptions.before, after = queueOptions && queueOptions.after, target, method, args, stack, queueIndex = 0, numberOfQueueItems = queueItems.length; if (numberOfQueueItems && before) { before(); } while (queueIndex < numberOfQueueItems) { target = queueItems[queueIndex]; method = queueItems[queueIndex+1]; args = queueItems[queueIndex+2]; stack = queueItems[queueIndex+3]; // Debugging assistance if (isString(method)) { method = target[method]; } // method could have been nullified / canceled during flush if (method) { invoke(target, method, args, onError); } queueIndex += 4; } queue._queueBeingFlushed = null; if (numberOfQueueItems && after) { after(); } if ((priorQueueNameIndex = indexOfPriorQueueWithActions(this, queueNameIndex)) !== -1) { queueNameIndex = priorQueueNameIndex; continue outerloop; } queueNameIndex++; } } }; function indexOfPriorQueueWithActions(daq, currentQueueIndex) { var queueName, queue; for (var i = 0, l = currentQueueIndex; i <= l; i++) { queueName = daq.queueNames[i]; queue = daq.queues[queueName]; if (queue._queue.length) { return i; } } return -1; } __exports__.DeferredActionQueues = DeferredActionQueues; }); define("backburner/queue", ["exports"], function(__exports__) { "use strict"; function Queue(daq, name, options) { this.daq = daq; this.name = name; this.globalOptions = options; this.options = options[name]; this._queue = []; } Queue.prototype = { daq: null, name: null, options: null, onError: null, _queue: null, push: function(target, method, args, stack) { var queue = this._queue; queue.push(target, method, args, stack); return {queue: this, target: target, method: method}; }, pushUnique: function(target, method, args, stack) { var queue = this._queue, currentTarget, currentMethod, i, l; for (i = 0, l = queue.length; i < l; i += 4) { currentTarget = queue[i]; currentMethod = queue[i+1]; if (currentTarget === target && currentMethod === method) { queue[i+2] = args; // replace args queue[i+3] = stack; // replace stack return {queue: this, target: target, method: method}; } } queue.push(target, method, args, stack); return {queue: this, target: target, method: method}; }, // TODO: remove me, only being used for Ember.run.sync flush: function() { var queue = this._queue, globalOptions = this.globalOptions, options = this.options, before = options && options.before, after = options && options.after, onError = globalOptions.onError || (globalOptions.onErrorTarget && globalOptions.onErrorTarget[globalOptions.onErrorMethod]), target, method, args, stack, i, l = queue.length; if (l && before) { before(); } for (i = 0; i < l; i += 4) { target = queue[i]; method = queue[i+1]; args = queue[i+2]; stack = queue[i+3]; // Debugging assistance // TODO: error handling if (args && args.length > 0) { if (onError) { try { method.apply(target, args); } catch (e) { onError(e); } } else { method.apply(target, args); } } else { if (onError) { try { method.call(target); } catch(e) { onError(e); } } else { method.call(target); } } } if (l && after) { after(); } // check if new items have been added if (queue.length > l) { this._queue = queue.slice(l); this.flush(); } else { this._queue.length = 0; } }, cancel: function(actionToCancel) { var queue = this._queue, currentTarget, currentMethod, i, l; for (i = 0, l = queue.length; i < l; i += 4) { currentTarget = queue[i]; currentMethod = queue[i+1]; if (currentTarget === actionToCancel.target && currentMethod === actionToCancel.method) { queue.splice(i, 4); return true; } } // if not found in current queue // could be in the queue that is being flushed queue = this._queueBeingFlushed; if (!queue) { return; } for (i = 0, l = queue.length; i < l; i += 4) { currentTarget = queue[i]; currentMethod = queue[i+1]; if (currentTarget === actionToCancel.target && currentMethod === actionToCancel.method) { // don't mess with array during flush // just nullify the method queue[i+1] = null; return true; } } } }; __exports__.Queue = Queue; }); define("backburner/utils", ["exports"], function(__exports__) { "use strict"; __exports__["default"] = { each: function(collection, callback) { for (var i = 0; i < collection.length; i++) { callback(collection[i]); } }, isString: function(suspect) { return typeof suspect === 'string'; }, isFunction: function(suspect) { return typeof suspect === 'function'; }, isNumber: function(suspect) { return typeof suspect === 'number'; } }; }); define("calculateVersion", [], function() { "use strict"; 'use strict'; var fs = require('fs'); var path = require('path'); module.exports = function () { var packageVersion = require('../package.json').version; var output = [packageVersion]; var gitPath = path.join(__dirname,'..','.git'); var headFilePath = path.join(gitPath, 'HEAD'); if (packageVersion.indexOf('+') > -1) { try { if (fs.existsSync(headFilePath)) { var headFile = fs.readFileSync(headFilePath, {encoding: 'utf8'}); var branchName = headFile.split('/').slice(-1)[0].trim(); var refPath = headFile.split(' ')[1]; var branchSHA; if (refPath) { var branchPath = path.join(gitPath, refPath.trim()); branchSHA = fs.readFileSync(branchPath); } else { branchSHA = branchName; } output.push(branchSHA.slice(0,10)); } } catch (err) { console.error(err.stack); } return output.join('.'); } else { return packageVersion; } }; }); define("container", ["container/container","exports"], function(__dependency1__, __exports__) { "use strict"; /* Public api for the container is still in flux. The public api, specified on the application namespace should be considered the stable api. // @module container @private */ /* Flag to enable/disable model factory injections (disabled by default) If model factory injections are enabled, models should not be accessed globally (only through `container.lookupFactory('model:modelName'))`); */ Ember.MODEL_FACTORY_INJECTIONS = false; if (Ember.ENV && typeof Ember.ENV.MODEL_FACTORY_INJECTIONS !== 'undefined') { Ember.MODEL_FACTORY_INJECTIONS = !!Ember.ENV.MODEL_FACTORY_INJECTIONS; } var Container = __dependency1__["default"]; __exports__["default"] = Container; }); define("container/container", ["container/inheriting_dict","ember-metal/core","exports"], function(__dependency1__, __dependency2__, __exports__) { "use strict"; var InheritingDict = __dependency1__["default"]; var Ember = __dependency2__["default"]; // Ember.assert // A lightweight container that helps to assemble and decouple components. // Public api for the container is still in flux. // The public api, specified on the application namespace should be considered the stable api. function Container(parent) { this.parent = parent; this.children = []; this.resolver = parent && parent.resolver || function() {}; this.registry = new InheritingDict(parent && parent.registry); this.cache = new InheritingDict(parent && parent.cache); this.factoryCache = new InheritingDict(parent && parent.factoryCache); this.resolveCache = new InheritingDict(parent && parent.resolveCache); this.typeInjections = new InheritingDict(parent && parent.typeInjections); this.injections = {}; this.factoryTypeInjections = new InheritingDict(parent && parent.factoryTypeInjections); this.factoryInjections = {}; this._options = new InheritingDict(parent && parent._options); this._typeOptions = new InheritingDict(parent && parent._typeOptions); } Container.prototype = { /** @property parent @type Container @default null */ parent: null, /** @property children @type Array @default [] */ children: null, /** @property resolver @type function */ resolver: null, /** @property registry @type InheritingDict */ registry: null, /** @property cache @type InheritingDict */ cache: null, /** @property typeInjections @type InheritingDict */ typeInjections: null, /** @property injections @type Object @default {} */ injections: null, /** @private @property _options @type InheritingDict @default null */ _options: null, /** @private @property _typeOptions @type InheritingDict */ _typeOptions: null, /** Returns a new child of the current container. These children are configured to correctly inherit from the current container. @method child @return {Container} */ child: function() { var container = new Container(this); this.children.push(container); return container; }, /** Sets a key-value pair on the current container. If a parent container, has the same key, once set on a child, the parent and child will diverge as expected. @method set @param {Object} object @param {String} key @param {any} value */ set: function(object, key, value) { object[key] = value; }, /** Registers a factory for later injection. Example: ```javascript var container = new Container(); container.register('model:user', Person, {singleton: false }); container.register('fruit:favorite', Orange); container.register('communication:main', Email, {singleton: false}); ``` @method register @param {String} fullName @param {Function} factory @param {Object} options */ register: function(fullName, factory, options) { Ember.assert('fullName must be a proper full name', validateFullName(fullName)); if (factory === undefined) { throw new TypeError('Attempting to register an unknown factory: `' + fullName + '`'); } var normalizedName = this.normalize(fullName); if (this.cache.has(normalizedName)) { throw new Error('Cannot re-register: `' + fullName +'`, as it has already been looked up.'); } this.registry.set(normalizedName, factory); this._options.set(normalizedName, options || {}); }, /** Unregister a fullName ```javascript var container = new Container(); container.register('model:user', User); container.lookup('model:user') instanceof User //=> true container.unregister('model:user') container.lookup('model:user') === undefined //=> true ``` @method unregister @param {String} fullName */ unregister: function(fullName) { Ember.assert('fullName must be a proper full name', validateFullName(fullName)); var normalizedName = this.normalize(fullName); this.registry.remove(normalizedName); this.cache.remove(normalizedName); this.factoryCache.remove(normalizedName); this.resolveCache.remove(normalizedName); this._options.remove(normalizedName); }, /** Given a fullName return the corresponding factory. By default `resolve` will retrieve the factory from its container's registry. ```javascript var container = new Container(); container.register('api:twitter', Twitter); container.resolve('api:twitter') // => Twitter ``` Optionally the container can be provided with a custom resolver. If provided, `resolve` will first provide the custom resolver the opportunity to resolve the fullName, otherwise it will fallback to the registry. ```javascript var container = new Container(); container.resolver = function(fullName) { // lookup via the module system of choice }; // the twitter factory is added to the module system container.resolve('api:twitter') // => Twitter ``` @method resolve @param {String} fullName @return {Function} fullName's factory */ resolve: function(fullName) { Ember.assert('fullName must be a proper full name', validateFullName(fullName)); return resolve(this, this.normalize(fullName)); }, /** A hook that can be used to describe how the resolver will attempt to find the factory. For example, the default Ember `.describe` returns the full class name (including namespace) where Ember's resolver expects to find the `fullName`. @method describe @param {String} fullName @return {string} described fullName */ describe: function(fullName) { return fullName; }, /** A hook to enable custom fullName normalization behaviour @method normalize @param {String} fullName @return {string} normalized fullName */ normalize: function(fullName) { return fullName; }, /** @method makeToString @param {any} factory @param {string} fullName @return {function} toString function */ makeToString: function(factory, fullName) { return factory.toString(); }, /** Given a fullName return a corresponding instance. The default behaviour is for lookup to return a singleton instance. The singleton is scoped to the container, allowing multiple containers to all have their own locally scoped singletons. ```javascript var container = new Container(); container.register('api:twitter', Twitter); var twitter = container.lookup('api:twitter'); twitter instanceof Twitter; // => true // by default the container will return singletons var twitter2 = container.lookup('api:twitter'); twitter2 instanceof Twitter; // => true twitter === twitter2; //=> true ``` If singletons are not wanted an optional flag can be provided at lookup. ```javascript var container = new Container(); container.register('api:twitter', Twitter); var twitter = container.lookup('api:twitter', { singleton: false }); var twitter2 = container.lookup('api:twitter', { singleton: false }); twitter === twitter2; //=> false ``` @method lookup @param {String} fullName @param {Object} options @return {any} */ lookup: function(fullName, options) { Ember.assert('fullName must be a proper full name', validateFullName(fullName)); return lookup(this, this.normalize(fullName), options); }, /** Given a fullName return the corresponding factory. @method lookupFactory @param {String} fullName @return {any} */ lookupFactory: function(fullName) { Ember.assert('fullName must be a proper full name', validateFullName(fullName)); return factoryFor(this, this.normalize(fullName)); }, /** Given a fullName check if the container is aware of its factory or singleton instance. @method has @param {String} fullName @return {Boolean} */ has: function(fullName) { Ember.assert('fullName must be a proper full name', validateFullName(fullName)); return has(this, this.normalize(fullName)); }, /** Allow registering options for all factories of a type. ```javascript var container = new Container(); // if all of type `connection` must not be singletons container.optionsForType('connection', { singleton: false }); container.register('connection:twitter', TwitterConnection); container.register('connection:facebook', FacebookConnection); var twitter = container.lookup('connection:twitter'); var twitter2 = container.lookup('connection:twitter'); twitter === twitter2; // => false var facebook = container.lookup('connection:facebook'); var facebook2 = container.lookup('connection:facebook'); facebook === facebook2; // => false ``` @method optionsForType @param {String} type @param {Object} options */ optionsForType: function(type, options) { if (this.parent) { illegalChildOperation('optionsForType'); } this._typeOptions.set(type, options); }, /** @method options @param {String} type @param {Object} options */ options: function(type, options) { this.optionsForType(type, options); }, /** Used only via `injection`. Provides a specialized form of injection, specifically enabling all objects of one type to be injected with a reference to another object. For example, provided each object of type `controller` needed a `router`. one would do the following: ```javascript var container = new Container(); container.register('router:main', Router); container.register('controller:user', UserController); container.register('controller:post', PostController); container.typeInjection('controller', 'router', 'router:main'); var user = container.lookup('controller:user'); var post = container.lookup('controller:post'); user.router instanceof Router; //=> true post.router instanceof Router; //=> true // both controllers share the same router user.router === post.router; //=> true ``` @private @method typeInjection @param {String} type @param {String} property @param {String} fullName */ typeInjection: function(type, property, fullName) { Ember.assert('fullName must be a proper full name', validateFullName(fullName)); if (this.parent) { illegalChildOperation('typeInjection'); } var fullNameType = fullName.split(':')[0]; if(fullNameType === type) { throw new Error('Cannot inject a `' + fullName + '` on other ' + type + '(s). Register the `' + fullName + '` as a different type and perform the typeInjection.'); } addTypeInjection(this.typeInjections, type, property, fullName); }, /** Defines injection rules. These rules are used to inject dependencies onto objects when they are instantiated. Two forms of injections are possible: * Injecting one fullName on another fullName * Injecting one fullName on a type Example: ```javascript var container = new Container(); container.register('source:main', Source); container.register('model:user', User); container.register('model:post', Post); // injecting one fullName on another fullName // eg. each user model gets a post model container.injection('model:user', 'post', 'model:post'); // injecting one fullName on another type container.injection('model', 'source', 'source:main'); var user = container.lookup('model:user'); var post = container.lookup('model:post'); user.source instanceof Source; //=> true post.source instanceof Source; //=> true user.post instanceof Post; //=> true // and both models share the same source user.source === post.source; //=> true ``` @method injection @param {String} factoryName @param {String} property @param {String} injectionName */ injection: function(fullName, property, injectionName) { if (this.parent) { illegalChildOperation('injection'); } validateFullName(injectionName); var normalizedInjectionName = this.normalize(injectionName); if (fullName.indexOf(':') === -1) { return this.typeInjection(fullName, property, normalizedInjectionName); } Ember.assert('fullName must be a proper full name', validateFullName(fullName)); var normalizedName = this.normalize(fullName); if (this.cache.has(normalizedName)) { throw new Error("Attempted to register an injection for a type that has already been looked up. ('" + normalizedName + "', '" + property + "', '" + injectionName + "')"); } addInjection(this.injections, normalizedName, property, normalizedInjectionName); }, /** Used only via `factoryInjection`. Provides a specialized form of injection, specifically enabling all factory of one type to be injected with a reference to another object. For example, provided each factory of type `model` needed a `store`. one would do the following: ```javascript var container = new Container(); container.register('store:main', SomeStore); container.factoryTypeInjection('model', 'store', 'store:main'); var store = container.lookup('store:main'); var UserFactory = container.lookupFactory('model:user'); UserFactory.store instanceof SomeStore; //=> true ``` @private @method factoryTypeInjection @param {String} type @param {String} property @param {String} fullName */ factoryTypeInjection: function(type, property, fullName) { if (this.parent) { illegalChildOperation('factoryTypeInjection'); } addTypeInjection(this.factoryTypeInjections, type, property, this.normalize(fullName)); }, /** Defines factory injection rules. Similar to regular injection rules, but are run against factories, via `Container#lookupFactory`. These rules are used to inject objects onto factories when they are looked up. Two forms of injections are possible: * Injecting one fullName on another fullName * Injecting one fullName on a type Example: ```javascript var container = new Container(); container.register('store:main', Store); container.register('store:secondary', OtherStore); container.register('model:user', User); container.register('model:post', Post); // injecting one fullName on another type container.factoryInjection('model', 'store', 'store:main'); // injecting one fullName on another fullName container.factoryInjection('model:post', 'secondaryStore', 'store:secondary'); var UserFactory = container.lookupFactory('model:user'); var PostFactory = container.lookupFactory('model:post'); var store = container.lookup('store:main'); UserFactory.store instanceof Store; //=> true UserFactory.secondaryStore instanceof OtherStore; //=> false PostFactory.store instanceof Store; //=> true PostFactory.secondaryStore instanceof OtherStore; //=> true // and both models share the same source instance UserFactory.store === PostFactory.store; //=> true ``` @method factoryInjection @param {String} factoryName @param {String} property @param {String} injectionName */ factoryInjection: function(fullName, property, injectionName) { if (this.parent) { illegalChildOperation('injection'); } var normalizedName = this.normalize(fullName); var normalizedInjectionName = this.normalize(injectionName); validateFullName(injectionName); if (fullName.indexOf(':') === -1) { return this.factoryTypeInjection(normalizedName, property, normalizedInjectionName); } Ember.assert('fullName must be a proper full name', validateFullName(fullName)); if (this.factoryCache.has(normalizedName)) { throw new Error('Attempted to register a factoryInjection for a type that has already ' + 'been looked up. (\'' + normalizedName + '\', \'' + property + '\', \'' + injectionName + '\')'); } addInjection(this.factoryInjections, normalizedName, property, normalizedInjectionName); }, /** A depth first traversal, destroying the container, its descendant containers and all their managed objects. @method destroy */ destroy: function() { for (var i = 0, length = this.children.length; i < length; i++) { this.children[i].destroy(); } this.children = []; eachDestroyable(this, function(item) { item.destroy(); }); this.parent = undefined; this.isDestroyed = true; }, /** @method reset */ reset: function() { for (var i = 0, length = this.children.length; i < length; i++) { resetCache(this.children[i]); } resetCache(this); } }; function resolve(container, normalizedName) { var cached = container.resolveCache.get(normalizedName); if (cached) { return cached; } var resolved = container.resolver(normalizedName) || container.registry.get(normalizedName); container.resolveCache.set(normalizedName, resolved); return resolved; } function has(container, fullName){ if (container.cache.has(fullName)) { return true; } return !!container.resolve(fullName); } function lookup(container, fullName, options) { options = options || {}; if (container.cache.has(fullName) && options.singleton !== false) { return container.cache.get(fullName); } var value = instantiate(container, fullName); if (value === undefined) { return; } if (isSingleton(container, fullName) && options.singleton !== false) { container.cache.set(fullName, value); } return value; } function illegalChildOperation(operation) { throw new Error(operation + ' is not currently supported on child containers'); } function isSingleton(container, fullName) { var singleton = option(container, fullName, 'singleton'); return singleton !== false; } function buildInjections(container, injections) { var hash = {}; if (!injections) { return hash; } var injection, injectable; for (var i = 0, length = injections.length; i < length; i++) { injection = injections[i]; injectable = lookup(container, injection.fullName); if (injectable !== undefined) { hash[injection.property] = injectable; } else { throw new Error('Attempting to inject an unknown injection: `' + injection.fullName + '`'); } } return hash; } function option(container, fullName, optionName) { var options = container._options.get(fullName); if (options && options[optionName] !== undefined) { return options[optionName]; } var type = fullName.split(':')[0]; options = container._typeOptions.get(type); if (options) { return options[optionName]; } } function factoryFor(container, fullName) { var cache = container.factoryCache; if (cache.has(fullName)) { return cache.get(fullName); } var factory = container.resolve(fullName); if (factory === undefined) { return; } var type = fullName.split(':')[0]; if (!factory || typeof factory.extend !== 'function' || (!Ember.MODEL_FACTORY_INJECTIONS && type === 'model')) { // TODO: think about a 'safe' merge style extension // for now just fallback to create time injection return factory; } else { var injections = injectionsFor(container, fullName); var factoryInjections = factoryInjectionsFor(container, fullName); factoryInjections._toString = container.makeToString(factory, fullName); var injectedFactory = factory.extend(injections); injectedFactory.reopenClass(factoryInjections); cache.set(fullName, injectedFactory); return injectedFactory; } } function injectionsFor(container, fullName) { var splitName = fullName.split(':'), type = splitName[0], injections = []; injections = injections.concat(container.typeInjections.get(type) || []); injections = injections.concat(container.injections[fullName] || []); injections = buildInjections(container, injections); injections._debugContainerKey = fullName; injections.container = container; return injections; } function factoryInjectionsFor(container, fullName) { var splitName = fullName.split(':'), type = splitName[0], factoryInjections = []; factoryInjections = factoryInjections.concat(container.factoryTypeInjections.get(type) || []); factoryInjections = factoryInjections.concat(container.factoryInjections[fullName] || []); factoryInjections = buildInjections(container, factoryInjections); factoryInjections._debugContainerKey = fullName; return factoryInjections; } function instantiate(container, fullName) { var factory = factoryFor(container, fullName); if (option(container, fullName, 'instantiate') === false) { return factory; } if (factory) { if (typeof factory.create !== 'function') { throw new Error('Failed to create an instance of \'' + fullName + '\'. ' + 'Most likely an improperly defined class or an invalid module export.'); } if (typeof factory.extend === 'function') { // assume the factory was extendable and is already injected return factory.create(); } else { // assume the factory was extendable // to create time injections // TODO: support new'ing for instantiation and merge injections for pure JS Functions return factory.create(injectionsFor(container, fullName)); } } } function eachDestroyable(container, callback) { container.cache.eachLocal(function(key, value) { if (option(container, key, 'instantiate') === false) { return; } callback(value); }); } function resetCache(container) { container.cache.eachLocal(function(key, value) { if (option(container, key, 'instantiate') === false) { return; } value.destroy(); }); container.cache.dict = {}; } function addTypeInjection(rules, type, property, fullName) { var injections = rules.get(type); if (!injections) { injections = []; rules.set(type, injections); } injections.push({ property: property, fullName: fullName }); } var VALID_FULL_NAME_REGEXP = /^[^:]+.+:[^:]+$/; function validateFullName(fullName) { if (!VALID_FULL_NAME_REGEXP.test(fullName)) { throw new TypeError('Invalid Fullname, expected: `type:name` got: ' + fullName); } return true; } function addInjection(rules, factoryName, property, injectionName) { var injections = rules[factoryName] = rules[factoryName] || []; injections.push({ property: property, fullName: injectionName }); } __exports__["default"] = Container; }); define("container/inheriting_dict", ["exports"], function(__exports__) { "use strict"; // A safe and simple inheriting object. function InheritingDict(parent) { this.parent = parent; this.dict = {}; } InheritingDict.prototype = { /** @property parent @type InheritingDict @default null */ parent: null, /** Object used to store the current nodes data. @property dict @type Object @default Object */ dict: null, /** Retrieve the value given a key, if the value is present at the current level use it, otherwise walk up the parent hierarchy and try again. If no matching key is found, return undefined. @method get @param {String} key @return {any} */ get: function(key) { var dict = this.dict; if (dict.hasOwnProperty(key)) { return dict[key]; } if (this.parent) { return this.parent.get(key); } }, /** Set the given value for the given key, at the current level. @method set @param {String} key @param {Any} value */ set: function(key, value) { this.dict[key] = value; }, /** Delete the given key @method remove @param {String} key */ remove: function(key) { delete this.dict[key]; }, /** Check for the existence of given a key, if the key is present at the current level return true, otherwise walk up the parent hierarchy and try again. If no matching key is found, return false. @method has @param {String} key @return {Boolean} */ has: function(key) { var dict = this.dict; if (dict.hasOwnProperty(key)) { return true; } if (this.parent) { return this.parent.has(key); } return false; }, /** Iterate and invoke a callback for each local key-value pair. @method eachLocal @param {Function} callback @param {Object} binding */ eachLocal: function(callback, binding) { var dict = this.dict; for (var prop in dict) { if (dict.hasOwnProperty(prop)) { callback.call(binding, prop, dict[prop]); } } } }; __exports__["default"] = InheritingDict; }); define("ember-application", ["ember-metal/core","ember-runtime/system/lazy_load","ember-application/system/dag","ember-application/system/resolver","ember-application/system/application","ember-application/ext/controller"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__) { "use strict"; var Ember = __dependency1__["default"]; var runLoadHooks = __dependency2__.runLoadHooks; /** Ember Application @module ember @submodule ember-application @requires ember-views, ember-routing */ var DAG = __dependency3__["default"]; var Resolver = __dependency4__.Resolver; var DefaultResolver = __dependency4__["default"]; var Application = __dependency5__["default"]; // side effect of extending ControllerMixin Ember.Application = Application; Ember.DAG = DAG; Ember.Resolver = Resolver; Ember.DefaultResolver = DefaultResolver; runLoadHooks('Ember.Application', Application); }); define("ember-application/ext/controller", ["ember-metal/core","ember-metal/property_get","ember-metal/property_set","ember-metal/error","ember-metal/utils","ember-metal/computed","ember-runtime/mixins/controller","ember-routing/system/controller_for","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__, __exports__) { "use strict"; /** @module ember @submodule ember-application */ var Ember = __dependency1__["default"]; // Ember.assert var get = __dependency2__.get; var set = __dependency3__.set; var EmberError = __dependency4__["default"]; var inspect = __dependency5__.inspect; var computed = __dependency6__.computed; var ControllerMixin = __dependency7__["default"]; var meta = __dependency5__.meta; var controllerFor = __dependency8__["default"]; function verifyNeedsDependencies(controller, container, needs) { var dependency, i, l, missing = []; for (i=0, l=needs.length; i 1 ? 'they' : 'it') + " could not be found"); } } var defaultControllersComputedProperty = computed(function() { var controller = this; return { needs: get(controller, 'needs'), container: get(controller, 'container'), unknownProperty: function(controllerName) { var needs = this.needs, dependency, i, l; for (i=0, l=needs.length; i 0) { Ember.assert(' `' + inspect(this) + ' specifies `needs`, but does ' + "not have a container. Please ensure this controller was " + "instantiated with a container.", this.container || meta(this, false).descs.controllers !== defaultControllersComputedProperty); if (this.container) { verifyNeedsDependencies(this, this.container, needs); } // if needs then initialize controllers proxy get(this, 'controllers'); } this._super.apply(this, arguments); }, /** @method controllerFor @see {Ember.Route#controllerFor} @deprecated Use `needs` instead */ controllerFor: function(controllerName) { Ember.deprecate("Controller#controllerFor is deprecated, please use Controller#needs instead"); return controllerFor(get(this, 'container'), controllerName); }, /** Stores the instances of other controllers available from within this controller. Any controller listed by name in the `needs` property will be accessible by name through this property. ```javascript App.CommentsController = Ember.ArrayController.extend({ needs: ['post'], postTitle: function(){ var currentPost = this.get('controllers.post'); // instance of App.PostController return currentPost.get('title'); }.property('controllers.post.title') }); ``` @see {Ember.ControllerMixin#needs} @property {Object} controllers @default null */ controllers: defaultControllersComputedProperty }); __exports__["default"] = ControllerMixin; }); define("ember-application/system/application", ["ember-metal","ember-metal/property_get","ember-metal/property_set","ember-runtime/system/lazy_load","ember-application/system/dag","ember-runtime/system/namespace","ember-runtime/mixins/deferred","ember-application/system/resolver","ember-metal/platform","ember-metal/run_loop","ember-metal/utils","container/container","ember-runtime/controllers/controller","ember-metal/enumerable_utils","ember-runtime/controllers/object_controller","ember-runtime/controllers/array_controller","ember-views/system/event_dispatcher","ember-views/system/jquery","ember-routing/system/route","ember-routing/system/router","ember-routing/location/hash_location","ember-routing/location/history_location","ember-routing/location/auto_location","ember-routing/location/none_location","ember-routing/system/cache","ember-metal/core","ember-handlebars-compiler","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__, __dependency9__, __dependency10__, __dependency11__, __dependency12__, __dependency13__, __dependency14__, __dependency15__, __dependency16__, __dependency17__, __dependency18__, __dependency19__, __dependency20__, __dependency21__, __dependency22__, __dependency23__, __dependency24__, __dependency25__, __dependency26__, __dependency27__, __exports__) { "use strict"; /** @module ember @submodule ember-application */ var Ember = __dependency1__["default"]; // Ember.FEATURES, Ember.deprecate, Ember.assert, Ember.libraries, LOG_VERSION, Namespace, BOOTED var get = __dependency2__.get; var set = __dependency3__.set; var runLoadHooks = __dependency4__.runLoadHooks; var DAG = __dependency5__["default"]; var Namespace = __dependency6__["default"]; var DeferredMixin = __dependency7__["default"]; var DefaultResolver = __dependency8__["default"]; var create = __dependency9__.create; var run = __dependency10__["default"]; var canInvoke = __dependency11__.canInvoke; var Container = __dependency12__["default"]; var Controller = __dependency13__["default"]; var EnumerableUtils = __dependency14__["default"]; var ObjectController = __dependency15__["default"]; var ArrayController = __dependency16__["default"]; var EventDispatcher = __dependency17__["default"]; //import ContainerDebugAdapter from "ember-extension-support/container_debug_adapter"; var jQuery = __dependency18__["default"]; var Route = __dependency19__["default"]; var Router = __dependency20__["default"]; var HashLocation = __dependency21__["default"]; var HistoryLocation = __dependency22__["default"]; var AutoLocation = __dependency23__["default"]; var NoneLocation = __dependency24__["default"]; var BucketCache = __dependency25__["default"]; var K = __dependency26__.K; var EmberHandlebars = __dependency27__["default"]; var ContainerDebugAdapter; /** An instance of `Ember.Application` is the starting point for every Ember application. It helps to instantiate, initialize and coordinate the many objects that make up your app. Each Ember app has one and only one `Ember.Application` object. In fact, the very first thing you should do in your application is create the instance: ```javascript window.App = Ember.Application.create(); ``` Typically, the application object is the only global variable. All other classes in your app should be properties on the `Ember.Application` instance, which highlights its first role: a global namespace. For example, if you define a view class, it might look like this: ```javascript App.MyView = Ember.View.extend(); ``` By default, calling `Ember.Application.create()` will automatically initialize your application by calling the `Ember.Application.initialize()` method. If you need to delay initialization, you can call your app's `deferReadiness()` method. When you are ready for your app to be initialized, call its `advanceReadiness()` method. You can define a `ready` method on the `Ember.Application` instance, which will be run by Ember when the application is initialized. Because `Ember.Application` inherits from `Ember.Namespace`, any classes you create will have useful string representations when calling `toString()`. See the `Ember.Namespace` documentation for more information. While you can think of your `Ember.Application` as a container that holds the other classes in your application, there are several other responsibilities going on under-the-hood that you may want to understand. ### Event Delegation Ember uses a technique called _event delegation_. This allows the framework to set up a global, shared event listener instead of requiring each view to do it manually. For example, instead of each view registering its own `mousedown` listener on its associated element, Ember sets up a `mousedown` listener on the `body`. If a `mousedown` event occurs, Ember will look at the target of the event and start walking up the DOM node tree, finding corresponding views and invoking their `mouseDown` method as it goes. `Ember.Application` has a number of default events that it listens for, as well as a mapping from lowercase events to camel-cased view method names. For example, the `keypress` event causes the `keyPress` method on the view to be called, the `dblclick` event causes `doubleClick` to be called, and so on. If there is a bubbling browser event that Ember does not listen for by default, you can specify custom events and their corresponding view method names by setting the application's `customEvents` property: ```javascript App = Ember.Application.create({ customEvents: { // add support for the paste event paste: "paste" } }); ``` By default, the application sets up these event listeners on the document body. However, in cases where you are embedding an Ember application inside an existing page, you may want it to set up the listeners on an element inside the body. For example, if only events inside a DOM element with the ID of `ember-app` should be delegated, set your application's `rootElement` property: ```javascript window.App = Ember.Application.create({ rootElement: '#ember-app' }); ``` The `rootElement` can be either a DOM element or a jQuery-compatible selector string. Note that *views appended to the DOM outside the root element will not receive events.* If you specify a custom root element, make sure you only append views inside it! To learn more about the advantages of event delegation and the Ember view layer, and a list of the event listeners that are setup by default, visit the [Ember View Layer guide](http://emberjs.com/guides/understanding-ember/the-view-layer/#toc_event-delegation). ### Initializers Libraries on top of Ember can add initializers, like so: ```javascript Ember.Application.initializer({ name: 'api-adapter', initialize: function(container, application) { application.register('api-adapter:main', ApiAdapter); } }); ``` Initializers provide an opportunity to access the container, which organizes the different components of an Ember application. Additionally they provide a chance to access the instantiated application. Beyond being used for libraries, initializers are also a great way to organize dependency injection or setup in your own application. ### Routing In addition to creating your application's router, `Ember.Application` is also responsible for telling the router when to start routing. Transitions between routes can be logged with the `LOG_TRANSITIONS` flag, and more detailed intra-transition logging can be logged with the `LOG_TRANSITIONS_INTERNAL` flag: ```javascript window.App = Ember.Application.create({ LOG_TRANSITIONS: true, // basic logging of successful transitions LOG_TRANSITIONS_INTERNAL: true // detailed logging of all routing steps }); ``` By default, the router will begin trying to translate the current URL into application state once the browser emits the `DOMContentReady` event. If you need to defer routing, you can call the application's `deferReadiness()` method. Once routing can begin, call the `advanceReadiness()` method. If there is any setup required before routing begins, you can implement a `ready()` method on your app that will be invoked immediately before routing begins. ``` @class Application @namespace Ember @extends Ember.Namespace */ var Application = Namespace.extend(DeferredMixin, { _suppressDeferredDeprecation: true, /** The root DOM element of the Application. This can be specified as an element or a [jQuery-compatible selector string](http://api.jquery.com/category/selectors/). This is the element that will be passed to the Application's, `eventDispatcher`, which sets up the listeners for event delegation. Every view in your application should be a child of the element you specify here. @property rootElement @type DOMElement @default 'body' */ rootElement: 'body', /** The `Ember.EventDispatcher` responsible for delegating events to this application's views. The event dispatcher is created by the application at initialization time and sets up event listeners on the DOM element described by the application's `rootElement` property. See the documentation for `Ember.EventDispatcher` for more information. @property eventDispatcher @type Ember.EventDispatcher @default null */ eventDispatcher: null, /** The DOM events for which the event dispatcher should listen. By default, the application's `Ember.EventDispatcher` listens for a set of standard DOM events, such as `mousedown` and `keyup`, and delegates them to your application's `Ember.View` instances. If you would like additional bubbling events to be delegated to your views, set your `Ember.Application`'s `customEvents` property to a hash containing the DOM event name as the key and the corresponding view method name as the value. For example: ```javascript App = Ember.Application.create({ customEvents: { // add support for the paste event paste: "paste" } }); ``` @property customEvents @type Object @default null */ customEvents: null, // Start off the number of deferrals at 1. This will be // decremented by the Application's own `initialize` method. _readinessDeferrals: 1, init: function() { if (!this.$) { this.$ = jQuery; } this.__container__ = this.buildContainer(); this.Router = this.defaultRouter(); this._super(); this.scheduleInitialize(); Ember.libraries.registerCoreLibrary('Handlebars', EmberHandlebars.VERSION); Ember.libraries.registerCoreLibrary('jQuery', jQuery().jquery); if ( Ember.LOG_VERSION ) { Ember.LOG_VERSION = false; // we only need to see this once per Application#init var nameLengths = EnumerableUtils.map(Ember.libraries, function(item) { return get(item, "name.length"); }); var maxNameLength = Math.max.apply(this, nameLengths); Ember.debug('-------------------------------'); Ember.libraries.each(function(name, version) { var spaces = new Array(maxNameLength - name.length + 1).join(" "); Ember.debug([name, spaces, ' : ', version].join("")); }); Ember.debug('-------------------------------'); } }, /** Build the container for the current application. Also register a default application view in case the application itself does not. @private @method buildContainer @return {Ember.Container} the configured container */ buildContainer: function() { var container = this.__container__ = Application.buildContainer(this); return container; }, /** If the application has not opted out of routing and has not explicitly defined a router, supply a default router for the application author to configure. This allows application developers to do: ```javascript var App = Ember.Application.create(); App.Router.map(function() { this.resource('posts'); }); ``` @private @method defaultRouter @return {Ember.Router} the default router */ defaultRouter: function() { if (this.Router === false) { return; } var container = this.__container__; if (this.Router) { container.unregister('router:main'); container.register('router:main', this.Router); } return container.lookupFactory('router:main'); }, /** Automatically initialize the application once the DOM has become ready. The initialization itself is scheduled on the actions queue which ensures that application loading finishes before booting. If you are asynchronously loading code, you should call `deferReadiness()` to defer booting, and then call `advanceReadiness()` once all of your code has finished loading. @private @method scheduleInitialize */ scheduleInitialize: function() { var self = this; if (!this.$ || this.$.isReady) { run.schedule('actions', self, '_initialize'); } else { this.$().ready(function runInitialize() { run(self, '_initialize'); }); } }, /** Use this to defer readiness until some condition is true. Example: ```javascript App = Ember.Application.create(); App.deferReadiness(); jQuery.getJSON("/auth-token", function(token) { App.token = token; App.advanceReadiness(); }); ``` This allows you to perform asynchronous setup logic and defer booting your application until the setup has finished. However, if the setup requires a loading UI, it might be better to use the router for this purpose. @method deferReadiness */ deferReadiness: function() { Ember.assert("You must call deferReadiness on an instance of Ember.Application", this instanceof Application); Ember.assert("You cannot defer readiness since the `ready()` hook has already been called.", this._readinessDeferrals > 0); this._readinessDeferrals++; }, /** Call `advanceReadiness` after any asynchronous setup logic has completed. Each call to `deferReadiness` must be matched by a call to `advanceReadiness` or the application will never become ready and routing will not begin. @method advanceReadiness @see {Ember.Application#deferReadiness} */ advanceReadiness: function() { Ember.assert("You must call advanceReadiness on an instance of Ember.Application", this instanceof Application); this._readinessDeferrals--; if (this._readinessDeferrals === 0) { run.once(this, this.didBecomeReady); } }, /** Registers a factory that can be used for dependency injection (with `App.inject`) or for service lookup. Each factory is registered with a full name including two parts: `type:name`. A simple example: ```javascript var App = Ember.Application.create(); App.Orange = Ember.Object.extend(); App.register('fruit:favorite', App.Orange); ``` Ember will resolve factories from the `App` namespace automatically. For example `App.CarsController` will be discovered and returned if an application requests `controller:cars`. An example of registering a controller with a non-standard name: ```javascript var App = Ember.Application.create(), Session = Ember.Controller.extend(); App.register('controller:session', Session); // The Session controller can now be treated like a normal controller, // despite its non-standard name. App.ApplicationController = Ember.Controller.extend({ needs: ['session'] }); ``` Registered factories are **instantiated** by having `create` called on them. Additionally they are **singletons**, each time they are looked up they return the same instance. Some examples modifying that default behavior: ```javascript var App = Ember.Application.create(); App.Person = Ember.Object.extend(); App.Orange = Ember.Object.extend(); App.Email = Ember.Object.extend(); App.session = Ember.Object.create(); App.register('model:user', App.Person, {singleton: false }); App.register('fruit:favorite', App.Orange); App.register('communication:main', App.Email, {singleton: false}); App.register('session', App.session, {instantiate: false}); ``` @method register @param fullName {String} type:name (e.g., 'model:user') @param factory {Function} (e.g., App.Person) @param options {Object} (optional) disable instantiation or singleton usage **/ register: function() { var container = this.__container__; container.register.apply(container, arguments); }, /** Define a dependency injection onto a specific factory or all factories of a type. When Ember instantiates a controller, view, or other framework component it can attach a dependency to that component. This is often used to provide services to a set of framework components. An example of providing a session object to all controllers: ```javascript var App = Ember.Application.create(), Session = Ember.Object.extend({ isAuthenticated: false }); // A factory must be registered before it can be injected App.register('session:main', Session); // Inject 'session:main' onto all factories of the type 'controller' // with the name 'session' App.inject('controller', 'session', 'session:main'); App.IndexController = Ember.Controller.extend({ isLoggedIn: Ember.computed.alias('session.isAuthenticated') }); ``` Injections can also be performed on specific factories. ```javascript App.inject(, , ) App.inject('route', 'source', 'source:main') App.inject('route:application', 'email', 'model:email') ``` It is important to note that injections can only be performed on classes that are instantiated by Ember itself. Instantiating a class directly (via `create` or `new`) bypasses the dependency injection system. Ember-Data instantiates its models in a unique manner, and consequently injections onto models (or all models) will not work as expected. Injections on models can be enabled by setting `Ember.MODEL_FACTORY_INJECTIONS` to `true`. @method inject @param factoryNameOrType {String} @param property {String} @param injectionName {String} **/ inject: function() { var container = this.__container__; container.injection.apply(container, arguments); }, /** Calling initialize manually is not supported. Please see Ember.Application#advanceReadiness and Ember.Application#deferReadiness. @private @deprecated @method initialize **/ initialize: function() { Ember.deprecate('Calling initialize manually is not supported. Please see Ember.Application#advanceReadiness and Ember.Application#deferReadiness'); }, /** Initialize the application. This happens automatically. Run any initializers and run the application load hook. These hooks may choose to defer readiness. For example, an authentication hook might want to defer readiness until the auth token has been retrieved. @private @method _initialize */ _initialize: function() { if (this.isDestroyed) { return; } // At this point, the App.Router must already be assigned if (this.Router) { var container = this.__container__; container.unregister('router:main'); container.register('router:main', this.Router); } this.runInitializers(); runLoadHooks('application', this); // At this point, any initializers or load hooks that would have wanted // to defer readiness have fired. In general, advancing readiness here // will proceed to didBecomeReady. this.advanceReadiness(); return this; }, /** Reset the application. This is typically used only in tests. It cleans up the application in the following order: 1. Deactivate existing routes 2. Destroy all objects in the container 3. Create a new application container 4. Re-route to the existing url Typical Example: ```javascript var App; run(function() { App = Ember.Application.create(); }); module("acceptance test", { setup: function() { App.reset(); } }); test("first test", function() { // App is freshly reset }); test("first test", function() { // App is again freshly reset }); ``` Advanced Example: Occasionally you may want to prevent the app from initializing during setup. This could enable extra configuration, or enable asserting prior to the app becoming ready. ```javascript var App; run(function() { App = Ember.Application.create(); }); module("acceptance test", { setup: function() { run(function() { App.reset(); App.deferReadiness(); }); } }); test("first test", function() { ok(true, 'something before app is initialized'); run(function() { App.advanceReadiness(); }); ok(true, 'something after app is initialized'); }); ``` @method reset **/ reset: function() { this._readinessDeferrals = 1; function handleReset() { var router = this.__container__.lookup('router:main'); router.reset(); run(this.__container__, 'destroy'); this.buildContainer(); run.schedule('actions', this, function() { this._initialize(); }); } run.join(this, handleReset); }, /** @private @method runInitializers */ runInitializers: function() { var initializers = get(this.constructor, 'initializers'); var container = this.__container__; var graph = new DAG(); var namespace = this; var name, initializer; for (name in initializers) { initializer = initializers[name]; graph.addEdges(initializer.name, initializer.initialize, initializer.before, initializer.after); } graph.topsort(function (vertex) { var initializer = vertex.value; Ember.assert("No application initializer named '"+vertex.name+"'", initializer); initializer(container, namespace); }); }, /** @private @method didBecomeReady */ didBecomeReady: function() { this.setupEventDispatcher(); this.ready(); // user hook this.startRouting(); if (!Ember.testing) { // Eagerly name all classes that are already loaded Ember.Namespace.processAll(); Ember.BOOTED = true; } this.resolve(this); }, /** Setup up the event dispatcher to receive events on the application's `rootElement` with any registered `customEvents`. @private @method setupEventDispatcher */ setupEventDispatcher: function() { var customEvents = get(this, 'customEvents'); var rootElement = get(this, 'rootElement'); var dispatcher = this.__container__.lookup('event_dispatcher:main'); set(this, 'eventDispatcher', dispatcher); dispatcher.setup(customEvents, rootElement); }, /** If the application has a router, use it to route to the current URL, and trigger a new call to `route` whenever the URL changes. @private @method startRouting @property router {Ember.Router} */ startRouting: function() { var router = this.__container__.lookup('router:main'); if (!router) { return; } router.startRouting(); }, handleURL: function(url) { var router = this.__container__.lookup('router:main'); router.handleURL(url); }, /** Called when the Application has become ready. The call will be delayed until the DOM has become ready. @event ready */ ready: K, /** @deprecated Use 'Resolver' instead Set this to provide an alternate class to `Ember.DefaultResolver` @property resolver */ resolver: null, /** Set this to provide an alternate class to `Ember.DefaultResolver` @property resolver */ Resolver: null, willDestroy: function() { Ember.BOOTED = false; // Ensure deactivation of routes before objects are destroyed this.__container__.lookup('router:main').reset(); this.__container__.destroy(); }, initializer: function(options) { this.constructor.initializer(options); }, /** @method then @private @deprecated */ then: function() { Ember.deprecate('Do not use `.then` on an instance of Ember.Application. Please use the `.ready` hook instead.'); this._super.apply(this, arguments); } }); Application.reopenClass({ initializers: {}, /** Initializer receives an object which has the following attributes: `name`, `before`, `after`, `initialize`. The only required attribute is `initialize, all others are optional. * `name` allows you to specify under which name the initializer is registered. This must be a unique name, as trying to register two initializers with the same name will result in an error. ```javascript Ember.Application.initializer({ name: 'namedInitializer', initialize: function(container, application) { Ember.debug("Running namedInitializer!"); } }); ``` * `before` and `after` are used to ensure that this initializer is ran prior or after the one identified by the value. This value can be a single string or an array of strings, referencing the `name` of other initializers. An example of ordering initializers, we create an initializer named `first`: ```javascript Ember.Application.initializer({ name: 'first', initialize: function(container, application) { Ember.debug("First initializer!"); } }); // DEBUG: First initializer! ``` We add another initializer named `second`, specifying that it should run after the initializer named `first`: ```javascript Ember.Application.initializer({ name: 'second', after: 'first', initialize: function(container, application) { Ember.debug("Second initializer!"); } }); // DEBUG: First initializer! // DEBUG: Second initializer! ``` Afterwards we add a further initializer named `pre`, this time specifying that it should run before the initializer named `first`: ```javascript Ember.Application.initializer({ name: 'pre', before: 'first', initialize: function(container, application) { Ember.debug("Pre initializer!"); } }); // DEBUG: Pre initializer! // DEBUG: First initializer! // DEBUG: Second initializer! ``` Finally we add an initializer named `post`, specifying it should run after both the `first` and the `second` initializers: ```javascript Ember.Application.initializer({ name: 'post', after: ['first', 'second'], initialize: function(container, application) { Ember.debug("Post initializer!"); } }); // DEBUG: Pre initializer! // DEBUG: First initializer! // DEBUG: Second initializer! // DEBUG: Post initializer! ``` * `initialize` is a callback function that receives two arguments, `container` and `application` on which you can operate. Example of using `container` to preload data into the store: ```javascript Ember.Application.initializer({ name: "preload-data", initialize: function(container, application) { var store = container.lookup('store:main'); store.pushPayload(preloadedData); } }); ``` Example of using `application` to register an adapter: ```javascript Ember.Application.initializer({ name: 'api-adapter', initialize: function(container, application) { application.register('api-adapter:main', ApiAdapter); } }); ``` @method initializer @param initializer {Object} */ initializer: function(initializer) { // If this is the first initializer being added to a subclass, we are going to reopen the class // to make sure we have a new `initializers` object, which extends from the parent class' using // prototypal inheritance. Without this, attempting to add initializers to the subclass would // pollute the parent class as well as other subclasses. if (this.superclass.initializers !== undefined && this.superclass.initializers === this.initializers) { this.reopenClass({ initializers: create(this.initializers) }); } Ember.assert("The initializer '" + initializer.name + "' has already been registered", !this.initializers[initializer.name]); Ember.assert("An initializer cannot be registered without an initialize function", canInvoke(initializer, 'initialize')); this.initializers[initializer.name] = initializer; }, /** This creates a container with the default Ember naming conventions. It also configures the container: * registered views are created every time they are looked up (they are not singletons) * registered templates are not factories; the registered value is returned directly. * the router receives the application as its `namespace` property * all controllers receive the router as their `target` and `controllers` properties * all controllers receive the application as their `namespace` property * the application view receives the application controller as its `controller` property * the application view receives the application template as its `defaultTemplate` property @private @method buildContainer @static @param {Ember.Application} namespace the application to build the container for. @return {Ember.Container} the built container */ buildContainer: function(namespace) { var container = new Container(); container.set = set; container.resolver = resolverFor(namespace); container.normalize = container.resolver.normalize; container.describe = container.resolver.describe; container.makeToString = container.resolver.makeToString; container.optionsForType('component', { singleton: false }); container.optionsForType('view', { singleton: false }); container.optionsForType('template', { instantiate: false }); container.optionsForType('helper', { instantiate: false }); container.register('application:main', namespace, { instantiate: false }); container.register('controller:basic', Controller, { instantiate: false }); container.register('controller:object', ObjectController, { instantiate: false }); container.register('controller:array', ArrayController, { instantiate: false }); container.register('route:basic', Route, { instantiate: false }); container.register('event_dispatcher:main', EventDispatcher); container.register('router:main', Router); container.injection('router:main', 'namespace', 'application:main'); container.register('location:auto', AutoLocation); container.register('location:hash', HashLocation); container.register('location:history', HistoryLocation); container.register('location:none', NoneLocation); container.injection('controller', 'target', 'router:main'); container.injection('controller', 'namespace', 'application:main'); container.register('-bucket-cache:main', BucketCache); container.injection('router', '_bucketCache', '-bucket-cache:main'); container.injection('route', '_bucketCache', '-bucket-cache:main'); container.injection('controller', '_bucketCache', '-bucket-cache:main'); container.injection('route', 'router', 'router:main'); container.injection('location', 'rootURL', '-location-setting:root-url'); // DEBUGGING container.register('resolver-for-debugging:main', container.resolver.__resolver__, { instantiate: false }); container.injection('container-debug-adapter:main', 'resolver', 'resolver-for-debugging:main'); container.injection('data-adapter:main', 'containerDebugAdapter', 'container-debug-adapter:main'); // Custom resolver authors may want to register their own ContainerDebugAdapter with this key // ES6TODO: resolve this via import once ember-application package is ES6'ed if (!ContainerDebugAdapter) { ContainerDebugAdapter = requireModule('ember-extension-support/container_debug_adapter')['default']; } container.register('container-debug-adapter:main', ContainerDebugAdapter); return container; } }); /** This function defines the default lookup rules for container lookups: * templates are looked up on `Ember.TEMPLATES` * other names are looked up on the application after classifying the name. For example, `controller:post` looks up `App.PostController` by default. * if the default lookup fails, look for registered classes on the container This allows the application to register default injections in the container that could be overridden by the normal naming convention. @private @method resolverFor @param {Ember.Namespace} namespace the namespace to look for classes @return {*} the resolved value for a given lookup */ function resolverFor(namespace) { if (namespace.get('resolver')) { Ember.deprecate('Application.resolver is deprecated in favor of Application.Resolver', false); } var ResolverClass = namespace.get('resolver') || namespace.get('Resolver') || DefaultResolver; var resolver = ResolverClass.create({ namespace: namespace }); function resolve(fullName) { return resolver.resolve(fullName); } resolve.describe = function(fullName) { return resolver.lookupDescription(fullName); }; resolve.makeToString = function(factory, fullName) { return resolver.makeToString(factory, fullName); }; resolve.normalize = function(fullName) { if (resolver.normalize) { return resolver.normalize(fullName); } else { Ember.deprecate('The Resolver should now provide a \'normalize\' function', false); return fullName; } }; resolve.__resolver__ = resolver; return resolve; } __exports__["default"] = Application; }); define("ember-application/system/dag", ["ember-metal/error","exports"], function(__dependency1__, __exports__) { "use strict"; var EmberError = __dependency1__["default"]; function visit(vertex, fn, visited, path) { var name = vertex.name; var vertices = vertex.incoming; var names = vertex.incomingNames; var len = names.length; var i; if (!visited) { visited = {}; } if (!path) { path = []; } if (visited.hasOwnProperty(name)) { return; } path.push(name); visited[name] = true; for (i = 0; i < len; i++) { visit(vertices[names[i]], fn, visited, path); } fn(vertex, path); path.pop(); } /** * DAG stands for Directed acyclic graph. * * It is used to build a graph of dependencies checking that there isn't circular * dependencies. p.e Registering initializers with a certain precedence order. * * @class DAG * @constructor */ function DAG() { this.names = []; this.vertices = {}; } /** * Adds a vertex entry to the graph unless it is already added. * * @private * @method add * @param {String} name The name of the vertex to add */ DAG.prototype.add = function(name) { if (!name) { return; } if (this.vertices.hasOwnProperty(name)) { return this.vertices[name]; } var vertex = { name: name, incoming: {}, incomingNames: [], hasOutgoing: false, value: null }; this.vertices[name] = vertex; this.names.push(name); return vertex; }; /** * Adds a vertex to the graph and sets its value. * * @private * @method map * @param {String} name The name of the vertex. * @param value The value to put in the vertex. */ DAG.prototype.map = function(name, value) { this.add(name).value = value; }; /** * Connects the vertices with the given names, adding them to the graph if * necesary, only if this does not produce is any circular dependency. * * @private * @method addEdge * @param {String} fromName The name the vertex where the edge starts. * @param {String} toName The name the vertex where the edge ends. */ DAG.prototype.addEdge = function(fromName, toName) { if (!fromName || !toName || fromName === toName) { return; } var from = this.add(fromName), to = this.add(toName); if (to.incoming.hasOwnProperty(fromName)) { return; } function checkCycle(vertex, path) { if (vertex.name === toName) { throw new EmberError("cycle detected: " + toName + " <- " + path.join(" <- ")); } } visit(from, checkCycle); from.hasOutgoing = true; to.incoming[fromName] = from; to.incomingNames.push(fromName); }; /** * Visits all the vertex of the graph calling the given function with each one, * ensuring that the vertices are visited respecting their precedence. * * @method topsort * @param {Function} fn The function to be invoked on each vertex. */ DAG.prototype.topsort = function(fn) { var visited = {}; var vertices = this.vertices; var names = this.names; var len = names.length; var i, vertex; for (i = 0; i < len; i++) { vertex = vertices[names[i]]; if (!vertex.hasOutgoing) { visit(vertex, fn, visited); } } }; /** * Adds a vertex with the given name and value to the graph and joins it with the * vertices referenced in _before_ and _after_. If there isn't vertices with those * names, they are added too. * * If either _before_ or _after_ are falsy/empty, the added vertex will not have * an incoming/outgoing edge. * * @method addEdges * @param {String} name The name of the vertex to be added. * @param value The value of that vertex. * @param before An string or array of strings with the names of the vertices before * which this vertex must be visited. * @param after An string or array of strings with the names of the vertex after * which this vertex must be visited. * */ DAG.prototype.addEdges = function(name, value, before, after) { var i; this.map(name, value); if (before) { if (typeof before === 'string') { this.addEdge(name, before); } else { for (i = 0; i < before.length; i++) { this.addEdge(name, before[i]); } } } if (after) { if (typeof after === 'string') { this.addEdge(after, name); } else { for (i = 0; i < after.length; i++) { this.addEdge(after[i], name); } } } }; __exports__["default"] = DAG; }); define("ember-application/system/resolver", ["ember-metal/core","ember-metal/property_get","ember-metal/logger","ember-runtime/system/string","ember-runtime/system/object","ember-runtime/system/namespace","ember-handlebars","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __exports__) { "use strict"; /** @module ember @submodule ember-application */ var Ember = __dependency1__["default"]; // Ember.TEMPLATES, Ember.assert var get = __dependency2__.get; var Logger = __dependency3__["default"]; var classify = __dependency4__.classify; var capitalize = __dependency4__.capitalize; var decamelize = __dependency4__.decamelize; var EmberObject = __dependency5__["default"]; var Namespace = __dependency6__["default"]; var EmberHandlebars = __dependency7__["default"]; var Resolver = EmberObject.extend({ /** This will be set to the Application instance when it is created. @property namespace */ namespace: null, normalize: Ember.required(Function), resolve: Ember.required(Function), parseName: Ember.required(Function), lookupDescription: Ember.required(Function), makeToString: Ember.required(Function), resolveOther: Ember.required(Function), _logLookup: Ember.required(Function) }); __exports__.Resolver = Resolver; /** The DefaultResolver defines the default lookup rules to resolve container lookups before consulting the container for registered items: * templates are looked up on `Ember.TEMPLATES` * other names are looked up on the application after converting the name. For example, `controller:post` looks up `App.PostController` by default. * there are some nuances (see examples below) ### How Resolving Works The container calls this object's `resolve` method with the `fullName` argument. It first parses the fullName into an object using `parseName`. Then it checks for the presence of a type-specific instance method of the form `resolve[Type]` and calls it if it exists. For example if it was resolving 'template:post', it would call the `resolveTemplate` method. Its last resort is to call the `resolveOther` method. The methods of this object are designed to be easy to override in a subclass. For example, you could enhance how a template is resolved like so: ```javascript App = Ember.Application.create({ Resolver: Ember.DefaultResolver.extend({ resolveTemplate: function(parsedName) { var resolvedTemplate = this._super(parsedName); if (resolvedTemplate) { return resolvedTemplate; } return Ember.TEMPLATES['not_found']; } }) }); ``` Some examples of how names are resolved: ``` 'template:post' //=> Ember.TEMPLATES['post'] 'template:posts/byline' //=> Ember.TEMPLATES['posts/byline'] 'template:posts.byline' //=> Ember.TEMPLATES['posts/byline'] 'template:blogPost' //=> Ember.TEMPLATES['blogPost'] // OR // Ember.TEMPLATES['blog_post'] 'controller:post' //=> App.PostController 'controller:posts.index' //=> App.PostsIndexController 'controller:blog/post' //=> Blog.PostController 'controller:basic' //=> Ember.Controller 'route:post' //=> App.PostRoute 'route:posts.index' //=> App.PostsIndexRoute 'route:blog/post' //=> Blog.PostRoute 'route:basic' //=> Ember.Route 'view:post' //=> App.PostView 'view:posts.index' //=> App.PostsIndexView 'view:blog/post' //=> Blog.PostView 'view:basic' //=> Ember.View 'foo:post' //=> App.PostFoo 'model:post' //=> App.Post ``` @class DefaultResolver @namespace Ember @extends Ember.Object */ __exports__["default"] = EmberObject.extend({ /** This will be set to the Application instance when it is created. @property namespace */ namespace: null, normalize: function(fullName) { var split = fullName.split(':', 2), type = split[0], name = split[1]; Ember.assert("Tried to normalize a container name without a colon (:) in it. You probably tried to lookup a name that did not contain a type, a colon, and a name. A proper lookup name would be `view:post`.", split.length === 2); if (type !== 'template') { var result = name; if (result.indexOf('.') > -1) { result = result.replace(/\.(.)/g, function(m) { return m.charAt(1).toUpperCase(); }); } if (name.indexOf('_') > -1) { result = result.replace(/_(.)/g, function(m) { return m.charAt(1).toUpperCase(); }); } return type + ':' + result; } else { return fullName; } }, /** This method is called via the container's resolver method. It parses the provided `fullName` and then looks up and returns the appropriate template or class. @method resolve @param {String} fullName the lookup string @return {Object} the resolved factory */ resolve: function(fullName) { var parsedName = this.parseName(fullName), resolveMethodName = parsedName.resolveMethodName, resolved; if (!(parsedName.name && parsedName.type)) { throw new TypeError('Invalid fullName: `' + fullName + '`, must be of the form `type:name` '); } if (this[resolveMethodName]) { resolved = this[resolveMethodName](parsedName); } if (!resolved) { resolved = this.resolveOther(parsedName); } if (parsedName.root && parsedName.root.LOG_RESOLVER) { this._logLookup(resolved, parsedName); } return resolved; }, /** Convert the string name of the form 'type:name' to a Javascript object with the parsed aspects of the name broken out. @protected @param {String} fullName the lookup string @method parseName */ parseName: function(fullName) { var nameParts = fullName.split(':'), type = nameParts[0], fullNameWithoutType = nameParts[1], name = fullNameWithoutType, namespace = get(this, 'namespace'), root = namespace; if (type !== 'template' && name.indexOf('/') !== -1) { var parts = name.split('/'); name = parts[parts.length - 1]; var namespaceName = capitalize(parts.slice(0, -1).join('.')); root = Namespace.byName(namespaceName); Ember.assert('You are looking for a ' + name + ' ' + type + ' in the ' + namespaceName + ' namespace, but the namespace could not be found', root); } return { fullName: fullName, type: type, fullNameWithoutType: fullNameWithoutType, name: name, root: root, resolveMethodName: 'resolve' + classify(type) }; }, /** Returns a human-readable description for a fullName. Used by the Application namespace in assertions to describe the precise name of the class that Ember is looking for, rather than container keys. @protected @param {String} fullName the lookup string @method lookupDescription */ lookupDescription: function(fullName) { var parsedName = this.parseName(fullName); if (parsedName.type === 'template') { return 'template at ' + parsedName.fullNameWithoutType.replace(/\./g, '/'); } var description = parsedName.root + '.' + classify(parsedName.name); if (parsedName.type !== 'model') { description += classify(parsedName.type); } return description; }, makeToString: function(factory, fullName) { return factory.toString(); }, /** Given a parseName object (output from `parseName`), apply the conventions expected by `Ember.Router` @protected @param {Object} parsedName a parseName object with the parsed fullName lookup string @method useRouterNaming */ useRouterNaming: function(parsedName) { parsedName.name = parsedName.name.replace(/\./g, '_'); if (parsedName.name === 'basic') { parsedName.name = ''; } }, /** Look up the template in Ember.TEMPLATES @protected @param {Object} parsedName a parseName object with the parsed fullName lookup string @method resolveTemplate */ resolveTemplate: function(parsedName) { var templateName = parsedName.fullNameWithoutType.replace(/\./g, '/'); if (Ember.TEMPLATES[templateName]) { return Ember.TEMPLATES[templateName]; } templateName = decamelize(templateName); if (Ember.TEMPLATES[templateName]) { return Ember.TEMPLATES[templateName]; } }, /** Lookup the view using `resolveOther` @protected @param {Object} parsedName a parseName object with the parsed fullName lookup string @method resolveView */ resolveView: function(parsedName) { this.useRouterNaming(parsedName); return this.resolveOther(parsedName); }, /** Lookup the controller using `resolveOther` @protected @param {Object} parsedName a parseName object with the parsed fullName lookup string @method resolveController */ resolveController: function(parsedName) { this.useRouterNaming(parsedName); return this.resolveOther(parsedName); }, /** Lookup the route using `resolveOther` @protected @param {Object} parsedName a parseName object with the parsed fullName lookup string @method resolveRoute */ resolveRoute: function(parsedName) { this.useRouterNaming(parsedName); return this.resolveOther(parsedName); }, /** Lookup the model on the Application namespace @protected @param {Object} parsedName a parseName object with the parsed fullName lookup string @method resolveModel */ resolveModel: function(parsedName) { var className = classify(parsedName.name); var factory = get(parsedName.root, className); if (factory) { return factory; } }, /** Look up the specified object (from parsedName) on the appropriate namespace (usually on the Application) @protected @param {Object} parsedName a parseName object with the parsed fullName lookup string @method resolveHelper */ resolveHelper: function(parsedName) { return this.resolveOther(parsedName) || EmberHandlebars.helpers[parsedName.fullNameWithoutType]; }, /** Look up the specified object (from parsedName) on the appropriate namespace (usually on the Application) @protected @param {Object} parsedName a parseName object with the parsed fullName lookup string @method resolveOther */ resolveOther: function(parsedName) { var className = classify(parsedName.name) + classify(parsedName.type); var factory = get(parsedName.root, className); if (factory) { return factory; } }, /** @method _logLookup @param {Boolean} found @param {Object} parsedName @private */ _logLookup: function(found, parsedName) { var symbol, padding; if (found) { symbol = '[✓]'; } else { symbol = '[ ]'; } if (parsedName.fullName.length > 60) { padding = '.'; } else { padding = new Array(60 - parsedName.fullName.length).join('.'); } Logger.info(symbol, parsedName.fullName, padding, this.lookupDescription(parsedName.fullName)); } }); }); define("ember-debug", ["ember-metal/core","ember-metal/error","ember-metal/logger"], function(__dependency1__, __dependency2__, __dependency3__) { "use strict"; /*global __fail__*/ var Ember = __dependency1__["default"]; var EmberError = __dependency2__["default"]; var Logger = __dependency3__["default"]; /** Ember Debug @module ember @submodule ember-debug */ /** @class Ember */ /** Define an assertion that will throw an exception if the condition is not met. Ember build tools will remove any calls to `Ember.assert()` when doing a production build. Example: ```javascript // Test for truthiness Ember.assert('Must pass a valid object', obj); // Fail unconditionally Ember.assert('This code path should never be run'); ``` @method assert @param {String} desc A description of the assertion. This will become the text of the Error thrown if the assertion fails. @param {Boolean} test Must be truthy for the assertion to pass. If falsy, an exception will be thrown. */ Ember.assert = function(desc, test) { if (!test) { throw new EmberError("Assertion Failed: " + desc); } }; /** Display a warning with the provided message. Ember build tools will remove any calls to `Ember.warn()` when doing a production build. @method warn @param {String} message A warning to display. @param {Boolean} test An optional boolean. If falsy, the warning will be displayed. */ Ember.warn = function(message, test) { if (!test) { Logger.warn("WARNING: "+message); if ('trace' in Logger) Logger.trace(); } }; /** Display a debug notice. Ember build tools will remove any calls to `Ember.debug()` when doing a production build. ```javascript Ember.debug('I\'m a debug notice!'); ``` @method debug @param {String} message A debug message to display. */ Ember.debug = function(message) { Logger.debug("DEBUG: "+message); }; /** Display a deprecation warning with the provided message and a stack trace (Chrome and Firefox only). Ember build tools will remove any calls to `Ember.deprecate()` when doing a production build. @method deprecate @param {String} message A description of the deprecation. @param {Boolean} test An optional boolean. If falsy, the deprecation will be displayed. */ Ember.deprecate = function(message, test) { if (test) { return; } if (Ember.ENV.RAISE_ON_DEPRECATION) { throw new EmberError(message); } var error; // When using new Error, we can't do the arguments check for Chrome. Alternatives are welcome try { __fail__.fail(); } catch (e) { error = e; } if (Ember.LOG_STACKTRACE_ON_DEPRECATION && error.stack) { var stack, stackStr = ''; if (error['arguments']) { // Chrome stack = error.stack.replace(/^\s+at\s+/gm, ''). replace(/^([^\(]+?)([\n$])/gm, '{anonymous}($1)$2'). replace(/^Object.\s*\(([^\)]+)\)/gm, '{anonymous}($1)').split('\n'); stack.shift(); } else { // Firefox stack = error.stack.replace(/(?:\n@:0)?\s+$/m, ''). replace(/^\(/gm, '{anonymous}(').split('\n'); } stackStr = "\n " + stack.slice(2).join("\n "); message = message + stackStr; } Logger.warn("DEPRECATION: "+message); }; /** Alias an old, deprecated method with its new counterpart. Display a deprecation warning with the provided message and a stack trace (Chrome and Firefox only) when the assigned method is called. Ember build tools will not remove calls to `Ember.deprecateFunc()`, though no warnings will be shown in production. ```javascript Ember.oldMethod = Ember.deprecateFunc('Please use the new, updated method', Ember.newMethod); ``` @method deprecateFunc @param {String} message A description of the deprecation. @param {Function} func The new function called to replace its deprecated counterpart. @return {Function} a new function that wrapped the original function with a deprecation warning */ Ember.deprecateFunc = function(message, func) { return function() { Ember.deprecate(message); return func.apply(this, arguments); }; }; /** Run a function meant for debugging. Ember build tools will remove any calls to `Ember.runInDebug()` when doing a production build. ```javascript Ember.runInDebug(function() { Ember.Handlebars.EachView.reopen({ didInsertElement: function() { console.log('I\'m happy'); } }); }); ``` @method runInDebug @param {Function} func The function to be executed. @since 1.5.0 */ Ember.runInDebug = function(func) { func(); }; // Inform the developer about the Ember Inspector if not installed. if (!Ember.testing) { var isFirefox = typeof InstallTrigger !== 'undefined'; var isChrome = !!window.chrome && !window.opera; if (typeof window !== 'undefined' && (isFirefox || isChrome) && window.addEventListener) { window.addEventListener("load", function() { if (document.documentElement && document.documentElement.dataset && !document.documentElement.dataset.emberExtension) { var downloadURL; if(isChrome) { downloadURL = 'https://chrome.google.com/webstore/detail/ember-inspector/bmdblncegkenkacieihfhpjfppoconhi'; } else if(isFirefox) { downloadURL = 'https://addons.mozilla.org/en-US/firefox/addon/ember-inspector/'; } Ember.debug('For more advanced debugging, install the Ember Inspector from ' + downloadURL); } }, false); } } }); define("ember-extension-support", ["ember-metal/core","ember-extension-support/data_adapter","ember-extension-support/container_debug_adapter"], function(__dependency1__, __dependency2__, __dependency3__) { "use strict"; /** Ember Extension Support @module ember @submodule ember-extension-support @requires ember-application */ var Ember = __dependency1__["default"]; var DataAdapter = __dependency2__["default"]; var ContainerDebugAdapter = __dependency3__["default"]; Ember.DataAdapter = DataAdapter; Ember.ContainerDebugAdapter = ContainerDebugAdapter; }); define("ember-extension-support/container_debug_adapter", ["ember-metal/core","ember-runtime/system/native_array","ember-metal/utils","ember-runtime/system/string","ember-runtime/system/namespace","ember-runtime/system/object","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __exports__) { "use strict"; var Ember = __dependency1__["default"]; var emberA = __dependency2__.A; var typeOf = __dependency3__.typeOf; var dasherize = __dependency4__.dasherize; var classify = __dependency4__.classify; var Namespace = __dependency5__["default"]; var EmberObject = __dependency6__["default"]; /** @module ember @submodule ember-extension-support */ /** The `ContainerDebugAdapter` helps the container and resolver interface with tools that debug Ember such as the [Ember Extension](https://github.com/tildeio/ember-extension) for Chrome and Firefox. This class can be extended by a custom resolver implementer to override some of the methods with library-specific code. The methods likely to be overridden are: * `canCatalogEntriesByType` * `catalogEntriesByType` The adapter will need to be registered in the application's container as `container-debug-adapter:main` Example: ```javascript Application.initializer({ name: "containerDebugAdapter", initialize: function(container, application) { application.register('container-debug-adapter:main', require('app/container-debug-adapter')); } }); ``` @class ContainerDebugAdapter @namespace Ember @extends EmberObject @since 1.5.0 */ __exports__["default"] = EmberObject.extend({ /** The container of the application being debugged. This property will be injected on creation. @property container @default null */ container: null, /** The resolver instance of the application being debugged. This property will be injected on creation. @property resolver @default null */ resolver: null, /** Returns true if it is possible to catalog a list of available classes in the resolver for a given type. @method canCatalogEntriesByType @param {string} type The type. e.g. "model", "controller", "route" @return {boolean} whether a list is available for this type. */ canCatalogEntriesByType: function(type) { if (type === 'model' || type === 'template') return false; return true; }, /** Returns the available classes a given type. @method catalogEntriesByType @param {string} type The type. e.g. "model", "controller", "route" @return {Array} An array of strings. */ catalogEntriesByType: function(type) { var namespaces = emberA(Namespace.NAMESPACES), types = emberA(), self = this; var typeSuffixRegex = new RegExp(classify(type) + "$"); namespaces.forEach(function(namespace) { if (namespace !== Ember) { for (var key in namespace) { if (!namespace.hasOwnProperty(key)) { continue; } if (typeSuffixRegex.test(key)) { var klass = namespace[key]; if (typeOf(klass) === 'class') { types.push(dasherize(key.replace(typeSuffixRegex, ''))); } } } } }); return types; } }); }); define("ember-extension-support/data_adapter", ["ember-metal/core","ember-metal/property_get","ember-metal/run_loop","ember-runtime/system/string","ember-runtime/system/namespace","ember-runtime/system/object","ember-runtime/system/native_array","ember-application/system/application","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__, __exports__) { "use strict"; var Ember = __dependency1__["default"]; var get = __dependency2__.get; var run = __dependency3__["default"]; var dasherize = __dependency4__.dasherize; var Namespace = __dependency5__["default"]; var EmberObject = __dependency6__["default"]; var emberA = __dependency7__.A; var Application = __dependency8__["default"]; /** @module ember @submodule ember-extension-support */ /** The `DataAdapter` helps a data persistence library interface with tools that debug Ember such as the [Ember Extension](https://github.com/tildeio/ember-extension) for Chrome and Firefox. This class will be extended by a persistence library which will override some of the methods with library-specific code. The methods likely to be overridden are: * `getFilters` * `detect` * `columnsForType` * `getRecords` * `getRecordColumnValues` * `getRecordKeywords` * `getRecordFilterValues` * `getRecordColor` * `observeRecord` The adapter will need to be registered in the application's container as `dataAdapter:main` Example: ```javascript Application.initializer({ name: "data-adapter", initialize: function(container, application) { application.register('data-adapter:main', DS.DataAdapter); } }); ``` @class DataAdapter @namespace Ember @extends EmberObject */ __exports__["default"] = EmberObject.extend({ init: function() { this._super(); this.releaseMethods = emberA(); }, /** The container of the application being debugged. This property will be injected on creation. @property container @default null @since 1.3.0 */ container: null, /** The container-debug-adapter which is used to list all models. @property containerDebugAdapter @default undefined @since 1.5.0 **/ containerDebugAdapter: undefined, /** Number of attributes to send as columns. (Enough to make the record identifiable). @private @property attributeLimit @default 3 @since 1.3.0 */ attributeLimit: 3, /** Stores all methods that clear observers. These methods will be called on destruction. @private @property releaseMethods @since 1.3.0 */ releaseMethods: emberA(), /** Specifies how records can be filtered. Records returned will need to have a `filterValues` property with a key for every name in the returned array. @public @method getFilters @return {Array} List of objects defining filters. The object should have a `name` and `desc` property. */ getFilters: function() { return emberA(); }, /** Fetch the model types and observe them for changes. @public @method watchModelTypes @param {Function} typesAdded Callback to call to add types. Takes an array of objects containing wrapped types (returned from `wrapModelType`). @param {Function} typesUpdated Callback to call when a type has changed. Takes an array of objects containing wrapped types. @return {Function} Method to call to remove all observers */ watchModelTypes: function(typesAdded, typesUpdated) { var modelTypes = this.getModelTypes(), self = this, typesToSend, releaseMethods = emberA(); typesToSend = modelTypes.map(function(type) { var klass = type.klass; var wrapped = self.wrapModelType(klass, type.name); releaseMethods.push(self.observeModelType(klass, typesUpdated)); return wrapped; }); typesAdded(typesToSend); var release = function() { releaseMethods.forEach(function(fn) { fn(); }); self.releaseMethods.removeObject(release); }; this.releaseMethods.pushObject(release); return release; }, _nameToClass: function(type) { if (typeof type === 'string') { type = this.container.lookupFactory('model:' + type); } return type; }, /** Fetch the records of a given type and observe them for changes. @public @method watchRecords @param {Function} recordsAdded Callback to call to add records. Takes an array of objects containing wrapped records. The object should have the following properties: columnValues: {Object} key and value of a table cell object: {Object} the actual record object @param {Function} recordsUpdated Callback to call when a record has changed. Takes an array of objects containing wrapped records. @param {Function} recordsRemoved Callback to call when a record has removed. Takes the following parameters: index: the array index where the records were removed count: the number of records removed @return {Function} Method to call to remove all observers */ watchRecords: function(type, recordsAdded, recordsUpdated, recordsRemoved) { var self = this, releaseMethods = emberA(), records = this.getRecords(type), release; var recordUpdated = function(updatedRecord) { recordsUpdated([updatedRecord]); }; var recordsToSend = records.map(function(record) { releaseMethods.push(self.observeRecord(record, recordUpdated)); return self.wrapRecord(record); }); var contentDidChange = function(array, idx, removedCount, addedCount) { for (var i = idx; i < idx + addedCount; i++) { var record = array.objectAt(i); var wrapped = self.wrapRecord(record); releaseMethods.push(self.observeRecord(record, recordUpdated)); recordsAdded([wrapped]); } if (removedCount) { recordsRemoved(idx, removedCount); } }; var observer = { didChange: contentDidChange, willChange: Ember.K }; records.addArrayObserver(self, observer); release = function() { releaseMethods.forEach(function(fn) { fn(); }); records.removeArrayObserver(self, observer); self.releaseMethods.removeObject(release); }; recordsAdded(recordsToSend); this.releaseMethods.pushObject(release); return release; }, /** Clear all observers before destruction @private @method willDestroy */ willDestroy: function() { this._super(); this.releaseMethods.forEach(function(fn) { fn(); }); }, /** Detect whether a class is a model. Test that against the model class of your persistence library @private @method detect @param {Class} klass The class to test @return boolean Whether the class is a model class or not */ detect: function(klass) { return false; }, /** Get the columns for a given model type. @private @method columnsForType @param {Class} type The model type @return {Array} An array of columns of the following format: name: {String} name of the column desc: {String} Humanized description (what would show in a table column name) */ columnsForType: function(type) { return emberA(); }, /** Adds observers to a model type class. @private @method observeModelType @param {Class} type The model type class @param {Function} typesUpdated Called when a type is modified. @return {Function} The function to call to remove observers */ observeModelType: function(type, typesUpdated) { var self = this, records = this.getRecords(type); var onChange = function() { typesUpdated([self.wrapModelType(type)]); }; var observer = { didChange: function() { run.scheduleOnce('actions', this, onChange); }, willChange: Ember.K }; records.addArrayObserver(this, observer); var release = function() { records.removeArrayObserver(self, observer); }; return release; }, /** Wraps a given model type and observes changes to it. @private @method wrapModelType @param {Class} type A model class @param {String} Optional name of the class @return {Object} contains the wrapped type and the function to remove observers Format: type: {Object} the wrapped type The wrapped type has the following format: name: {String} name of the type count: {Integer} number of records available columns: {Columns} array of columns to describe the record object: {Class} the actual Model type class release: {Function} The function to remove observers */ wrapModelType: function(type, name) { var release, records = this.getRecords(type), typeToSend, self = this; typeToSend = { name: name || type.toString(), count: get(records, 'length'), columns: this.columnsForType(type), object: type }; return typeToSend; }, /** Fetches all models defined in the application. @private @method getModelTypes @return {Array} Array of model types */ getModelTypes: function() { var types, self = this, containerDebugAdapter = this.get('containerDebugAdapter'); if (containerDebugAdapter.canCatalogEntriesByType('model')) { types = containerDebugAdapter.catalogEntriesByType('model'); } else { types = this._getObjectsOnNamespaces(); } // New adapters return strings instead of classes types = emberA(types).map(function(name) { return { klass: self._nameToClass(name), name: name }; }); types = emberA(types).filter(function(type) { return self.detect(type.klass); }); return emberA(types); }, /** Loops over all namespaces and all objects attached to them @private @method _getObjectsOnNamespaces @return {Array} Array of model type strings */ _getObjectsOnNamespaces: function() { var namespaces = emberA(Namespace.NAMESPACES), types = emberA(), self = this; namespaces.forEach(function(namespace) { for (var key in namespace) { if (!namespace.hasOwnProperty(key)) { continue; } // Even though we will filter again in `getModelTypes`, // we should not call `lookupContainer` on non-models // (especially when `Ember.MODEL_FACTORY_INJECTIONS` is `true`) if (!self.detect(namespace[key])) { continue; } var name = dasherize(key); if (!(namespace instanceof Application) && namespace.toString()) { name = namespace + '/' + name; } types.push(name); } }); return types; }, /** Fetches all loaded records for a given type. @private @method getRecords @return {Array} An array of records. This array will be observed for changes, so it should update when new records are added/removed. */ getRecords: function(type) { return emberA(); }, /** Wraps a record and observers changes to it. @private @method wrapRecord @param {Object} record The record instance. @return {Object} The wrapped record. Format: columnValues: {Array} searchKeywords: {Array} */ wrapRecord: function(record) { var recordToSend = { object: record }, columnValues = {}, self = this; recordToSend.columnValues = this.getRecordColumnValues(record); recordToSend.searchKeywords = this.getRecordKeywords(record); recordToSend.filterValues = this.getRecordFilterValues(record); recordToSend.color = this.getRecordColor(record); return recordToSend; }, /** Gets the values for each column. @private @method getRecordColumnValues @return {Object} Keys should match column names defined by the model type. */ getRecordColumnValues: function(record) { return {}; }, /** Returns keywords to match when searching records. @private @method getRecordKeywords @return {Array} Relevant keywords for search. */ getRecordKeywords: function(record) { return emberA(); }, /** Returns the values of filters defined by `getFilters`. @private @method getRecordFilterValues @param {Object} record The record instance @return {Object} The filter values */ getRecordFilterValues: function(record) { return {}; }, /** Each record can have a color that represents its state. @private @method getRecordColor @param {Object} record The record instance @return {String} The record's color Possible options: black, red, blue, green */ getRecordColor: function(record) { return null; }, /** Observes all relevant properties and re-sends the wrapped record when a change occurs. @private @method observerRecord @param {Object} record The record instance @param {Function} recordUpdated The callback to call when a record is updated. @return {Function} The function to call to remove all observers. */ observeRecord: function(record, recordUpdated) { return function(){}; } }); }); define("ember-extension-support/initializers", [], function() { "use strict"; }); define("ember-handlebars-compiler", ["ember-metal/core","exports"], function(__dependency1__, __exports__) { "use strict"; /* global Handlebars:true */ /** @module ember @submodule ember-handlebars-compiler */ var Ember = __dependency1__["default"]; // ES6Todo: you'll need to import debugger once debugger is es6'd. if (typeof Ember.assert === 'undefined') { Ember.assert = function(){}; } if (typeof Ember.FEATURES === 'undefined') { Ember.FEATURES = { isEnabled: function(){} }; } var objectCreate = Object.create || function(parent) { function F() {} F.prototype = parent; return new F(); }; // set up for circular references later var View, Component; // ES6Todo: when ember-debug is es6'ed import this. // var emberAssert = Ember.assert; var Handlebars = (Ember.imports && Ember.imports.Handlebars) || (this && this.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 */ var EmberHandlebars = 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* */ EmberHandlebars.helper = function(name, value) { if (!View) { View = requireModule('ember-views/views/view')['default']; } // ES6TODO: stupid circular dep if (!Component) { Component = requireModule('ember-views/views/component')['default']; } // ES6TODO: stupid circular dep Ember.assert("You tried to register a component named '" + name + "', but component names must include a '-'", !Component.detect(value) || name.match(/-/)); if (View.detect(value)) { EmberHandlebars.registerHelper(name, EmberHandlebars.makeViewHelper(value)); } else { EmberHandlebars.registerBoundHelper.apply(null, arguments); } }; /** Returns a helper function that renders the provided ViewClass. Used internally by Ember.Handlebars.helper and other methods involving helper/component registration. @private @method makeViewHelper @for Ember.Handlebars @param {Function} ViewClass view class constructor @since 1.2.0 */ EmberHandlebars.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 found in '" + ViewClass.toString() + "'", arguments.length < 2); return EmberHandlebars.helpers.view.call(this, ViewClass, options); }; }; /** @class helpers @namespace Ember.Handlebars */ EmberHandlebars.helpers = objectCreate(Handlebars.helpers); /** Override the the opcode compiler and JavaScript compiler for Handlebars. @class Compiler @namespace Ember.Handlebars @private @constructor */ EmberHandlebars.Compiler = function() {}; // Handlebars.Compiler doesn't exist in runtime-only if (Handlebars.Compiler) { EmberHandlebars.Compiler.prototype = objectCreate(Handlebars.Compiler.prototype); } EmberHandlebars.Compiler.prototype.compiler = EmberHandlebars.Compiler; /** @class JavaScriptCompiler @namespace Ember.Handlebars @private @constructor */ EmberHandlebars.JavaScriptCompiler = function() {}; // Handlebars.JavaScriptCompiler doesn't exist in runtime-only if (Handlebars.JavaScriptCompiler) { EmberHandlebars.JavaScriptCompiler.prototype = objectCreate(Handlebars.JavaScriptCompiler.prototype); EmberHandlebars.JavaScriptCompiler.prototype.compiler = EmberHandlebars.JavaScriptCompiler; } EmberHandlebars.JavaScriptCompiler.prototype.namespace = "Ember.Handlebars"; EmberHandlebars.JavaScriptCompiler.prototype.initializeBuffer = function() { return "''"; }; /** 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. @private @method appendToBuffer @param string {String} */ EmberHandlebars.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/634 var DOT_LOOKUP_REGEX = /helpers\.(.*?)\)/, BRACKET_STRING_LOOKUP_REGEX = /helpers\['(.*?)'/, INVOCATION_SPLITTING_REGEX = /(.*blockHelperMissing\.call\(.*)(stack[0-9]+)(,.*)/; EmberHandlebars.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 = EmberHandlebars.JavaScriptCompiler.stringifyLastBlockHelperMissingInvocation; var originalBlockValue = EmberHandlebars.JavaScriptCompiler.prototype.blockValue; EmberHandlebars.JavaScriptCompiler.prototype.blockValue = function() { originalBlockValue.apply(this, arguments); stringifyBlockHelperMissing(this.source); }; var originalAmbiguousBlockValue = EmberHandlebars.JavaScriptCompiler.prototype.ambiguousBlockValue; EmberHandlebars.JavaScriptCompiler.prototype.ambiguousBlockValue = function() { originalAmbiguousBlockValue.apply(this, arguments); stringifyBlockHelperMissing(this.source); }; /** 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. @private @method mustache @for Ember.Handlebars.Compiler @param mustache */ EmberHandlebars.Compiler.prototype.mustache = function(mustache) { if (!(mustache.params.length || mustache.hash)) { 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 @param {Boolean} asObject optional parameter, defaulting to true, of whether or not the compiled template should be returned as an Object or a String */ EmberHandlebars.precompile = function(string, asObject) { var ast = Handlebars.parse(string); var options = { knownHelpers: { action: true, unbound: true, 'bind-attr': true, template: true, view: true, _triageMustache: true }, data: true, stringParams: true }; asObject = asObject === undefined ? true : asObject; var environment = new EmberHandlebars.Compiler().compile(ast, options); return new EmberHandlebars.JavaScriptCompiler().compile(environment, options, undefined, asObject); }; // 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} */ EmberHandlebars.compile = function(string) { var ast = Handlebars.parse(string); var options = { data: true, stringParams: true }; var environment = new EmberHandlebars.Compiler().compile(ast, options); var templateSpec = new EmberHandlebars.JavaScriptCompiler().compile(environment, options, undefined, true); var template = EmberHandlebars.template(templateSpec); template.isMethod = false; //Make sure we don't wrap templates with ._super return template; }; } __exports__["default"] = EmberHandlebars; }); define("ember-handlebars", ["ember-handlebars-compiler","ember-metal/core","ember-runtime/system/lazy_load","ember-handlebars/loader","ember-handlebars/ext","ember-handlebars/string","ember-handlebars/helpers/shared","ember-handlebars/helpers/binding","ember-handlebars/helpers/collection","ember-handlebars/helpers/view","ember-handlebars/helpers/unbound","ember-handlebars/helpers/debug","ember-handlebars/helpers/each","ember-handlebars/helpers/template","ember-handlebars/helpers/partial","ember-handlebars/helpers/yield","ember-handlebars/helpers/loc","ember-handlebars/controls/checkbox","ember-handlebars/controls/select","ember-handlebars/controls/text_area","ember-handlebars/controls/text_field","ember-handlebars/controls/text_support","ember-handlebars/controls","ember-handlebars/component_lookup","ember-handlebars/views/handlebars_bound_view","ember-handlebars/views/metamorph_view","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__, __dependency9__, __dependency10__, __dependency11__, __dependency12__, __dependency13__, __dependency14__, __dependency15__, __dependency16__, __dependency17__, __dependency18__, __dependency19__, __dependency20__, __dependency21__, __dependency22__, __dependency23__, __dependency24__, __dependency25__, __dependency26__, __exports__) { "use strict"; var EmberHandlebars = __dependency1__["default"]; var Ember = __dependency2__["default"]; // to add to globals var runLoadHooks = __dependency3__.runLoadHooks; var bootstrap = __dependency4__["default"]; var normalizePath = __dependency5__.normalizePath; var template = __dependency5__.template; var makeBoundHelper = __dependency5__.makeBoundHelper; var registerBoundHelper = __dependency5__.registerBoundHelper; var resolveHash = __dependency5__.resolveHash; var resolveParams = __dependency5__.resolveParams; var getEscaped = __dependency5__.getEscaped; var handlebarsGet = __dependency5__.handlebarsGet; var evaluateUnboundHelper = __dependency5__.evaluateUnboundHelper; var helperMissingHelper = __dependency5__.helperMissingHelper; var blockHelperMissingHelper = __dependency5__.blockHelperMissingHelper; // side effect of extending StringUtils of htmlSafe var resolvePaths = __dependency7__["default"]; var bind = __dependency8__.bind; var _triageMustacheHelper = __dependency8__._triageMustacheHelper; var resolveHelper = __dependency8__.resolveHelper; var bindHelper = __dependency8__.bindHelper; var boundIfHelper = __dependency8__.boundIfHelper; var unboundIfHelper = __dependency8__.unboundIfHelper; var withHelper = __dependency8__.withHelper; var ifHelper = __dependency8__.ifHelper; var unlessHelper = __dependency8__.unlessHelper; var bindAttrHelper = __dependency8__.bindAttrHelper; var bindAttrHelperDeprecated = __dependency8__.bindAttrHelperDeprecated; var bindClasses = __dependency8__.bindClasses; var collectionHelper = __dependency9__["default"]; var ViewHelper = __dependency10__.ViewHelper; var viewHelper = __dependency10__.viewHelper; var unboundHelper = __dependency11__["default"]; var logHelper = __dependency12__.logHelper; var debuggerHelper = __dependency12__.debuggerHelper; var EachView = __dependency13__.EachView; var GroupedEach = __dependency13__.GroupedEach; var eachHelper = __dependency13__.eachHelper; var templateHelper = __dependency14__["default"]; var partialHelper = __dependency15__["default"]; var yieldHelper = __dependency16__["default"]; var locHelper = __dependency17__["default"]; var Checkbox = __dependency18__["default"]; var Select = __dependency19__.Select; var SelectOption = __dependency19__.SelectOption; var SelectOptgroup = __dependency19__.SelectOptgroup; var TextArea = __dependency20__["default"]; var TextField = __dependency21__["default"]; var TextSupport = __dependency22__["default"]; var inputHelper = __dependency23__.inputHelper; var textareaHelper = __dependency23__.textareaHelper; var ComponentLookup = __dependency24__["default"]; var _HandlebarsBoundView = __dependency25__._HandlebarsBoundView; var SimpleHandlebarsView = __dependency25__.SimpleHandlebarsView; var _wrapMap = __dependency26__._wrapMap; var _SimpleMetamorphView = __dependency26__._SimpleMetamorphView; var _MetamorphView = __dependency26__._MetamorphView; var _Metamorph = __dependency26__._Metamorph; /** Ember Handlebars @module ember @submodule ember-handlebars @requires ember-views */ // Ember.Handlebars.Globals EmberHandlebars.bootstrap = bootstrap; EmberHandlebars.template = template; EmberHandlebars.makeBoundHelper = makeBoundHelper; EmberHandlebars.registerBoundHelper = registerBoundHelper; EmberHandlebars.resolveHash = resolveHash; EmberHandlebars.resolveParams = resolveParams; EmberHandlebars.resolveHelper = resolveHelper; EmberHandlebars.get = handlebarsGet; EmberHandlebars.getEscaped = getEscaped; EmberHandlebars.evaluateUnboundHelper = evaluateUnboundHelper; EmberHandlebars.bind = bind; EmberHandlebars.bindClasses = bindClasses; EmberHandlebars.EachView = EachView; EmberHandlebars.GroupedEach = GroupedEach; EmberHandlebars.resolvePaths = resolvePaths; EmberHandlebars.ViewHelper = ViewHelper; EmberHandlebars.normalizePath = normalizePath; // Ember Globals Ember.Handlebars = EmberHandlebars; Ember.ComponentLookup = ComponentLookup; Ember._SimpleHandlebarsView = SimpleHandlebarsView; Ember._HandlebarsBoundView = _HandlebarsBoundView; Ember._SimpleMetamorphView = _SimpleMetamorphView; Ember._MetamorphView = _MetamorphView; Ember._Metamorph = _Metamorph; Ember._metamorphWrapMap = _wrapMap; Ember.TextSupport = TextSupport; Ember.Checkbox = Checkbox; Ember.Select = Select; Ember.SelectOption = SelectOption; Ember.SelectOptgroup = SelectOptgroup; Ember.TextArea = TextArea; Ember.TextField = TextField; Ember.TextSupport = TextSupport; // register helpers EmberHandlebars.registerHelper('helperMissing', helperMissingHelper); EmberHandlebars.registerHelper('blockHelperMissing', blockHelperMissingHelper); EmberHandlebars.registerHelper('bind', bindHelper); EmberHandlebars.registerHelper('boundIf', boundIfHelper); EmberHandlebars.registerHelper('_triageMustache', _triageMustacheHelper); EmberHandlebars.registerHelper('unboundIf', unboundIfHelper); EmberHandlebars.registerHelper('with', withHelper); EmberHandlebars.registerHelper('if', ifHelper); EmberHandlebars.registerHelper('unless', unlessHelper); EmberHandlebars.registerHelper('bind-attr', bindAttrHelper); EmberHandlebars.registerHelper('bindAttr', bindAttrHelperDeprecated); EmberHandlebars.registerHelper('collection', collectionHelper); EmberHandlebars.registerHelper("log", logHelper); EmberHandlebars.registerHelper("debugger", debuggerHelper); EmberHandlebars.registerHelper("each", eachHelper); EmberHandlebars.registerHelper("loc", locHelper); EmberHandlebars.registerHelper("partial", partialHelper); EmberHandlebars.registerHelper("template", templateHelper); EmberHandlebars.registerHelper("yield", yieldHelper); EmberHandlebars.registerHelper("view", viewHelper); EmberHandlebars.registerHelper("unbound", unboundHelper); EmberHandlebars.registerHelper("input", inputHelper); EmberHandlebars.registerHelper("textarea", textareaHelper); // run load hooks runLoadHooks('Ember.Handlebars', EmberHandlebars); __exports__["default"] = EmberHandlebars; }); define("ember-handlebars/component_lookup", ["ember-runtime/system/object","exports"], function(__dependency1__, __exports__) { "use strict"; var EmberObject = __dependency1__["default"]; var ComponentLookup = EmberObject.extend({ lookupFactory: function(name, container) { container = container || this.container; var fullName = 'component:' + name, templateFullName = 'template:components/' + name, templateRegistered = container && container.has(templateFullName); if (templateRegistered) { container.injection(fullName, 'layout', templateFullName); } var Component = container.lookupFactory(fullName); // Only treat as a component if either the component // or a template has been registered. if (templateRegistered || Component) { if (!Component) { container.register(fullName, Ember.Component); Component = container.lookupFactory(fullName); } return Component; } } }); __exports__["default"] = ComponentLookup; }); define("ember-handlebars/controls", ["ember-handlebars/controls/checkbox","ember-handlebars/controls/text_field","ember-handlebars/controls/text_area","ember-metal/core","ember-handlebars-compiler","ember-handlebars/ext","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __exports__) { "use strict"; var Checkbox = __dependency1__["default"]; var TextField = __dependency2__["default"]; var TextArea = __dependency3__["default"]; var Ember = __dependency4__["default"]; // Ember.assert // var emberAssert = Ember.assert; var EmberHandlebars = __dependency5__["default"]; var handlebarsGet = __dependency6__.handlebarsGet; var helpers = EmberHandlebars.helpers; /** @module ember @submodule ember-handlebars-compiler */ function _resolveOption(context, options, key) { if (options.hashTypes[key] === "ID") { return handlebarsGet(context, options.hash[key], options); } else { return options.hash[key]; } } /** The `{{input}}` helper inserts an HTML `` tag into the template, with a `type` value of either `text` or `checkbox`. If no `type` is provided, `text` will be the default value applied. The attributes of `{{input}}` match those of the native HTML tag as closely as possible for these two types. ## Use as text field An `{{input}}` with no `type` or a `type` of `text` will render an HTML text input. The following HTML attributes can be set via the helper:
`readonly``required``autofocus`
`value``placeholder``disabled`
`size``tabindex``maxlength`
`name``min``max`
`pattern``accept``autocomplete`
`autosave``formaction``formenctype`
`formmethod``formnovalidate``formtarget`
`height``inputmode``multiple`
`step``width``form`
`selectionDirection``spellcheck` 
When set to a quoted string, these values will be directly applied to the HTML element. When left unquoted, these values will be bound to a property on the template's current rendering context (most typically a controller instance). ## Unbound: ```handlebars {{input value="http://www.facebook.com"}} ``` ```html ``` ## Bound: ```javascript App.ApplicationController = Ember.Controller.extend({ firstName: "Stanley", entryNotAllowed: true }); ``` ```handlebars {{input type="text" value=firstName disabled=entryNotAllowed size="50"}} ``` ```html ``` ## Actions The helper can send multiple actions based on user events. The action property defines the action which is send when the user presses the return key. ```handlebars {{input action="submit"}} ``` The helper allows some user events to send actions. * `enter` * `insert-newline` * `escape-press` * `focus-in` * `focus-out` * `key-press` For example, if you desire an action to be sent when the input is blurred, you only need to setup the action name to the event name property. ```handlebars {{input focus-in="alertMessage"}} ``` See more about [Text Support Actions](/api/classes/Ember.TextField.html) ## Extension Internally, `{{input type="text"}}` creates an instance of `Ember.TextField`, passing arguments from the helper to `Ember.TextField`'s `create` method. You can extend the capabilities of text inputs in your applications by reopening this class. For example, if you are building a Bootstrap project where `data-*` attributes are used, you can add one to the `TextField`'s `attributeBindings` property: ```javascript Ember.TextField.reopen({ attributeBindings: ['data-error'] }); ``` Keep in mind when writing `Ember.TextField` subclasses that `Ember.TextField` itself extends `Ember.Component`, meaning that it does NOT inherit the `controller` of the parent view. See more about [Ember components](/api/classes/Ember.Component.html) ## Use as checkbox An `{{input}}` with a `type` of `checkbox` will render an HTML checkbox input. The following HTML attributes can be set via the helper: * `checked` * `disabled` * `tabindex` * `indeterminate` * `name` * `autofocus` * `form` When set to a quoted string, these values will be directly applied to the HTML element. When left unquoted, these values will be bound to a property on the template's current rendering context (most typically a controller instance). ## Unbound: ```handlebars {{input type="checkbox" name="isAdmin"}} ``` ```html ``` ## Bound: ```javascript App.ApplicationController = Ember.Controller.extend({ isAdmin: true }); ``` ```handlebars {{input type="checkbox" checked=isAdmin }} ``` ```html ``` ## Extension Internally, `{{input type="checkbox"}}` creates an instance of `Ember.Checkbox`, passing arguments from the helper to `Ember.Checkbox`'s `create` method. You can extend the capablilties of checkbox inputs in your applications by reopening this class. For example, if you wanted to add a css class to all checkboxes in your application: ```javascript Ember.Checkbox.reopen({ classNames: ['my-app-checkbox'] }); ``` @method input @for Ember.Handlebars.helpers @param {Hash} options */ function inputHelper(options) { Ember.assert('You can only pass attributes to the `input` helper, not arguments', arguments.length < 2); var hash = options.hash, types = options.hashTypes, inputType = _resolveOption(this, options, 'type'), onEvent = hash.on; if (inputType === 'checkbox') { delete hash.type; delete types.type; Ember.assert("{{input type='checkbox'}} does not support setting `value=someBooleanValue`; you must use `checked=someBooleanValue` instead.", options.hashTypes.value !== 'ID'); return helpers.view.call(this, Checkbox, options); } else { delete hash.on; hash.onEvent = onEvent || 'enter'; return helpers.view.call(this, TextField, options); } } __exports__.inputHelper = inputHelper;/** `{{textarea}}` inserts a new instance of ` ``` Bound: In the following example, the `writtenWords` property on `App.ApplicationController` will be updated live as the user types 'Lots of text that IS bound' into the text area of their browser's window. ```javascript App.ApplicationController = Ember.Controller.extend({ writtenWords: "Lots of text that IS bound" }); ``` ```handlebars {{textarea value=writtenWords}} ``` Would result in the following HTML: ```html ``` If you wanted a one way binding between the text area and a div tag somewhere else on your screen, you could use `Ember.computed.oneWay`: ```javascript App.ApplicationController = Ember.Controller.extend({ writtenWords: "Lots of text that IS bound", outputWrittenWords: Ember.computed.oneWay("writtenWords") }); ``` ```handlebars {{textarea value=writtenWords}}
{{outputWrittenWords}}
``` Would result in the following HTML: ```html <-- the following div will be updated in real time as you type -->
Lots of text that IS bound
``` Finally, this example really shows the power and ease of Ember when two properties are bound to eachother via `Ember.computed.alias`. Type into either text area box and they'll both stay in sync. Note that `Ember.computed.alias` costs more in terms of performance, so only use it when your really binding in both directions: ```javascript App.ApplicationController = Ember.Controller.extend({ writtenWords: "Lots of text that IS bound", twoWayWrittenWords: Ember.computed.alias("writtenWords") }); ``` ```handlebars {{textarea value=writtenWords}} {{textarea value=twoWayWrittenWords}} ``` ```html <-- both updated in real time --> ``` ## Actions The helper can send multiple actions based on user events. The action property defines the action which is send when the user presses the return key. ```handlebars {{input action="submit"}} ``` The helper allows some user events to send actions. * `enter` * `insert-newline` * `escape-press` * `focus-in` * `focus-out` * `key-press` For example, if you desire an action to be sent when the input is blurred, you only need to setup the action name to the event name property. ```handlebars {{textarea focus-in="alertMessage"}} ``` See more about [Text Support Actions](/api/classes/Ember.TextArea.html) ## Extension Internally, `{{textarea}}` creates an instance of `Ember.TextArea`, passing arguments from the helper to `Ember.TextArea`'s `create` method. You can extend the capabilities of text areas in your application by reopening this class. For example, if you are building a Bootstrap project where `data-*` attributes are used, you can globally add support for a `data-*` attribute on all `{{textarea}}`s' in your app by reopening `Ember.TextArea` or `Ember.TextSupport` and adding it to the `attributeBindings` concatenated property: ```javascript Ember.TextArea.reopen({ attributeBindings: ['data-error'] }); ``` Keep in mind when writing `Ember.TextArea` subclasses that `Ember.TextArea` itself extends `Ember.Component`, meaning that it does NOT inherit the `controller` of the parent view. See more about [Ember components](/api/classes/Ember.Component.html) @method textarea @for Ember.Handlebars.helpers @param {Hash} options */ function textareaHelper(options) { Ember.assert('You can only pass attributes to the `textarea` helper, not arguments', arguments.length < 2); var hash = options.hash, types = options.hashTypes; return helpers.view.call(this, TextArea, options); } __exports__.textareaHelper = textareaHelper; }); define("ember-handlebars/controls/checkbox", ["ember-metal/property_get","ember-metal/property_set","ember-views/views/view","exports"], function(__dependency1__, __dependency2__, __dependency3__, __exports__) { "use strict"; var get = __dependency1__.get; var set = __dependency2__.set; var View = __dependency3__["default"]; /** @module ember @submodule ember-handlebars */ /** The internal class used to create text inputs when the `{{input}}` helper is used with `type` of `checkbox`. See [handlebars.helpers.input](/api/classes/Ember.Handlebars.helpers.html#method_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 */ __exports__["default"] = View.extend({ instrumentDisplay: '{{input type="checkbox"}}', classNames: ['ember-checkbox'], tagName: 'input', attributeBindings: [ 'type', 'checked', 'indeterminate', 'disabled', 'tabindex', 'name', 'autofocus', 'required', 'form' ], type: 'checkbox', checked: false, disabled: false, indeterminate: false, init: function() { this._super(); this.on('change', this, this._updateElementValue); }, didInsertElement: function() { this._super(); get(this, 'element').indeterminate = !!get(this, 'indeterminate'); }, _updateElementValue: function() { set(this, 'checked', this.$().prop('checked')); } }); }); define("ember-handlebars/controls/select", ["ember-handlebars-compiler","ember-metal/enumerable_utils","ember-metal/property_get","ember-metal/property_set","ember-views/views/view","ember-views/views/collection_view","ember-metal/utils","ember-metal/is_none","ember-metal/computed","ember-runtime/system/native_array","ember-metal/mixin","ember-metal/properties","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__, __dependency9__, __dependency10__, __dependency11__, __dependency12__, __exports__) { "use strict"; /** @module ember @submodule ember-handlebars */ var EmberHandlebars = __dependency1__["default"]; var forEach = __dependency2__.forEach; var indexOf = __dependency2__.indexOf; var indexesOf = __dependency2__.indexesOf; var replace = __dependency2__.replace; var get = __dependency3__.get; var set = __dependency4__.set; var View = __dependency5__["default"]; var CollectionView = __dependency6__["default"]; var isArray = __dependency7__.isArray; var isNone = __dependency8__["default"]; var computed = __dependency9__.computed; var emberA = __dependency10__.A; var observer = __dependency11__.observer; var defineProperty = __dependency12__.defineProperty; var precompileTemplate = EmberHandlebars.compile; var SelectOption = View.extend({ instrumentDisplay: 'Ember.SelectOption', tagName: 'option', attributeBindings: ['value', 'selected'], defaultTemplate: function(context, options) { options = { data: options.data, hash: {} }; EmberHandlebars.helpers.bind.call(context, "view.label", options); }, init: function() { this.labelPathDidChange(); this.valuePathDidChange(); this._super(); }, selected: 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; // jshint ignore:line } }).property('content', 'parentView.selection'), labelPathDidChange: observer('parentView.optionLabelPath', function() { var labelPath = get(this, 'parentView.optionLabelPath'); if (!labelPath) { return; } defineProperty(this, 'label', computed(function() { return get(this, labelPath); }).property(labelPath)); }), valuePathDidChange: observer('parentView.optionValuePath', function() { var valuePath = get(this, 'parentView.optionValuePath'); if (!valuePath) { return; } defineProperty(this, 'value', computed(function() { return get(this, valuePath); }).property(valuePath)); }) }); var SelectOptgroup = CollectionView.extend({ instrumentDisplay: 'Ember.SelectOptgroup', 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 ` ``` The `value` attribute of the selected `"); return buffer; } function program3(depth0,data) { var stack1; stack1 = helpers.each.call(depth0, "view.groupedContent", {hash:{},hashTypes:{},hashContexts:{},inverse:self.noop,fn:self.program(4, program4, data),contexts:[depth0],types:["ID"],data:data}); if(stack1 || stack1 === 0) { data.buffer.push(stack1); } else { data.buffer.push(''); } } function program4(depth0,data) { data.buffer.push(escapeExpression(helpers.view.call(depth0, "view.groupView", {hash:{ 'content': ("content"), 'label': ("label") },hashTypes:{'content': "ID",'label': "ID"},hashContexts:{'content': depth0,'label': depth0},contexts:[depth0],types:["ID"],data:data}))); } function program6(depth0,data) { var stack1; stack1 = helpers.each.call(depth0, "view.content", {hash:{},hashTypes:{},hashContexts:{},inverse:self.noop,fn:self.program(7, program7, data),contexts:[depth0],types:["ID"],data:data}); if(stack1 || stack1 === 0) { data.buffer.push(stack1); } else { data.buffer.push(''); } } function program7(depth0,data) { data.buffer.push(escapeExpression(helpers.view.call(depth0, "view.optionView", {hash:{ 'content': ("") },hashTypes:{'content': "ID"},hashContexts:{'content': depth0},contexts:[depth0],types:["ID"],data:data}))); } stack1 = helpers['if'].call(depth0, "view.prompt", {hash:{},hashTypes:{},hashContexts:{},inverse:self.noop,fn:self.program(1, program1, data),contexts:[depth0],types:["ID"],data:data}); if(stack1 || stack1 === 0) { data.buffer.push(stack1); } stack1 = helpers['if'].call(depth0, "view.optionGroupPath", {hash:{},hashTypes:{},hashContexts:{},inverse:self.program(6, program6, data),fn:self.program(3, program3, data),contexts:[depth0],types:["ID"],data:data}); if(stack1 || stack1 === 0) { data.buffer.push(stack1); } return buffer; }), attributeBindings: ['multiple', 'disabled', 'tabindex', 'name', 'required', 'autofocus', 'form', 'size'], /** The `multiple` attribute of the select element. Indicates whether multiple options can be selected. @property multiple @type Boolean @default false */ multiple: false, /** The `disabled` attribute of the select element. Indicates whether the element is disabled from interactions. @property disabled @type Boolean @default false */ disabled: false, /** The `required` attribute of the select element. Indicates whether a selected option is required for form validation. @property required @type Boolean @default false @since 1.5.0 */ required: false, /** The list of options. If `optionLabelPath` and `optionValuePath` are not overridden, this should be a list of strings, which will serve simultaneously as labels and values. Otherwise, this should be a list of objects. For instance: ```javascript Ember.Select.create({ content: Ember.A([ { id: 1, firstName: 'Yehuda' }, { id: 2, firstName: 'Tom' } ]), optionLabelPath: 'content.firstName', optionValuePath: 'content.id' }); ``` @property content @type Array @default null */ content: null, /** When `multiple` is `false`, the element of `content` that is currently selected, if any. When `multiple` is `true`, an array of such elements. @property selection @type Object or Array @default null */ selection: null, /** In single selection mode (when `multiple` is `false`), value can be used to get the current selection's value or set the selection by it's value. It is not currently supported in multiple selection mode. @property value @type String @default null */ value: computed(function(key, value) { if (arguments.length === 2) { return value; } var valuePath = get(this, 'optionValuePath').replace(/^content\.?/, ''); return valuePath ? get(this, 'selection.' + valuePath) : get(this, 'selection'); }).property('selection'), /** If given, a top-most dummy option will be rendered to serve as a user prompt. @property prompt @type String @default null */ prompt: null, /** The path of the option labels. See [content](/api/classes/Ember.Select.html#property_content). @property optionLabelPath @type String @default 'content' */ optionLabelPath: 'content', /** The path of the option values. See [content](/api/classes/Ember.Select.html#property_content). @property optionValuePath @type String @default 'content' */ optionValuePath: 'content', /** The path of the option group. When this property is used, `content` should be sorted by `optionGroupPath`. @property optionGroupPath @type String @default null */ optionGroupPath: null, /** The view class for optgroup. @property groupView @type Ember.View @default Ember.SelectOptgroup */ groupView: SelectOptgroup, groupedContent: computed(function() { var groupPath = get(this, 'optionGroupPath'); var groupedContent = emberA(); var content = get(this, 'content') || []; forEach(content, function(item) { var label = get(item, groupPath); if (get(groupedContent, 'lastObject.label') !== label) { groupedContent.pushObject({ label: label, content: emberA() }); } get(groupedContent, 'lastObject.content').push(item); }); return groupedContent; }).property('optionGroupPath', 'content.@each'), /** The view class for option. @property optionView @type Ember.View @default Ember.SelectOption */ optionView: SelectOption, _change: function() { if (get(this, 'multiple')) { this._changeMultiple(); } else { this._changeSingle(); } }, selectionDidChange: observer('selection.@each', function() { var selection = get(this, 'selection'); if (get(this, 'multiple')) { if (!isArray(selection)) { set(this, 'selection', emberA([selection])); return; } this._selectionDidChangeMultiple(); } else { this._selectionDidChangeSingle(); } }), valueDidChange: observer('value', function() { var content = get(this, 'content'), value = get(this, 'value'), valuePath = get(this, 'optionValuePath').replace(/^content\.?/, ''), selectedValue = (valuePath ? get(this, 'selection.' + valuePath) : get(this, 'selection')), selection; if (value !== selectedValue) { selection = content ? content.find(function(obj) { return value === (valuePath ? get(obj, valuePath) : obj); }) : null; this.set('selection', selection); } }), _triggerChange: function() { var selection = get(this, 'selection'); var value = get(this, 'value'); if (!isNone(selection)) { this.selectionDidChange(); } if (!isNone(value)) { this.valueDidChange(); } this._change(); }, _changeSingle: function() { var selectedIndex = this.$()[0].selectedIndex, content = get(this, 'content'), prompt = get(this, 'prompt'); if (!content || !get(content, 'length')) { return; } if (prompt && selectedIndex === 0) { set(this, 'selection', null); return; } if (prompt) { selectedIndex -= 1; } set(this, 'selection', content.objectAt(selectedIndex)); }, _changeMultiple: function() { var options = this.$('option:selected'), prompt = get(this, 'prompt'), offset = prompt ? 1 : 0, content = get(this, 'content'), selection = get(this, 'selection'); if (!content) { return; } if (options) { var selectedIndexes = options.map(function() { return this.index - offset; }).toArray(); var newSelection = content.objectsAt(selectedIndexes); if (isArray(selection)) { replace(selection, 0, get(selection, 'length'), newSelection); } else { set(this, 'selection', newSelection); } } }, _selectionDidChangeSingle: function() { var el = this.get('element'); if (!el) { return; } var content = get(this, 'content'), selection = get(this, 'selection'), selectionIndex = content ? indexOf(content, selection) : -1, prompt = get(this, 'prompt'); if (prompt) { selectionIndex += 1; } if (el) { el.selectedIndex = selectionIndex; } }, _selectionDidChangeMultiple: function() { var content = get(this, 'content'), selection = get(this, 'selection'), selectedIndexes = content ? indexesOf(content, selection) : [-1], prompt = get(this, 'prompt'), offset = prompt ? 1 : 0, options = this.$('option'), adjusted; if (options) { options.each(function() { adjusted = this.index > -1 ? this.index - offset : -1; this.selected = indexOf(selectedIndexes, adjusted) > -1; }); } }, init: function() { this._super(); this.on("didInsertElement", this, this._triggerChange); this.on("change", this, this._change); } }); __exports__["default"] = Select; __exports__.Select = Select; __exports__.SelectOption = SelectOption; __exports__.SelectOptgroup = SelectOptgroup; }); define("ember-handlebars/controls/text_area", ["ember-metal/property_get","ember-views/views/component","ember-handlebars/controls/text_support","ember-metal/mixin","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __exports__) { "use strict"; /** @module ember @submodule ember-handlebars */ var get = __dependency1__.get; var Component = __dependency2__["default"]; var TextSupport = __dependency3__["default"]; var observer = __dependency4__.observer; /** 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 */ __exports__["default"] = Component.extend(TextSupport, { instrumentDisplay: '{{textarea}}', classNames: ['ember-text-area'], tagName: "textarea", attributeBindings: ['rows', 'cols', 'name', 'selectionEnd', 'selectionStart', 'wrap'], rows: null, cols: null, _updateElementValue: 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); } }); }); define("ember-handlebars/controls/text_field", ["ember-metal/property_get","ember-metal/property_set","ember-views/views/component","ember-handlebars/controls/text_support","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __exports__) { "use strict"; /** @module ember @submodule ember-handlebars */ var get = __dependency1__.get; var set = __dependency2__.set; var Component = __dependency3__["default"]; var TextSupport = __dependency4__["default"]; /** The internal class used to create text inputs when the `{{input}}` helper is used with `type` of `text`. See [Handlebars.helpers.input](/api/classes/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 */ __exports__["default"] = Component.extend(TextSupport, { instrumentDisplay: '{{input type="text"}}', classNames: ['ember-text-field'], tagName: "input", attributeBindings: ['type', 'value', 'size', 'pattern', 'name', 'min', 'max', 'accept', 'autocomplete', 'autosave', 'formaction', 'formenctype', 'formmethod', 'formnovalidate', 'formtarget', 'height', 'inputmode', 'list', 'multiple', 'step', 'width'], /** 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` attribute of input element. @property pattern @type String @default null */ pattern: null, /** The `min` attribute of input element used with `type="number"` or `type="range"`. @property min @type String @default null @since 1.4.0 */ min: null, /** The `max` attribute of input element used with `type="number"` or `type="range"`. @property max @type String @default null @since 1.4.0 */ max: null }); }); define("ember-handlebars/controls/text_support", ["ember-metal/property_get","ember-metal/property_set","ember-metal/mixin","ember-runtime/mixins/target_action_support","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __exports__) { "use strict"; /** @module ember @submodule ember-handlebars */ var get = __dependency1__.get; var set = __dependency2__.set; var Mixin = __dependency3__.Mixin; var TargetActionSupport = __dependency4__["default"]; /** Shared mixin used by `Ember.TextField` and `Ember.TextArea`. @class TextSupport @namespace Ember @uses Ember.TargetActionSupport @extends Ember.Mixin @private */ var TextSupport = Mixin.create(TargetActionSupport, { value: "", attributeBindings: ['placeholder', 'disabled', 'maxlength', 'tabindex', 'readonly', 'autofocus', 'form', 'selectionDirection', 'spellcheck', 'required', 'title', 'autocapitalize', 'autocorrect'], 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 = TextSupport.KEY_EVENTS; var method = map[event.keyCode]; this._elementValueDidChange(); if (method) { return this[method](event); } }, _elementValueDidChange: function() { set(this, 'value', this.$().val()); }, /** Called 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. @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. @method cancel @param {Event} event */ cancel: function(event) { sendAction('escape-press', this, event); }, /** Called when the text area is focused. Uses sendAction to send the `focus-in` action. @method focusIn @param {Event} event */ focusIn: function(event) { sendAction('focus-in', this, event); }, /** Called when the text area is blurred. Uses sendAction to send the `focus-out` action. @method focusOut @param {Event} event */ focusOut: function(event) { sendAction('focus-out', this, event); }, /** Called when the user presses a key. Enabled by setting the `onEvent` property to `keyPress`. Uses sendAction to send the `key-press` action. @method keyPress @param {Event} event */ keyPress: function(event) { sendAction('key-press', this, event); } }); TextSupport.KEY_EVENTS = { 13: 'insertNewline', 27: 'cancel' }; // In principle, this shouldn't be necessary, but the legacy // sendAction 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(); } } } __exports__["default"] = TextSupport; }); define("ember-handlebars/ext", ["ember-metal/core","ember-runtime/system/string","ember-handlebars-compiler","ember-metal/property_get","ember-metal/binding","ember-metal/error","ember-metal/mixin","ember-metal/is_empty","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__, __exports__) { "use strict"; var Ember = __dependency1__["default"]; // Ember.FEATURES, Ember.assert, Ember.Handlebars, Ember.lookup // var emberAssert = Ember.assert; var fmt = __dependency2__.fmt; var EmberHandlebars = __dependency3__["default"]; var helpers = EmberHandlebars.helpers; var get = __dependency4__.get; var isGlobalPath = __dependency5__.isGlobalPath; var EmberError = __dependency6__["default"]; var IS_BINDING = __dependency7__.IS_BINDING; // late bound via requireModule because of circular dependencies. var resolveHelper, SimpleHandlebarsView; var isEmpty = __dependency8__["default"]; var slice = [].slice, originalTemplate = EmberHandlebars.template; /** If a path starts with a reserved keyword, returns the root that should be used. @private @method normalizePath @for Ember @param root {Object} @param path {String} @param data {Hash} */ function normalizePath(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 */ function handlebarsGet(root, path, options) { var data = options && options.data, normalizedPath = normalizePath(root, path, data), value; root = normalizedPath.root; path = normalizedPath.path; value = get(root, path); if (value === undefined && root !== Ember.lookup && isGlobalPath(path)) { value = get(Ember.lookup, path); } return value; } /** This method uses `Ember.Handlebars.get` to lookup a value, then ensures that the value is escaped properly. If `unescaped` is a truthy value then the escaping will not be performed. @method getEscaped @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 @since 1.4.0 */ function getEscaped(root, path, options) { var result = handlebarsGet(root, path, options); if (result === null || result === undefined) { result = ""; } else if (!(result instanceof Handlebars.SafeString)) { result = String(result); } if (!options.hash.unescaped){ result = Handlebars.Utils.escapeExpression(result); } return result; } __exports__.getEscaped = getEscaped;function resolveParams(context, params, options) { var resolvedParams = [], types = options.types, param, type; for (var i=0, l=params.length; i{{user.name}}
{{user.role.label}}
{{user.role.id}}

{{user.role.description}}

``` `{{with}}` can be our best friend in these cases, instead of writing `user.role.*` over and over, we use `{{#with user.role}}`. Now the context within the `{{#with}} .. {{/with}}` block is `user.role` so you can do the following: ```handlebars
{{user.name}}
{{#with user.role}}
{{label}}
{{id}}

{{description}}

{{/with}}
``` ### `as` operator This operator aliases the scope to a new name. It's helpful for semantic clarity and to retain default scope or to reference from another `{{with}}` block. ```handlebars // posts might not be {{#with user.posts as blogPosts}}
There are {{blogPosts.length}} blog posts written by {{user.name}}.
{{#each post in blogPosts}}
  • {{post.title}}
  • {{/each}} {{/with}} ``` Without the `as` operator, it would be impossible to reference `user.name` in the example above. NOTE: The alias should not reuse a name from the bound property path. For example: `{{#with foo.bar as foo}}` is not supported because it attempts to alias using the first part of the property path, `foo`. Instead, use `{{#with foo.bar as baz}}`. ### `controller` option Adding `controller='something'` instructs the `{{with}}` helper to create and use an instance of the specified controller with the new context as its content. This is very similar to using an `itemController` option with the `{{each}}` helper. ```handlebars {{#with users.posts controller='userBlogPosts'}} {{!- The current context is wrapped in our controller instance }} {{/with}} ``` In the above example, the template provided to the `{{with}}` block is now wrapped in the `userBlogPost` controller, which provides a very elegant way to decorate the context with custom functions/properties. @method with @for Ember.Handlebars.helpers @param {Function} context @param {Hash} options @return {String} HTML string */ function withHelper(context, options) { var bindContext, preserveContext, controller, helperName = 'with'; if (arguments.length === 4) { var keywordName, path, rootPath, normalized, contextPath; Ember.assert("If you pass more than one argument to the with helper, it must be in the form #with foo as bar", arguments[1] === "as"); options = arguments[3]; keywordName = arguments[2]; path = arguments[0]; if (path) { helperName += ' ' + path + ' as ' + keywordName; } Ember.assert("You must pass a block to the with helper", options.fn && options.fn !== Handlebars.VM.noop); var localizedOptions = o_create(options); localizedOptions.data = o_create(options.data); localizedOptions.data.keywords = o_create(options.data.keywords || {}); if (isGlobalPath(path)) { contextPath = path; } else { normalized = normalizePath(this, path, options.data); path = normalized.path; rootPath = normalized.root; // This is a workaround for the fact that you cannot bind separate objects // together. When we implement that functionality, we should use it here. var contextKey = jQuery.expando + guidFor(rootPath); localizedOptions.data.keywords[contextKey] = rootPath; // if the path is '' ("this"), just bind directly to the current context contextPath = path ? contextKey + '.' + path : contextKey; } localizedOptions.hash.keywordName = keywordName; localizedOptions.hash.keywordPath = contextPath; bindContext = this; context = contextPath; options = localizedOptions; preserveContext = true; } else { Ember.assert("You must pass exactly one argument to the with helper", arguments.length === 2); Ember.assert("You must pass a block to the with helper", options.fn && options.fn !== Handlebars.VM.noop); helperName += ' ' + context; bindContext = options.contexts[0]; preserveContext = false; } options.helperName = helperName; options.isWithHelper = true; return bind.call(bindContext, context, options, preserveContext, exists); } /** See [boundIf](/api/classes/Ember.Handlebars.helpers.html#method_boundIf) and [unboundIf](/api/classes/Ember.Handlebars.helpers.html#method_unboundIf) @method if @for Ember.Handlebars.helpers @param {Function} context @param {Hash} options @return {String} HTML string */ function ifHelper(context, options) { Ember.assert("You must pass exactly one argument to the if helper", arguments.length === 2); Ember.assert("You must pass a block to the if helper", options.fn && options.fn !== Handlebars.VM.noop); options.helperName = options.helperName || ('if ' + context); if (options.data.isUnbound) { return helpers.unboundIf.call(options.contexts[0], context, options); } else { return helpers.boundIf.call(options.contexts[0], context, options); } } /** @method unless @for Ember.Handlebars.helpers @param {Function} context @param {Hash} options @return {String} HTML string */ function unlessHelper(context, options) { Ember.assert("You must pass exactly one argument to the unless helper", arguments.length === 2); Ember.assert("You must pass a block to the unless helper", options.fn && options.fn !== Handlebars.VM.noop); var fn = options.fn, inverse = options.inverse, helperName = 'unless'; if (context) { helperName += ' ' + context; } options.fn = inverse; options.inverse = fn; options.helperName = options.helperName || helperName; if (options.data.isUnbound) { return helpers.unboundIf.call(options.contexts[0], context, options); } else { return helpers.boundIf.call(options.contexts[0], context, options); } } /** `bind-attr` allows you to create a binding between DOM element attributes and Ember objects. For example: ```handlebars imageTitle ``` The above handlebars template will fill the ``'s `src` attribute with 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 A humorous image of a cat ``` `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 imageTitle ``` ### `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 = 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 = 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 */ function bindAttrHelper(options) { var attrs = options.hash; Ember.assert("You must specify at least one hash argument to bind-attr", !!keys(attrs).length); var view = options.data.view; var ret = []; // we relied on the behavior of calling without // context to mean this === window, but when running // "use strict", it's possible for this to === undefined; var ctx = this || window; // 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 = uuid(); // Handle classes differently, as we can bind multiple classes var classBindings = attrs['class']; if (classBindings != null) { var classResults = bindClasses(ctx, classBindings, view, dataId, options); ret.push('class="' + Handlebars.Utils.escapeExpression(classResults.join(' ')) + '"'); delete attrs['class']; } var attrKeys = 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 = 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; 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) { removeObserver(normalized.root, normalized.path, observer); return; } 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 SafeString(ret.join(' ')); } /** See `bind-attr` @method bindAttr @for Ember.Handlebars.helpers @deprecated @param {Function} context @param {Hash} options @return {String} HTML string */ function bindAttrHelperDeprecated() { Ember.warn("The 'bindAttr' view helper is deprecated in favor of 'bind-attr'"); return helpers['bind-attr'].apply(this, arguments); } /** 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. @private @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 {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 */ function bindClasses(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 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; var parsedPath = 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) { removeObserver(pathRoot, path, observer); } 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; } __exports__.bind = bind; __exports__._triageMustacheHelper = _triageMustacheHelper; __exports__.resolveHelper = resolveHelper; __exports__.bindHelper = bindHelper; __exports__.boundIfHelper = boundIfHelper; __exports__.unboundIfHelper = unboundIfHelper; __exports__.withHelper = withHelper; __exports__.ifHelper = ifHelper; __exports__.unlessHelper = unlessHelper; __exports__.bindAttrHelper = bindAttrHelper; __exports__.bindAttrHelperDeprecated = bindAttrHelperDeprecated; __exports__.bindClasses = bindClasses; }); define("ember-handlebars/helpers/collection", ["ember-metal/core","ember-metal/utils","ember-handlebars-compiler","ember-runtime/system/string","ember-metal/property_get","ember-handlebars/ext","ember-handlebars/helpers/view","ember-metal/computed","ember-views/views/collection_view","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__, __dependency9__, __exports__) { "use strict"; /** @module ember @submodule ember-handlebars */ var Ember = __dependency1__["default"]; // Ember.assert, Ember.deprecate var inspect = __dependency2__.inspect; // var emberAssert = Ember.assert; // emberDeprecate = Ember.deprecate; var EmberHandlebars = __dependency3__["default"]; var helpers = EmberHandlebars.helpers; var fmt = __dependency4__.fmt; var get = __dependency5__.get; var handlebarsGet = __dependency6__.handlebarsGet; var ViewHelper = __dependency7__.ViewHelper; var computed = __dependency8__.computed; var CollectionView = __dependency9__["default"]; var alias = computed.alias; /** `{{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 Dave
    Hi Mary
    Hi Sara
    ``` ### Blockless use in a collection 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
    Greetings Dave
    Greetings Mary
    Greetings 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

    Howdy Dave

    Howdy Mary

    Howdy Sara

    ``` @method collection @for Ember.Handlebars.helpers @param {String} path @param {Hash} options @return {String} HTML string @deprecated Use `{{each}}` helper instead. */ function collectionHelper(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; var controller, container; // If passed a path string, convert that into an object. // Otherwise, just default to the standard class. var collectionClass; if (path) { controller = data.keywords.controller; container = controller && controller.container; collectionClass = handlebarsGet(this, path, options) || container.lookupFactory('view:' + path); Ember.assert(fmt("%@ #collection: Could not find collection class %@", [data.view, path]), !!collectionClass); } else { collectionClass = CollectionView; } 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) { 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); container = controller.container; itemViewClass = container.lookupFactory('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 !== EmberHandlebars.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 = this; } else { itemHash._context = alias('content'); } var viewOptions = ViewHelper.propertiesFromHTMLOptions({ data: data, hash: itemHash }, this); hash.itemViewClass = itemViewClass.extend(viewOptions); options.helperName = options.helperName || 'collection'; return helpers.view.call(this, collectionClass, options); } __exports__["default"] = collectionHelper; }); define("ember-handlebars/helpers/debug", ["ember-metal/core","ember-metal/utils","ember-metal/logger","ember-metal/property_get","ember-handlebars/ext","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __exports__) { "use strict"; /*jshint debug:true*/ /** @module ember @submodule ember-handlebars */ var Ember = __dependency1__["default"]; // Ember.FEATURES, var inspect = __dependency2__.inspect; var Logger = __dependency3__["default"]; var get = __dependency4__.get; var normalizePath = __dependency5__.normalizePath; var handlebarsGet = __dependency5__.handlebarsGet; var a_slice = [].slice; /** `log` allows you to output the value of variables in the current rendering context. `log` also accepts primitive types such as strings or numbers. ```handlebars {{log "myVariable:" myVariable }} ``` @method log @for Ember.Handlebars.helpers @param {String} property */ function logHelper() { var params = a_slice.call(arguments, 0, -1), options = arguments[arguments.length - 1], logger = Logger.log, values = [], allowPrimitives = true; for (var i = 0; i < params.length; i++) { var type = options.types[i]; if (type === 'ID' || !allowPrimitives) { var context = (options.contexts && options.contexts[i]) || this, normalized = normalizePath(context, params[i], options.data); if (normalized.path === 'this') { values.push(normalized.root); } else { values.push(handlebarsGet(normalized.root, normalized.path, options)); } } else { values.push(params[i]); } } logger.apply(logger, values); } /** Execute the `debugger` statement in the current context. ```handlebars {{debugger}} ``` Before invoking the `debugger` statement, there are a few helpful variables defined in the body of this helper that you can inspect while debugging that describe how and where this helper was invoked: - templateContext: this is most likely a controller from which this template looks up / displays properties - typeOfTemplateContext: a string description of what the templateContext is For example, if you're wondering why a value `{{foo}}` isn't rendering as expected within a template, you could place a `{{debugger}}` statement, and when the `debugger;` breakpoint is hit, you can inspect `templateContext`, determine if it's the object you expect, and/or evaluate expressions in the console to perform property lookups on the `templateContext`: ``` > templateContext.get('foo') // -> "" ``` @method debugger @for Ember.Handlebars.helpers @param {String} property */ function debuggerHelper(options) { // These are helpful values you can inspect while debugging. var templateContext = this; var typeOfTemplateContext = inspect(templateContext); Ember.Logger.info('Use `this` to access the context of the calling template.'); debugger; } __exports__.logHelper = logHelper; __exports__.debuggerHelper = debuggerHelper; }); define("ember-handlebars/helpers/each", ["ember-metal/core","ember-handlebars-compiler","ember-runtime/system/string","ember-metal/property_get","ember-metal/property_set","ember-views/views/collection_view","ember-metal/binding","ember-runtime/mixins/controller","ember-runtime/controllers/array_controller","ember-runtime/mixins/array","ember-runtime/copy","ember-metal/run_loop","ember-metal/events","ember-handlebars/ext","ember-metal/computed","ember-metal/observer","ember-handlebars/views/metamorph_view","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__, __dependency9__, __dependency10__, __dependency11__, __dependency12__, __dependency13__, __dependency14__, __dependency15__, __dependency16__, __dependency17__, __exports__) { "use strict"; /** @module ember @submodule ember-handlebars */ var Ember = __dependency1__["default"]; // Ember.assert;, Ember.K // var emberAssert = Ember.assert, var K = Ember.K; var EmberHandlebars = __dependency2__["default"]; var helpers = EmberHandlebars.helpers; var fmt = __dependency3__.fmt; var get = __dependency4__.get; var set = __dependency5__.set; var CollectionView = __dependency6__["default"]; var Binding = __dependency7__.Binding; var ControllerMixin = __dependency8__["default"]; var ArrayController = __dependency9__["default"]; var EmberArray = __dependency10__["default"]; var copy = __dependency11__["default"]; var run = __dependency12__["default"]; var on = __dependency13__.on; var handlebarsGet = __dependency14__.handlebarsGet; var computed = __dependency15__.computed; var addObserver = __dependency16__.addObserver; var removeObserver = __dependency16__.removeObserver; var addBeforeObserver = __dependency16__.addBeforeObserver; var removeBeforeObserver = __dependency16__.removeBeforeObserver; var _Metamorph = __dependency17__._Metamorph; var _MetamorphView = __dependency17__._MetamorphView; var EachView = CollectionView.extend(_Metamorph, { init: function() { var itemController = get(this, 'itemController'); var binding; if (itemController) { var controller = get(this, 'controller.container').lookupFactory('controller:array').create({ _isVirtual: true, parentController: get(this, 'controller'), itemController: itemController, target: get(this, 'controller'), _eachView: this }); this.disableContentObservers(function() { set(this, 'content', controller); binding = new Binding('content', '_eachView.dataSource').oneWay(); binding.connect(controller); }); set(this, '_arrayController', controller); } else { this.disableContentObservers(function() { binding = new Binding('content', 'dataSource').oneWay(); binding.connect(this); }); } return this._super(); }, _assertArrayLike: function(content) { Ember.assert(fmt("The value that #each loops over must be an Array. You " + "passed %@, but it should have been an ArrayController", [content.constructor]), !ControllerMixin.detect(content) || (content && content.isGenerated) || content instanceof ArrayController); Ember.assert(fmt("The value that #each loops over must be an Array. You passed %@", [(ControllerMixin.detect(content) && content.get('model') !== undefined) ? fmt("'%@' (wrapped in %@)", [content.get('model'), content]) : content]), EmberArray.detect(content)); }, disableContentObservers: function(callback) { removeBeforeObserver(this, 'content', null, '_contentWillChange'); removeObserver(this, 'content', null, '_contentDidChange'); callback.call(this); addBeforeObserver(this, 'content', null, '_contentWillChange'); addObserver(this, 'content', null, '_contentDidChange'); }, itemViewClass: _MetamorphView, emptyViewClass: _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 = 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 && 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; } }); // Defeatureify doesn't seem to like nested functions that need to be removed function _addMetamorphCheck() { EachView.reopen({ _checkMetamorph: on('didInsertElement', function() { Ember.assert("The metamorph tags, " + this.morph.start + " and " + this.morph.end + ", have different parents.\nThe browser has fixed your template to output valid HTML (for example, check that you have properly closed all tags and have used a TBODY tag when creating a table with '{{#each}}')", document.getElementById( this.morph.start ).parentNode === document.getElementById( this.morph.end ).parentNode ); }) }); } // until ember-debug is es6ed var runInDebug = function(f){ f(); }; runInDebug( function() { _addMetamorphCheck(); }); var GroupedEach = EmberHandlebars.GroupedEach = function(context, path, options) { var self = this, normalized = EmberHandlebars.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: K, contentArrayDidChange: function() { this.rerenderContainingView(); }, lookupContent: function() { return handlebarsGet(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() { addBeforeObserver(this.normalizedRoot, this.normalizedPath, this, this.contentWillChange); addObserver(this.normalizedRoot, this.normalizedPath, this, this.contentDidChange); }, removeContentObservers: function() { removeBeforeObserver(this.normalizedRoot, this.normalizedPath, this.contentWillChange); removeObserver(this.normalizedRoot, this.normalizedPath, this.contentDidChange); }, render: function() { if (!this.content) { return; } var content = this.content, contentLength = get(content, 'length'), options = this.options, data = options.data, template = this.template; data.insideEach = true; for (var i = 0; i < contentLength; i++) { var context = content.objectAt(i); options.data.keywords[options.hash.keyword] = context; template(context, { data: data }); } }, rerenderContainingView: function() { var self = this; 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
    Greetings Dave
    Greetings Mary
    Greetings Sara
    ``` 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 `model` 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('model.isEmployed') && this.get('model.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 */ function eachHelper(path, options) { var ctx, helperName = 'each'; 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]; helperName += ' ' + keywordName + ' in ' + path; if (path === '') { path = "this"; } options.hash.keyword = keywordName; } else if (arguments.length === 1) { options = path; path = 'this'; } else { helperName += ' ' + path; } options.hash.dataSourceBinding = path; // Set up emptyView as a metamorph with no tag //options.hash.emptyViewClass = Ember._MetamorphView; // can't rely on this default behavior when use strict ctx = this || window; options.helperName = options.helperName || helperName; if (options.data.insideGroup && !options.hash.groupedRows && !options.hash.itemViewClass) { new GroupedEach(ctx, path, options).render(); } else { // ES6TODO: figure out how to do this without global lookup. return helpers.collection.call(ctx, 'Ember.Handlebars.EachView', options); } } __exports__.EachView = EachView; __exports__.GroupedEach = GroupedEach; __exports__.eachHelper = eachHelper; }); define("ember-handlebars/helpers/loc", ["ember-runtime/system/string","exports"], function(__dependency1__, __exports__) { "use strict"; var loc = __dependency1__.loc; /** @module ember @submodule ember-handlebars */ // ES6TODO: // Pretty sure this can be expressed as // var locHelper EmberStringUtils.loc ? /** Calls [Ember.String.loc](/api/classes/Ember.String.html#method_loc) with the provided string. This is a convenient way to localize text. For example: ```html ``` Take note that `"welcome"` is a string and not an object reference. See [Ember.String.loc](/api/classes/Ember.String.html#method_loc) for how to set up localized string references. @method loc @for Ember.Handlebars.helpers @param {String} str The string to format @see {Ember.String#loc} */ __exports__["default"] = function locHelper(str) { return loc(str); } }); define("ember-handlebars/helpers/partial", ["ember-metal/core","ember-metal/is_none","ember-handlebars/ext","ember-handlebars/helpers/binding","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __exports__) { "use strict"; var Ember = __dependency1__["default"]; // Ember.assert // var emberAssert = Ember.assert; var isNone = __dependency2__.isNone; var handlebarsGet = __dependency3__.handlebarsGet; var bind = __dependency4__.bind; /** @module ember @submodule ember-handlebars */ /** The `partial` helper renders another template without changing the template context: ```handlebars {{foo}} {{partial "nav"}} ``` The above example template will render a template named "_nav", which has the same context as the parent template it's rendered into, so if the "_nav" template also referenced `{{foo}}`, it would print the same thing as the `{{foo}}` in the above example. If a "_nav" template isn't found, the `partial` helper will fall back to a template named "nav". ## Bound template names The parameter supplied to `partial` can also be a path to a property containing a template name, e.g.: ```handlebars {{partial someTemplateName}} ``` The above example will look up the value of `someTemplateName` on the template context (e.g. a controller) and use that value as the name of the template to render. If the resolved value is falsy, nothing will be rendered. If `someTemplateName` changes, the partial will be re-rendered using the new template name. ## Setting the partial's context with `with` The `partial` helper can be used in conjunction with the `with` helper to set a context that will be used by the partial: ```handlebars {{#with currentUser}} {{partial "user_info"}} {{/with}} ``` @method partial @for Ember.Handlebars.helpers @param {String} partialName the name of the template to render minus the leading underscore */ __exports__["default"] = function partialHelper(name, options) { var context = (options.contexts && options.contexts.length) ? options.contexts[0] : this; options.helperName = options.helperName || 'partial'; if (options.types[0] === "ID") { // Helper was passed a property path; we need to // create a binding that will re-render whenever // this property changes. options.fn = function(context, fnOptions) { var partialName = handlebarsGet(context, name, fnOptions); renderPartial(context, partialName, fnOptions); }; return bind.call(context, name, options, true, exists); } else { // Render the partial right into parent template. renderPartial(context, name, options); } } function exists(value) { return !isNone(value); } function renderPartial(context, name, options) { var nameParts = name.split("/"); var lastPart = nameParts[nameParts.length - 1]; nameParts[nameParts.length - 1] = "_" + lastPart; var view = options.data.view; var underscoredName = nameParts.join("/"); var template = view.templateForName(underscoredName); var deprecatedTemplate = !template && view.templateForName(name); Ember.assert("Unable to find partial with name '"+name+"'.", template || deprecatedTemplate); template = template || deprecatedTemplate; template(context, { data: options.data }); } }); define("ember-handlebars/helpers/shared", ["ember-handlebars/ext","exports"], function(__dependency1__, __exports__) { "use strict"; var handlebarsGet = __dependency1__.handlebarsGet; __exports__["default"] = function resolvePaths(options) { var ret = [], contexts = options.contexts, roots = options.roots, data = options.data; for (var i=0, l=contexts.length; i {{#with loggedInUser}} Last Login: {{lastLogin}} User Info: {{template "user_info"}} {{/with}} ``` ```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 `"; 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. var movesWhitespace = typeof document !== 'undefined' && (function() { var testEl = document.createElement('div'); testEl.innerHTML = "Test: Value"; return testEl.childNodes[0].nodeValue === 'Test:' && testEl.childNodes[2].nodeValue === ' Value'; })(); // Use this to find children by ID instead of using jQuery var findChildById = function(element, id) { if (element.getAttribute('id') === id) { return element; } var len = element.childNodes.length, idx, node, found; for (idx=0; idx 0) { var len = matches.length, idx; for (idx=0; idxTest'); canSet = el.options.length === 1; } innerHTMLTags[tagName] = canSet; return canSet; }; function setInnerHTML(element, html) { var tagName = element.tagName; if (canSetInnerHTML(tagName)) { setInnerHTMLWithoutFix(element, html); } else { // Firefox versions < 11 do not have support for element.outerHTML. var outerHTML = element.outerHTML || new XMLSerializer().serializeToString(element); Ember.assert("Can't set innerHTML on "+element.tagName+" in this browser", outerHTML); var startTag = outerHTML.match(new RegExp("<"+tagName+"([^>]*)>", 'i'))[0], endTag = ''; var wrapper = document.createElement('div'); setInnerHTMLWithoutFix(wrapper, startTag + html + endTag); element = wrapper.firstChild; while (element.tagName !== tagName) { element = element.nextSibling; } } return element; } __exports__.setInnerHTML = setInnerHTML;function isSimpleClick(event) { var modifier = event.shiftKey || event.metaKey || event.altKey || event.ctrlKey, secondaryClick = event.which > 1; // IE9 may return undefined return !modifier && !secondaryClick; } __exports__.isSimpleClick = isSimpleClick; }); define("ember-views/views/collection_view", ["ember-metal/core","ember-metal/platform","ember-metal/binding","ember-metal/merge","ember-metal/property_get","ember-metal/property_set","ember-runtime/system/string","ember-views/views/container_view","ember-views/views/core_view","ember-views/views/view","ember-metal/mixin","ember-runtime/mixins/array","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__, __dependency9__, __dependency10__, __dependency11__, __dependency12__, __exports__) { "use strict"; /** @module ember @submodule ember-views */ var Ember = __dependency1__["default"]; // Ember.assert var create = __dependency2__.create; var isGlobalPath = __dependency3__.isGlobalPath; var merge = __dependency4__["default"]; var get = __dependency5__.get; var set = __dependency6__.set; var fmt = __dependency7__.fmt; var ContainerView = __dependency8__["default"]; var CoreView = __dependency9__["default"]; var View = __dependency10__["default"]; var observer = __dependency11__.observer; var beforeObserver = __dependency11__.beforeObserver; var EmberArray = __dependency12__["default"]; /** `Ember.CollectionView` is an `Ember.View` descendent responsible for managing a collection (an array or array-like object) by maintaining a child view object and associated DOM representation for each item in the array and ensuring that child views and their associated rendered HTML are updated when items in the array are added, removed, or replaced. ## Setting content The managed collection of objects is referenced as the `Ember.CollectionView` instance's `content` property. ```javascript someItemsView = Ember.CollectionView.create({ content: ['A', 'B','C'] }) ``` The view for each item in the collection will have its `content` property set to the item. ## Specifying itemViewClass By default the view class for each item in the managed collection will be an instance of `Ember.View`. You can supply a different class by setting the `CollectionView`'s `itemViewClass` property. Given an empty `` 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
    the letter: A
    the letter: B
    the letter: C
    ``` ## 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 anUnorderedListView = Ember.CollectionView.create({ tagName: 'ul', content: ['A','B','C'], itemViewClass: Ember.View.extend({ template: Ember.Handlebars.compile("the letter: {{view.content}}") }) }); anUnorderedListView.appendTo('body'); ``` Will result in the following HTML structure ```html
    • the letter: A
    • the letter: B
    • the letter: C
    ``` Additional `tagName` pairs can be provided by adding to `Ember.CollectionView.CONTAINER_MAP ` ```javascript Ember.CollectionView.CONTAINER_MAP['article'] = 'section' ``` ## Programmatic creation of child views For cases where additional customization beyond the use of a single `itemViewClass` or `tagName` matching is required CollectionView's `createChildView` method can be overidden: ```javascript CustomCollectionView = Ember.CollectionView.extend({ createChildView: function(viewClass, attrs) { if (attrs.content.kind == 'album') { viewClass = App.AlbumView; } else { viewClass = App.SongView; } return this._super(viewClass, attrs); } }); ``` ## Empty View You can provide an `Ember.View` subclass to the `Ember.CollectionView` instance as its `emptyView` property. If the `content` property of a `CollectionView` is set to `null` or an empty array, an instance of this view will be the `CollectionView`s only child. ```javascript aListWithNothing = Ember.CollectionView.create({ classNames: ['nothing'] content: null, emptyView: Ember.View.extend({ template: Ember.Handlebars.compile("The collection is empty") }) }); aListWithNothing.appendTo('body'); ``` Will result in the following HTML structure ```html
    The collection is empty
    ``` ## 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 */ var CollectionView = ContainerView.extend({ /** A list of items to be displayed by the `Ember.CollectionView`. @property content @type Ember.Array @default null */ content: null, /** This provides metadata about what kind of empty view class this collection would like if it is being instantiated from another system (like Handlebars) @private @property emptyViewClass */ emptyViewClass: 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: View, /** Setup a CollectionView @method init */ init: function() { var ret = this._super(); this._contentDidChange(); return ret; }, /** Invoked when the content property is about to change. Notifies observers that the entire array content will change. @private @method _contentWillChange */ _contentWillChange: 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); }), /** 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. @private @method _contentDidChange */ _contentDidChange: 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); }), /** Ensure that the content implements Ember.Array @private @method _assertArrayLike */ _assertArrayLike: function(content) { Ember.assert(fmt("an Ember.CollectionView's content must implement Ember.Array. You passed %@", [content]), EmberArray.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 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 && isGlobalPath(itemViewClass)) { itemViewClass = get(itemViewClass) || itemViewClass; } Ember.assert(fmt("itemViewClass must be a subclass of Ember.View, not %@", [itemViewClass]), 'string' === typeof itemViewClass || 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 && isGlobalPath(emptyView)) { emptyView = get(emptyView) || emptyView; } emptyView = this.createChildView(emptyView); addedViews.push(emptyView); set(this, 'emptyView', emptyView); if (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 = 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 */ CollectionView.CONTAINER_MAP = { ul: 'li', ol: 'li', table: 'tr', thead: 'tr', tbody: 'tr', tfoot: 'tr', tr: 'td', select: 'option' }; __exports__["default"] = CollectionView; }); define("ember-views/views/component", ["ember-metal/core","ember-views/mixins/component_template_deprecation","ember-runtime/mixins/target_action_support","ember-views/views/view","ember-metal/property_get","ember-metal/property_set","ember-metal/is_none","ember-metal/computed","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__, __exports__) { "use strict"; var Ember = __dependency1__["default"]; // Ember.assert, Ember.Handlebars var ComponentTemplateDeprecation = __dependency2__["default"]; var TargetActionSupport = __dependency3__["default"]; var View = __dependency4__["default"]; var get = __dependency5__.get; var set = __dependency6__.set; var isNone = __dependency7__.isNone; var computed = __dependency8__.computed; var 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 must be 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. ```handlebars {{app-profile person=currentUser}} ``` ```handlebars

    {{person.title}}

    {{person.signature}}

    ``` You can use `yield` inside a template to include the **contents** of any block attached to the component. The block will be executed in the context of the surrounding context or outer controller: ```handlebars {{#app-profile person=currentUser}}

    Admin mode

    {{! Executed in the controller's context. }} {{/app-profile}} ``` ```handlebars

    {{person.title}}

    {{! Executed in the components context. }} {{yield}} {{! block contents }} ``` 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: ```handlebars

    {{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 */ var Component = View.extend(TargetActionSupport, ComponentTemplateDeprecation, { instrumentName: 'component', instrumentDisplay: computed(function() { if (this._debugContainerKey) { return '{{' + this._debugContainerKey.split(':')[1] + '}}'; } }), init: function() { this._super(); set(this, 'origContext', get(this, 'context')); set(this, 'context', this); set(this, 'controller', this); }, defaultLayout: function(context, options){ Ember.Handlebars.helpers['yield'].call(context, options); }, /** A components template property is set by passing a block during its invocation. It is executed within the parent context. Example: ```handlebars {{#my-component}} // something that is run in the context // of the parent context {{/my-component}} ``` Specifying a template directly to a component is deprecated without also specifying the layout property. @deprecated @property template */ template: 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'), /** Specifying a components `templateName` is deprecated without also providing the `layout` or `layoutName` properties. @deprecated @property templateName */ templateName: null, // 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(View, { isVirtual: true, tagName: '', _contextView: parentView, template: template, context: options.data.insideGroup ? get(this, 'origContext') : get(parentView, 'context'), controller: get(parentView, 'controller'), templateData: { keywords: parentView.cloneKeywords(), insideGroup: options.data.insideGroup } }); } }, /** 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: 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.sendAction('play'); } else { this.sendAction('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 }); } }); __exports__["default"] = Component; }); define("ember-views/views/container_view", ["ember-metal/core","ember-metal/merge","ember-runtime/mixins/mutable_array","ember-metal/property_get","ember-metal/property_set","ember-views/views/view","ember-views/views/view_collection","ember-views/views/states","ember-metal/error","ember-metal/enumerable_utils","ember-metal/computed","ember-metal/run_loop","ember-metal/properties","ember-views/system/render_buffer","ember-metal/mixin","ember-runtime/system/native_array","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__, __dependency9__, __dependency10__, __dependency11__, __dependency12__, __dependency13__, __dependency14__, __dependency15__, __dependency16__, __exports__) { "use strict"; var Ember = __dependency1__["default"]; // Ember.assert, Ember.K var merge = __dependency2__["default"]; var MutableArray = __dependency3__["default"]; var get = __dependency4__.get; var set = __dependency5__.set; var View = __dependency6__["default"]; var ViewCollection = __dependency7__["default"]; var cloneStates = __dependency8__.cloneStates; var EmberViewStates = __dependency8__.states; var EmberError = __dependency9__["default"]; var forEach = __dependency10__.forEach; var computed = __dependency11__.computed; var run = __dependency12__["default"]; var defineProperty = __dependency13__.defineProperty; var renderBuffer = __dependency14__["default"]; var observer = __dependency15__.observer; var beforeObserver = __dependency15__.beforeObserver; var emberA = __dependency16__.A; /** @module ember @submodule ember-views */ var states = cloneStates(EmberViewStates); /** A `ContainerView` is an `Ember.View` subclass that implements `Ember.MutableArray` allowing programmatic 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 programmatic 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
    A
    B
    ``` 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
    ``` 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
    B
    ``` 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, ] ``` Will result in the following HTML ```html
    A
    B
    Another view
    ``` ## 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 */ var ContainerView = View.extend(MutableArray, { _states: states, willWatchProperty: function(prop){ Ember.deprecate( "ContainerViews should not be observed as arrays. This behavior will change in future implementations of ContainerView.", !prop.match(/\[]/) && prop.indexOf('@') !== 0 ); }, init: function() { this._super(); var childViews = get(this, 'childViews'); // redefine view's childViews property that was obliterated defineProperty(this, 'childViews', 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 - the child is already a child of another view", emberA(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: computed(function () { return this._childViews.length; })["volatile"](), /** Instructs each child view to render to the passed render buffer. @private @method render @param {Ember.RenderBuffer} buffer the buffer to render to */ render: function(buffer) { this.forEachChildView(function(view) { view.renderToBuffer(buffer); }); }, instrumentName: 'container', /** 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. @private @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; }, /** 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. @private @method childViewsDidChange @param {Ember.Array} views the array of child views after the mutation has occurred @param {Number} start the start position of the mutation @param {Number} removed the number of child views removed @param {Number} added 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: beforeObserver('currentView', function() { var currentView = get(this, 'currentView'); if (currentView) { currentView.destroy(); } }), _currentViewDidChange: 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); } }); merge(states._default, { childViewsWillChange: Ember.K, childViewsDidChange: Ember.K, ensureChildrenAreInDOM: Ember.K }); merge(states.inBuffer, { childViewsDidChange: function(parentView, views, start, added) { throw new EmberError('You cannot modify child views while in the inBuffer state'); } }); merge(states.hasElement, { childViewsWillChange: function(view, views, start, removed) { for (var i=start; i ``` ## HTML `class` Attribute The HTML `class` attribute of a view's tag can be set by providing a `classNames` property that is set to an array of strings: ```javascript MyView = Ember.View.extend({ classNames: ['my-class', 'my-other-class'] }); ``` Will result in view instances with an HTML representation of: ```html
    ``` `class` attribute values can also be set by providing a `classNameBindings` property set to an array of properties names for the view. The return value of these properties will be added as part of the value for the view's `class` attribute. These properties can be computed properties: ```javascript MyView = Ember.View.extend({ classNameBindings: ['propertyA', 'propertyB'], propertyA: 'from-a', propertyB: function() { if (someLogic) { return 'from-b'; } }.property() }); ``` Will result in view instances with an HTML representation of: ```html
    ``` If the value of a class name binding returns a boolean the property name itself will be used as the class name if the property is true. The class name will not be added if the value is `false` or `undefined`. ```javascript MyView = Ember.View.extend({ classNameBindings: ['hovered'], hovered: true }); ``` Will result in view instances with an HTML representation of: ```html
    ``` When using boolean class name bindings you can supply a string value other than the property name for use as the `class` HTML attribute by appending the preferred value after a ":" character when defining the binding: ```javascript MyView = Ember.View.extend({ classNameBindings: ['awesome:so-very-cool'], awesome: true }); ``` Will result in view instances with an HTML representation of: ```html
    ``` Boolean value class name bindings whose property names are in a camelCase-style format will be converted to a dasherized format: ```javascript MyView = Ember.View.extend({ classNameBindings: ['isUrgent'], isUrgent: true }); ``` Will result in view instances with an HTML representation of: ```html
    ``` Class name bindings can also refer to object values that are found by traversing a path relative to the view itself: ```javascript MyView = Ember.View.extend({ classNameBindings: ['messages.empty'] messages: Ember.Object.create({ empty: true }) }); ``` Will result in view instances with an HTML representation of: ```html
    ``` If you want to add a class name for a property which evaluates to true and and a different class name if it evaluates to false, you can pass a binding like this: ```javascript // Applies 'enabled' class when isEnabled is true and 'disabled' when isEnabled is false Ember.View.extend({ classNameBindings: ['isEnabled:enabled:disabled'] isEnabled: true }); ``` Will result in view instances with an HTML representation of: ```html
    ``` When isEnabled is `false`, the resulting HTML reprensentation looks like this: ```html
    ``` This syntax offers the convenience to add a class if a property is `false`: ```javascript // Applies no class when isEnabled is true and class 'disabled' when isEnabled is false Ember.View.extend({ classNameBindings: ['isEnabled::disabled'] isEnabled: true }); ``` Will result in view instances with an HTML representation of: ```html
    ``` When the `isEnabled` property on the view is set to `false`, it will result in view instances with an HTML representation of: ```html
    ``` Updates to the the value of a class name binding will result in automatic update of the HTML `class` attribute in the view's rendered HTML representation. If the value becomes `false` or `undefined` the class name will be removed. Both `classNames` and `classNameBindings` are concatenated properties. See [Ember.Object](/api/classes/Ember.Object.html) documentation for more information about concatenated properties. ## HTML Attributes The HTML attribute section of a view's tag can be set by providing an `attributeBindings` property set to an array of property names on the view. The return value of these properties will be used as the value of the view's HTML associated attribute: ```javascript AnchorView = Ember.View.extend({ tagName: 'a', attributeBindings: ['href'], href: 'http://google.com' }); ``` Will result in view instances with an HTML representation of: ```html ``` One property can be mapped on to another by placing a ":" between the source property and the destination property: ```javascript AnchorView = Ember.View.extend({ tagName: 'a', attributeBindings: ['url:href'], url: 'http://google.com' }); ``` Will result in view instances with an HTML representation of: ```html ``` If the return value of an `attributeBindings` monitored property is a boolean the property will follow HTML's pattern of repeating the attribute's name as its value: ```javascript MyTextInput = Ember.View.extend({ tagName: 'input', attributeBindings: ['disabled'], disabled: true }); ``` Will result in view instances with an HTML representation of: ```html ``` `attributeBindings` can refer to computed properties: ```javascript MyTextInput = Ember.View.extend({ tagName: 'input', attributeBindings: ['disabled'], disabled: function() { if (someLogic) { return true; } else { return false; } }.property() }); ``` Updates to the the property of an attribute binding will result in automatic update of the HTML attribute in the view's rendered HTML representation. `attributeBindings` is a concatenated property. See [Ember.Object](/api/classes/Ember.Object.html) documentation for more information about concatenated properties. ## Templates The HTML contents of a view's rendered representation are determined by its template. Templates can be any function that accepts an optional context parameter and returns a string of HTML that will be inserted within the view's tag. Most typically in Ember this function will be a compiled `Ember.Handlebars` template. ```javascript AView = Ember.View.extend({ template: Ember.Handlebars.compile('I am the template') }); ``` Will result in view instances with an HTML representation of: ```html
    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' }); ``` If you have nested resources, your Handlebars template will look like this: ```html ``` And `templateName` property: ```javascript AView = Ember.View.extend({ templateName: 'posts/new' }); ``` 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
    I got wrapped
    ``` 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` * `dragOver` * `dragEnd` * `drop` ## 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 */ var View = CoreView.extend({ concatenatedProperties: ['classNames', 'classNameBindings', 'attributeBindings'], /** @property isView @type Boolean @default true @static */ 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, /** Used to identify this view during debugging @property instrumentDisplay @type String */ instrumentDisplay: computed(function() { if (this.helperName) { return '{{' + this.helperName + '}}'; } }), /** 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: computed('templateName', 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'); }), /** 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: computed('_parentView', function(key) { var parentView = get(this, '_parentView'); return parentView ? get(parentView, 'controller') : null; }), /** 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: 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); if (!this.container) { throw new EmberError('Container was not found when looking up a views template. ' + 'This is most likely due to manually instantiating an Ember.View. ' + 'See: http://git.io/EKPpnA'); } return this.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: computed(function(key, value) { if (arguments.length === 2) { set(this, '_context', value); return value; } else { return get(this, '_context'); } })["volatile"](), /** 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 @private */ _context: computed(function(key) { var parentView, controller; if (controller = get(this, 'controller')) { return controller; } parentView = this._parentView; if (parentView) { return get(parentView, '_context'); } return null; }), /** If a value that affects template rendering changes, the view should be re-rendered to reflect the new value. @method _contextDidChange @private */ _contextDidChange: observer('context', function() { this.rerender(); }), /** If `false`, the view will appear hidden in DOM. @property isVisible @type Boolean @default null */ isVisible: true, /** Array of child views. You should never edit this array directly. Instead, use `appendChild` and `removeFromParent`. @property childViews @type Array @default [] @private */ childViews: childViewsProperty, _childViews: EMPTY_ARRAY, // When it's a virtual view, we need to notify the parent that their // childViews will change. _childViewsWillChange: beforeObserver('childViews', function() { if (this.isVirtual) { var parentView = get(this, 'parentView'); if (parentView) { propertyWillChange(parentView, 'childViews'); } } }), // When it's a virtual view, we need to notify the parent that their // childViews did change. _childViewsDidChange: observer('childViews', function() { if (this.isVirtual) { var parentView = get(this, 'parentView'); if (parentView) { propertyDidChange(parentView, 'childViews'); } } }), /** Return the nearest ancestor that is an instance of the provided class. @method 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. @method 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 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. @method 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`. @method 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'); } }, /** When the parent view changes, recursively invalidate `controller` @method _parentViewDidChange @private */ _parentViewDidChange: observer('_parentView', function() { if (this.isDestroying) { return; } this.trigger('parentViewDidChange'); if (get(this, 'parentView.controller') && !get(this, 'controller')) { this.notifyPropertyChange('controller'); } }), _controllerDidChange: 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 ? copy(templateData.keywords) : {}; set(keywords, 'view', this.isVirtual ? keywords.view : this); 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(); } } }, /** 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 @private */ _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') forEach(classBindings, function(binding) { Ember.assert("classNameBindings must not have spaces in them. Multiple class name bindings can be provided as elements of an array, e.g. ['foo', ':bar']", binding.indexOf(' ') === -1); // 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 = 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. 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); }, _unspecifiedAttributeBindings: null, /** 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 @private */ _applyAttributeBindings: function(buffer, attributeBindings) { var attributeValue, unspecifiedAttributeBindings = this._unspecifiedAttributeBindings = this._unspecifiedAttributeBindings || {}; forEach(attributeBindings, function(binding) { var split = binding.split(':'), property = split[0], attributeName = split[1] || property; if (property in this) { this._setupAttributeBindingObservation(property, attributeName); // Determine the current value and add it to the render buffer // if necessary. attributeValue = get(this, property); View.applyAttributeBindings(buffer, attributeName, attributeValue); } else { unspecifiedAttributeBindings[property] = attributeName; } }, this); // Lazily setup setUnknownProperty after attributeBindings are initially applied this.setUnknownProperty = this._setUnknownProperty; }, _setupAttributeBindingObservation: function(property, attributeName) { var attributeValue, elem; // Create an observer to add/remove/change the attribute if the // JavaScript property changes. var observer = function() { elem = this.$(); attributeValue = get(this, property); View.applyAttributeBindings(elem, attributeName, attributeValue); }; this.registerObserver(this, property, observer); }, /** We're using setUnknownProperty as a hook to setup attributeBinding observers for properties that aren't defined on a view at initialization time. Note: setUnknownProperty will only be called once for each property. @method setUnknownProperty @param key @param value @private */ setUnknownProperty: null, // Gets defined after initialization by _applyAttributeBindings _setUnknownProperty: function(key, value) { var attributeName = this._unspecifiedAttributeBindings && this._unspecifiedAttributeBindings[key]; if (attributeName) { this._setupAttributeBindingObservation(key, attributeName); } defineProperty(this, key); return set(this, key, value); }, /** 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 @private */ _classStringForProperty: function(property) { var parsedPath = View._parsePropertyPath(property); var path = parsedPath.path; var val = get(this, path); if (val === undefined && isGlobalPath(path)) { val = get(Ember.lookup, path); } return View._classStringForValue(path, val, parsedPath.className, parsedPath.falsyClassName); }, // .......................................................... // ELEMENT SUPPORT // /** Returns the current DOM element for the view. @property element @type DOMElement */ element: computed('_parentView', function(key, value) { if (value !== undefined) { return this.currentState.setElement(this, value); } else { return this.currentState.getElement(this); } }), /** 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", jQuery(target).length > 0); Ember.assert("You cannot append to an existing Ember.View. Consider using Ember.ContainerView instead.", !jQuery(target).is('.ember-view') && !jQuery(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} target 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", jQuery(target).length > 0); Ember.assert("You cannot replace an existing Ember.View. Consider using Ember.ContainerView instead.", !jQuery(target).is('.ember-view') && !jQuery(target).parents().is('.ember-view')); this._insertElementLater(function() { jQuery(target).empty(); this.$().appendTo(target); }); return this; }, /** 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 @private */ _insertElementLater: function(fn) { this._scheduledInsert = 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 jQuery(id)[0] || jQuery(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, /** Run this callback on the current view (unless includeSelf is false) and recursively on child views. @method invokeRecursively @param fn {Function} @param includeSelf {Boolean} Includes itself if true. @private */ 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` tag for views. @property tagName @type String @default null */ // We leave this null by default so we can tell the difference between // the default case and a user-specified tag. tagName: null, /** The WAI-ARIA role of the control represented by this view. For example, a button may have a role of type 'button', or a pane may have a role of type 'alertdialog'. This property is used by assistive software to help visually challenged users navigate rich web applications. The full list of valid WAI-ARIA roles is available at: [http://www.w3.org/TR/wai-aria/roles#roles_categorization](http://www.w3.org/TR/wai-aria/roles#roles_categorization) @property ariaRole @type String @default null */ ariaRole: null, /** Standard CSS class names to apply to the view's outer element. This property automatically inherits any class names defined by the view's superclasses as well. @property classNames @type Array @default ['ember-view'] */ classNames: ['ember-view'], /** A list of properties of the view to apply as class names. If the property is a string value, the value of that string will be applied as a class name. ```javascript // Applies the 'high' class to the view element Ember.View.extend({ classNameBindings: ['priority'] priority: 'high' }); ``` If the value of the property is a Boolean, the name of that property is added as a dasherized class name. ```javascript // Applies the 'is-urgent' class to the view element Ember.View.extend({ classNameBindings: ['isUrgent'] isUrgent: true }); ``` If you would prefer to use a custom value instead of the dasherized property name, you can pass a binding like this: ```javascript // Applies the 'urgent' class to the view element Ember.View.extend({ classNameBindings: ['isUrgent:urgent'] isUrgent: true }); ``` This list of properties is inherited from the view's superclasses as well. @property classNameBindings @type Array @default [] */ classNameBindings: EMPTY_ARRAY, /** A list of properties of the view to apply as attributes. If the property is a string value, the value of that string will be applied as the attribute. ```javascript // Applies the type attribute to the element // with the value "button", like
    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 // /** 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 @private */ 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'", typeOf(this.classNameBindings) === 'array'); this.classNameBindings = emberA(this.classNameBindings.slice()); Ember.assert("Only arrays are allowed for 'classNames'", typeOf(this.classNames) === 'array'); this.classNames = emberA(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; 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 (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 ViewKlass = this.container.lookupFactory(fullName); Ember.assert("Could not find view: '" + fullName + "'", !!ViewKlass); attrs.templateData = get(this, 'templateData'); view = ViewKlass.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'); } setProperties(view, attrs); } return view; }, becameVisible: Ember.K, becameHidden: Ember.K, /** When the view's `isVisible` property changes, toggle the visibility element of the actual DOM element. @method _isVisibleDidChange @private */ _isVisibleDidChange: observer('isVisible', function() { if (this._isVisible === get(this, 'isVisible')) { return ; } run.scheduleOnce('render', this, this._toggleVisibility); }), _toggleVisibility: function() { var $el = this.$(); if (!$el) { return; } var isVisible = get(this, 'isVisible'); if (this._isVisible === isVisible) { return ; } $el.toggle(isVisible); this._isVisible = 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(nullViewsBuffer); }, transitionTo: function(state, children) { Ember.deprecate("Ember.View#transitionTo has been deprecated, it is for internal use only"); this._transitionTo(state, children); }, _transitionTo: function(state, children) { var priorState = this.currentState; var 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') { meta(this).cache.element = undefined; } if (children !== false) { this.forEachChildView(function(view) { view._transitionTo(state); }); } }, // ....................................................... // EVENT HANDLING // /** Handle events from `Ember.EventDispatcher` @method handleEvent @param eventName {String} @param evt {Event} @private */ 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() { run.scheduleOnce('render', this, stateCheckedObserver); }; addObserver(root, path, target, scheduledObserver); this.one('willClearRender', function() { removeObserver(root, path, target, scheduledObserver); }); } }); deprecateProperty(View.prototype, 'state', '_state'); deprecateProperty(View.prototype, 'states', '_states'); /* 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 * hasElement: the DOM representation of the view is created, and is ready to be inserted * 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() { run.once(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() { jQuery(element).replaceWith(get(view, 'element')); notifyMutationListeners(); }); }, remove: function(view) { view.$().remove(); notifyMutationListeners(); }, empty: function(view) { view.$().empty(); notifyMutationListeners(); } }; View.reopen({ domManager: DOMManager }); View.reopenClass({ /** 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 @private */ _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 }; }, /** 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 @private */ _classStringForValue: function(path, val, className, falsyClassName) { if(isArray(val)) { val = get(val, 'length') !== 0; } // 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 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 = EmberObject.extend(Evented).create(); View.addMutationListener = function(callback) { mutation.on('change', callback); }; View.removeMutationListener = function(callback) { mutation.off('change', callback); }; View.notifyMutationListeners = function() { mutation.trigger('change'); }; /** Global views hash @property views @static @type Hash */ 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. View.childViewsProperty = childViewsProperty; View.applyAttributeBindings = function(elem, name, value) { var type = 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') { if (isNone(value) || value === false) { // `null`, `undefined` or `false` should remove attribute elem.removeAttr(name); // In IE8 `prop` couldn't remove attribute when name is `required`. if (name === 'required') { elem.removeProp(name); } else { elem.prop(name, ''); } } else if (value !== elem.prop(name)) { // value should always be properties elem.prop(name, value); } } else if (!value) { elem.removeAttr(name); } }; __exports__["default"] = View; }); define("ember-views/views/view_collection", ["ember-metal/enumerable_utils","exports"], function(__dependency1__, __exports__) { "use strict"; var forEach = __dependency1__.forEach; function ViewCollection(initialViews) { var views = this.views = initialViews || []; this.length = views.length; } ViewCollection.prototype = { length: 0, trigger: function(eventName) { var views = this.views, view; for (var i = 0, l = views.length; i < l; i++) { view = views[i]; if (view.trigger) { view.trigger(eventName); } } }, triggerRecursively: function(eventName) { var views = this.views; for (var i = 0, l = views.length; i < l; i++) { views[i].triggerRecursively(eventName); } }, invokeRecursively: function(fn) { var views = this.views, view; for (var i = 0, l = views.length; i < l; i++) { view = views[i]; fn(view); } }, transitionTo: function(state, children) { var views = this.views; for (var i = 0, l = views.length; i < l; i++) { views[i]._transitionTo(state, children); } }, push: function() { this.length += arguments.length; var views = this.views; return views.push.apply(views, arguments); }, objectAt: function(idx) { return this.views[idx]; }, forEach: function(callback) { var views = this.views; return forEach(views, callback); }, clear: function() { this.length = 0; this.views.length = 0; } }; __exports__["default"] = ViewCollection; }); define("ember", ["ember-metal","ember-runtime","ember-handlebars","ember-views","ember-routing","ember-routing-handlebars","ember-application","ember-extension-support"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__) { // Remove "use strict"; from transpiled module until // https://bugs.webkit.org/show_bug.cgi?id=138038 is fixed // // REMOVE_USE_STRICT: true // require the main entry points for each of these packages // this is so that the global exports occur properly // do this to ensure that Ember.Test is defined properly on the global // if it is present. if (Ember.__loader.registry['ember-testing']) { requireModule('ember-testing'); } /** Ember @module ember */ function throwWithMessage(msg) { return function() { throw new Ember.Error(msg); }; } function generateRemovedClass(className) { var msg = " has been moved into a plugin: https://github.com/emberjs/ember-states"; return { extend: throwWithMessage(className + msg), create: throwWithMessage(className + msg) }; } Ember.StateManager = generateRemovedClass("Ember.StateManager"); /** This was exported to ember-states plugin for v 1.0.0 release. See: https://github.com/emberjs/ember-states @class StateManager @namespace Ember */ Ember.State = generateRemovedClass("Ember.State"); /** This was exported to ember-states plugin for v 1.0.0 release. See: https://github.com/emberjs/ember-states @class State @namespace Ember */ }); define("metamorph", [], function() { "use strict"; // ========================================================================== // Project: metamorph // Copyright: ©2014 Tilde, Inc. All rights reserved. // ========================================================================== var K = function() {}, guid = 0, disableRange = (function(){ if ('undefined' !== typeof MetamorphENV) { return MetamorphENV.DISABLE_RANGE_API; } else if ('undefined' !== ENV) { return ENV.DISABLE_RANGE_API; } else { return false; } })(), // Feature-detect the W3C range API, the extended check is for IE9 which only partially supports ranges supportsRange = (!disableRange) && typeof document !== 'undefined' && ('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 = typeof document !== 'undefined' && (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"; * div.firstChild.firstChild.tagName //=> "" * * If our script markers are inside such a node, we need to find that * node and use *it* as the marker. */ var realNode = function(start) { while (start.parentNode.tagName === "") { start = start.parentNode; } return start; }; /* * When automatically adding a tbody, Internet Explorer inserts the * tbody immediately before the first . Other browsers create it * before the first node, no matter what. * * This means the the following code: * * div = document.createElement("div"); * div.innerHTML = "
    hi
    * * 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); if (outerToo) { start.parentNode.removeChild(start); } // 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; }); define("route-recognizer", ["route-recognizer/dsl","exports"], function(__dependency1__, __exports__) { "use strict"; var map = __dependency1__["default"]; var specials = [ '/', '.', '*', '+', '?', '|', '(', ')', '[', ']', '{', '}', '\\' ]; var escapeRegex = new RegExp('(\\' + specials.join('|\\') + ')', 'g'); function isArray(test) { return Object.prototype.toString.call(test) === "[object Array]"; } // A Segment represents a segment in the original route description. // Each Segment type provides an `eachChar` and `regex` method. // // The `eachChar` method invokes the callback with one or more character // specifications. A character specification consumes one or more input // characters. // // The `regex` method returns a regex fragment for the segment. If the // segment is a dynamic of star segment, the regex fragment also includes // a capture. // // A character specification contains: // // * `validChars`: a String with a list of all valid characters, or // * `invalidChars`: a String with a list of all invalid characters // * `repeat`: true if the character specification can repeat function StaticSegment(string) { this.string = string; } StaticSegment.prototype = { eachChar: function(callback) { var string = this.string, ch; for (var i=0, l=string.length; i " + n.nextStates.map(function(s) { return s.debug() }).join(" or ") + " )"; }).join(", ") } END IF **/ // This is a somewhat naive strategy, but should work in a lot of cases // A better strategy would properly resolve /posts/:id/new and /posts/edit/:id. // // This strategy generally prefers more static and less dynamic matching. // Specifically, it // // * prefers fewer stars to more, then // * prefers using stars for less of the match to more, then // * prefers fewer dynamic segments to more, then // * prefers more static segments to more function sortSolutions(states) { return states.sort(function(a, b) { if (a.types.stars !== b.types.stars) { return a.types.stars - b.types.stars; } if (a.types.stars) { if (a.types.statics !== b.types.statics) { return b.types.statics - a.types.statics; } if (a.types.dynamics !== b.types.dynamics) { return b.types.dynamics - a.types.dynamics; } } if (a.types.dynamics !== b.types.dynamics) { return a.types.dynamics - b.types.dynamics; } if (a.types.statics !== b.types.statics) { return b.types.statics - a.types.statics; } return 0; }); } function recognizeChar(states, ch) { var nextStates = []; for (var i=0, l=states.length; i 2 && key.slice(keyLength -2) === '[]') { isArray = true; key = key.slice(0, keyLength - 2); if(!queryParams[key]) { queryParams[key] = []; } } value = pair[1] ? decodeURIComponent(pair[1]) : ''; } if (isArray) { queryParams[key].push(value); } else { queryParams[key] = value; } } return queryParams; }, recognize: function(path) { var states = [ this.rootState ], pathLen, i, l, queryStart, queryParams = {}, isSlashDropped = false; queryStart = path.indexOf('?'); if (queryStart !== -1) { var queryString = path.substr(queryStart + 1, path.length); path = path.substr(0, queryStart); queryParams = this.parseQueryString(queryString); } path = decodeURI(path); // DEBUG GROUP path if (path.charAt(0) !== "/") { path = "/" + path; } pathLen = path.length; if (pathLen > 1 && path.charAt(pathLen - 1) === "/") { path = path.substr(0, pathLen - 1); isSlashDropped = true; } for (i=0, l=path.length; i= 0 && proceed; --i) { var route = routes[i]; recognizer.add(routes, { as: route.handler }); proceed = route.path === '/' || route.path === '' || route.handler.slice(-6) === '.index'; } }); }, hasRoute: function(route) { return this.recognizer.hasRoute(route); }, queryParamsTransition: function(changelist, wasTransitioning, oldState, newState) { var router = this; fireQueryParamDidChange(this, newState, changelist); if (!wasTransitioning && this.activeTransition) { // One of the handlers in queryParamsDidChange // caused a transition. Just return that transition. return this.activeTransition; } else { // Running queryParamsDidChange didn't change anything. // Just update query params and be on our way. // We have to return a noop transition that will // perform a URL update at the end. This gives // the user the ability to set the url update // method (default is replaceState). var newTransition = new Transition(this); newTransition.queryParamsOnly = true; oldState.queryParams = finalizeQueryParamChange(this, newState.handlerInfos, newState.queryParams, newTransition); newTransition.promise = newTransition.promise.then(function(result) { updateURL(newTransition, oldState, true); if (router.didTransition) { router.didTransition(router.currentHandlerInfos); } return result; }, null, promiseLabel("Transition complete")); return newTransition; } }, // NOTE: this doesn't really belong here, but here // it shall remain until our ES6 transpiler can // handle cyclical deps. transitionByIntent: function(intent, isIntermediate) { var wasTransitioning = !!this.activeTransition; var oldState = wasTransitioning ? this.activeTransition.state : this.state; var newTransition; var router = this; try { var newState = intent.applyToState(oldState, this.recognizer, this.getHandler, isIntermediate); var queryParamChangelist = getChangelist(oldState.queryParams, newState.queryParams); if (handlerInfosEqual(newState.handlerInfos, oldState.handlerInfos)) { // This is a no-op transition. See if query params changed. if (queryParamChangelist) { newTransition = this.queryParamsTransition(queryParamChangelist, wasTransitioning, oldState, newState); if (newTransition) { return newTransition; } } // No-op. No need to create a new transition. return new Transition(this); } if (isIntermediate) { setupContexts(this, newState); return; } // Create a new transition to the destination route. newTransition = new Transition(this, intent, newState); // Abort and usurp any previously active transition. if (this.activeTransition) { this.activeTransition.abort(); } this.activeTransition = newTransition; // Transition promises by default resolve with resolved state. // For our purposes, swap out the promise to resolve // after the transition has been finalized. newTransition.promise = newTransition.promise.then(function(result) { return finalizeTransition(newTransition, result.state); }, null, promiseLabel("Settle transition promise when transition is finalized")); if (!wasTransitioning) { notifyExistingHandlers(this, newState, newTransition); } fireQueryParamDidChange(this, newState, queryParamChangelist); return newTransition; } catch(e) { return new Transition(this, intent, null, e); } }, /** Clears the current and target route handlers and triggers exit on each of them starting at the leaf and traversing up through its ancestors. */ reset: function() { if (this.state) { forEach(this.state.handlerInfos.slice().reverse(), function(handlerInfo) { var handler = handlerInfo.handler; callHook(handler, 'exit'); }); } this.state = new TransitionState(); this.currentHandlerInfos = null; }, activeTransition: null, /** var handler = handlerInfo.handler; The entry point for handling a change to the URL (usually via the back and forward button). Returns an Array of handlers and the parameters associated with those parameters. @param {String} url a URL to process @return {Array} an Array of `[handler, parameter]` tuples */ handleURL: function(url) { // Perform a URL-based transition, but don't change // the URL afterward, since it already happened. var args = slice.call(arguments); if (url.charAt(0) !== '/') { args[0] = '/' + url; } return doTransition(this, args).method(null); }, /** Hook point for updating the URL. @param {String} url a URL to update to */ updateURL: function() { throw new Error("updateURL is not implemented"); }, /** Hook point for replacing the current URL, i.e. with replaceState By default this behaves the same as `updateURL` @param {String} url a URL to update to */ replaceURL: function(url) { this.updateURL(url); }, /** Transition into the specified named route. If necessary, trigger the exit callback on any handlers that are no longer represented by the target route. @param {String} name the name of the route */ transitionTo: function(name) { return doTransition(this, arguments); }, intermediateTransitionTo: function(name) { return doTransition(this, arguments, true); }, refresh: function(pivotHandler) { var state = this.activeTransition ? this.activeTransition.state : this.state; var handlerInfos = state.handlerInfos; var params = {}; for (var i = 0, len = handlerInfos.length; i < len; ++i) { var handlerInfo = handlerInfos[i]; params[handlerInfo.name] = handlerInfo.params || {}; } log(this, "Starting a refresh transition"); var intent = new NamedTransitionIntent({ name: handlerInfos[handlerInfos.length - 1].name, pivotHandler: pivotHandler || handlerInfos[0].handler, contexts: [], // TODO collect contexts...? queryParams: this._changedQueryParams || state.queryParams || {} }); return this.transitionByIntent(intent, false); }, /** Identical to `transitionTo` except that the current URL will be replaced if possible. This method is intended primarily for use with `replaceState`. @param {String} name the name of the route */ replaceWith: function(name) { return doTransition(this, arguments).method('replace'); }, /** Take a named route and context objects and generate a URL. @param {String} name the name of the route to generate a URL for @param {...Object} objects a list of objects to serialize @return {String} a URL */ generate: function(handlerName) { var partitionedArgs = extractQueryParams(slice.call(arguments, 1)), suppliedParams = partitionedArgs[0], queryParams = partitionedArgs[1]; // Construct a TransitionIntent with the provided params // and apply it to the present state of the router. var intent = new NamedTransitionIntent({ name: handlerName, contexts: suppliedParams }); var state = intent.applyToState(this.state, this.recognizer, this.getHandler); var params = {}; for (var i = 0, len = state.handlerInfos.length; i < len; ++i) { var handlerInfo = state.handlerInfos[i]; var handlerParams = handlerInfo.serialize(); merge(params, handlerParams); } params.queryParams = queryParams; return this.recognizer.generate(handlerName, params); }, applyIntent: function(handlerName, contexts) { var intent = new NamedTransitionIntent({ name: handlerName, contexts: contexts }); var state = this.activeTransition && this.activeTransition.state || this.state; return intent.applyToState(state, this.recognizer, this.getHandler); }, isActiveIntent: function(handlerName, contexts, queryParams) { var targetHandlerInfos = this.state.handlerInfos, found = false, names, object, handlerInfo, handlerObj, i, len; if (!targetHandlerInfos.length) { return false; } var targetHandler = targetHandlerInfos[targetHandlerInfos.length - 1].name; var recogHandlers = this.recognizer.handlersFor(targetHandler); var index = 0; for (len = recogHandlers.length; index < len; ++index) { handlerInfo = targetHandlerInfos[index]; if (handlerInfo.name === handlerName) { break; } } if (index === recogHandlers.length) { // The provided route name isn't even in the route hierarchy. return false; } var state = new TransitionState(); state.handlerInfos = targetHandlerInfos.slice(0, index + 1); recogHandlers = recogHandlers.slice(0, index + 1); var intent = new NamedTransitionIntent({ name: targetHandler, contexts: contexts }); var newState = intent.applyToHandlers(state, recogHandlers, this.getHandler, targetHandler, true, true); var handlersEqual = handlerInfosEqual(newState.handlerInfos, state.handlerInfos); if (!queryParams || !handlersEqual) { return handlersEqual; } // Get a hash of QPs that will still be active on new route var activeQPsOnNewHandler = {}; merge(activeQPsOnNewHandler, queryParams); var activeQueryParams = this.state.queryParams; for (var key in activeQueryParams) { if (activeQueryParams.hasOwnProperty(key) && activeQPsOnNewHandler.hasOwnProperty(key)) { activeQPsOnNewHandler[key] = activeQueryParams[key]; } } return handlersEqual && !getChangelist(activeQPsOnNewHandler, queryParams); }, isActive: function(handlerName) { var partitionedArgs = extractQueryParams(slice.call(arguments, 1)); return this.isActiveIntent(handlerName, partitionedArgs[0], partitionedArgs[1]); }, trigger: function(name) { var args = slice.call(arguments); trigger(this, this.currentHandlerInfos, false, args); }, /** Hook point for logging transition status updates. @param {String} message The message to log. */ log: null, _willChangeContextEvent: 'willChangeContext', _triggerWillChangeContext: function(handlerInfos, newTransition) { trigger(this, handlerInfos, true, [this._willChangeContextEvent, newTransition]); }, _triggerWillLeave: function(handlerInfos, newTransition, leavingChecker) { trigger(this, handlerInfos, true, ['willLeave', newTransition, leavingChecker]); } }; /** @private Fires queryParamsDidChange event */ function fireQueryParamDidChange(router, newState, queryParamChangelist) { // If queryParams changed trigger event if (queryParamChangelist) { // This is a little hacky but we need some way of storing // changed query params given that no activeTransition // is guaranteed to have occurred. router._changedQueryParams = queryParamChangelist.all; trigger(router, newState.handlerInfos, true, ['queryParamsDidChange', queryParamChangelist.changed, queryParamChangelist.all, queryParamChangelist.removed]); router._changedQueryParams = null; } } /** @private Takes an Array of `HandlerInfo`s, figures out which ones are exiting, entering, or changing contexts, and calls the proper handler hooks. For example, consider the following tree of handlers. Each handler is followed by the URL segment it handles. ``` |~index ("/") | |~posts ("/posts") | | |-showPost ("/:id") | | |-newPost ("/new") | | |-editPost ("/edit") | |~about ("/about/:id") ``` Consider the following transitions: 1. A URL transition to `/posts/1`. 1. Triggers the `*model` callbacks on the `index`, `posts`, and `showPost` handlers 2. Triggers the `enter` callback on the same 3. Triggers the `setup` callback on the same 2. A direct transition to `newPost` 1. Triggers the `exit` callback on `showPost` 2. Triggers the `enter` callback on `newPost` 3. Triggers the `setup` callback on `newPost` 3. A direct transition to `about` with a specified context object 1. Triggers the `exit` callback on `newPost` and `posts` 2. Triggers the `serialize` callback on `about` 3. Triggers the `enter` callback on `about` 4. Triggers the `setup` callback on `about` @param {Router} transition @param {TransitionState} newState */ function setupContexts(router, newState, transition) { var partition = partitionHandlers(router.state, newState); forEach(partition.exited, function(handlerInfo) { var handler = handlerInfo.handler; delete handler.context; callHook(handler, 'reset', true, transition); callHook(handler, 'exit', transition); }); var oldState = router.oldState = router.state; router.state = newState; var currentHandlerInfos = router.currentHandlerInfos = partition.unchanged.slice(); try { forEach(partition.reset, function(handlerInfo) { var handler = handlerInfo.handler; callHook(handler, 'reset', false, transition); }); forEach(partition.updatedContext, function(handlerInfo) { return handlerEnteredOrUpdated(currentHandlerInfos, handlerInfo, false, transition); }); forEach(partition.entered, function(handlerInfo) { return handlerEnteredOrUpdated(currentHandlerInfos, handlerInfo, true, transition); }); } catch(e) { router.state = oldState; router.currentHandlerInfos = oldState.handlerInfos; throw e; } router.state.queryParams = finalizeQueryParamChange(router, currentHandlerInfos, newState.queryParams, transition); } /** @private Helper method used by setupContexts. Handles errors or redirects that may happen in enter/setup. */ function handlerEnteredOrUpdated(currentHandlerInfos, handlerInfo, enter, transition) { var handler = handlerInfo.handler, context = handlerInfo.context; callHook(handler, 'enter', transition); if (transition && transition.isAborted) { throw new TransitionAborted(); } handler.context = context; callHook(handler, 'contextDidChange'); callHook(handler, 'setup', context, transition); if (transition && transition.isAborted) { throw new TransitionAborted(); } currentHandlerInfos.push(handlerInfo); return true; } /** @private This function is called when transitioning from one URL to another to determine which handlers are no longer active, which handlers are newly active, and which handlers remain active but have their context changed. Take a list of old handlers and new handlers and partition them into four buckets: * unchanged: the handler was active in both the old and new URL, and its context remains the same * updated context: the handler was active in both the old and new URL, but its context changed. The handler's `setup` method, if any, will be called with the new context. * exited: the handler was active in the old URL, but is no longer active. * entered: the handler was not active in the old URL, but is now active. The PartitionedHandlers structure has four fields: * `updatedContext`: a list of `HandlerInfo` objects that represent handlers that remain active but have a changed context * `entered`: a list of `HandlerInfo` objects that represent handlers that are newly active * `exited`: a list of `HandlerInfo` objects that are no longer active. * `unchanged`: a list of `HanderInfo` objects that remain active. @param {Array[HandlerInfo]} oldHandlers a list of the handler information for the previous URL (or `[]` if this is the first handled transition) @param {Array[HandlerInfo]} newHandlers a list of the handler information for the new URL @return {Partition} */ function partitionHandlers(oldState, newState) { var oldHandlers = oldState.handlerInfos; var newHandlers = newState.handlerInfos; var handlers = { updatedContext: [], exited: [], entered: [], unchanged: [] }; var handlerChanged, contextChanged = false, i, l; for (i=0, l=newHandlers.length; i= 0; --i) { var handlerInfo = handlerInfos[i]; merge(params, handlerInfo.params); if (handlerInfo.handler.inaccessibleByURL) { urlMethod = null; } } if (urlMethod) { params.queryParams = transition._visibleQueryParams || state.queryParams; var url = router.recognizer.generate(handlerName, params); if (urlMethod === 'replace') { router.replaceURL(url); } else { router.updateURL(url); } } } /** @private Updates the URL (if necessary) and calls `setupContexts` to update the router's array of `currentHandlerInfos`. */ function finalizeTransition(transition, newState) { try { log(transition.router, transition.sequence, "Resolved all models on destination route; finalizing transition."); var router = transition.router, handlerInfos = newState.handlerInfos, seq = transition.sequence; // Run all the necessary enter/setup/exit hooks setupContexts(router, newState, transition); // Check if a redirect occurred in enter/setup if (transition.isAborted) { // TODO: cleaner way? distinguish b/w targetHandlerInfos? router.state.handlerInfos = router.currentHandlerInfos; return Promise.reject(logAbort(transition)); } updateURL(transition, newState, transition.intent.url); transition.isActive = false; router.activeTransition = null; trigger(router, router.currentHandlerInfos, true, ['didTransition']); if (router.didTransition) { router.didTransition(router.currentHandlerInfos); } log(router, transition.sequence, "TRANSITION COMPLETE."); // Resolve with the final handler. return handlerInfos[handlerInfos.length - 1].handler; } catch(e) { if (!((e instanceof TransitionAborted))) { //var erroneousHandler = handlerInfos.pop(); var infos = transition.state.handlerInfos; transition.trigger(true, 'error', e, transition, infos[infos.length-1].handler); transition.abort(); } throw e; } } /** @private Begins and returns a Transition based on the provided arguments. Accepts arguments in the form of both URL transitions and named transitions. @param {Router} router @param {Array[Object]} args arguments passed to transitionTo, replaceWith, or handleURL */ function doTransition(router, args, isIntermediate) { // Normalize blank transitions to root URL transitions. var name = args[0] || '/'; var lastArg = args[args.length-1]; var queryParams = {}; if (lastArg && lastArg.hasOwnProperty('queryParams')) { queryParams = pop.call(args).queryParams; } var intent; if (args.length === 0) { log(router, "Updating query params"); // A query param update is really just a transition // into the route you're already on. var handlerInfos = router.state.handlerInfos; intent = new NamedTransitionIntent({ name: handlerInfos[handlerInfos.length - 1].name, contexts: [], queryParams: queryParams }); } else if (name.charAt(0) === '/') { log(router, "Attempting URL transition to " + name); intent = new URLTransitionIntent({ url: name }); } else { log(router, "Attempting transition to " + name); intent = new NamedTransitionIntent({ name: args[0], contexts: slice.call(args, 1), queryParams: queryParams }); } return router.transitionByIntent(intent, isIntermediate); } function handlerInfosEqual(handlerInfos, otherHandlerInfos) { if (handlerInfos.length !== otherHandlerInfos.length) { return false; } for (var i = 0, len = handlerInfos.length; i < len; ++i) { if (handlerInfos[i] !== otherHandlerInfos[i]) { return false; } } return true; } function finalizeQueryParamChange(router, resolvedHandlers, newQueryParams, transition) { // We fire a finalizeQueryParamChange event which // gives the new route hierarchy a chance to tell // us which query params it's consuming and what // their final values are. If a query param is // no longer consumed in the final route hierarchy, // its serialized segment will be removed // from the URL. for (var k in newQueryParams) { if (newQueryParams.hasOwnProperty(k) && newQueryParams[k] === null) { delete newQueryParams[k]; } } var finalQueryParamsArray = []; trigger(router, resolvedHandlers, true, ['finalizeQueryParamChange', newQueryParams, finalQueryParamsArray, transition]); if (transition) { transition._visibleQueryParams = {}; } var finalQueryParams = {}; for (var i = 0, len = finalQueryParamsArray.length; i < len; ++i) { var qp = finalQueryParamsArray[i]; finalQueryParams[qp.key] = qp.value; if (transition && qp.visible !== false) { transition._visibleQueryParams[qp.key] = qp.value; } } return finalQueryParams; } function notifyExistingHandlers(router, newState, newTransition) { var oldHandlers = router.state.handlerInfos, changing = [], leavingIndex = null, leaving, leavingChecker, i, oldHandlerLen, oldHandler, newHandler; oldHandlerLen = oldHandlers.length; for (i = 0; i < oldHandlerLen; i++) { oldHandler = oldHandlers[i]; newHandler = newState.handlerInfos[i]; if (!newHandler || oldHandler.name !== newHandler.name) { leavingIndex = i; break; } if (!newHandler.isResolved) { changing.push(oldHandler); } } if (leavingIndex !== null) { leaving = oldHandlers.slice(leavingIndex, oldHandlerLen); leavingChecker = function(name) { for (var h = 0, len = leaving.length; h < len; h++) { if (leaving[h].name === name) { return true; } } return false; }; router._triggerWillLeave(leaving, newTransition, leavingChecker); } if (changing.length > 0) { router._triggerWillChangeContext(changing, newTransition); } trigger(router, oldHandlers, true, ['willTransition', newTransition]); } __exports__["default"] = Router; }); define("router/transition-intent", ["./utils","exports"], function(__dependency1__, __exports__) { "use strict"; var merge = __dependency1__.merge; function TransitionIntent(props) { this.initialize(props); // TODO: wat this.data = this.data || {}; } TransitionIntent.prototype = { initialize: null, applyToState: null }; __exports__["default"] = TransitionIntent; }); define("router/transition-intent/named-transition-intent", ["../transition-intent","../transition-state","../handler-info/factory","../utils","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __exports__) { "use strict"; var TransitionIntent = __dependency1__["default"]; var TransitionState = __dependency2__["default"]; var handlerInfoFactory = __dependency3__["default"]; var isParam = __dependency4__.isParam; var extractQueryParams = __dependency4__.extractQueryParams; var merge = __dependency4__.merge; var subclass = __dependency4__.subclass; __exports__["default"] = subclass(TransitionIntent, { name: null, pivotHandler: null, contexts: null, queryParams: null, initialize: function(props) { this.name = props.name; this.pivotHandler = props.pivotHandler; this.contexts = props.contexts || []; this.queryParams = props.queryParams; }, applyToState: function(oldState, recognizer, getHandler, isIntermediate) { var partitionedArgs = extractQueryParams([this.name].concat(this.contexts)), pureArgs = partitionedArgs[0], queryParams = partitionedArgs[1], handlers = recognizer.handlersFor(pureArgs[0]); var targetRouteName = handlers[handlers.length-1].handler; return this.applyToHandlers(oldState, handlers, getHandler, targetRouteName, isIntermediate); }, applyToHandlers: function(oldState, handlers, getHandler, targetRouteName, isIntermediate, checkingIfActive) { var i, len; var newState = new TransitionState(); var objects = this.contexts.slice(0); var invalidateIndex = handlers.length; // Pivot handlers are provided for refresh transitions if (this.pivotHandler) { for (i = 0, len = handlers.length; i < len; ++i) { if (getHandler(handlers[i].handler) === this.pivotHandler) { invalidateIndex = i; break; } } } var pivotHandlerFound = !this.pivotHandler; for (i = handlers.length - 1; i >= 0; --i) { var result = handlers[i]; var name = result.handler; var handler = getHandler(name); var oldHandlerInfo = oldState.handlerInfos[i]; var newHandlerInfo = null; if (result.names.length > 0) { if (i >= invalidateIndex) { newHandlerInfo = this.createParamHandlerInfo(name, handler, result.names, objects, oldHandlerInfo); } else { newHandlerInfo = this.getHandlerInfoForDynamicSegment(name, handler, result.names, objects, oldHandlerInfo, targetRouteName, i); } } else { // This route has no dynamic segment. // Therefore treat as a param-based handlerInfo // with empty params. This will cause the `model` // hook to be called with empty params, which is desirable. newHandlerInfo = this.createParamHandlerInfo(name, handler, result.names, objects, oldHandlerInfo); } if (checkingIfActive) { // If we're performing an isActive check, we want to // serialize URL params with the provided context, but // ignore mismatches between old and new context. newHandlerInfo = newHandlerInfo.becomeResolved(null, newHandlerInfo.context); var oldContext = oldHandlerInfo && oldHandlerInfo.context; if (result.names.length > 0 && newHandlerInfo.context === oldContext) { // If contexts match in isActive test, assume params also match. // This allows for flexibility in not requiring that every last // handler provide a `serialize` method newHandlerInfo.params = oldHandlerInfo && oldHandlerInfo.params; } newHandlerInfo.context = oldContext; } var handlerToUse = oldHandlerInfo; if (i >= invalidateIndex || newHandlerInfo.shouldSupercede(oldHandlerInfo)) { invalidateIndex = Math.min(i, invalidateIndex); handlerToUse = newHandlerInfo; } if (isIntermediate && !checkingIfActive) { handlerToUse = handlerToUse.becomeResolved(null, handlerToUse.context); } newState.handlerInfos.unshift(handlerToUse); } if (objects.length > 0) { throw new Error("More context objects were passed than there are dynamic segments for the route: " + targetRouteName); } if (!isIntermediate) { this.invalidateChildren(newState.handlerInfos, invalidateIndex); } merge(newState.queryParams, this.queryParams || {}); return newState; }, invalidateChildren: function(handlerInfos, invalidateIndex) { for (var i = invalidateIndex, l = handlerInfos.length; i < l; ++i) { var handlerInfo = handlerInfos[i]; handlerInfos[i] = handlerInfos[i].getUnresolved(); } }, getHandlerInfoForDynamicSegment: function(name, handler, names, objects, oldHandlerInfo, targetRouteName, i) { var numNames = names.length; var objectToUse; if (objects.length > 0) { // Use the objects provided for this transition. objectToUse = objects[objects.length - 1]; if (isParam(objectToUse)) { return this.createParamHandlerInfo(name, handler, names, objects, oldHandlerInfo); } else { objects.pop(); } } else if (oldHandlerInfo && oldHandlerInfo.name === name) { // Reuse the matching oldHandlerInfo return oldHandlerInfo; } else { if (this.preTransitionState) { var preTransitionHandlerInfo = this.preTransitionState.handlerInfos[i]; objectToUse = preTransitionHandlerInfo && preTransitionHandlerInfo.context; } else { // Ideally we should throw this error to provide maximal // information to the user that not enough context objects // were provided, but this proves too cumbersome in Ember // in cases where inner template helpers are evaluated // before parent helpers un-render, in which cases this // error somewhat prematurely fires. //throw new Error("Not enough context objects were provided to complete a transition to " + targetRouteName + ". Specifically, the " + name + " route needs an object that can be serialized into its dynamic URL segments [" + names.join(', ') + "]"); return oldHandlerInfo; } } return handlerInfoFactory('object', { name: name, handler: handler, context: objectToUse, names: names }); }, createParamHandlerInfo: function(name, handler, names, objects, oldHandlerInfo) { var params = {}; // Soak up all the provided string/numbers var numNames = names.length; while (numNames--) { // Only use old params if the names match with the new handler var oldParams = (oldHandlerInfo && name === oldHandlerInfo.name && oldHandlerInfo.params) || {}; var peek = objects[objects.length - 1]; var paramName = names[numNames]; if (isParam(peek)) { params[paramName] = "" + objects.pop(); } else { // If we're here, this means only some of the params // were string/number params, so try and use a param // value from a previous handler. if (oldParams.hasOwnProperty(paramName)) { params[paramName] = oldParams[paramName]; } else { throw new Error("You didn't provide enough string/numeric parameters to satisfy all of the dynamic segments for route " + name); } } } return handlerInfoFactory('param', { name: name, handler: handler, params: params }); } }); }); define("router/transition-intent/url-transition-intent", ["../transition-intent","../transition-state","../handler-info/factory","../utils","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __exports__) { "use strict"; var TransitionIntent = __dependency1__["default"]; var TransitionState = __dependency2__["default"]; var handlerInfoFactory = __dependency3__["default"]; var oCreate = __dependency4__.oCreate; var merge = __dependency4__.merge; var subclass = __dependency4__.subclass; __exports__["default"] = subclass(TransitionIntent, { url: null, initialize: function(props) { this.url = props.url; }, applyToState: function(oldState, recognizer, getHandler) { var newState = new TransitionState(); var results = recognizer.recognize(this.url), queryParams = {}, i, len; if (!results) { throw new UnrecognizedURLError(this.url); } var statesDiffer = false; for (i = 0, len = results.length; i < len; ++i) { var result = results[i]; var name = result.handler; var handler = getHandler(name); if (handler.inaccessibleByURL) { throw new UnrecognizedURLError(this.url); } var newHandlerInfo = handlerInfoFactory('param', { name: name, handler: handler, params: result.params }); var oldHandlerInfo = oldState.handlerInfos[i]; if (statesDiffer || newHandlerInfo.shouldSupercede(oldHandlerInfo)) { statesDiffer = true; newState.handlerInfos[i] = newHandlerInfo; } else { newState.handlerInfos[i] = oldHandlerInfo; } } merge(newState.queryParams, results.queryParams); return newState; } }); /** Promise reject reasons passed to promise rejection handlers for failed transitions. */ function UnrecognizedURLError(message) { this.message = (message || "UnrecognizedURLError"); this.name = "UnrecognizedURLError"; } }); define("router/transition-state", ["./handler-info","./utils","rsvp/promise","exports"], function(__dependency1__, __dependency2__, __dependency3__, __exports__) { "use strict"; var ResolvedHandlerInfo = __dependency1__.ResolvedHandlerInfo; var forEach = __dependency2__.forEach; var promiseLabel = __dependency2__.promiseLabel; var callHook = __dependency2__.callHook; var Promise = __dependency3__["default"]; function TransitionState(other) { this.handlerInfos = []; this.queryParams = {}; this.params = {}; } TransitionState.prototype = { handlerInfos: null, queryParams: null, params: null, promiseLabel: function(label) { var targetName = ''; forEach(this.handlerInfos, function(handlerInfo) { if (targetName !== '') { targetName += '.'; } targetName += handlerInfo.name; }); return promiseLabel("'" + targetName + "': " + label); }, resolve: function(shouldContinue, payload) { var self = this; // First, calculate params for this state. This is useful // information to provide to the various route hooks. var params = this.params; forEach(this.handlerInfos, function(handlerInfo) { params[handlerInfo.name] = handlerInfo.params || {}; }); payload = payload || {}; payload.resolveIndex = 0; var currentState = this; var wasAborted = false; // The prelude RSVP.resolve() asyncs us into the promise land. return Promise.resolve(null, this.promiseLabel("Start transition")) .then(resolveOneHandlerInfo, null, this.promiseLabel('Resolve handler'))['catch'](handleError, this.promiseLabel('Handle error')); function innerShouldContinue() { return Promise.resolve(shouldContinue(), currentState.promiseLabel("Check if should continue"))['catch'](function(reason) { // We distinguish between errors that occurred // during resolution (e.g. beforeModel/model/afterModel), // and aborts due to a rejecting promise from shouldContinue(). wasAborted = true; return Promise.reject(reason); }, currentState.promiseLabel("Handle abort")); } function handleError(error) { // This is the only possible // reject value of TransitionState#resolve var handlerInfos = currentState.handlerInfos; var errorHandlerIndex = payload.resolveIndex >= handlerInfos.length ? handlerInfos.length - 1 : payload.resolveIndex; return Promise.reject({ error: error, handlerWithError: currentState.handlerInfos[errorHandlerIndex].handler, wasAborted: wasAborted, state: currentState }); } function proceed(resolvedHandlerInfo) { var wasAlreadyResolved = currentState.handlerInfos[payload.resolveIndex].isResolved; // Swap the previously unresolved handlerInfo with // the resolved handlerInfo currentState.handlerInfos[payload.resolveIndex++] = resolvedHandlerInfo; if (!wasAlreadyResolved) { // Call the redirect hook. The reason we call it here // vs. afterModel is so that redirects into child // routes don't re-run the model hooks for this // already-resolved route. var handler = resolvedHandlerInfo.handler; callHook(handler, 'redirect', resolvedHandlerInfo.context, payload); } // Proceed after ensuring that the redirect hook // didn't abort this transition by transitioning elsewhere. return innerShouldContinue().then(resolveOneHandlerInfo, null, currentState.promiseLabel('Resolve handler')); } function resolveOneHandlerInfo() { if (payload.resolveIndex === currentState.handlerInfos.length) { // This is is the only possible // fulfill value of TransitionState#resolve return { error: null, state: currentState }; } var handlerInfo = currentState.handlerInfos[payload.resolveIndex]; return handlerInfo.resolve(innerShouldContinue, payload) .then(proceed, null, currentState.promiseLabel('Proceed')); } } }; __exports__["default"] = TransitionState; }); define("router/transition", ["rsvp/promise","./handler-info","./utils","exports"], function(__dependency1__, __dependency2__, __dependency3__, __exports__) { "use strict"; var Promise = __dependency1__["default"]; var ResolvedHandlerInfo = __dependency2__.ResolvedHandlerInfo; var trigger = __dependency3__.trigger; var slice = __dependency3__.slice; var log = __dependency3__.log; var promiseLabel = __dependency3__.promiseLabel; /** @private A Transition is a thennable (a promise-like object) that represents an attempt to transition to another route. It can be aborted, either explicitly via `abort` or by attempting another transition while a previous one is still underway. An aborted transition can also be `retry()`d later. */ function Transition(router, intent, state, error) { var transition = this; this.state = state || router.state; this.intent = intent; this.router = router; this.data = this.intent && this.intent.data || {}; this.resolvedModels = {}; this.queryParams = {}; if (error) { this.promise = Promise.reject(error); return; } if (state) { this.params = state.params; this.queryParams = state.queryParams; this.handlerInfos = state.handlerInfos; var len = state.handlerInfos.length; if (len) { this.targetName = state.handlerInfos[len-1].name; } for (var i = 0; i < len; ++i) { var handlerInfo = state.handlerInfos[i]; // TODO: this all seems hacky if (!handlerInfo.isResolved) { break; } this.pivotHandler = handlerInfo.handler; } this.sequence = Transition.currentSequence++; this.promise = state.resolve(checkForAbort, this)['catch'](function(result) { if (result.wasAborted || transition.isAborted) { return Promise.reject(logAbort(transition)); } else { transition.trigger('error', result.error, transition, result.handlerWithError); transition.abort(); return Promise.reject(result.error); } }, promiseLabel('Handle Abort')); } else { this.promise = Promise.resolve(this.state); this.params = {}; } function checkForAbort() { if (transition.isAborted) { return Promise.reject(undefined, promiseLabel("Transition aborted - reject")); } } } Transition.currentSequence = 0; Transition.prototype = { targetName: null, urlMethod: 'update', intent: null, params: null, pivotHandler: null, resolveIndex: 0, handlerInfos: null, resolvedModels: null, isActive: true, state: null, queryParamsOnly: false, isTransition: true, isExiting: function(handler) { var handlerInfos = this.handlerInfos; for (var i = 0, len = handlerInfos.length; i < len; ++i) { var handlerInfo = handlerInfos[i]; if (handlerInfo.name === handler || handlerInfo.handler === handler) { return false; } } return true; }, /** @public The Transition's internal promise. Calling `.then` on this property is that same as calling `.then` on the Transition object itself, but this property is exposed for when you want to pass around a Transition's promise, but not the Transition object itself, since Transition object can be externally `abort`ed, while the promise cannot. */ promise: null, /** @public Custom state can be stored on a Transition's `data` object. This can be useful for decorating a Transition within an earlier hook and shared with a later hook. Properties set on `data` will be copied to new transitions generated by calling `retry` on this transition. */ data: null, /** @public A standard promise hook that resolves if the transition succeeds and rejects if it fails/redirects/aborts. Forwards to the internal `promise` property which you can use in situations where you want to pass around a thennable, but not the Transition itself. @param {Function} onFulfilled @param {Function} onRejected @param {String} label optional string for labeling the promise. Useful for tooling. @return {Promise} */ then: function(onFulfilled, onRejected, label) { return this.promise.then(onFulfilled, onRejected, label); }, /** @public Forwards to the internal `promise` property which you can use in situations where you want to pass around a thennable, but not the Transition itself. @method catch @param {Function} onRejection @param {String} label optional string for labeling the promise. Useful for tooling. @return {Promise} */ "catch": function(onRejection, label) { return this.promise["catch"](onRejection, label); }, /** @public Forwards to the internal `promise` property which you can use in situations where you want to pass around a thennable, but not the Transition itself. @method finally @param {Function} callback @param {String} label optional string for labeling the promise. Useful for tooling. @return {Promise} */ "finally": function(callback, label) { return this.promise["finally"](callback, label); }, /** @public Aborts the Transition. Note you can also implicitly abort a transition by initiating another transition while a previous one is underway. */ abort: function() { if (this.isAborted) { return this; } log(this.router, this.sequence, this.targetName + ": transition was aborted"); this.intent.preTransitionState = this.router.state; this.isAborted = true; this.isActive = false; this.router.activeTransition = null; return this; }, /** @public Retries a previously-aborted transition (making sure to abort the transition if it's still active). Returns a new transition that represents the new attempt to transition. */ retry: function() { // TODO: add tests for merged state retry()s this.abort(); return this.router.transitionByIntent(this.intent, false); }, /** @public Sets the URL-changing method to be employed at the end of a successful transition. By default, a new Transition will just use `updateURL`, but passing 'replace' to this method will cause the URL to update using 'replaceWith' instead. Omitting a parameter will disable the URL change, allowing for transitions that don't update the URL at completion (this is also used for handleURL, since the URL has already changed before the transition took place). @param {String} method the type of URL-changing method to use at the end of a transition. Accepted values are 'replace', falsy values, or any other non-falsy value (which is interpreted as an updateURL transition). @return {Transition} this transition */ method: function(method) { this.urlMethod = method; return this; }, /** @public Fires an event on the current list of resolved/resolving handlers within this transition. Useful for firing events on route hierarchies that haven't fully been entered yet. Note: This method is also aliased as `send` @param {Boolean} [ignoreFailure=false] a boolean specifying whether unhandled events throw an error @param {String} name the name of the event to fire */ trigger: function (ignoreFailure) { var args = slice.call(arguments); if (typeof ignoreFailure === 'boolean') { args.shift(); } else { // Throw errors on unhandled trigger events by default ignoreFailure = false; } trigger(this.router, this.state.handlerInfos.slice(0, this.resolveIndex + 1), ignoreFailure, args); }, /** @public Transitions are aborted and their promises rejected when redirects occur; this method returns a promise that will follow any redirects that occur and fulfill with the value fulfilled by any redirecting transitions that occur. @return {Promise} a promise that fulfills with the same value that the final redirecting transition fulfills with */ followRedirects: function() { var router = this.router; return this.promise['catch'](function(reason) { if (router.activeTransition) { return router.activeTransition.followRedirects(); } return Promise.reject(reason); }); }, toString: function() { return "Transition (sequence " + this.sequence + ")"; }, /** @private */ log: function(message) { log(this.router, this.sequence, message); } }; // Alias 'trigger' as 'send' Transition.prototype.send = Transition.prototype.trigger; /** @private Logs and returns a TransitionAborted error. */ function logAbort(transition) { log(transition.router, transition.sequence, "detected abort."); return new TransitionAborted(); } function TransitionAborted(message) { this.message = (message || "TransitionAborted"); this.name = "TransitionAborted"; } __exports__.Transition = Transition; __exports__.logAbort = logAbort; __exports__.TransitionAborted = TransitionAborted; }); define("router/utils", ["exports"], function(__exports__) { "use strict"; var slice = Array.prototype.slice; var _isArray; if (!Array.isArray) { _isArray = function (x) { return Object.prototype.toString.call(x) === "[object Array]"; }; } else { _isArray = Array.isArray; } var isArray = _isArray; __exports__.isArray = isArray; function merge(hash, other) { for (var prop in other) { if (other.hasOwnProperty(prop)) { hash[prop] = other[prop]; } } } var oCreate = Object.create || function(proto) { function F() {} F.prototype = proto; return new F(); }; __exports__.oCreate = oCreate; /** @private Extracts query params from the end of an array **/ function extractQueryParams(array) { var len = (array && array.length), head, queryParams; if(len && len > 0 && array[len - 1] && array[len - 1].hasOwnProperty('queryParams')) { queryParams = array[len - 1].queryParams; head = slice.call(array, 0, len - 1); return [head, queryParams]; } else { return [array, null]; } } __exports__.extractQueryParams = extractQueryParams;/** @private Coerces query param properties and array elements into strings. **/ function coerceQueryParamsToString(queryParams) { for (var key in queryParams) { if (typeof queryParams[key] === 'number') { queryParams[key] = '' + queryParams[key]; } else if (isArray(queryParams[key])) { for (var i = 0, l = queryParams[key].length; i < l; i++) { queryParams[key][i] = '' + queryParams[key][i]; } } } } /** @private */ function log(router, sequence, msg) { if (!router.log) { return; } if (arguments.length === 3) { router.log("Transition #" + sequence + ": " + msg); } else { msg = sequence; router.log(msg); } } __exports__.log = log;function bind(context, fn) { var boundArgs = arguments; return function(value) { var args = slice.call(boundArgs, 2); args.push(value); return fn.apply(context, args); }; } __exports__.bind = bind;function isParam(object) { return (typeof object === "string" || object instanceof String || typeof object === "number" || object instanceof Number); } function forEach(array, callback) { for (var i=0, l=array.length; i=0; i--) { var handlerInfo = handlerInfos[i], handler = handlerInfo.handler; if (handler.events && handler.events[name]) { if (handler.events[name].apply(handler, args) === true) { eventWasHandled = true; } else { return; } } } if (!eventWasHandled && !ignoreFailure) { throw new Error("Nothing handled the event '" + name + "'."); } } __exports__.trigger = trigger;function getChangelist(oldObject, newObject) { var key; var results = { all: {}, changed: {}, removed: {} }; merge(results.all, newObject); var didChange = false; coerceQueryParamsToString(oldObject); coerceQueryParamsToString(newObject); // Calculate removals for (key in oldObject) { if (oldObject.hasOwnProperty(key)) { if (!newObject.hasOwnProperty(key)) { didChange = true; results.removed[key] = oldObject[key]; } } } // Calculate changes for (key in newObject) { if (newObject.hasOwnProperty(key)) { if (isArray(oldObject[key]) && isArray(newObject[key])) { if (oldObject[key].length !== newObject[key].length) { results.changed[key] = newObject[key]; didChange = true; } else { for (var i = 0, l = oldObject[key].length; i < l; i++) { if (oldObject[key][i] !== newObject[key][i]) { results.changed[key] = newObject[key]; didChange = true; } } } } else { if (oldObject[key] !== newObject[key]) { results.changed[key] = newObject[key]; didChange = true; } } } } return didChange && results; } __exports__.getChangelist = getChangelist;function promiseLabel(label) { return 'Router: ' + label; } __exports__.promiseLabel = promiseLabel;function subclass(parentConstructor, proto) { function C(props) { parentConstructor.call(this, props || {}); } C.prototype = oCreate(parentConstructor.prototype); merge(C.prototype, proto); return C; } __exports__.subclass = subclass;function resolveHook(obj, hookName) { if (!obj) { return; } var underscored = "_" + hookName; return obj[underscored] && underscored || obj[hookName] && hookName; } function callHook(obj, hookName) { var args = slice.call(arguments, 2); return applyHook(obj, hookName, args); } function applyHook(obj, _hookName, args) { var hookName = resolveHook(obj, _hookName); if (hookName) { return obj[hookName].apply(obj, args); } } __exports__.merge = merge; __exports__.slice = slice; __exports__.isParam = isParam; __exports__.coerceQueryParamsToString = coerceQueryParamsToString; __exports__.callHook = callHook; __exports__.resolveHook = resolveHook; __exports__.applyHook = applyHook; }); define("router", ["./router/router","exports"], function(__dependency1__, __exports__) { "use strict"; var Router = __dependency1__["default"]; __exports__["default"] = Router; }); define("rsvp", ["./rsvp/promise","./rsvp/events","./rsvp/node","./rsvp/all","./rsvp/all-settled","./rsvp/race","./rsvp/hash","./rsvp/hash-settled","./rsvp/rethrow","./rsvp/defer","./rsvp/config","./rsvp/map","./rsvp/resolve","./rsvp/reject","./rsvp/filter","./rsvp/asap","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__, __dependency9__, __dependency10__, __dependency11__, __dependency12__, __dependency13__, __dependency14__, __dependency15__, __dependency16__, __exports__) { "use strict"; var Promise = __dependency1__["default"]; var EventTarget = __dependency2__["default"]; var denodeify = __dependency3__["default"]; var all = __dependency4__["default"]; var allSettled = __dependency5__["default"]; var race = __dependency6__["default"]; var hash = __dependency7__["default"]; var hashSettled = __dependency8__["default"]; var rethrow = __dependency9__["default"]; var defer = __dependency10__["default"]; var config = __dependency11__.config; var configure = __dependency11__.configure; var map = __dependency12__["default"]; var resolve = __dependency13__["default"]; var reject = __dependency14__["default"]; var filter = __dependency15__["default"]; var asap = __dependency16__["default"]; config.async = asap; // default async is asap; var cast = resolve; function async(callback, arg) { config.async(callback, arg); } function on() { config.on.apply(config, arguments); } function off() { config.off.apply(config, arguments); } // Set up instrumentation through `window.__PROMISE_INTRUMENTATION__` if (typeof window !== 'undefined' && typeof window['__PROMISE_INSTRUMENTATION__'] === 'object') { var callbacks = window['__PROMISE_INSTRUMENTATION__']; configure('instrument', true); for (var eventName in callbacks) { if (callbacks.hasOwnProperty(eventName)) { on(eventName, callbacks[eventName]); } } } __exports__.cast = cast; __exports__.Promise = Promise; __exports__.EventTarget = EventTarget; __exports__.all = all; __exports__.allSettled = allSettled; __exports__.race = race; __exports__.hash = hash; __exports__.hashSettled = hashSettled; __exports__.rethrow = rethrow; __exports__.defer = defer; __exports__.denodeify = denodeify; __exports__.configure = configure; __exports__.on = on; __exports__.off = off; __exports__.resolve = resolve; __exports__.reject = reject; __exports__.async = async; __exports__.map = map; __exports__.filter = filter; }); define("rsvp.umd", ["./rsvp"], function(__dependency1__) { "use strict"; var Promise = __dependency1__.Promise; var allSettled = __dependency1__.allSettled; var hash = __dependency1__.hash; var hashSettled = __dependency1__.hashSettled; var denodeify = __dependency1__.denodeify; var on = __dependency1__.on; var off = __dependency1__.off; var map = __dependency1__.map; var filter = __dependency1__.filter; var resolve = __dependency1__.resolve; var reject = __dependency1__.reject; var rethrow = __dependency1__.rethrow; var all = __dependency1__.all; var defer = __dependency1__.defer; var EventTarget = __dependency1__.EventTarget; var configure = __dependency1__.configure; var race = __dependency1__.race; var async = __dependency1__.async; var RSVP = { 'race': race, 'Promise': Promise, 'allSettled': allSettled, 'hash': hash, 'hashSettled': hashSettled, 'denodeify': denodeify, 'on': on, 'off': off, 'map': map, 'filter': filter, 'resolve': resolve, 'reject': reject, 'all': all, 'rethrow': rethrow, 'defer': defer, 'EventTarget': EventTarget, 'configure': configure, 'async': async }; /* global define:true module:true window: true */ if (typeof define === 'function' && define.amd) { define(function() { return RSVP; }); } else if (typeof module !== 'undefined' && module.exports) { module.exports = RSVP; } else if (typeof this !== 'undefined') { this['RSVP'] = RSVP; } }); define("rsvp/-internal", ["./utils","./instrument","./config","exports"], function(__dependency1__, __dependency2__, __dependency3__, __exports__) { "use strict"; var objectOrFunction = __dependency1__.objectOrFunction; var isFunction = __dependency1__.isFunction; var instrument = __dependency2__["default"]; var config = __dependency3__.config; function noop() {} var PENDING = void 0; var FULFILLED = 1; var REJECTED = 2; var GET_THEN_ERROR = new ErrorObject(); function getThen(promise) { try { return promise.then; } catch(error) { GET_THEN_ERROR.error = error; return GET_THEN_ERROR; } } function tryThen(then, value, fulfillmentHandler, rejectionHandler) { try { then.call(value, fulfillmentHandler, rejectionHandler); } catch(e) { return e; } } function handleForeignThenable(promise, thenable, then) { config.async(function(promise) { var sealed = false; var error = tryThen(then, thenable, function(value) { if (sealed) { return; } sealed = true; if (thenable !== value) { resolve(promise, value); } else { fulfill(promise, value); } }, function(reason) { if (sealed) { return; } sealed = true; reject(promise, reason); }, 'Settle: ' + (promise._label || ' unknown promise')); if (!sealed && error) { sealed = true; reject(promise, error); } }, promise); } function handleOwnThenable(promise, thenable) { if (thenable._state === FULFILLED) { fulfill(promise, thenable._result); } else if (promise._state === REJECTED) { reject(promise, thenable._result); } else { subscribe(thenable, undefined, function(value) { if (thenable !== value) { resolve(promise, value); } else { fulfill(promise, value); } }, function(reason) { reject(promise, reason); }); } } function handleMaybeThenable(promise, maybeThenable) { if (maybeThenable.constructor === promise.constructor) { handleOwnThenable(promise, maybeThenable); } else { var then = getThen(maybeThenable); if (then === GET_THEN_ERROR) { reject(promise, GET_THEN_ERROR.error); } else if (then === undefined) { fulfill(promise, maybeThenable); } else if (isFunction(then)) { handleForeignThenable(promise, maybeThenable, then); } else { fulfill(promise, maybeThenable); } } } function resolve(promise, value) { if (promise === value) { fulfill(promise, value); } else if (objectOrFunction(value)) { handleMaybeThenable(promise, value); } else { fulfill(promise, value); } } function publishRejection(promise) { if (promise._onerror) { promise._onerror(promise._result); } publish(promise); } function fulfill(promise, value) { if (promise._state !== PENDING) { return; } promise._result = value; promise._state = FULFILLED; if (promise._subscribers.length === 0) { if (config.instrument) { instrument('fulfilled', promise); } } else { config.async(publish, promise); } } function reject(promise, reason) { if (promise._state !== PENDING) { return; } promise._state = REJECTED; promise._result = reason; config.async(publishRejection, promise); } function subscribe(parent, child, onFulfillment, onRejection) { var subscribers = parent._subscribers; var length = subscribers.length; parent._onerror = null; subscribers[length] = child; subscribers[length + FULFILLED] = onFulfillment; subscribers[length + REJECTED] = onRejection; if (length === 0 && parent._state) { config.async(publish, parent); } } function publish(promise) { var subscribers = promise._subscribers; var settled = promise._state; if (config.instrument) { instrument(settled === FULFILLED ? 'fulfilled' : 'rejected', promise); } if (subscribers.length === 0) { return; } var child, callback, detail = promise._result; for (var i = 0; i < subscribers.length; i += 3) { child = subscribers[i]; callback = subscribers[i + settled]; if (child) { invokeCallback(settled, child, callback, detail); } else { callback(detail); } } promise._subscribers.length = 0; } function ErrorObject() { this.error = null; } var TRY_CATCH_ERROR = new ErrorObject(); function tryCatch(callback, detail) { try { return callback(detail); } catch(e) { TRY_CATCH_ERROR.error = e; return TRY_CATCH_ERROR; } } function invokeCallback(settled, promise, callback, detail) { var hasCallback = isFunction(callback), value, error, succeeded, failed; if (hasCallback) { value = tryCatch(callback, detail); if (value === TRY_CATCH_ERROR) { failed = true; error = value.error; value = null; } else { succeeded = true; } if (promise === value) { reject(promise, new TypeError('A promises callback cannot return that same promise.')); return; } } else { value = detail; succeeded = true; } if (promise._state !== PENDING) { // noop } else if (hasCallback && succeeded) { resolve(promise, value); } else if (failed) { reject(promise, error); } else if (settled === FULFILLED) { fulfill(promise, value); } else if (settled === REJECTED) { reject(promise, value); } } function initializePromise(promise, resolver) { try { resolver(function resolvePromise(value){ resolve(promise, value); }, function rejectPromise(reason) { reject(promise, reason); }); } catch(e) { reject(promise, e); } } __exports__.noop = noop; __exports__.resolve = resolve; __exports__.reject = reject; __exports__.fulfill = fulfill; __exports__.subscribe = subscribe; __exports__.publish = publish; __exports__.publishRejection = publishRejection; __exports__.initializePromise = initializePromise; __exports__.invokeCallback = invokeCallback; __exports__.FULFILLED = FULFILLED; __exports__.REJECTED = REJECTED; __exports__.PENDING = PENDING; }); define("rsvp/all-settled", ["./enumerator","./promise","./utils","exports"], function(__dependency1__, __dependency2__, __dependency3__, __exports__) { "use strict"; var Enumerator = __dependency1__["default"]; var makeSettledResult = __dependency1__.makeSettledResult; var Promise = __dependency2__["default"]; var o_create = __dependency3__.o_create; function AllSettled(Constructor, entries, label) { this._superConstructor(Constructor, entries, false /* don't abort on reject */, label); } AllSettled.prototype = o_create(Enumerator.prototype); AllSettled.prototype._superConstructor = Enumerator; AllSettled.prototype._makeResult = makeSettledResult; AllSettled.prototype._validationError = function() { return new Error('allSettled must be called with an array'); }; /** `RSVP.allSettled` is similar to `RSVP.all`, but instead of implementing a fail-fast method, it waits until all the promises have returned and shows you all the results. This is useful if you want to handle multiple promises' failure states together as a set. Returns a promise that is fulfilled when all the given promises have been settled. The return promise is fulfilled with an array of the states of the promises passed into the `promises` array argument. Each state object will either indicate fulfillment or rejection, and provide the corresponding value or reason. The states will take one of the following formats: ```javascript { state: 'fulfilled', value: value } or { state: 'rejected', reason: reason } ``` Example: ```javascript var promise1 = RSVP.Promise.resolve(1); var promise2 = RSVP.Promise.reject(new Error('2')); var promise3 = RSVP.Promise.reject(new Error('3')); var promises = [ promise1, promise2, promise3 ]; RSVP.allSettled(promises).then(function(array){ // array == [ // { state: 'fulfilled', value: 1 }, // { state: 'rejected', reason: Error }, // { state: 'rejected', reason: Error } // ] // Note that for the second item, reason.message will be '2', and for the // third item, reason.message will be '3'. }, function(error) { // Not run. (This block would only be called if allSettled had failed, // for instance if passed an incorrect argument type.) }); ``` @method allSettled @static @for RSVP @param {Array} promises @param {String} label - optional string that describes the promise. Useful for tooling. @return {Promise} promise that is fulfilled with an array of the settled states of the constituent promises. */ __exports__["default"] = function allSettled(entries, label) { return new AllSettled(Promise, entries, label).promise; } }); define("rsvp/all", ["./promise","exports"], function(__dependency1__, __exports__) { "use strict"; var Promise = __dependency1__["default"]; /** This is a convenient alias for `RSVP.Promise.all`. @method all @static @for RSVP @param {Array} array Array of promises. @param {String} label An optional label. This is useful for tooling. */ __exports__["default"] = function all(array, label) { return Promise.all(array, label); } }); define("rsvp/asap", ["exports"], function(__exports__) { "use strict"; var len = 0; __exports__["default"] = function asap(callback, arg) { queue[len] = callback; queue[len + 1] = arg; len += 2; if (len === 2) { // If len is 1, that means that we need to schedule an async flush. // If additional callbacks are queued before the queue is flushed, they // will be processed by this flush that we are scheduling. scheduleFlush(); } } var browserGlobal = (typeof window !== 'undefined') ? window : {}; var BrowserMutationObserver = browserGlobal.MutationObserver || browserGlobal.WebKitMutationObserver; // test for web worker but not in IE10 var isWorker = typeof Uint8ClampedArray !== 'undefined' && typeof importScripts !== 'undefined' && typeof MessageChannel !== 'undefined'; // node function useNextTick() { return function() { process.nextTick(flush); }; } function useMutationObserver() { var iterations = 0; var observer = new BrowserMutationObserver(flush); var node = document.createTextNode(''); observer.observe(node, { characterData: true }); return function() { node.data = (iterations = ++iterations % 2); }; } // web worker function useMessageChannel() { var channel = new MessageChannel(); channel.port1.onmessage = flush; return function () { channel.port2.postMessage(0); }; } function useSetTimeout() { return function() { setTimeout(flush, 1); }; } var queue = new Array(1000); function flush() { for (var i = 0; i < len; i+=2) { var callback = queue[i]; var arg = queue[i+1]; callback(arg); queue[i] = undefined; queue[i+1] = undefined; } len = 0; } var scheduleFlush; // Decide what async method to use to triggering processing of queued callbacks: if (typeof process !== 'undefined' && {}.toString.call(process) === '[object process]') { scheduleFlush = useNextTick(); } else if (BrowserMutationObserver) { scheduleFlush = useMutationObserver(); } else if (isWorker) { scheduleFlush = useMessageChannel(); } else { scheduleFlush = useSetTimeout(); } }); define("rsvp/config", ["./events","exports"], function(__dependency1__, __exports__) { "use strict"; var EventTarget = __dependency1__["default"]; var config = { instrument: false }; EventTarget.mixin(config); function configure(name, value) { if (name === 'onerror') { // handle for legacy users that expect the actual // error to be passed to their function added via // `RSVP.configure('onerror', someFunctionHere);` config.on('error', value); return; } if (arguments.length === 2) { config[name] = value; } else { return config[name]; } } __exports__.config = config; __exports__.configure = configure; }); define("rsvp/defer", ["./promise","exports"], function(__dependency1__, __exports__) { "use strict"; var Promise = __dependency1__["default"]; /** `RSVP.defer` returns an object similar to jQuery's `$.Deferred`. `RSVP.defer` should be used when porting over code reliant on `$.Deferred`'s interface. New code should use the `RSVP.Promise` constructor instead. The object returned from `RSVP.defer` is a plain object with three properties: * promise - an `RSVP.Promise`. * reject - a function that causes the `promise` property on this object to become rejected * resolve - a function that causes the `promise` property on this object to become fulfilled. Example: ```javascript var deferred = RSVP.defer(); deferred.resolve("Success!"); defered.promise.then(function(value){ // value here is "Success!" }); ``` @method defer @static @for RSVP @param {String} label optional string for labeling the promise. Useful for tooling. @return {Object} */ __exports__["default"] = function defer(label) { var deferred = { }; deferred.promise = new Promise(function(resolve, reject) { deferred.resolve = resolve; deferred.reject = reject; }, label); return deferred; } }); define("rsvp/enumerator", ["./utils","./-internal","exports"], function(__dependency1__, __dependency2__, __exports__) { "use strict"; var isArray = __dependency1__.isArray; var isMaybeThenable = __dependency1__.isMaybeThenable; var noop = __dependency2__.noop; var reject = __dependency2__.reject; var fulfill = __dependency2__.fulfill; var subscribe = __dependency2__.subscribe; var FULFILLED = __dependency2__.FULFILLED; var REJECTED = __dependency2__.REJECTED; var PENDING = __dependency2__.PENDING; function makeSettledResult(state, position, value) { if (state === FULFILLED) { return { state: 'fulfilled', value: value }; } else { return { state: 'rejected', reason: value }; } } __exports__.makeSettledResult = makeSettledResult;function Enumerator(Constructor, input, abortOnReject, label) { this._instanceConstructor = Constructor; this.promise = new Constructor(noop, label); this._abortOnReject = abortOnReject; if (this._validateInput(input)) { this._input = input; this.length = input.length; this._remaining = input.length; this._init(); if (this.length === 0) { fulfill(this.promise, this._result); } else { this.length = this.length || 0; this._enumerate(); if (this._remaining === 0) { fulfill(this.promise, this._result); } } } else { reject(this.promise, this._validationError()); } } Enumerator.prototype._validateInput = function(input) { return isArray(input); }; Enumerator.prototype._validationError = function() { return new Error('Array Methods must be provided an Array'); }; Enumerator.prototype._init = function() { this._result = new Array(this.length); }; __exports__["default"] = Enumerator; Enumerator.prototype._enumerate = function() { var length = this.length; var promise = this.promise; var input = this._input; for (var i = 0; promise._state === PENDING && i < length; i++) { this._eachEntry(input[i], i); } }; Enumerator.prototype._eachEntry = function(entry, i) { var c = this._instanceConstructor; if (isMaybeThenable(entry)) { if (entry.constructor === c && entry._state !== PENDING) { entry._onerror = null; this._settledAt(entry._state, i, entry._result); } else { this._willSettleAt(c.resolve(entry), i); } } else { this._remaining--; this._result[i] = this._makeResult(FULFILLED, i, entry); } }; Enumerator.prototype._settledAt = function(state, i, value) { var promise = this.promise; if (promise._state === PENDING) { this._remaining--; if (this._abortOnReject && state === REJECTED) { reject(promise, value); } else { this._result[i] = this._makeResult(state, i, value); } } if (this._remaining === 0) { fulfill(promise, this._result); } }; Enumerator.prototype._makeResult = function(state, i, value) { return value; }; Enumerator.prototype._willSettleAt = function(promise, i) { var enumerator = this; subscribe(promise, undefined, function(value) { enumerator._settledAt(FULFILLED, i, value); }, function(reason) { enumerator._settledAt(REJECTED, i, reason); }); }; }); define("rsvp/events", ["exports"], function(__exports__) { "use strict"; function indexOf(callbacks, callback) { for (var i=0, l=callbacks.length; i 1; }; RSVP.filter(promises, filterFn).then(function(result){ // result is [ 2, 3 ] }); ``` If any of the `promises` given to `RSVP.filter` are rejected, the first promise that is rejected will be given as an argument to the returned promise's rejection handler. For example: ```javascript var promise1 = RSVP.resolve(1); var promise2 = RSVP.reject(new Error('2')); var promise3 = RSVP.reject(new Error('3')); var promises = [ promise1, promise2, promise3 ]; var filterFn = function(item){ return item > 1; }; RSVP.filter(promises, filterFn).then(function(array){ // Code here never runs because there are rejected promises! }, function(reason) { // reason.message === '2' }); ``` `RSVP.filter` will also wait for any promises returned from `filterFn`. For instance, you may want to fetch a list of users then return a subset of those users based on some asynchronous operation: ```javascript var alice = { name: 'alice' }; var bob = { name: 'bob' }; var users = [ alice, bob ]; var promises = users.map(function(user){ return RSVP.resolve(user); }); var filterFn = function(user){ // Here, Alice has permissions to create a blog post, but Bob does not. return getPrivilegesForUser(user).then(function(privs){ return privs.can_create_blog_post === true; }); }; RSVP.filter(promises, filterFn).then(function(users){ // true, because the server told us only Alice can create a blog post. users.length === 1; // false, because Alice is the only user present in `users` users[0] === bob; }); ``` @method filter @static @for RSVP @param {Array} promises @param {Function} filterFn - function to be called on each resolved value to filter the final results. @param {String} label optional string describing the promise. Useful for tooling. @return {Promise} */ __exports__["default"] = function filter(promises, filterFn, label) { return Promise.all(promises, label).then(function(values) { if (!isFunction(filterFn)) { throw new TypeError("You must pass a function as filter's second argument."); } var length = values.length; var filtered = new Array(length); for (var i = 0; i < length; i++) { filtered[i] = filterFn(values[i]); } return Promise.all(filtered, label).then(function(filtered) { var results = new Array(length); var newLength = 0; for (var i = 0; i < length; i++) { if (filtered[i]) { results[newLength] = values[i]; newLength++; } } results.length = newLength; return results; }); }); } }); define("rsvp/hash-settled", ["./promise","./enumerator","./promise-hash","./utils","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __exports__) { "use strict"; var Promise = __dependency1__["default"]; var makeSettledResult = __dependency2__.makeSettledResult; var PromiseHash = __dependency3__["default"]; var Enumerator = __dependency2__["default"]; var o_create = __dependency4__.o_create; function HashSettled(Constructor, object, label) { this._superConstructor(Constructor, object, false, label); } HashSettled.prototype = o_create(PromiseHash.prototype); HashSettled.prototype._superConstructor = Enumerator; HashSettled.prototype._makeResult = makeSettledResult; HashSettled.prototype._validationError = function() { return new Error('hashSettled must be called with an object'); }; /** `RSVP.hashSettled` is similar to `RSVP.allSettled`, but takes an object instead of an array for its `promises` argument. Unlike `RSVP.all` or `RSVP.hash`, which implement a fail-fast method, but like `RSVP.allSettled`, `hashSettled` waits until all the constituent promises have returned and then shows you all the results with their states and values/reasons. This is useful if you want to handle multiple promises' failure states together as a set. Returns a promise that is fulfilled when all the given promises have been settled, or rejected if the passed parameters are invalid. The returned promise is fulfilled with a hash that has the same key names as the `promises` object argument. If any of the values in the object are not promises, they will be copied over to the fulfilled object and marked with state 'fulfilled'. Example: ```javascript var promises = { myPromise: RSVP.Promise.resolve(1), yourPromise: RSVP.Promise.resolve(2), theirPromise: RSVP.Promise.resolve(3), notAPromise: 4 }; RSVP.hashSettled(promises).then(function(hash){ // hash here is an object that looks like: // { // myPromise: { state: 'fulfilled', value: 1 }, // yourPromise: { state: 'fulfilled', value: 2 }, // theirPromise: { state: 'fulfilled', value: 3 }, // notAPromise: { state: 'fulfilled', value: 4 } // } }); ``` If any of the `promises` given to `RSVP.hash` are rejected, the state will be set to 'rejected' and the reason for rejection provided. Example: ```javascript var promises = { myPromise: RSVP.Promise.resolve(1), rejectedPromise: RSVP.Promise.reject(new Error('rejection')), anotherRejectedPromise: RSVP.Promise.reject(new Error('more rejection')), }; RSVP.hashSettled(promises).then(function(hash){ // hash here is an object that looks like: // { // myPromise: { state: 'fulfilled', value: 1 }, // rejectedPromise: { state: 'rejected', reason: Error }, // anotherRejectedPromise: { state: 'rejected', reason: Error }, // } // Note that for rejectedPromise, reason.message == 'rejection', // and for anotherRejectedPromise, reason.message == 'more rejection'. }); ``` An important note: `RSVP.hashSettled` is intended for plain JavaScript objects that are just a set of keys and values. `RSVP.hashSettled` will NOT preserve prototype chains. Example: ```javascript function MyConstructor(){ this.example = RSVP.Promise.resolve('Example'); } MyConstructor.prototype = { protoProperty: RSVP.Promise.resolve('Proto Property') }; var myObject = new MyConstructor(); RSVP.hashSettled(myObject).then(function(hash){ // protoProperty will not be present, instead you will just have an // object that looks like: // { // example: { state: 'fulfilled', value: 'Example' } // } // // hash.hasOwnProperty('protoProperty'); // false // 'undefined' === typeof hash.protoProperty }); ``` @method hashSettled @for RSVP @param {Object} promises @param {String} label optional string that describes the promise. Useful for tooling. @return {Promise} promise that is fulfilled when when all properties of `promises` have been settled. @static */ __exports__["default"] = function hashSettled(object, label) { return new HashSettled(Promise, object, label).promise; } }); define("rsvp/hash", ["./promise","./promise-hash","exports"], function(__dependency1__, __dependency2__, __exports__) { "use strict"; var Promise = __dependency1__["default"]; var PromiseHash = __dependency2__["default"]; /** `RSVP.hash` is similar to `RSVP.all`, but takes an object instead of an array for its `promises` argument. Returns a promise that is fulfilled when all the given promises have been fulfilled, or rejected if any of them become rejected. The returned promise is fulfilled with a hash that has the same key names as the `promises` object argument. If any of the values in the object are not promises, they will simply be copied over to the fulfilled object. Example: ```javascript var promises = { myPromise: RSVP.resolve(1), yourPromise: RSVP.resolve(2), theirPromise: RSVP.resolve(3), notAPromise: 4 }; RSVP.hash(promises).then(function(hash){ // hash here is an object that looks like: // { // myPromise: 1, // yourPromise: 2, // theirPromise: 3, // notAPromise: 4 // } }); ```` If any of the `promises` given to `RSVP.hash` are rejected, the first promise that is rejected will be given as the reason to the rejection handler. Example: ```javascript var promises = { myPromise: RSVP.resolve(1), rejectedPromise: RSVP.reject(new Error('rejectedPromise')), anotherRejectedPromise: RSVP.reject(new Error('anotherRejectedPromise')), }; RSVP.hash(promises).then(function(hash){ // Code here never runs because there are rejected promises! }, function(reason) { // reason.message === 'rejectedPromise' }); ``` An important note: `RSVP.hash` is intended for plain JavaScript objects that are just a set of keys and values. `RSVP.hash` will NOT preserve prototype chains. Example: ```javascript function MyConstructor(){ this.example = RSVP.resolve('Example'); } MyConstructor.prototype = { protoProperty: RSVP.resolve('Proto Property') }; var myObject = new MyConstructor(); RSVP.hash(myObject).then(function(hash){ // protoProperty will not be present, instead you will just have an // object that looks like: // { // example: 'Example' // } // // hash.hasOwnProperty('protoProperty'); // false // 'undefined' === typeof hash.protoProperty }); ``` @method hash @static @for RSVP @param {Object} promises @param {String} label optional string that describes the promise. Useful for tooling. @return {Promise} promise that is fulfilled when all properties of `promises` have been fulfilled, or rejected if any of them become rejected. */ __exports__["default"] = function hash(object, label) { return new PromiseHash(Promise, object, label).promise; } }); define("rsvp/instrument", ["./config","./utils","exports"], function(__dependency1__, __dependency2__, __exports__) { "use strict"; var config = __dependency1__.config; var now = __dependency2__.now; var queue = []; __exports__["default"] = function instrument(eventName, promise, child) { if (1 === queue.push({ name: eventName, payload: { guid: promise._guidKey + promise._id, eventName: eventName, detail: promise._result, childGuid: child && promise._guidKey + child._id, label: promise._label, timeStamp: now(), stack: new Error(promise._label).stack }})) { setTimeout(function() { var entry; for (var i = 0; i < queue.length; i++) { entry = queue[i]; config.trigger(entry.name, entry.payload); } queue.length = 0; }, 50); } } }); define("rsvp/map", ["./promise","./utils","exports"], function(__dependency1__, __dependency2__, __exports__) { "use strict"; var Promise = __dependency1__["default"]; var isFunction = __dependency2__.isFunction; /** `RSVP.map` is similar to JavaScript's native `map` method, except that it waits for all promises to become fulfilled before running the `mapFn` on each item in given to `promises`. `RSVP.map` returns a promise that will become fulfilled with the result of running `mapFn` on the values the promises become fulfilled with. For example: ```javascript var promise1 = RSVP.resolve(1); var promise2 = RSVP.resolve(2); var promise3 = RSVP.resolve(3); var promises = [ promise1, promise2, promise3 ]; var mapFn = function(item){ return item + 1; }; RSVP.map(promises, mapFn).then(function(result){ // result is [ 2, 3, 4 ] }); ``` If any of the `promises` given to `RSVP.map` are rejected, the first promise that is rejected will be given as an argument to the returned promise's rejection handler. For example: ```javascript var promise1 = RSVP.resolve(1); var promise2 = RSVP.reject(new Error('2')); var promise3 = RSVP.reject(new Error('3')); var promises = [ promise1, promise2, promise3 ]; var mapFn = function(item){ return item + 1; }; RSVP.map(promises, mapFn).then(function(array){ // Code here never runs because there are rejected promises! }, function(reason) { // reason.message === '2' }); ``` `RSVP.map` will also wait if a promise is returned from `mapFn`. For example, say you want to get all comments from a set of blog posts, but you need the blog posts first because they contain a url to those comments. ```javscript var mapFn = function(blogPost){ // getComments does some ajax and returns an RSVP.Promise that is fulfilled // with some comments data return getComments(blogPost.comments_url); }; // getBlogPosts does some ajax and returns an RSVP.Promise that is fulfilled // with some blog post data RSVP.map(getBlogPosts(), mapFn).then(function(comments){ // comments is the result of asking the server for the comments // of all blog posts returned from getBlogPosts() }); ``` @method map @static @for RSVP @param {Array} promises @param {Function} mapFn function to be called on each fulfilled promise. @param {String} label optional string for labeling the promise. Useful for tooling. @return {Promise} promise that is fulfilled with the result of calling `mapFn` on each fulfilled promise or value when they become fulfilled. The promise will be rejected if any of the given `promises` become rejected. @static */ __exports__["default"] = function map(promises, mapFn, label) { return Promise.all(promises, label).then(function(values) { if (!isFunction(mapFn)) { throw new TypeError("You must pass a function as map's second argument."); } var length = values.length; var results = new Array(length); for (var i = 0; i < length; i++) { results[i] = mapFn(values[i]); } return Promise.all(results, label); }); } }); define("rsvp/node", ["./promise","./-internal","./utils","exports"], function(__dependency1__, __dependency2__, __dependency3__, __exports__) { "use strict"; var Promise = __dependency1__["default"]; var noop = __dependency2__.noop; var resolve = __dependency2__.resolve; var reject = __dependency2__.reject; var isArray = __dependency3__.isArray; function Result() { this.value = undefined; } var ERROR = new Result(); var GET_THEN_ERROR = new Result(); function getThen(obj) { try { return obj.then; } catch(error) { ERROR.value= error; return ERROR; } } function tryApply(f, s, a) { try { f.apply(s, a); } catch(error) { ERROR.value = error; return ERROR; } } function makeObject(_, argumentNames) { var obj = {}; var name; var i; var length = _.length; var args = new Array(length); for (var x = 0; x < length; x++) { args[x] = _[x]; } for (i = 0; i < argumentNames.length; i++) { name = argumentNames[i]; obj[name] = args[i + 1]; } return obj; } function arrayResult(_) { var length = _.length; var args = new Array(length - 1); for (var i = 1; i < length; i++) { args[i - 1] = _[i]; } return args; } function wrapThenable(then, promise) { return { then: function(onFulFillment, onRejection) { return then.call(promise, onFulFillment, onRejection); } }; } /** `RSVP.denodeify` takes a 'node-style' function and returns a function that will return an `RSVP.Promise`. You can use `denodeify` in Node.js or the browser when you'd prefer to use promises over using callbacks. For example, `denodeify` transforms the following: ```javascript var fs = require('fs'); fs.readFile('myfile.txt', function(err, data){ if (err) return handleError(err); handleData(data); }); ``` into: ```javascript var fs = require('fs'); var readFile = RSVP.denodeify(fs.readFile); readFile('myfile.txt').then(handleData, handleError); ``` If the node function has multiple success parameters, then `denodeify` just returns the first one: ```javascript var request = RSVP.denodeify(require('request')); request('http://example.com').then(function(res) { // ... }); ``` However, if you need all success parameters, setting `denodeify`'s second parameter to `true` causes it to return all success parameters as an array: ```javascript var request = RSVP.denodeify(require('request'), true); request('http://example.com').then(function(result) { // result[0] -> res // result[1] -> body }); ``` Or if you pass it an array with names it returns the parameters as a hash: ```javascript var request = RSVP.denodeify(require('request'), ['res', 'body']); request('http://example.com').then(function(result) { // result.res // result.body }); ``` Sometimes you need to retain the `this`: ```javascript var app = require('express')(); var render = RSVP.denodeify(app.render.bind(app)); ``` The denodified function inherits from the original function. It works in all environments, except IE 10 and below. Consequently all properties of the original function are available to you. However, any properties you change on the denodeified function won't be changed on the original function. Example: ```javascript var request = RSVP.denodeify(require('request')), cookieJar = request.jar(); // <- Inheritance is used here request('http://example.com', {jar: cookieJar}).then(function(res) { // cookieJar.cookies holds now the cookies returned by example.com }); ``` Using `denodeify` makes it easier to compose asynchronous operations instead of using callbacks. For example, instead of: ```javascript var fs = require('fs'); fs.readFile('myfile.txt', function(err, data){ if (err) { ... } // Handle error fs.writeFile('myfile2.txt', data, function(err){ if (err) { ... } // Handle error console.log('done') }); }); ``` you can chain the operations together using `then` from the returned promise: ```javascript var fs = require('fs'); var readFile = RSVP.denodeify(fs.readFile); var writeFile = RSVP.denodeify(fs.writeFile); readFile('myfile.txt').then(function(data){ return writeFile('myfile2.txt', data); }).then(function(){ console.log('done') }).catch(function(error){ // Handle error }); ``` @method denodeify @static @for RSVP @param {Function} nodeFunc a 'node-style' function that takes a callback as its last argument. The callback expects an error to be passed as its first argument (if an error occurred, otherwise null), and the value from the operation as its second argument ('function(err, value){ }'). @param {Boolean|Array} argumentNames An optional paramter that if set to `true` causes the promise to fulfill with the callback's success arguments as an array. This is useful if the node function has multiple success paramters. If you set this paramter to an array with names, the promise will fulfill with a hash with these names as keys and the success parameters as values. @return {Function} a function that wraps `nodeFunc` to return an `RSVP.Promise` @static */ __exports__["default"] = function denodeify(nodeFunc, options) { var fn = function() { var self = this; var l = arguments.length; var args = new Array(l + 1); var arg; var promiseInput = false; for (var i = 0; i < l; ++i) { arg = arguments[i]; if (!promiseInput) { // TODO: clean this up promiseInput = needsPromiseInput(arg); if (promiseInput === GET_THEN_ERROR) { var p = new Promise(noop); reject(p, GET_THEN_ERROR.value); return p; } else if (promiseInput && promiseInput !== true) { arg = wrapThenable(promiseInput, arg); } } args[i] = arg; } var promise = new Promise(noop); args[l] = function(err, val) { if (err) reject(promise, err); else if (options === undefined) resolve(promise, val); else if (options === true) resolve(promise, arrayResult(arguments)); else if (isArray(options)) resolve(promise, makeObject(arguments, options)); else resolve(promise, val); }; if (promiseInput) { return handlePromiseInput(promise, args, nodeFunc, self); } else { return handleValueInput(promise, args, nodeFunc, self); } }; fn.__proto__ = nodeFunc; return fn; } function handleValueInput(promise, args, nodeFunc, self) { var result = tryApply(nodeFunc, self, args); if (result === ERROR) { reject(promise, result.value); } return promise; } function handlePromiseInput(promise, args, nodeFunc, self){ return Promise.all(args).then(function(args){ var result = tryApply(nodeFunc, self, args); if (result === ERROR) { reject(promise, result.value); } return promise; }); } function needsPromiseInput(arg) { if (arg && typeof arg === 'object') { if (arg.constructor === Promise) { return true; } else { return getThen(arg); } } else { return false; } } }); define("rsvp/promise-hash", ["./enumerator","./-internal","./utils","exports"], function(__dependency1__, __dependency2__, __dependency3__, __exports__) { "use strict"; var Enumerator = __dependency1__["default"]; var PENDING = __dependency2__.PENDING; var o_create = __dependency3__.o_create; function PromiseHash(Constructor, object, label) { this._superConstructor(Constructor, object, true, label); } __exports__["default"] = PromiseHash; PromiseHash.prototype = o_create(Enumerator.prototype); PromiseHash.prototype._superConstructor = Enumerator; PromiseHash.prototype._init = function() { this._result = {}; }; PromiseHash.prototype._validateInput = function(input) { return input && typeof input === 'object'; }; PromiseHash.prototype._validationError = function() { return new Error('Promise.hash must be called with an object'); }; PromiseHash.prototype._enumerate = function() { var promise = this.promise; var input = this._input; var results = []; for (var key in input) { if (promise._state === PENDING && input.hasOwnProperty(key)) { results.push({ position: key, entry: input[key] }); } } var length = results.length; this._remaining = length; var result; for (var i = 0; promise._state === PENDING && i < length; i++) { result = results[i]; this._eachEntry(result.entry, result.position); } }; }); define("rsvp/promise", ["./config","./instrument","./utils","./-internal","./promise/all","./promise/race","./promise/resolve","./promise/reject","exports"], function(__dependency1__, __dependency2__, __dependency3__, __dependency4__, __dependency5__, __dependency6__, __dependency7__, __dependency8__, __exports__) { "use strict"; var config = __dependency1__.config; var instrument = __dependency2__["default"]; var isFunction = __dependency3__.isFunction; var now = __dependency3__.now; var noop = __dependency4__.noop; var subscribe = __dependency4__.subscribe; var initializePromise = __dependency4__.initializePromise; var invokeCallback = __dependency4__.invokeCallback; var FULFILLED = __dependency4__.FULFILLED; var REJECTED = __dependency4__.REJECTED; var all = __dependency5__["default"]; var race = __dependency6__["default"]; var Resolve = __dependency7__["default"]; var Reject = __dependency8__["default"]; var guidKey = 'rsvp_' + now() + '-'; var counter = 0; function needsResolver() { throw new TypeError('You must pass a resolver function as the first argument to the promise constructor'); } function needsNew() { throw new TypeError("Failed to construct 'Promise': Please use the 'new' operator, this object constructor cannot be called as a function."); } __exports__["default"] = Promise; /** Promise objects represent the eventual result of an asynchronous operation. The primary way of interacting with a promise is through its `then` method, which registers callbacks to receive either a promise’s eventual value or the reason why the promise cannot be fulfilled. Terminology ----------- - `promise` is an object or function with a `then` method whose behavior conforms to this specification. - `thenable` is an object or function that defines a `then` method. - `value` is any legal JavaScript value (including undefined, a thenable, or a promise). - `exception` is a value that is thrown using the throw statement. - `reason` is a value that indicates why a promise was rejected. - `settled` the final resting state of a promise, fulfilled or rejected. A promise can be in one of three states: pending, fulfilled, or rejected. Promises that are fulfilled have a fulfillment value and are in the fulfilled state. Promises that are rejected have a rejection reason and are in the rejected state. A fulfillment value is never a thenable. Promises can also be said to *resolve* a value. If this value is also a promise, then the original promise's settled state will match the value's settled state. So a promise that *resolves* a promise that rejects will itself reject, and a promise that *resolves* a promise that fulfills will itself fulfill. Basic Usage: ------------ ```js var promise = new Promise(function(resolve, reject) { // on success resolve(value); // on failure reject(reason); }); promise.then(function(value) { // on fulfillment }, function(reason) { // on rejection }); ``` Advanced Usage: --------------- Promises shine when abstracting away asynchronous interactions such as `XMLHttpRequest`s. ```js function getJSON(url) { return new Promise(function(resolve, reject){ var xhr = new XMLHttpRequest(); xhr.open('GET', url); xhr.onreadystatechange = handler; xhr.responseType = 'json'; xhr.setRequestHeader('Accept', 'application/json'); xhr.send(); function handler() { if (this.readyState === this.DONE) { if (this.status === 200) { resolve(this.response); } else { reject(new Error('getJSON: `' + url + '` failed with status: [' + this.status + ']')); } } }; }); } getJSON('/posts.json').then(function(json) { // on fulfillment }, function(reason) { // on rejection }); ``` Unlike callbacks, promises are great composable primitives. ```js Promise.all([ getJSON('/posts'), getJSON('/comments') ]).then(function(values){ values[0] // => postsJSON values[1] // => commentsJSON return values; }); ``` @class RSVP.Promise @param {function} resolver @param {String} label optional string for labeling the promise. Useful for tooling. @constructor */ function Promise(resolver, label) { this._id = counter++; this._label = label; this._state = undefined; this._result = undefined; this._subscribers = []; if (config.instrument) { instrument('created', this); } if (noop !== resolver) { if (!isFunction(resolver)) { needsResolver(); } if (!(this instanceof Promise)) { needsNew(); } initializePromise(this, resolver); } } Promise.cast = Resolve; // deprecated Promise.all = all; Promise.race = race; Promise.resolve = Resolve; Promise.reject = Reject; Promise.prototype = { constructor: Promise, _guidKey: guidKey, _onerror: function (reason) { config.trigger('error', reason); }, /** The primary way of interacting with a promise is through its `then` method, which registers callbacks to receive either a promise's eventual value or the reason why the promise cannot be fulfilled. ```js findUser().then(function(user){ // user is available }, function(reason){ // user is unavailable, and you are given the reason why }); ``` Chaining -------- The return value of `then` is itself a promise. This second, 'downstream' promise is resolved with the return value of the first promise's fulfillment or rejection handler, or rejected if the handler throws an exception. ```js findUser().then(function (user) { return user.name; }, function (reason) { return 'default name'; }).then(function (userName) { // If `findUser` fulfilled, `userName` will be the user's name, otherwise it // will be `'default name'` }); findUser().then(function (user) { throw new Error('Found user, but still unhappy'); }, function (reason) { throw new Error('`findUser` rejected and we're unhappy'); }).then(function (value) { // never reached }, function (reason) { // if `findUser` fulfilled, `reason` will be 'Found user, but still unhappy'. // If `findUser` rejected, `reason` will be '`findUser` rejected and we're unhappy'. }); ``` If the downstream promise does not specify a rejection handler, rejection reasons will be propagated further downstream. ```js findUser().then(function (user) { throw new PedagogicalException('Upstream error'); }).then(function (value) { // never reached }).then(function (value) { // never reached }, function (reason) { // The `PedgagocialException` is propagated all the way down to here }); ``` Assimilation ------------ Sometimes the value you want to propagate to a downstream promise can only be retrieved asynchronously. This can be achieved by returning a promise in the fulfillment or rejection handler. The downstream promise will then be pending until the returned promise is settled. This is called *assimilation*. ```js findUser().then(function (user) { return findCommentsByAuthor(user); }).then(function (comments) { // The user's comments are now available }); ``` If the assimliated promise rejects, then the downstream promise will also reject. ```js findUser().then(function (user) { return findCommentsByAuthor(user); }).then(function (comments) { // If `findCommentsByAuthor` fulfills, we'll have the value here }, function (reason) { // If `findCommentsByAuthor` rejects, we'll have the reason here }); ``` Simple Example -------------- Synchronous Example ```javascript var result; try { result = findResult(); // success } catch(reason) { // failure } ``` Errback Example ```js findResult(function(result, err){ if (err) { // failure } else { // success } }); ``` Promise Example; ```javascript findResult().then(function(result){ // success }, function(reason){ // failure }); ``` Advanced Example -------------- Synchronous Example ```javascript var author, books; try { author = findAuthor(); books = findBooksByAuthor(author); // success } catch(reason) { // failure } ``` Errback Example ```js function foundBooks(books) { } function failure(reason) { } findAuthor(function(author, err){ if (err) { failure(err); // failure } else { try { findBoooksByAuthor(author, function(books, err) { if (err) { failure(err); } else { try { foundBooks(books); } catch(reason) { failure(reason); } } }); } catch(error) { failure(err); } // success } }); ``` Promise Example; ```javascript findAuthor(). then(findBooksByAuthor). then(function(books){ // found books }).catch(function(reason){ // something went wrong }); ``` @method then @param {Function} onFulfilled @param {Function} onRejected @param {String} label optional string for labeling the promise. Useful for tooling. @return {Promise} */ then: function(onFulfillment, onRejection, label) { var parent = this; var state = parent._state; if (state === FULFILLED && !onFulfillment || state === REJECTED && !onRejection) { if (config.instrument) { instrument('chained', this, this); } return this; } parent._onerror = null; var child = new this.constructor(noop, label); var result = parent._result; if (config.instrument) { instrument('chained', parent, child); } if (state) { var callback = arguments[state - 1]; config.async(function(){ invokeCallback(state, child, callback, result); }); } else { subscribe(parent, child, onFulfillment, onRejection); } return child; }, /** `catch` is simply sugar for `then(undefined, onRejection)` which makes it the same as the catch block of a try/catch statement. ```js function findAuthor(){ throw new Error('couldn't find that author'); } // synchronous try { findAuthor(); } catch(reason) { // something went wrong } // async with promises findAuthor().catch(function(reason){ // something went wrong }); ``` @method catch @param {Function} onRejection @param {String} label optional string for labeling the promise. Useful for tooling. @return {Promise} */ 'catch': function(onRejection, label) { return this.then(null, onRejection, label); }, /** `finally` will be invoked regardless of the promise's fate just as native try/catch/finally behaves Synchronous example: ```js findAuthor() { if (Math.random() > 0.5) { throw new Error(); } return new Author(); } try { return findAuthor(); // succeed or fail } catch(error) { return findOtherAuther(); } finally { // always runs // doesn't affect the return value } ``` Asynchronous example: ```js findAuthor().catch(function(reason){ return findOtherAuther(); }).finally(function(){ // author was either found, or not }); ``` @method finally @param {Function} callback @param {String} label optional string for labeling the promise. Useful for tooling. @return {Promise} */ 'finally': function(callback, label) { var constructor = this.constructor; return this.then(function(value) { return constructor.resolve(callback()).then(function(){ return value; }); }, function(reason) { return constructor.resolve(callback()).then(function(){ throw reason; }); }, label); } }; }); define("rsvp/promise/all", ["../enumerator","exports"], function(__dependency1__, __exports__) { "use strict"; var Enumerator = __dependency1__["default"]; /** `RSVP.Promise.all` accepts an array of promises, and returns a new promise which is fulfilled with an array of fulfillment values for the passed promises, or rejected with the reason of the first passed promise to be rejected. It casts all elements of the passed iterable to promises as it runs this algorithm. Example: ```javascript var promise1 = RSVP.resolve(1); var promise2 = RSVP.resolve(2); var promise3 = RSVP.resolve(3); var promises = [ promise1, promise2, promise3 ]; RSVP.Promise.all(promises).then(function(array){ // The array here would be [ 1, 2, 3 ]; }); ``` If any of the `promises` given to `RSVP.all` are rejected, the first promise that is rejected will be given as an argument to the returned promises's rejection handler. For example: Example: ```javascript var promise1 = RSVP.resolve(1); var promise2 = RSVP.reject(new Error("2")); var promise3 = RSVP.reject(new Error("3")); var promises = [ promise1, promise2, promise3 ]; RSVP.Promise.all(promises).then(function(array){ // Code here never runs because there are rejected promises! }, function(error) { // error.message === "2" }); ``` @method all @static @param {Array} entries array of promises @param {String} label optional string for labeling the promise. Useful for tooling. @return {Promise} promise that is fulfilled when all `promises` have been fulfilled, or rejected if any of them become rejected. @static */ __exports__["default"] = function all(entries, label) { return new Enumerator(this, entries, true /* abort on reject */, label).promise; } }); define("rsvp/promise/race", ["../utils","../-internal","exports"], function(__dependency1__, __dependency2__, __exports__) { "use strict"; var isArray = __dependency1__.isArray; var noop = __dependency2__.noop; var resolve = __dependency2__.resolve; var reject = __dependency2__.reject; var subscribe = __dependency2__.subscribe; var PENDING = __dependency2__.PENDING; /** `RSVP.Promise.race` returns a new promise which is settled in the same way as the first passed promise to settle. Example: ```javascript var promise1 = new RSVP.Promise(function(resolve, reject){ setTimeout(function(){ resolve('promise 1'); }, 200); }); var promise2 = new RSVP.Promise(function(resolve, reject){ setTimeout(function(){ resolve('promise 2'); }, 100); }); RSVP.Promise.race([promise1, promise2]).then(function(result){ // result === 'promise 2' because it was resolved before promise1 // was resolved. }); ``` `RSVP.Promise.race` is deterministic in that only the state of the first settled promise matters. For example, even if other promises given to the `promises` array argument are resolved, but the first settled promise has become rejected before the other promises became fulfilled, the returned promise will become rejected: ```javascript var promise1 = new RSVP.Promise(function(resolve, reject){ setTimeout(function(){ resolve('promise 1'); }, 200); }); var promise2 = new RSVP.Promise(function(resolve, reject){ setTimeout(function(){ reject(new Error('promise 2')); }, 100); }); RSVP.Promise.race([promise1, promise2]).then(function(result){ // Code here never runs }, function(reason){ // reason.message === 'promise 2' because promise 2 became rejected before // promise 1 became fulfilled }); ``` An example real-world use case is implementing timeouts: ```javascript RSVP.Promise.race([ajax('foo.json'), timeout(5000)]) ``` @method race @static @param {Array} promises array of promises to observe @param {String} label optional string for describing the promise returned. Useful for tooling. @return {Promise} a promise which settles in the same way as the first passed promise to settle. */ __exports__["default"] = function race(entries, label) { /*jshint validthis:true */ var Constructor = this; var promise = new Constructor(noop, label); if (!isArray(entries)) { reject(promise, new TypeError('You must pass an array to race.')); return promise; } var length = entries.length; function onFulfillment(value) { resolve(promise, value); } function onRejection(reason) { reject(promise, reason); } for (var i = 0; promise._state === PENDING && i < length; i++) { subscribe(Constructor.resolve(entries[i]), undefined, onFulfillment, onRejection); } return promise; } }); define("rsvp/promise/reject", ["../-internal","exports"], function(__dependency1__, __exports__) { "use strict"; var noop = __dependency1__.noop; var _reject = __dependency1__.reject; /** `RSVP.Promise.reject` returns a promise rejected with the passed `reason`. It is shorthand for the following: ```javascript var promise = new RSVP.Promise(function(resolve, reject){ reject(new Error('WHOOPS')); }); promise.then(function(value){ // Code here doesn't run because the promise is rejected! }, function(reason){ // reason.message === 'WHOOPS' }); ``` Instead of writing the above, your code now simply becomes the following: ```javascript var promise = RSVP.Promise.reject(new Error('WHOOPS')); promise.then(function(value){ // Code here doesn't run because the promise is rejected! }, function(reason){ // reason.message === 'WHOOPS' }); ``` @method reject @static @param {Any} reason value that the returned promise will be rejected with. @param {String} label optional string for identifying the returned promise. Useful for tooling. @return {Promise} a promise rejected with the given `reason`. */ __exports__["default"] = function reject(reason, label) { /*jshint validthis:true */ var Constructor = this; var promise = new Constructor(noop, label); _reject(promise, reason); return promise; } }); define("rsvp/promise/resolve", ["../-internal","exports"], function(__dependency1__, __exports__) { "use strict"; var noop = __dependency1__.noop; var _resolve = __dependency1__.resolve; /** `RSVP.Promise.resolve` returns a promise that will become resolved with the passed `value`. It is shorthand for the following: ```javascript var promise = new RSVP.Promise(function(resolve, reject){ resolve(1); }); promise.then(function(value){ // value === 1 }); ``` Instead of writing the above, your code now simply becomes the following: ```javascript var promise = RSVP.Promise.resolve(1); promise.then(function(value){ // value === 1 }); ``` @method resolve @static @param {Any} value value that the returned promise will be resolved with @param {String} label optional string for identifying the returned promise. Useful for tooling. @return {Promise} a promise that will become fulfilled with the given `value` */ __exports__["default"] = function resolve(object, label) { /*jshint validthis:true */ var Constructor = this; if (object && typeof object === 'object' && object.constructor === Constructor) { return object; } var promise = new Constructor(noop, label); _resolve(promise, object); return promise; } }); define("rsvp/race", ["./promise","exports"], function(__dependency1__, __exports__) { "use strict"; var Promise = __dependency1__["default"]; /** This is a convenient alias for `RSVP.Promise.race`. @method race @static @for RSVP @param {Array} array Array of promises. @param {String} label An optional label. This is useful for tooling. */ __exports__["default"] = function race(array, label) { return Promise.race(array, label); } }); define("rsvp/reject", ["./promise","exports"], function(__dependency1__, __exports__) { "use strict"; var Promise = __dependency1__["default"]; /** This is a convenient alias for `RSVP.Promise.reject`. @method reject @static @for RSVP @param {Any} reason value that the returned promise will be rejected with. @param {String} label optional string for identifying the returned promise. Useful for tooling. @return {Promise} a promise rejected with the given `reason`. */ __exports__["default"] = function reject(reason, label) { return Promise.reject(reason, label); } }); define("rsvp/resolve", ["./promise","exports"], function(__dependency1__, __exports__) { "use strict"; var Promise = __dependency1__["default"]; /** This is a convenient alias for `RSVP.Promise.resolve`. @method resolve @static @for RSVP @param {Any} value value that the returned promise will be resolved with @param {String} label optional string for identifying the returned promise. Useful for tooling. @return {Promise} a promise that will become fulfilled with the given `value` */ __exports__["default"] = function resolve(value, label) { return Promise.resolve(value, label); } }); define("rsvp/rethrow", ["exports"], function(__exports__) { "use strict"; /** `RSVP.rethrow` will rethrow an error on the next turn of the JavaScript event loop in order to aid debugging. Promises A+ specifies that any exceptions that occur with a promise must be caught by the promises implementation and bubbled to the last handler. For this reason, it is recommended that you always specify a second rejection handler function to `then`. However, `RSVP.rethrow` will throw the exception outside of the promise, so it bubbles up to your console if in the browser, or domain/cause uncaught exception in Node. `rethrow` will also throw the error again so the error can be handled by the promise per the spec. ```javascript function throws(){ throw new Error('Whoops!'); } var promise = new RSVP.Promise(function(resolve, reject){ throws(); }); promise.catch(RSVP.rethrow).then(function(){ // Code here doesn't run because the promise became rejected due to an // error! }, function (err){ // handle the error here }); ``` The 'Whoops' error will be thrown on the next turn of the event loop and you can watch for it in your console. You can also handle it using a rejection handler given to `.then` or `.catch` on the returned promise. @method rethrow @static @for RSVP @param {Error} reason reason the promise became rejected. @throws Error @static */ __exports__["default"] = function rethrow(reason) { setTimeout(function() { throw reason; }); throw reason; } }); define("rsvp/utils", ["exports"], function(__exports__) { "use strict"; function objectOrFunction(x) { return typeof x === 'function' || (typeof x === 'object' && x !== null); } __exports__.objectOrFunction = objectOrFunction;function isFunction(x) { return typeof x === 'function'; } __exports__.isFunction = isFunction;function isMaybeThenable(x) { return typeof x === 'object' && x !== null; } __exports__.isMaybeThenable = isMaybeThenable;var _isArray; if (!Array.isArray) { _isArray = function (x) { return Object.prototype.toString.call(x) === '[object Array]'; }; } else { _isArray = Array.isArray; } var isArray = _isArray; __exports__.isArray = isArray; // Date.now is not available in browsers < IE9 // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/now#Compatibility var now = Date.now || function() { return new Date().getTime(); }; __exports__.now = now; function F() { } var o_create = (Object.create || function (o) { if (arguments.length > 1) { throw new Error('Second argument not supported'); } if (typeof o !== 'object') { throw new TypeError('Argument must be an object'); } F.prototype = o; return new F(); }); __exports__.o_create = o_create; }); requireModule("ember"); })();