diff --git a/examples/unfinished/shark/.meteor/packages b/examples/unfinished/shark/.meteor/packages
index 6fb55a3d6d..50f082c829 100644
--- a/examples/unfinished/shark/.meteor/packages
+++ b/examples/unfinished/shark/.meteor/packages
@@ -7,3 +7,5 @@ autopublish
insecure
preserve-inputs
ui
+html5-tokenizer
+spacebars
diff --git a/examples/unfinished/shark/client/shark.js b/examples/unfinished/shark/client/shark.js
index ec2b9e9d21..3416e873b1 100644
--- a/examples/unfinished/shark/client/shark.js
+++ b/examples/unfinished/shark/client/shark.js
@@ -34,7 +34,7 @@ DebugComponent = Component.extend({
LI = DebugComponent.extend({
build: function (frag) {
var li = document.createElement('LI');
- li.appendChild(document.createTextNode(this.args.text));
+ li.appendChild(document.createTextNode(this.getArg('text')));
frag.appendChild(li);
this.setBounds(li);
this.textNode = li.firstChild;
@@ -44,7 +44,7 @@ LI = DebugComponent.extend({
this.textNode.nodeValue = args.text;
},
toHtml: function () {
- return "
" + escapeForHtml(this.args.text) + "";
+ return "" + escapeForHtml(this.getArg('text')) + "";
}
});
@@ -132,7 +132,7 @@ Each = DebugComponent.extend({
items: new OrderedDict(idStringify),
init: function () {
var self = this;
- var cursor = self.args.list; // XXX support arrays too
+ var cursor = self.getArg('list'); // XXX support arrays too
var items = self.items;
// Templates should have access to data and methods added by the
@@ -230,7 +230,7 @@ Each = DebugComponent.extend({
},
itemAddedBefore: function (id, doc, beforeId) {
- var bodyClass = this.args.bodyClass;
+ var bodyClass = this.getArg('bodyClass');
var comp = new bodyClass({data: doc});
this.addItemChild(id, comp);
@@ -245,8 +245,8 @@ Each = DebugComponent.extend({
itemRemoved: function (id) {
if (this.items.size() === 1) {
// making empty
- var elseClass = this.args.elseClass || EmptyComponent;
- var comp = new elseClass({data: this.args.data});
+ var elseClass = this.getArg('elseClass') || EmptyComponent;
+ var comp = new elseClass({data: this.getArg('data')});
this.addChild('else', comp);
if (this.isBuilt) {
@@ -270,8 +270,8 @@ Each = DebugComponent.extend({
this.getItemChild(id).update({data: doc});
},
initiallyEmpty: function () {
- var elseClass = this.args.elseClass || EmptyComponent;
- this.addChild('else', new elseClass({data: this.args.data}));
+ var elseClass = this.getArg('elseClass') || EmptyComponent;
+ this.addChild('else', new elseClass({data: this.getArg('data')}));
},
build: function (frag) {
@@ -294,7 +294,7 @@ Each = DebugComponent.extend({
MyLI = DebugComponent.extend({
init: function () {
- this.setChild('1', LI, {text: this.args.data.text || ''});
+ this.setChild('1', LI, {text: this.getArg('data').text || ''});
},
build: function (frag) {
var c = this.children['1'];
diff --git a/packages/ui/component.js b/packages/ui/component.js
index 0b9501914e..162d65ddbb 100644
--- a/packages/ui/component.js
+++ b/packages/ui/component.js
@@ -12,7 +12,8 @@ Component = function (args) {
this._fragment = null; // DocumentFragment, if built; empty when attached
this._uniqueIdCounter = 1;
- this.args = args;
+ this._args = args;
+ this._argDeps = {};
};
_.extend(Component.prototype, {
@@ -221,9 +222,34 @@ _.extend(Component.prototype, {
this.dom.end = end;
},
+ getArg: function (argName) {
+ var dep = (this._argDeps.hasOwnProperty(argName) ?
+ this._argDeps[argName] :
+ (this._argDeps[argName] = new Deps.Dependency));
+ dep.depend();
+ return this._args[argName];
+ },
update: function (args) {
- var oldArgs = this.args;
- this.args = args;
+ var oldArgs = this._args;
+ this._args = args;
+
+ var argDeps = this._argDeps;
+
+ for (var k in args) {
+ if (args.hasOwnProperty(k) &&
+ argDeps.hasOwnProperty(k) &&
+ ! EJSON.equal(args[k], oldArgs[k])) {
+ argDeps[k].invalidate();
+ delete oldArgs[k];
+ }
+ }
+ for (var k in oldArgs) {
+ if (oldArgs.hasOwnProperty(k) &&
+ argDeps.hasOwnProperty(k)) {
+ argDeps[k].invalidate();
+ }
+ }
+
this.updated(args, oldArgs);
},
findOne: function (selector) { return this.dom.findOne(selector); },
diff --git a/packages/ui/package.js b/packages/ui/package.js
index cb2fa5761c..1a380e6bf4 100644
--- a/packages/ui/package.js
+++ b/packages/ui/package.js
@@ -3,6 +3,8 @@ Package.describe({
});
Package.on_use(function (api) {
+ api.use('underscore', 'client');
+
api.add_files(['chunk.js', 'component.js'], 'client');
});