changes in the docs: rename modules to components, change idiomatic controller and view usage

This commit is contained in:
Leo Horie 2015-04-06 22:41:38 -04:00
parent 0addce57ba
commit d5619d412e
19 changed files with 395 additions and 692 deletions

View file

@ -14,7 +14,7 @@ app.view = function(ctrl) {
return m("input", {value: item.name})
});
}
m.module(document.getElementById("container"), app);
m.mount(document.getElementById("container"), app);
</script>
</body>
</html>

View file

@ -13,7 +13,7 @@ app.view = function(ctrl) {
return m("input", {value: item.name})
});
}
m.module(document.getElementById("container"), app);
m.mount(document.getElementById("container"), app);
</script>
</body>
</html>

View file

@ -84,31 +84,32 @@ var Page = {
}
};
//controller
var Demo = {};
Demo.controller = function() {
var pages = Page.list();
return {
pages: pages,
rotate: function() {
pages().push(pages().shift());
var Demo = m.component({
//controller
controller: function() {
var pages = Page.list();
return {
pages: pages,
rotate: function() {
pages().push(pages().shift());
}
}
}
};
},
//view
view: function(ctrl) {
return m("div", [
ctrl.pages().map(function(page) {
return m("a", {href: page.url}, page.title);
}),
m("button", {onclick: ctrl.rotate}, "Rotate links")
]);
};
});
//view
Demo.view = function(ctrl) {
return [
ctrl.pages().map(function(page) {
return m("a", {href: page.url}, page.title);
}),
m("button", {onclick: ctrl.rotate}, "Rotate links")
];
};
//initialize
m.module(document.getElementById("example"), Demo);</code></pre>
m.mount(document.getElementById("example"), Demo);</code></pre>
</div>
<div class="col(4,4,12)">
@ -123,31 +124,32 @@ var Page = {
}
};
//controller
var Demo = {};
Demo.controller = function() {
var pages = Page.list();
return {
pages: pages,
rotate: function() {
pages().push(pages().shift());
var Demo = m.component({
//controller
controller: function() {
var pages = Page.list();
return {
pages: pages,
rotate: function() {
pages().push(pages().shift());
}
}
}
};
},
//view
view: function(ctrl) {
return m("div", [
ctrl.pages().map(function(page) {
return m("a", {href: page.url}, page.title);
}),
m("button", {onclick: ctrl.rotate}, "Rotate links")
]);
};
});
//view
Demo.view = function(ctrl) {
return [
ctrl.pages().map(function(page) {
return m("a", {href: page.url}, page.title);
}),
m("button", {onclick: ctrl.rotate}, "Rotate links")
];
};
//initialize
m.module(document.getElementById("example"), Demo);
m.mount(document.getElementById("example"), Demo);
</script>
</div>
</div>

View file

@ -5,5 +5,5 @@
<script src="../mithril.min.js"></script>
<script src="template-converter.js"></script>
<script>
m.module(document.getElementById("converter"), templateConverter);
m.mount(document.getElementById("converter"), templateConverter);
</script>

View file

@ -82,9 +82,9 @@ templateConverter.controller = function() {
};
templateConverter.view = function(ctrl) {
return [
return m("div", [
m("textarea", {autofocus: true, style: {width:"100%", height: "40%"}, onchange: m.withAttr("value", ctrl.source)}, ctrl.source()),
m("button", {onclick: ctrl.convert.bind(ctrl)}, "Convert"),
m("textarea", {style: {width:"100%", height: "40%"}}, ctrl.output())
];
]);
};