Skip to content

Instantly share code, notes, and snippets.

@manast

manast/gist:6281160

Created August 20, 2013 13:10
Show Gist options
  • Save manast/6281160 to your computer and use it in GitHub Desktop.
Save manast/6281160 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. manast created this gist Aug 20, 2013.
    113 changes: 113 additions & 0 deletions gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,113 @@
    <!DOCTYPE html>
    <html lang="en">

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
    <meta name="fragment" content="!">

    <title>Ground Application</title>

    <link rel="icon" type="image/png" href="images/favicon.png" />
    <link rel="stylesheet" href="../../../../assets/base.css">

    <script>
    // Prevent IE from crashing
    if(typeof console === 'undefined') {
    console = {
    log: function() {}
    }
    }
    </script>

    <script type="text/javascript">
    curl = {
    paths:{
    css:'/assets/css',
    tmpl:'/assets/templates',
    gnd: 'vendor/gnd'
    },
    };
    </script>

    <script src="vendor/lodash.js"></script>
    <script src="vendor/curl.js"></script>
    </head>

    <body>
    <section id="todoapp">
    <header id="header">
    <h1>todos</h1>
    <input id="new-todo" autofocus
    data-event="keyup: todolist.addTodo"
    placeholder="What needs to be done?">
    </header>

    <section id="main">
    <input id="toggle-all" type="checkbox"
    data-event="click: todolist.toggleAll"
    data-bind="checked: todolist.allCompleted">

    <label for="toggle-all">Mark all as complete</label>

    <ul id="todo-list">
    <li id="todo-item"
    data-each="todos: todo"
    data-class="completed: todo.completed; editing: todo.isEditing">
    <div class="view">
    <input class="toggle" type="checkbox"
    data-bind="checked: todo.completed">
    <label data-bind="text: todo.description"
    data-event="dblclick: todolist.startEditing"></label>
    <button data-event="click: todolist.removeTodo"
    class="destroy"></button>
    </div>
    <input class="edit" type="text"
    data-bind="value: todo.description"
    data-event="keypress: todolist.endEditing; blur: todolist.endEditing;">
    </li>
    </ul>
    </section>

    <footer id="footer" data-show="todos.count">
    <span id="todo-count">
    <strong data-bind="text: todolist.remaining"></strong>
    <span data-bind="text: todolist.itemsLeftString"></span>
    </span>
    <ul id="filters">
    <li>
    <a data-class="selected: app.filterAll" href="#/">All</a>
    </li>
    <li>
    <a data-class="selected: app.filterActive" href="#/active">Active</a>
    </li>
    <li>
    <a data-class="selected: app.filterCompleted" href="#/completed">Completed</a>
    </li>
    </ul>
    <button id="clear-completed"
    data-event="click: todolist.clearCompleted"
    data-show="todolist.completed">
    Clear completed (<span data-bind="text: todolist.completed"></span>)
    </button>
    </footer>
    </section>
    </div>
    <footer id="info">
    <p>Double-click to edit a todo</p>
    <!-- Change this out with your name and url ↓ -->
    <p>Created by <a href="http://twitter.com/optimalbits">OptimalBits</a></p>
    </footer>
    <!-- Scripts here. Don't remove this ↓ -->
    <script src="../../../../assets/base.js"></script>
    <!-- <script src="app.js"></script> -->

    <script>
    curl(['domReady!', 'app'], function(){
    console.log("Application Loaded");
    });
    </script>

    </body>

    </html>