<title>Backbone Tea Tree</title>
<link rel="stylesheet" href="/./css/styles.css" />
<script data-main="js/main" src="/lib/requirejs/require.js"></script>
<header id="header" align="center">
<span class="title">Welcome to Backbone Tea Tree</span>
<h1>Backbone Tea Tree</h1>
<li> is one MVC & single-page web app on Backbone.js </li>
<li> is one modular Backbone app which loading JS code as-needed by RequireJS </li>
<li> whenever the Model's data change, all the Views bound to this Model automatically re-render </li>
<li> integrate with RESTful services based on Slim framework (PHP version) </li>
<li> one Responsive Web Design (RWD) application by CSS3 Media Queries mechanics </li>
<li> to drag&drop image file and upload it to web server based on HTML 5 APIs: communication, drag & drop</li>
<small>Written by <a href="https://www.ebizdesigner.com/">John Yin</a></small>
<script type="text/template" id="tpl-header">
<span class="title">Backbone Tea Navigation</span>
<button class="new">New Tea</button>
<script type="text/template" id="tpl-tea-list-item">
<p><a href="#teas/<%= id %>">
<img src="/./images/<%= picture %>" alt="<%= name %>" /></a></p>
<script type="text/template" id="tpl-tea-details">
<div class="form-left-col">
<img height="350" src="/./images/<%= picture %>" />
<div class="form-right-col">
<input type="text" id="id" name="id" value="<%= id %>" disabled />
<input type="text" id="name" name="name" value="<%= name %>" required/>
<input type="text" id="brand" name="brand" value="<%= brand %>" required/>
<input type="text" id="serving" name="serving" value="<%= serving %>" required/>
<input type="text" id="servings" name="servings" value="<%= servings %>" />
<label>Ingredients:</label>
<textarea id="ingredients" name="ingredients">
<label>Description:</label>
<textarea id="description" name="description">
<button class="save">Save</button>
<button class="delete">Delete</button>
<script src="/lib/jquery-1.7.1.min.js"></script>
<script src="/lib/underscore-min.js"></script>
<script src="/lib/backbone-min.js"></script>
<script src="/js/main.js"></script>