Initial version of the todos (no sort)

juggy · Apr 22, 2011 · 8a3eab9 · 8a3eab9
commit 8a3eab9
Show file tree

Hide file tree

Showing 8 changed files with 2,152 additions and 0 deletions.
diff --git a/README.markdown b/README.markdown
@@ -0,0 +1,51 @@
+# Backbone Template TODOs example
+
+Partly copied and adapted from the original example by Jerome https://github.com/jeromegn/localtodos .
+
+# What is Backbone Template
+
+Backbone Template lets you describe your Backbone view layer in a single template that will automatically refresh when the bounded data changes. It uses Handlebars and is inspired by SproutCore (>= 1.5) SC.TemplateView .
+
+## Basic use
+
+* Create your template
+* Load it in a Backbone.Template object
+* render it and append it to your page (somewhere, the body maybe)
+* Make it alive to start all eventing and make your views behave as intended
+
+## Things to know:
+
+* If you do not call makeAlive your views will not receive events
+* Any defined render method will be redefined by the template
+* You can declare an alive function on your view to handle last minute initialization
+
+# More...
+
+Check out Backbone Template Github repo at (https://github.com/juggy/backbone-template)
+
+# License (MIT)
+
+Copyright (c) 2010 Julien Guimont <[email protected]>
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+# Special thanks
+
+* Jerome Gravel-Niquet <[email protected]>
diff --git a/images/destroy.png b/images/destroy.png
diff --git a/index.html b/index.html
@@ -0,0 +1,73 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+  <head>
+    <title>Todos</title>
+    <link href="stylesheets/screen.css" media="all" rel="stylesheet" type="text/css"/>
+    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
+    <script type="text/javascript" src="http://ajax.cdnjs.com/ajax/libs/underscore.js/1.1.5/underscore-min.js"></script>
+    <script type="text/javascript" src="http://ajax.cdnjs.com/ajax/libs/backbone.js/0.3.3/backbone-min.js"></script>
+    <script type="text/javascript" src="javascripts/backbone.localStorage.js" type="text/javascript"></script>
+    <script type="text/javascript" src="javascripts/handlebars.js" ></script>
+    <script type="text/javascript" src="../backbone-template/lib/backbone_template.js" ></script>
+  </head>
+  <body>
+    <script id="app-template" type="text/handlebar-template">
+      {{#view AppView}}
+        <div class='title'>
+          <h1>Todos</h1>
+        </div>
+        <div class='content'>
+          <div id='create-todo'>
+            <input id='new-todo' placeholder='What needs to be done?' type='text' />
+            <span class='ui-tooltip-top'>Press Enter to create this task</span>
+          </div>
+          <div id="todos"
+            {{#collection model colTag="ul" colId="todo-list" itemView="TodoView"}}
+              {{#if done}}
+                <input type='checkbox' class='todo-check' checked="checked" />
+              {{else}}
+                <input type='checkbox' class='todo-check'/>
+              {{/if}}
+              <div class='todo-content'>{{content}}</div>
+              <span class='todo-destroy'></span>
+              <input type='text' class='todo-input' {{bindAttr value=content}}/>
+            {{/collection}}
+          </div>
+        </div>
+        <div id='todo-stats'>
+          {{#if items}}
+            <span class="todo-count">
+              <span class="number">{{bind "remainingItems"}}</span>
+              <span class="word"> {{bind "remainingWord"}}</span> 
+              left.
+            </span>
+          {{/if}}
+          {{#if doneItems}}
+            <span class="todo-clear">
+              <a href="#">
+                Clear 
+                <span class="number-done">{{bind "doneItems"}} </span>
+                completed 
+                <span class="word-done">{{bind "doneWord"}}</span>
+              </a>
+            </span>
+          {{/if}}
+        </div>
+      </div>
+      <ul id='instructions'>
+        <li>Double-click to edit a todo.</li>
+      </ul>
+      <div id='credits'>
+        Created by
+        <br />
+        <a href='http://jgn.me/'>J&eacute;r&ocirc;me Gravel-Niquet</a>
+        <br />
+        Updated by
+        <br />
+        <a href='http://jguimont.com/'>Julien Guimont</a>
+      {{/view}}
+    </script>
+
+    <script language="javascript" src="javascripts/todos.js" type="text/javascript"></script>
+  </body>
+</html>
diff --git a/javascripts/backbone.localStorage.js b/javascripts/backbone.localStorage.js