Commit 8990986b authored by addyosmani's avatar addyosmani

Minor fixes and updates to broken templates and app indices

parent 62fda92b
...@@ -2074,7 +2074,7 @@ fun = __require__["_21"].exports; ...@@ -2074,7 +2074,7 @@ fun = __require__["_21"].exports;
fun.hook(_XML_HOOK_34, _ROOT_HOOK_0, { tagName:"footer", attrs:[{name:"id",value: fun.expressions.Text("info")}] }) fun.hook(_XML_HOOK_34, _ROOT_HOOK_0, { tagName:"footer", attrs:[{name:"id",value: fun.expressions.Text("info")}] })
var _XML_HOOK_35 = fun.name() var _XML_HOOK_35 = fun.name()
fun.hook(_XML_HOOK_35, _XML_HOOK_34, { tagName:"p", attrs:null }) fun.hook(_XML_HOOK_35, _XML_HOOK_34, { tagName:"p", attrs:null })
fun.emit(_XML_HOOK_35, fun.expressions.Text("Double-click to edit a todo")) fun.emit(_XML_HOOK_35, fun.expressions.Text(""))
var _XML_HOOK_36 = fun.name() var _XML_HOOK_36 = fun.name()
fun.hook(_XML_HOOK_36, _XML_HOOK_34, { tagName:"p", attrs:null }) fun.hook(_XML_HOOK_36, _XML_HOOK_34, { tagName:"p", attrs:null })
fun.emit(_XML_HOOK_36, fun.expressions.Text("Created for TodoMVC with ")) fun.emit(_XML_HOOK_36, fun.expressions.Text("Created for TodoMVC with "))
......
...@@ -55,7 +55,7 @@ ...@@ -55,7 +55,7 @@
function loadTemplates(cb) { function loadTemplates(cb) {
var root = "//" + window.location.host + window.location.pathname; var root = "//" + window.location.host + window.location.pathname;
$.get(root + 'templates/task.html', function(tmpl) { $.get('templates/task.html', function(tmpl) {
cb(function(view) { cb(function(view) {
return Mustache.to_html(tmpl, view); return Mustache.to_html(tmpl, view);
}); });
......
...@@ -17,11 +17,12 @@ ...@@ -17,11 +17,12 @@
<label for="toggle-all">Mark all as complete</label> <label for="toggle-all">Mark all as complete</label>
<ul id="todo-list" data-weave="widget/list"></ul> <ul id="todo-list" data-weave="widget/list"></ul>
</section> </section>
<!-- this footer needs to be shown with JS when there are todos and hidden when not -->
<footer data-weave="widget/display"> <footer id="footer" data-weave="widget/display">
<a id="clear-completed" data-weave="widget/clear">Clear completed</a>
<div id="todo-count" data-weave="widget/count"></div> <div id="todo-count" data-weave="widget/count"></div>
<a id="clear-completed" data-weave="widget/clear">Clear completed</a>
</footer> </footer>
</div> </div>
<div id="instructions"> <div id="instructions">
Double click to edit a todo. Double click to edit a todo.
......
...@@ -55,7 +55,7 @@ define(["lib/stapes", "lib/mustache"], function(Stapes, Mustache) { ...@@ -55,7 +55,7 @@ define(["lib/stapes", "lib/mustache"], function(Stapes, Mustache) {
function loadTemplates(cb) { function loadTemplates(cb) {
var root = "//" + window.location.host + window.location.pathname; var root = "//" + window.location.host + window.location.pathname;
$.get(root + 'templates/task.html', function(tmpl) { $.get('templates/task.html', function(tmpl) {
cb(function(view) { cb(function(view) {
return Mustache.to_html(tmpl, view); return Mustache.to_html(tmpl, view);
}); });
......
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
<div class="span5 header-title"> <div class="span5 header-title">
<h1>TodoMVC Labs</h1> <h1>TodoMVC Labs</h1>
<p> <p>
A common learning application for JavaScript MV* frameworks under consideration for the future A common learning application for JavaScript MV* frameworks
<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://addyosmani.github.com/todomvc" data-via="addyosmani">Tweet</a> <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://addyosmani.github.com/todomvc" data-via="addyosmani">Tweet</a>
</p> </p>
<nav> <nav>
...@@ -35,40 +35,44 @@ ...@@ -35,40 +35,44 @@
<h2>Introduction</h2> <h2>Introduction</h2>
<p>TodoMVC Labs showcases sample Todo applications for frameworks that have just been released or are still awaiting consideration for inclusion in TodoMVC.</p> <p>TodoMVC Labs showcases sample Todo applications for frameworks that have just been released or are still awaiting consideration for inclusion in TodoMVC.</p>
<p>While our team are working on improving these applications for a future release of TodoMVC (e.g ensuring they meet our functional requirements), developers wishing to try out brand new frameworks or see what's coming next for this project can preview this today.</p> <p>While our team are working on improving these applications for a future release of TodoMVC (e.g ensuring they meet our functional requirements), developers wishing to try out brand new frameworks or see what's coming next for this project can preview this today.</p>
<p>* Using our latest template</p>
</div> </div>
<div class="span5" id="demos"> <div class="span5" id="demos">
<h2>Demos</h2> <h2>Demos</h2>
<ul class="nav nav-pills"> <ul class="nav nav-pills">
<li> <li>
<a href="http://todomvcapp.meteor.com/" data-source="http://meteor.com/" data-content="Meteor is an ultra-simple environment for building modern websites.A Meteor application is a mix of JavaScript that runs inside a client web browser, JavaScript that runs on the Meteor server inside a Node.js container, and all the supporting HTML fragments, CSS rules, and static assets. Meteor automates the packaging and transmission of these different components. And, it is quite flexible about how you choose to structure those components in your file tree.">Meteor</a> <a href="architecture-examples/agilityjs/index.html" data-source="http://agilityjs.com" data-content="Agility.js is an MVC library for Javascript that lets you write maintainable and reusable browser code without the infrastructural overhead found in other MVC libraries. The goal is to enable developers to write web apps at least as quickly as with jQuery, while simplifying long-term maintainability through MVC objects.">AgilityJS *</a>
</li> </li>
<li> <li>
<a href="architecture-examples/agilityjs/index.html" data-source="http://agilityjs.com" data-content="Agility.js is an MVC library for Javascript that lets you write maintainable and reusable browser code without the infrastructural overhead found in other MVC libraries. The goal is to enable developers to write web apps at least as quickly as with jQuery, while simplifying long-term maintainability through MVC objects.">AgilityJS</a> <a href="architecture-examples/stapes/index.html" data-source="http://hay.github.com/stapes/" data-content="Stapes is a (really) tiny Javascript MVC micro-framework (1.7kb) that has all the building blocks you need when writing an MVC app. It includes a powerful event system, support for inheritance, use with AMD, plugin support and more. A RequireJS Todo application is <a href='dependency-examples/stapes_require/index.html'>also</a> available.">Stapes *</a>
</li> </li>
<li> <li>
<a href="architecture-examples/batmanjs/index.html" data-source="http://batmanjs.org/" data-content="Batman.js is a framework for building rich web applications with CoffeeScript or JavaScript. App code is concise and declarative, thanks to a powerful system of view bindings and observable properties. The API is designed with developer and designer happiness as its first priority.">Batman.js</a> <a href="architecture-examples/troopjs/index.html" data-source="https://github.com/troopjs/" data-content="TroopJS attempts to package popular front-end technologies and bind them with minimal effort for the developer. It includes jQuery for DOM manipulation, ComposeJS for object composition, RequireJS for modularity and Has.js for feature detection. On top, it includes Pub/Sub support, templating, weaving (widgets to DOM) and auto-wiring.">TroopJS *</a>
</li> </li>
<li> <li>
<a href="architecture-examples/stapes/index.html" data-source="http://hay.github.com/stapes/" data-content="Stapes is a (really) tiny Javascript MVC micro-framework (1.7kb) that has all the building blocks you need when writing an MVC app. It includes a powerful event system, support for inheritance, use with AMD, plugin support and more. A RequireJS Todo application is <a href='dependency-examples/stapes_require/index.html'>also</a> available.">Stapes</a> <a href="architecture-examples/fun/index.html" data-source="https://github.com/marcuswestin/fun" data-content="Fun is not an MVC framework, but a programming language meant to tackle MVC/UI programming on a deeper, more fundamental level - part reactive/functional and part sequential/procedural.">Fun *</a>
</li> </li>
</ul>
<ul class="nav nav-pills">
<li> <li>
<a href="architecture-examples/gwt/index.html" data-source="https://developers.google.com/web-toolkit/" data-content="Google Web Toolkit (GWT) is an MVP development toolkit for building and optimizing complex browser-based applications. GWT is used by many products at Google, including Google AdWords.">Google Web Toolkit</a> <a href="http://todomvcapp.meteor.com/" data-source="http://meteor.com/" data-content="Meteor is an ultra-simple environment for building modern websites.A Meteor application is a mix of JavaScript that runs inside a client web browser, JavaScript that runs on the Meteor server inside a Node.js container, and all the supporting HTML fragments, CSS rules, and static assets. Meteor automates the packaging and transmission of these different components. And, it is quite flexible about how you choose to structure those components in your file tree.">Meteor</a>
</li> </li>
<li> <li>
<a href="architecture-examples/olives/index.html" data-source="https://github.com/flams/olives" data-content="Olives is a JS MVC framework that helps you create realtime UIs. It includes a set of AMD/CommonJS modules that are easily extensive, a high level of abstraction to reduce boilerplate and is based on socket.io, to provide a powerful means to communicate with node.js.">Olives</a> <a href="architecture-examples/batmanjs/index.html" data-source="http://batmanjs.org/" data-content="Batman.js is a framework for building rich web applications with CoffeeScript or JavaScript. App code is concise and declarative, thanks to a powerful system of view bindings and observable properties. The API is designed with developer and designer happiness as its first priority.">Batman.js</a>
</li> </li>
<li> <li>
<a href="architecture-examples/fun/index.html" data-source="https://github.com/marcuswestin/fun" data-content="Fun is not an MVC framework, but a programming language meant to tackle MVC/UI programming on a deeper, more fundamental level - part reactive/functional and part sequential/procedural.">Fun</a> <a href="architecture-examples/gwt/index.html" data-source="https://developers.google.com/web-toolkit/" data-content="Google Web Toolkit (GWT) is an MVP development toolkit for building and optimizing complex browser-based applications. GWT is used by many products at Google, including Google AdWords.">Google Web Toolkit</a>
</li> </li>
<li> <li>
<a href="architecture-examples/rappidjs/index.html" data-source="https://github.com/it-ony/rAppid.js" data-content="rAppid.js is a declarative JavaScript framework for rapid web application development. It supports dependency loading, Model-View binding, View-Model binding, dependency injection and i18n.">rAppid</a> <a href="architecture-examples/olives/index.html" data-source="https://github.com/flams/olives" data-content="Olives is a JS MVC framework that helps you create realtime UIs. It includes a set of AMD/CommonJS modules that are easily extensive, a high level of abstraction to reduce boilerplate and is based on socket.io, to provide a powerful means to communicate with node.js.">Olives</a>
</li> </li>
<li> <li>
<a href="architecture-examples/dijon/index.html" data-source="https://github.com/creynders/dijon-framework" data-content="Dijon is an IOC and DI micro-framework for Javascript. Originally it was meant to be a port of Robotlegs, but deviated to something quite different. It remains however heavily inspired by Robotlegs, and more specifically Swiftsuspenders.">Dijon</a> <a href="architecture-examples/rappidjs/index.html" data-source="https://github.com/it-ony/rAppid.js" data-content="rAppid.js is a declarative JavaScript framework for rapid web application development. It supports dependency loading, Model-View binding, View-Model binding, dependency injection and i18n.">rAppid</a>
</li> </li>
<li> <li>
<a href="architecture-examples/troopjs/index.html" data-source="https://github.com/troopjs/" data-content="TroopJS attempts to package popular front-end technologies and bind them with minimal effort for the developer. It includes jQuery for DOM manipulation, ComposeJS for object composition, RequireJS for modularity and Has.js for feature detection. On top, it includes Pub/Sub support, templating, weaving (widgets to DOM) and auto-wiring.">TroopJS</a> <a href="architecture-examples/dijon/index.html" data-source="https://github.com/creynders/dijon-framework" data-content="Dijon is an IOC and DI micro-framework for Javascript. Originally it was meant to be a port of Robotlegs, but deviated to something quite different. It remains however heavily inspired by Robotlegs, and more specifically Swiftsuspenders.">Dijon</a>
</li> </li>
<li> <li>
<a href="dependency-examples/emberjs_require/index.html" data-source="http://hay.github.com/stapes/" data-content="Ember is a JavaScript framework for creating ambitious web applications that eliminates boilerplate and provides a standard application architecture. This is an example of using it with AMD modules">Ember.js + RequireJS</a> <a href="dependency-examples/emberjs_require/index.html" data-source="http://hay.github.com/stapes/" data-content="Ember is a JavaScript framework for creating ambitious web applications that eliminates boilerplate and provides a standard application architecture. This is an example of using it with AMD modules">Ember.js + RequireJS</a>
</li> </li>
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment