From c1573dbf2c0e29089b97572a8b339d8d9055010e Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Sun, 15 Apr 2018 13:09:59 -0400 Subject: [PATCH] implement onstate and onupdate --- src/generators/Generator.ts | 8 +++ src/generators/dom/index.ts | 24 ++++++-- src/shared/index.js | 32 +++++----- src/validate/js/propValidators/index.ts | 4 ++ src/validate/js/propValidators/onstate.ts | 14 +++++ src/validate/js/propValidators/onupdate.ts | 14 +++++ store.js | 41 +++++++------ test/js/samples/action/expected-bundle.js | 53 +++++----------- .../_actual-bundle-v2.js | 53 +++++----------- .../expected-bundle-v2.js | 53 +++++----------- .../expected-bundle.js | 53 +++++----------- .../expected-bundle.js | 53 +++++----------- .../expected-bundle.js | 53 +++++----------- .../component-static/expected-bundle.js | 53 +++++----------- .../computed-collapsed-if/expected-bundle.js | 53 +++++----------- .../css-media-query/expected-bundle.js | 53 +++++----------- .../expected-bundle.js | 53 +++++----------- .../deconflict-builtins/_actual-bundle-v2.js | 53 +++++----------- .../deconflict-builtins/expected-bundle-v2.js | 53 +++++----------- .../deconflict-builtins/expected-bundle.js | 53 +++++----------- .../deconflict-globals/expected-bundle.js | 60 +++++++------------ .../js/samples/deconflict-globals/expected.js | 7 ++- .../_actual-bundle-v2.js | 53 +++++----------- .../expected-bundle-v2.js | 53 +++++----------- .../expected-bundle.js | 53 +++++----------- .../do-use-dataset/_actual-bundle-v2.js | 53 +++++----------- .../do-use-dataset/expected-bundle-v2.js | 53 +++++----------- .../samples/do-use-dataset/expected-bundle.js | 53 +++++----------- .../_actual-bundle-v2.js | 53 +++++----------- .../expected-bundle-v2.js | 53 +++++----------- .../expected-bundle.js | 53 +++++----------- .../_actual-bundle-v2.js | 53 +++++----------- .../expected-bundle-v2.js | 53 +++++----------- .../expected-bundle.js | 53 +++++----------- .../_actual-bundle-v2.js | 53 +++++----------- .../expected-bundle-v2.js | 53 +++++----------- .../expected-bundle.js | 53 +++++----------- .../event-handlers-custom/expected-bundle.js | 53 +++++----------- .../head-no-whitespace/_actual-bundle-v2.js | 53 +++++----------- .../head-no-whitespace/expected-bundle-v2.js | 53 +++++----------- .../head-no-whitespace/expected-bundle.js | 53 +++++----------- .../if-block-no-update/_actual-bundle-v2.js | 53 +++++----------- .../if-block-no-update/expected-bundle-v2.js | 53 +++++----------- .../if-block-no-update/expected-bundle.js | 53 +++++----------- .../if-block-simple/_actual-bundle-v2.js | 53 +++++----------- .../if-block-simple/expected-bundle-v2.js | 53 +++++----------- .../if-block-simple/expected-bundle.js | 53 +++++----------- .../_actual-bundle-v2.js | 53 +++++----------- .../expected-bundle-v2.js | 53 +++++----------- .../expected-bundle.js | 53 +++++----------- .../_actual-bundle-v2.js | 53 +++++----------- .../expected-bundle-v2.js | 53 +++++----------- .../expected-bundle.js | 53 +++++----------- .../_actual-bundle-v2.js | 53 +++++----------- .../expected-bundle-v2.js | 53 +++++----------- .../inline-style-optimized/expected-bundle.js | 53 +++++----------- .../_actual-bundle-v2.js | 53 +++++----------- .../expected-bundle-v2.js | 53 +++++----------- .../expected-bundle.js | 53 +++++----------- .../expected-bundle.js | 53 +++++----------- .../samples/legacy-default/expected-bundle.js | 53 +++++----------- .../legacy-input-type/expected-bundle.js | 53 +++++----------- .../legacy-quote-class/expected-bundle.js | 53 +++++----------- .../samples/media-bindings/expected-bundle.js | 53 +++++----------- .../non-imported-component/expected-bundle.js | 53 +++++----------- .../expected-bundle.js | 60 +++++++------------ .../onrender-onteardown-rewritten/expected.js | 7 ++- .../samples/setup-method/expected-bundle.js | 53 +++++----------- test/js/samples/svg-title/expected-bundle.js | 53 +++++----------- test/js/samples/title/_actual-bundle-v2.js | 53 +++++----------- test/js/samples/title/expected-bundle-v2.js | 53 +++++----------- test/js/samples/title/expected-bundle.js | 53 +++++----------- .../_actual-bundle-v2.js | 53 +++++----------- .../expected-bundle-v2.js | 53 +++++----------- .../expected-bundle.js | 53 +++++----------- .../_actual-bundle-v2.js | 53 +++++----------- .../expected-bundle-v2.js | 53 +++++----------- .../window-binding-scroll/expected-bundle.js | 53 +++++----------- .../onstate-before-oncreate/_config.js | 8 +++ .../samples/onstate-before-oncreate/main.html | 16 +++++ test/runtime/samples/onstate-event/_config.js | 49 +++++++++++++++ test/runtime/samples/onstate-event/main.html | 2 + test/runtime/samples/onstate/_config.js | 20 +++++++ test/runtime/samples/onstate/main.html | 10 ++++ test/runtime/samples/onupdate/_config.js | 1 - .../samples/onstate-arrow-this/errors.json | 1 + .../samples/onupdate-arrow-this/errors.json | 1 + 87 files changed, 1193 insertions(+), 2737 deletions(-) create mode 100644 src/validate/js/propValidators/onstate.ts create mode 100644 src/validate/js/propValidators/onupdate.ts create mode 100644 test/runtime/samples/onstate-before-oncreate/_config.js create mode 100644 test/runtime/samples/onstate-before-oncreate/main.html create mode 100644 test/runtime/samples/onstate-event/_config.js create mode 100644 test/runtime/samples/onstate-event/main.html create mode 100644 test/runtime/samples/onstate/_config.js create mode 100644 test/runtime/samples/onstate/main.html diff --git a/src/generators/Generator.ts b/src/generators/Generator.ts index 6d49faf906..5dbb202259 100644 --- a/src/generators/Generator.ts +++ b/src/generators/Generator.ts @@ -646,6 +646,14 @@ export default class Generator { addDeclaration('ondestroy', templateProperties.ondestroy.value); } + if (templateProperties.onstate && dom) { + addDeclaration('onstate', templateProperties.onstate.value); + } + + if (templateProperties.onupdate && dom) { + addDeclaration('onupdate', templateProperties.onupdate.value); + } + if (templateProperties.preload) { addDeclaration('preload', templateProperties.preload.value); } diff --git a/src/generators/dom/index.ts b/src/generators/dom/index.ts index 51f4664ae7..4de05981af 100644 --- a/src/generators/dom/index.ts +++ b/src/generators/dom/index.ts @@ -171,6 +171,8 @@ export default function dom( initialState.push(`options.data`); + const hasInitHooks = !!(templateProperties.oncreate || templateProperties.onstate || templateProperties.onupdate); + const constructorBody = deindent` ${options.dev && `this._debugName = '${debugName}';`} ${options.dev && !generator.customElement && @@ -199,6 +201,9 @@ export default function dom( ${generator.bindingGroups.length && `this._bindingGroups = [${Array(generator.bindingGroups.length).fill('[]').join(', ')}];`} + ${templateProperties.onstate && `this._handlers.state = [%onstate];`} + ${templateProperties.onupdate && `this._handlers.update = [%onupdate];`} + ${(templateProperties.ondestroy || storeProps.length) && ( `this._handlers.destroy = [${ [templateProperties.ondestroy && `%ondestroy`, storeProps.length && `@removeFromStore`].filter(Boolean).join(', ') @@ -216,9 +221,18 @@ export default function dom( `if (!document.getElementById("${generator.stylesheet.id}-style")) @add_css();`) } - ${templateProperties.oncreate && `var _oncreate = %oncreate.bind(this);`} + ${hasInitHooks && deindent` + var self = this; + var _oncreate = function() { + var initial = { changed: { ${expectedProperties.map(p => `${p}: 1`).join(', ')} }, current: self._state, previous: undefined }; + ${templateProperties.onstate && `%onstate.call(self, initial);`} + ${templateProperties.oncreate && `%oncreate.call(self);`} + ${templateProperties.onupdate && `%onupdate.call(self, initial);`} + self.fire("update", initial); + }; + `} - ${(templateProperties.oncreate || generator.hasComponents || generator.hasComplexBindings || generator.hasIntroTransitions) && deindent` + ${(hasInitHooks || generator.hasComponents || generator.hasComplexBindings || generator.hasIntroTransitions) && deindent` if (!options.root) { this._oncreate = []; ${(generator.hasComponents || generator.hasComplexBindings) && `this._beforecreate = [];`} @@ -230,7 +244,7 @@ export default function dom( this._fragment = @create_main_fragment(this, this._state); - ${(templateProperties.oncreate) && deindent` + ${hasInitHooks && deindent` this.root._oncreate.push(_oncreate); `} @@ -253,10 +267,10 @@ export default function dom( `} this._mount(options.target, options.anchor); - ${(generator.hasComponents || generator.hasComplexBindings || templateProperties.oncreate || generator.hasIntroTransitions) && deindent` + ${(generator.hasComponents || generator.hasComplexBindings || hasInitHooks || generator.hasIntroTransitions) && deindent` ${generator.hasComponents && `this._lock = true;`} ${(generator.hasComponents || generator.hasComplexBindings) && `@callAll(this._beforecreate);`} - ${(generator.hasComponents || templateProperties.oncreate) && `@callAll(this._oncreate);`} + ${(generator.hasComponents || hasInitHooks) && `@callAll(this._oncreate);`} ${(generator.hasComponents || generator.hasIntroTransitions) && `@callAll(this._aftercreate);`} ${generator.hasComponents && `this._lock = false;`} `} diff --git a/src/shared/index.js b/src/shared/index.js index 5a8c9e470b..5beb57ceca 100644 --- a/src/shared/index.js +++ b/src/shared/index.js @@ -62,7 +62,13 @@ export function fire(eventName, data) { if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -71,7 +77,6 @@ export function get(key) { } export function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -81,24 +86,15 @@ export function init(component, options) { } export function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } export function observeDev(key, callback, options) { @@ -169,9 +165,9 @@ export function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/src/validate/js/propValidators/index.ts b/src/validate/js/propValidators/index.ts index 8641ed36b9..9f14ebc354 100644 --- a/src/validate/js/propValidators/index.ts +++ b/src/validate/js/propValidators/index.ts @@ -3,6 +3,8 @@ import actions from './actions'; import computed from './computed'; import oncreate from './oncreate'; import ondestroy from './ondestroy'; +import onstate from './onstate'; +import onupdate from './onupdate'; import onrender from './onrender'; import onteardown from './onteardown'; import helpers from './helpers'; @@ -24,6 +26,8 @@ export default { computed, oncreate, ondestroy, + onstate, + onupdate, onrender, onteardown, helpers, diff --git a/src/validate/js/propValidators/onstate.ts b/src/validate/js/propValidators/onstate.ts new file mode 100644 index 0000000000..c8aa1f5127 --- /dev/null +++ b/src/validate/js/propValidators/onstate.ts @@ -0,0 +1,14 @@ +import usesThisOrArguments from '../utils/usesThisOrArguments'; +import { Validator } from '../../index'; +import { Node } from '../../../interfaces'; + +export default function onstate(validator: Validator, prop: Node) { + if (prop.value.type === 'ArrowFunctionExpression') { + if (usesThisOrArguments(prop.value.body)) { + validator.error(prop, { + code: `invalid-onstate-property`, + message: `'onstate' should be a function expression, not an arrow function expression` + }); + } + } +} diff --git a/src/validate/js/propValidators/onupdate.ts b/src/validate/js/propValidators/onupdate.ts new file mode 100644 index 0000000000..5fd649d947 --- /dev/null +++ b/src/validate/js/propValidators/onupdate.ts @@ -0,0 +1,14 @@ +import usesThisOrArguments from '../utils/usesThisOrArguments'; +import { Validator } from '../../index'; +import { Node } from '../../../interfaces'; + +export default function onupdate(validator: Validator, prop: Node) { + if (prop.value.type === 'ArrowFunctionExpression') { + if (usesThisOrArguments(prop.value.body)) { + validator.error(prop, { + code: `invalid-onupdate-property`, + message: `'onupdate' should be a function expression, not an arrow function expression` + }); + } + } +} diff --git a/store.js b/store.js index 52acd34688..1447c78eaa 100644 --- a/store.js +++ b/store.js @@ -5,12 +5,14 @@ import { _differsImmutable, dispatchObservers, get, - observe + observe, + on, + fire } from './shared.js'; function Store(state, options) { this._observers = { pre: blankObject(), post: blankObject() }; - this._changeHandlers = []; + this._handlers = {}; this._dependents = []; this._computed = blankObject(); @@ -105,21 +107,20 @@ assign(Store.prototype, { this._sortComputedProperties(); }, + fire: fire, + get: get, + // TODO remove this method observe: observe, - onchange: function(callback) { - this._changeHandlers.push(callback); - - var store = this; + on: on, - return { - cancel: function() { - var index = store._changeHandlers.indexOf(callback); - if (~index) store._changeHandlers.splice(index, 1); - } - }; + onchange: function(callback) { + // TODO remove this method + return this.on('state', function(event) { + callback(event.current, event.changed); + }); }, set: function(newState) { @@ -139,11 +140,11 @@ assign(Store.prototype, { this._sortedComputedProperties[i].update(this._state, changed); } - for (var i = 0; i < this._changeHandlers.length; i += 1) { - this._changeHandlers[i](this._state, changed); - } - - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire('state', { + changed: changed, + current: this._state, + previous: oldState + }); var dependents = this._dependents.slice(); // guard against mutations for (var i = 0; i < dependents.length; i += 1) { @@ -162,7 +163,11 @@ assign(Store.prototype, { if (dirty) dependent.component.set(componentState); } - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire('update', { + changed: changed, + current: this._state, + previous: oldState + }); } }); diff --git a/test/js/samples/action/expected-bundle.js b/test/js/samples/action/expected-bundle.js index 68fdff503d..e316279a1c 100644 --- a/test/js/samples/action/expected-bundle.js +++ b/test/js/samples/action/expected-bundle.js @@ -35,34 +35,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -71,7 +56,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -81,24 +65,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -140,9 +115,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/collapses-text-around-comments/_actual-bundle-v2.js b/test/js/samples/collapses-text-around-comments/_actual-bundle-v2.js index 83e680be30..af5c88e152 100644 --- a/test/js/samples/collapses-text-around-comments/_actual-bundle-v2.js +++ b/test/js/samples/collapses-text-around-comments/_actual-bundle-v2.js @@ -43,34 +43,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -79,7 +64,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -89,24 +73,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -148,9 +123,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/collapses-text-around-comments/expected-bundle-v2.js b/test/js/samples/collapses-text-around-comments/expected-bundle-v2.js index 83e680be30..af5c88e152 100644 --- a/test/js/samples/collapses-text-around-comments/expected-bundle-v2.js +++ b/test/js/samples/collapses-text-around-comments/expected-bundle-v2.js @@ -43,34 +43,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -79,7 +64,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -89,24 +73,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -148,9 +123,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/collapses-text-around-comments/expected-bundle.js b/test/js/samples/collapses-text-around-comments/expected-bundle.js index 83e680be30..af5c88e152 100644 --- a/test/js/samples/collapses-text-around-comments/expected-bundle.js +++ b/test/js/samples/collapses-text-around-comments/expected-bundle.js @@ -43,34 +43,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -79,7 +64,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -89,24 +73,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -148,9 +123,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/component-static-immutable/expected-bundle.js b/test/js/samples/component-static-immutable/expected-bundle.js index 572dd75439..27aa216840 100644 --- a/test/js/samples/component-static-immutable/expected-bundle.js +++ b/test/js/samples/component-static-immutable/expected-bundle.js @@ -27,34 +27,19 @@ function _differsImmutable(a, b) { return a != a ? b == b : a !== b; } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -63,7 +48,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -73,24 +57,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -132,9 +107,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/component-static-immutable2/expected-bundle.js b/test/js/samples/component-static-immutable2/expected-bundle.js index 572dd75439..27aa216840 100644 --- a/test/js/samples/component-static-immutable2/expected-bundle.js +++ b/test/js/samples/component-static-immutable2/expected-bundle.js @@ -27,34 +27,19 @@ function _differsImmutable(a, b) { return a != a ? b == b : a !== b; } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -63,7 +48,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -73,24 +57,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -132,9 +107,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/component-static/expected-bundle.js b/test/js/samples/component-static/expected-bundle.js index 9895844ac6..91fb33207b 100644 --- a/test/js/samples/component-static/expected-bundle.js +++ b/test/js/samples/component-static/expected-bundle.js @@ -23,34 +23,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -59,7 +44,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -69,24 +53,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -128,9 +103,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/computed-collapsed-if/expected-bundle.js b/test/js/samples/computed-collapsed-if/expected-bundle.js index c2d577187f..95e448f874 100644 --- a/test/js/samples/computed-collapsed-if/expected-bundle.js +++ b/test/js/samples/computed-collapsed-if/expected-bundle.js @@ -23,34 +23,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -59,7 +44,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -69,24 +53,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -128,9 +103,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/css-media-query/expected-bundle.js b/test/js/samples/css-media-query/expected-bundle.js index 65abf18b53..79e3e3e456 100644 --- a/test/js/samples/css-media-query/expected-bundle.js +++ b/test/js/samples/css-media-query/expected-bundle.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js b/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js index 66d6da680d..e320ba4218 100644 --- a/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js +++ b/test/js/samples/css-shadow-dom-keyframes/expected-bundle.js @@ -35,34 +35,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -71,7 +56,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -81,24 +65,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -140,9 +115,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/deconflict-builtins/_actual-bundle-v2.js b/test/js/samples/deconflict-builtins/_actual-bundle-v2.js index 6680adfdb4..a8dcb7e5f4 100644 --- a/test/js/samples/deconflict-builtins/_actual-bundle-v2.js +++ b/test/js/samples/deconflict-builtins/_actual-bundle-v2.js @@ -53,34 +53,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -89,7 +74,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -99,24 +83,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -158,9 +133,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/deconflict-builtins/expected-bundle-v2.js b/test/js/samples/deconflict-builtins/expected-bundle-v2.js index 6680adfdb4..a8dcb7e5f4 100644 --- a/test/js/samples/deconflict-builtins/expected-bundle-v2.js +++ b/test/js/samples/deconflict-builtins/expected-bundle-v2.js @@ -53,34 +53,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -89,7 +74,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -99,24 +83,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -158,9 +133,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/deconflict-builtins/expected-bundle.js b/test/js/samples/deconflict-builtins/expected-bundle.js index eac899bc36..ee08884e3d 100644 --- a/test/js/samples/deconflict-builtins/expected-bundle.js +++ b/test/js/samples/deconflict-builtins/expected-bundle.js @@ -53,34 +53,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -89,7 +74,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -99,24 +83,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -158,9 +133,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/deconflict-globals/expected-bundle.js b/test/js/samples/deconflict-globals/expected-bundle.js index c5967ec8b6..61cc091f93 100644 --- a/test/js/samples/deconflict-globals/expected-bundle.js +++ b/test/js/samples/deconflict-globals/expected-bundle.js @@ -23,34 +23,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -59,7 +44,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -69,24 +53,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -128,9 +103,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } @@ -191,7 +166,12 @@ function SvelteComponent(options) { init(this, options); this._state = assign(data_1(), options.data); - var _oncreate = oncreate.bind(this); + var self = this; + var _oncreate = function() { + var initial = { changed: { }, current: self._state, previous: undefined }; + oncreate.call(self); + self.fire("update", initial); + }; if (!options.root) { this._oncreate = []; diff --git a/test/js/samples/deconflict-globals/expected.js b/test/js/samples/deconflict-globals/expected.js index 8e00df8d4a..99ef4f5659 100644 --- a/test/js/samples/deconflict-globals/expected.js +++ b/test/js/samples/deconflict-globals/expected.js @@ -30,7 +30,12 @@ function SvelteComponent(options) { init(this, options); this._state = assign(data_1(), options.data); - var _oncreate = oncreate.bind(this); + var self = this; + var _oncreate = function() { + var initial = { changed: { }, current: self._state, previous: undefined }; + oncreate.call(self); + self.fire("update", initial); + }; if (!options.root) { this._oncreate = []; diff --git a/test/js/samples/dev-warning-missing-data-computed/_actual-bundle-v2.js b/test/js/samples/dev-warning-missing-data-computed/_actual-bundle-v2.js index 84a148c901..5ba9581cf5 100644 --- a/test/js/samples/dev-warning-missing-data-computed/_actual-bundle-v2.js +++ b/test/js/samples/dev-warning-missing-data-computed/_actual-bundle-v2.js @@ -50,34 +50,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -86,7 +71,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -96,24 +80,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function observeDev(key, callback, options) { @@ -180,9 +155,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/dev-warning-missing-data-computed/expected-bundle-v2.js b/test/js/samples/dev-warning-missing-data-computed/expected-bundle-v2.js index 84a148c901..5ba9581cf5 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected-bundle-v2.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected-bundle-v2.js @@ -50,34 +50,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -86,7 +71,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -96,24 +80,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function observeDev(key, callback, options) { @@ -180,9 +155,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js index 84a148c901..5ba9581cf5 100644 --- a/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js +++ b/test/js/samples/dev-warning-missing-data-computed/expected-bundle.js @@ -50,34 +50,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -86,7 +71,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -96,24 +80,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function observeDev(key, callback, options) { @@ -180,9 +155,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/do-use-dataset/_actual-bundle-v2.js b/test/js/samples/do-use-dataset/_actual-bundle-v2.js index 883194110d..37bc15d302 100644 --- a/test/js/samples/do-use-dataset/_actual-bundle-v2.js +++ b/test/js/samples/do-use-dataset/_actual-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/do-use-dataset/expected-bundle-v2.js b/test/js/samples/do-use-dataset/expected-bundle-v2.js index 883194110d..37bc15d302 100644 --- a/test/js/samples/do-use-dataset/expected-bundle-v2.js +++ b/test/js/samples/do-use-dataset/expected-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/do-use-dataset/expected-bundle.js b/test/js/samples/do-use-dataset/expected-bundle.js index 883194110d..37bc15d302 100644 --- a/test/js/samples/do-use-dataset/expected-bundle.js +++ b/test/js/samples/do-use-dataset/expected-bundle.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/dont-use-dataset-in-legacy/_actual-bundle-v2.js b/test/js/samples/dont-use-dataset-in-legacy/_actual-bundle-v2.js index 1e231ec056..be43fd0e9b 100644 --- a/test/js/samples/dont-use-dataset-in-legacy/_actual-bundle-v2.js +++ b/test/js/samples/dont-use-dataset-in-legacy/_actual-bundle-v2.js @@ -43,34 +43,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -79,7 +64,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -89,24 +73,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -148,9 +123,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/dont-use-dataset-in-legacy/expected-bundle-v2.js b/test/js/samples/dont-use-dataset-in-legacy/expected-bundle-v2.js index 1e231ec056..be43fd0e9b 100644 --- a/test/js/samples/dont-use-dataset-in-legacy/expected-bundle-v2.js +++ b/test/js/samples/dont-use-dataset-in-legacy/expected-bundle-v2.js @@ -43,34 +43,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -79,7 +64,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -89,24 +73,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -148,9 +123,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/dont-use-dataset-in-legacy/expected-bundle.js b/test/js/samples/dont-use-dataset-in-legacy/expected-bundle.js index 1e231ec056..be43fd0e9b 100644 --- a/test/js/samples/dont-use-dataset-in-legacy/expected-bundle.js +++ b/test/js/samples/dont-use-dataset-in-legacy/expected-bundle.js @@ -43,34 +43,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -79,7 +64,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -89,24 +73,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -148,9 +123,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/dont-use-dataset-in-svg/_actual-bundle-v2.js b/test/js/samples/dont-use-dataset-in-svg/_actual-bundle-v2.js index 0b60ba22e2..1092b9ab86 100644 --- a/test/js/samples/dont-use-dataset-in-svg/_actual-bundle-v2.js +++ b/test/js/samples/dont-use-dataset-in-svg/_actual-bundle-v2.js @@ -43,34 +43,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -79,7 +64,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -89,24 +73,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -148,9 +123,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/dont-use-dataset-in-svg/expected-bundle-v2.js b/test/js/samples/dont-use-dataset-in-svg/expected-bundle-v2.js index 0b60ba22e2..1092b9ab86 100644 --- a/test/js/samples/dont-use-dataset-in-svg/expected-bundle-v2.js +++ b/test/js/samples/dont-use-dataset-in-svg/expected-bundle-v2.js @@ -43,34 +43,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -79,7 +64,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -89,24 +73,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -148,9 +123,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/dont-use-dataset-in-svg/expected-bundle.js b/test/js/samples/dont-use-dataset-in-svg/expected-bundle.js index 0b60ba22e2..1092b9ab86 100644 --- a/test/js/samples/dont-use-dataset-in-svg/expected-bundle.js +++ b/test/js/samples/dont-use-dataset-in-svg/expected-bundle.js @@ -43,34 +43,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -79,7 +64,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -89,24 +73,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -148,9 +123,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/each-block-changed-check/_actual-bundle-v2.js b/test/js/samples/each-block-changed-check/_actual-bundle-v2.js index 1ce468ca12..f7d0080cbd 100644 --- a/test/js/samples/each-block-changed-check/_actual-bundle-v2.js +++ b/test/js/samples/each-block-changed-check/_actual-bundle-v2.js @@ -55,34 +55,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -91,7 +76,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -101,24 +85,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -160,9 +135,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/each-block-changed-check/expected-bundle-v2.js b/test/js/samples/each-block-changed-check/expected-bundle-v2.js index 1ce468ca12..f7d0080cbd 100644 --- a/test/js/samples/each-block-changed-check/expected-bundle-v2.js +++ b/test/js/samples/each-block-changed-check/expected-bundle-v2.js @@ -55,34 +55,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -91,7 +76,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -101,24 +85,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -160,9 +135,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/each-block-changed-check/expected-bundle.js b/test/js/samples/each-block-changed-check/expected-bundle.js index 7581483383..a3023dc6b1 100644 --- a/test/js/samples/each-block-changed-check/expected-bundle.js +++ b/test/js/samples/each-block-changed-check/expected-bundle.js @@ -55,34 +55,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -91,7 +76,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -101,24 +85,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -160,9 +135,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/event-handlers-custom/expected-bundle.js b/test/js/samples/event-handlers-custom/expected-bundle.js index 7c17164c74..196f0e1c94 100644 --- a/test/js/samples/event-handlers-custom/expected-bundle.js +++ b/test/js/samples/event-handlers-custom/expected-bundle.js @@ -35,34 +35,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -71,7 +56,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -81,24 +65,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -140,9 +115,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/head-no-whitespace/_actual-bundle-v2.js b/test/js/samples/head-no-whitespace/_actual-bundle-v2.js index 396cf8fb8c..e17d8ede61 100644 --- a/test/js/samples/head-no-whitespace/_actual-bundle-v2.js +++ b/test/js/samples/head-no-whitespace/_actual-bundle-v2.js @@ -35,34 +35,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -71,7 +56,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -81,24 +65,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -140,9 +115,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/head-no-whitespace/expected-bundle-v2.js b/test/js/samples/head-no-whitespace/expected-bundle-v2.js index 396cf8fb8c..e17d8ede61 100644 --- a/test/js/samples/head-no-whitespace/expected-bundle-v2.js +++ b/test/js/samples/head-no-whitespace/expected-bundle-v2.js @@ -35,34 +35,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -71,7 +56,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -81,24 +65,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -140,9 +115,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/head-no-whitespace/expected-bundle.js b/test/js/samples/head-no-whitespace/expected-bundle.js index 396cf8fb8c..e17d8ede61 100644 --- a/test/js/samples/head-no-whitespace/expected-bundle.js +++ b/test/js/samples/head-no-whitespace/expected-bundle.js @@ -35,34 +35,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -71,7 +56,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -81,24 +65,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -140,9 +115,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/if-block-no-update/_actual-bundle-v2.js b/test/js/samples/if-block-no-update/_actual-bundle-v2.js index 29d151e15d..5569d332f8 100644 --- a/test/js/samples/if-block-no-update/_actual-bundle-v2.js +++ b/test/js/samples/if-block-no-update/_actual-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/if-block-no-update/expected-bundle-v2.js b/test/js/samples/if-block-no-update/expected-bundle-v2.js index 29d151e15d..5569d332f8 100644 --- a/test/js/samples/if-block-no-update/expected-bundle-v2.js +++ b/test/js/samples/if-block-no-update/expected-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/if-block-no-update/expected-bundle.js b/test/js/samples/if-block-no-update/expected-bundle.js index 59d3e9656b..c48994fc3b 100644 --- a/test/js/samples/if-block-no-update/expected-bundle.js +++ b/test/js/samples/if-block-no-update/expected-bundle.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/if-block-simple/_actual-bundle-v2.js b/test/js/samples/if-block-simple/_actual-bundle-v2.js index 72dbdec889..336cd0bc5d 100644 --- a/test/js/samples/if-block-simple/_actual-bundle-v2.js +++ b/test/js/samples/if-block-simple/_actual-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/if-block-simple/expected-bundle-v2.js b/test/js/samples/if-block-simple/expected-bundle-v2.js index 72dbdec889..336cd0bc5d 100644 --- a/test/js/samples/if-block-simple/expected-bundle-v2.js +++ b/test/js/samples/if-block-simple/expected-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/if-block-simple/expected-bundle.js b/test/js/samples/if-block-simple/expected-bundle.js index 1c0f7f3fae..47065fea58 100644 --- a/test/js/samples/if-block-simple/expected-bundle.js +++ b/test/js/samples/if-block-simple/expected-bundle.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/inline-style-optimized-multiple/_actual-bundle-v2.js b/test/js/samples/inline-style-optimized-multiple/_actual-bundle-v2.js index eb528e4ebf..035b3d9414 100644 --- a/test/js/samples/inline-style-optimized-multiple/_actual-bundle-v2.js +++ b/test/js/samples/inline-style-optimized-multiple/_actual-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/inline-style-optimized-multiple/expected-bundle-v2.js b/test/js/samples/inline-style-optimized-multiple/expected-bundle-v2.js index eb528e4ebf..035b3d9414 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected-bundle-v2.js +++ b/test/js/samples/inline-style-optimized-multiple/expected-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/inline-style-optimized-multiple/expected-bundle.js b/test/js/samples/inline-style-optimized-multiple/expected-bundle.js index eb528e4ebf..035b3d9414 100644 --- a/test/js/samples/inline-style-optimized-multiple/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-multiple/expected-bundle.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/inline-style-optimized-url/_actual-bundle-v2.js b/test/js/samples/inline-style-optimized-url/_actual-bundle-v2.js index a4d2dda669..b08091489f 100644 --- a/test/js/samples/inline-style-optimized-url/_actual-bundle-v2.js +++ b/test/js/samples/inline-style-optimized-url/_actual-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/inline-style-optimized-url/expected-bundle-v2.js b/test/js/samples/inline-style-optimized-url/expected-bundle-v2.js index a4d2dda669..b08091489f 100644 --- a/test/js/samples/inline-style-optimized-url/expected-bundle-v2.js +++ b/test/js/samples/inline-style-optimized-url/expected-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/inline-style-optimized-url/expected-bundle.js b/test/js/samples/inline-style-optimized-url/expected-bundle.js index a4d2dda669..b08091489f 100644 --- a/test/js/samples/inline-style-optimized-url/expected-bundle.js +++ b/test/js/samples/inline-style-optimized-url/expected-bundle.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/inline-style-optimized/_actual-bundle-v2.js b/test/js/samples/inline-style-optimized/_actual-bundle-v2.js index 2b78d3932a..fcd458c356 100644 --- a/test/js/samples/inline-style-optimized/_actual-bundle-v2.js +++ b/test/js/samples/inline-style-optimized/_actual-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/inline-style-optimized/expected-bundle-v2.js b/test/js/samples/inline-style-optimized/expected-bundle-v2.js index 2b78d3932a..fcd458c356 100644 --- a/test/js/samples/inline-style-optimized/expected-bundle-v2.js +++ b/test/js/samples/inline-style-optimized/expected-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/inline-style-optimized/expected-bundle.js b/test/js/samples/inline-style-optimized/expected-bundle.js index 2b78d3932a..fcd458c356 100644 --- a/test/js/samples/inline-style-optimized/expected-bundle.js +++ b/test/js/samples/inline-style-optimized/expected-bundle.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/inline-style-unoptimized/_actual-bundle-v2.js b/test/js/samples/inline-style-unoptimized/_actual-bundle-v2.js index 670a2c02f6..f7034d9007 100644 --- a/test/js/samples/inline-style-unoptimized/_actual-bundle-v2.js +++ b/test/js/samples/inline-style-unoptimized/_actual-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/inline-style-unoptimized/expected-bundle-v2.js b/test/js/samples/inline-style-unoptimized/expected-bundle-v2.js index 670a2c02f6..f7034d9007 100644 --- a/test/js/samples/inline-style-unoptimized/expected-bundle-v2.js +++ b/test/js/samples/inline-style-unoptimized/expected-bundle-v2.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/inline-style-unoptimized/expected-bundle.js b/test/js/samples/inline-style-unoptimized/expected-bundle.js index 670a2c02f6..f7034d9007 100644 --- a/test/js/samples/inline-style-unoptimized/expected-bundle.js +++ b/test/js/samples/inline-style-unoptimized/expected-bundle.js @@ -39,34 +39,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -75,7 +60,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -85,24 +69,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -144,9 +119,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/input-without-blowback-guard/expected-bundle.js b/test/js/samples/input-without-blowback-guard/expected-bundle.js index 3a0d2ab0e5..4b8909150b 100644 --- a/test/js/samples/input-without-blowback-guard/expected-bundle.js +++ b/test/js/samples/input-without-blowback-guard/expected-bundle.js @@ -47,34 +47,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -83,7 +68,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -93,24 +77,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -152,9 +127,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/legacy-default/expected-bundle.js b/test/js/samples/legacy-default/expected-bundle.js index 38455aa8bc..b400d303d7 100644 --- a/test/js/samples/legacy-default/expected-bundle.js +++ b/test/js/samples/legacy-default/expected-bundle.js @@ -57,34 +57,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -93,7 +78,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -103,24 +87,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -162,9 +137,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/legacy-input-type/expected-bundle.js b/test/js/samples/legacy-input-type/expected-bundle.js index 9c478dd3d9..ff4b0b5e2b 100644 --- a/test/js/samples/legacy-input-type/expected-bundle.js +++ b/test/js/samples/legacy-input-type/expected-bundle.js @@ -41,34 +41,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -77,7 +62,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -87,24 +71,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -146,9 +121,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/legacy-quote-class/expected-bundle.js b/test/js/samples/legacy-quote-class/expected-bundle.js index 84afafca02..fc088bf34a 100644 --- a/test/js/samples/legacy-quote-class/expected-bundle.js +++ b/test/js/samples/legacy-quote-class/expected-bundle.js @@ -58,34 +58,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -94,7 +79,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -104,24 +88,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -163,9 +138,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/media-bindings/expected-bundle.js b/test/js/samples/media-bindings/expected-bundle.js index b4479b8ff1..7d8c7624ea 100644 --- a/test/js/samples/media-bindings/expected-bundle.js +++ b/test/js/samples/media-bindings/expected-bundle.js @@ -51,34 +51,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -87,7 +72,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -97,24 +81,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -156,9 +131,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/non-imported-component/expected-bundle.js b/test/js/samples/non-imported-component/expected-bundle.js index 47366ed109..06d1b0d4ea 100644 --- a/test/js/samples/non-imported-component/expected-bundle.js +++ b/test/js/samples/non-imported-component/expected-bundle.js @@ -37,34 +37,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -73,7 +58,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -83,24 +67,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -142,9 +117,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/onrender-onteardown-rewritten/expected-bundle.js b/test/js/samples/onrender-onteardown-rewritten/expected-bundle.js index 87e038ea8d..28b9ab51ef 100644 --- a/test/js/samples/onrender-onteardown-rewritten/expected-bundle.js +++ b/test/js/samples/onrender-onteardown-rewritten/expected-bundle.js @@ -23,34 +23,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -59,7 +44,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -69,24 +53,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -128,9 +103,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } @@ -186,7 +161,12 @@ function SvelteComponent(options) { this._handlers.destroy = [ondestroy]; - var _oncreate = oncreate.bind(this); + var self = this; + var _oncreate = function() { + var initial = { changed: { }, current: self._state, previous: undefined }; + oncreate.call(self); + self.fire("update", initial); + }; if (!options.root) { this._oncreate = []; diff --git a/test/js/samples/onrender-onteardown-rewritten/expected.js b/test/js/samples/onrender-onteardown-rewritten/expected.js index 1d91737faa..0de4ce702f 100644 --- a/test/js/samples/onrender-onteardown-rewritten/expected.js +++ b/test/js/samples/onrender-onteardown-rewritten/expected.js @@ -26,7 +26,12 @@ function SvelteComponent(options) { this._handlers.destroy = [ondestroy]; - var _oncreate = oncreate.bind(this); + var self = this; + var _oncreate = function() { + var initial = { changed: { }, current: self._state, previous: undefined }; + oncreate.call(self); + self.fire("update", initial); + }; if (!options.root) { this._oncreate = []; diff --git a/test/js/samples/setup-method/expected-bundle.js b/test/js/samples/setup-method/expected-bundle.js index 3a002059aa..8e8036f6e7 100644 --- a/test/js/samples/setup-method/expected-bundle.js +++ b/test/js/samples/setup-method/expected-bundle.js @@ -23,34 +23,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -59,7 +44,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -69,24 +53,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -128,9 +103,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/svg-title/expected-bundle.js b/test/js/samples/svg-title/expected-bundle.js index 837d81e0e2..804ce01d7c 100644 --- a/test/js/samples/svg-title/expected-bundle.js +++ b/test/js/samples/svg-title/expected-bundle.js @@ -43,34 +43,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -79,7 +64,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -89,24 +73,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -148,9 +123,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/title/_actual-bundle-v2.js b/test/js/samples/title/_actual-bundle-v2.js index 83c8815d6f..df4a5e2125 100644 --- a/test/js/samples/title/_actual-bundle-v2.js +++ b/test/js/samples/title/_actual-bundle-v2.js @@ -23,34 +23,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -59,7 +44,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -69,24 +53,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -128,9 +103,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/title/expected-bundle-v2.js b/test/js/samples/title/expected-bundle-v2.js index 83c8815d6f..df4a5e2125 100644 --- a/test/js/samples/title/expected-bundle-v2.js +++ b/test/js/samples/title/expected-bundle-v2.js @@ -23,34 +23,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -59,7 +44,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -69,24 +53,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -128,9 +103,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/title/expected-bundle.js b/test/js/samples/title/expected-bundle.js index 83c8815d6f..df4a5e2125 100644 --- a/test/js/samples/title/expected-bundle.js +++ b/test/js/samples/title/expected-bundle.js @@ -23,34 +23,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -59,7 +44,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -69,24 +53,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -128,9 +103,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/use-elements-as-anchors/_actual-bundle-v2.js b/test/js/samples/use-elements-as-anchors/_actual-bundle-v2.js index 7aefaab6c8..5fe8f188a2 100644 --- a/test/js/samples/use-elements-as-anchors/_actual-bundle-v2.js +++ b/test/js/samples/use-elements-as-anchors/_actual-bundle-v2.js @@ -47,34 +47,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -83,7 +68,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -93,24 +77,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -152,9 +127,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/use-elements-as-anchors/expected-bundle-v2.js b/test/js/samples/use-elements-as-anchors/expected-bundle-v2.js index 7aefaab6c8..5fe8f188a2 100644 --- a/test/js/samples/use-elements-as-anchors/expected-bundle-v2.js +++ b/test/js/samples/use-elements-as-anchors/expected-bundle-v2.js @@ -47,34 +47,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -83,7 +68,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -93,24 +77,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -152,9 +127,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/use-elements-as-anchors/expected-bundle.js b/test/js/samples/use-elements-as-anchors/expected-bundle.js index 722574e063..9ac8ca4ebe 100644 --- a/test/js/samples/use-elements-as-anchors/expected-bundle.js +++ b/test/js/samples/use-elements-as-anchors/expected-bundle.js @@ -47,34 +47,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -83,7 +68,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -93,24 +77,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -152,9 +127,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/window-binding-scroll/_actual-bundle-v2.js b/test/js/samples/window-binding-scroll/_actual-bundle-v2.js index a98de2af63..a6afbf9b14 100644 --- a/test/js/samples/window-binding-scroll/_actual-bundle-v2.js +++ b/test/js/samples/window-binding-scroll/_actual-bundle-v2.js @@ -43,34 +43,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -79,7 +64,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -89,24 +73,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -148,9 +123,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/window-binding-scroll/expected-bundle-v2.js b/test/js/samples/window-binding-scroll/expected-bundle-v2.js index a98de2af63..a6afbf9b14 100644 --- a/test/js/samples/window-binding-scroll/expected-bundle-v2.js +++ b/test/js/samples/window-binding-scroll/expected-bundle-v2.js @@ -43,34 +43,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -79,7 +64,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -89,24 +73,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -148,9 +123,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/js/samples/window-binding-scroll/expected-bundle.js b/test/js/samples/window-binding-scroll/expected-bundle.js index a98de2af63..a6afbf9b14 100644 --- a/test/js/samples/window-binding-scroll/expected-bundle.js +++ b/test/js/samples/window-binding-scroll/expected-bundle.js @@ -43,34 +43,19 @@ function _differs(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } -function dispatchObservers(component, group, changed, newState, oldState) { - for (var key in group) { - if (!changed[key]) continue; - - var newValue = newState[key]; - var oldValue = oldState[key]; - - var callbacks = group[key]; - if (!callbacks) continue; - - for (var i = 0; i < callbacks.length; i += 1) { - var callback = callbacks[i]; - if (callback.__calling) continue; - - callback.__calling = true; - callback.call(component, newValue, oldValue); - callback.__calling = false; - } - } -} - function fire(eventName, data) { var handlers = eventName in this._handlers && this._handlers[eventName].slice(); if (!handlers) return; for (var i = 0; i < handlers.length; i += 1) { - handlers[i].call(this, data); + var handler = handlers[i]; + + if (!handler.__calling) { + handler.__calling = true; + handler.call(this, data); + handler.__calling = false; + } } } @@ -79,7 +64,6 @@ function get(key) { } function init(component, options) { - component._observers = { pre: blankObject(), post: blankObject() }; component._handlers = blankObject(); component._bind = options._bind; @@ -89,24 +73,15 @@ function init(component, options) { } function observe(key, callback, options) { - var group = options && options.defer - ? this._observers.post - : this._observers.pre; - - (group[key] || (group[key] = [])).push(callback); + var fn = callback.bind(this); if (!options || options.init !== false) { - callback.__calling = true; - callback.call(this, this._state[key]); - callback.__calling = false; + fn(this.get()[key], undefined); } - return { - cancel: function() { - var index = group[key].indexOf(callback); - if (~index) group[key].splice(index, 1); - } - }; + return this.on(options && options.defer ? 'update' : 'state', function(event) { + if (event.changed[key]) fn(event.current[key], event.previous && event.previous[key]); + }); } function on(eventName, handler) { @@ -148,9 +123,9 @@ function _set(newState) { if (this._bind) this._bind(changed, this._state); if (this._fragment) { - dispatchObservers(this, this._observers.pre, changed, this._state, oldState); + this.fire("state", { changed: changed, current: this._state, previous: oldState }); this._fragment.p(changed, this._state); - dispatchObservers(this, this._observers.post, changed, this._state, oldState); + this.fire("update", { changed: changed, current: this._state, previous: oldState }); } } diff --git a/test/runtime/samples/onstate-before-oncreate/_config.js b/test/runtime/samples/onstate-before-oncreate/_config.js new file mode 100644 index 0000000000..ff2b87b712 --- /dev/null +++ b/test/runtime/samples/onstate-before-oncreate/_config.js @@ -0,0 +1,8 @@ +export default { + 'skip-ssr': true, + + test(assert, component, target) { + assert.ok(component.onstateRanBeforeOncreate); + assert.ok(!component.onupdateRanBeforeOncreate); + } +}; diff --git a/test/runtime/samples/onstate-before-oncreate/main.html b/test/runtime/samples/onstate-before-oncreate/main.html new file mode 100644 index 0000000000..9d4aa980ea --- /dev/null +++ b/test/runtime/samples/onstate-before-oncreate/main.html @@ -0,0 +1,16 @@ + \ No newline at end of file diff --git a/test/runtime/samples/onstate-event/_config.js b/test/runtime/samples/onstate-event/_config.js new file mode 100644 index 0000000000..d3f24376f9 --- /dev/null +++ b/test/runtime/samples/onstate-event/_config.js @@ -0,0 +1,49 @@ +export default { + 'skip-ssr': true, + + data: { + foo: 'woo!' + }, + + html: ` +

woo!

+

undefined

+ `, + + test(assert, component, target) { + const history = []; + + component.on('state', ({ changed, current, previous }) => { + history.push({ changed, current, previous }); + component.set({ bar: current.foo.toUpperCase() }); + }); + + component.set({ foo: 'yeah!' }); + assert.htmlEqual(target.innerHTML, ` +

yeah!

+

YEAH!

+ `); + + component.set({ unused: 'x' }); + + assert.deepEqual(history, [ + { + changed: { foo: true }, + current: { foo: 'yeah!' }, + previous: { foo: 'woo!' } + }, + // this is NOT received, because Svelte will not allow + // an event handler to trigger itself recursively + // { + // changed: { bar: true }, + // current: { foo: 'yeah!', bar: 'YEAH!' }, + // previous: { foo: 'yeah!' } + // }, + { + changed: { unused: true }, + current: { foo: 'yeah!', bar: 'YEAH!', unused: 'x' }, + previous: { foo: 'yeah!', bar: 'YEAH!' } + } + ]); + } +}; diff --git a/test/runtime/samples/onstate-event/main.html b/test/runtime/samples/onstate-event/main.html new file mode 100644 index 0000000000..3699be60db --- /dev/null +++ b/test/runtime/samples/onstate-event/main.html @@ -0,0 +1,2 @@ +

{{foo}}

+

{{bar}}

\ No newline at end of file diff --git a/test/runtime/samples/onstate/_config.js b/test/runtime/samples/onstate/_config.js new file mode 100644 index 0000000000..48712bb41f --- /dev/null +++ b/test/runtime/samples/onstate/_config.js @@ -0,0 +1,20 @@ +export default { + 'skip-ssr': true, + + data: { + foo: 'woo!' + }, + + html: ` +

woo!

+

WOO!

+ `, + + test(assert, component, target) { + component.set({ foo: 'yeah!' }); + assert.htmlEqual(target.innerHTML, ` +

yeah!

+

YEAH!

+ `); + } +}; diff --git a/test/runtime/samples/onstate/main.html b/test/runtime/samples/onstate/main.html new file mode 100644 index 0000000000..5e2cbaee8c --- /dev/null +++ b/test/runtime/samples/onstate/main.html @@ -0,0 +1,10 @@ +

{{foo}}

+

{{bar}}

+ + \ No newline at end of file diff --git a/test/runtime/samples/onupdate/_config.js b/test/runtime/samples/onupdate/_config.js index 1603c5a74a..41e6041937 100644 --- a/test/runtime/samples/onupdate/_config.js +++ b/test/runtime/samples/onupdate/_config.js @@ -1,5 +1,4 @@ export default { - solo: true, 'skip-ssr': true, data: { diff --git a/test/validator/samples/onstate-arrow-this/errors.json b/test/validator/samples/onstate-arrow-this/errors.json index cfcba87f4e..c1788d56de 100644 --- a/test/validator/samples/onstate-arrow-this/errors.json +++ b/test/validator/samples/onstate-arrow-this/errors.json @@ -1,4 +1,5 @@ [{ + "code": "invalid-onstate-property", "message": "'onstate' should be a function expression, not an arrow function expression", "pos": 29, "loc": { diff --git a/test/validator/samples/onupdate-arrow-this/errors.json b/test/validator/samples/onupdate-arrow-this/errors.json index e4c1a3a441..b4b1b8231e 100644 --- a/test/validator/samples/onupdate-arrow-this/errors.json +++ b/test/validator/samples/onupdate-arrow-this/errors.json @@ -1,4 +1,5 @@ [{ + "code": "invalid-onupdate-property", "message": "'onupdate' should be a function expression, not an arrow function expression", "pos": 29, "loc": {