Commit ebdead12 authored by Sindre Sorhus's avatar Sindre Sorhus
parent 19064ddd
......@@ -205,9 +205,6 @@
<li>
<a href="labs/architecture-examples/puremvc/" data-source="http://puremvc.github.com" data-content="PureMVC is a lightweight framework for creating applications based upon the classic Model-View-Controller design meta-pattern.">PureMVC</a>
</li>
<li>
<a href="labs/architecture-examples/fidel/" data-source="https://github.com/jgallen23/fidel" data-content="Fidel is a micro-framework for building widgets, modules and plugins. It resembles the controller in Spine.js and could be considered a controller library. Having not heavily needed models and routing in some of the single-page applications the author built, he found a library focusing on controller logic more useful.">Fidel</a>
</li>
<li>
<a href="labs/architecture-examples/olives/" 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>
......
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
body {
line-height: 1;
color: black;
background: white;
}
ol, ul {
list-style: none;
}
a img {
border: none;
}
html {
background: #eeeeee;
}
body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
line-height: 1.4em;
background: #eeeeee;
color: #333333;
}
#todoapp {
width: 480px;
margin: 0 auto 40px;
background: white;
padding: 20px;
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 5px 6px 0;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 5px 6px 0;
-o-box-shadow: rgba(0, 0, 0, 0.2) 0 5px 6px 0;
box-shadow: rgba(0, 0, 0, 0.2) 0 5px 6px 0;
}
#todoapp h1 {
font-size: 36px;
font-weight: bold;
text-align: center;
padding: 20px 0 30px 0;
line-height: 1;
}
#create-todo {
position: relative;
}
#create-todo input {
width: 466px;
font-size: 24px;
font-family: inherit;
line-height: 1.4em;
border: 0;
outline: none;
padding: 6px;
border: 1px solid #999999;
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
-o-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
}
#create-todo span {
position: absolute;
z-index: 999;
width: 170px;
left: 50%;
margin-left: -85px;
}
#todo-list {
margin-top: 10px;
}
#todo-list li {
padding: 12px 20px 11px 0;
position: relative;
font-size: 24px;
line-height: 1.1em;
border-bottom: 1px solid #cccccc;
}
#todo-list li:after {
content: "\0020";
display: block;
height: 0;
clear: both;
overflow: hidden;
visibility: hidden;
}
#todo-list li.editing {
padding: 0;
border-bottom: 0;
}
#todo-list .editing .display,
#todo-list .edit {
display: none;
}
#todo-list .editing .edit {
display: block;
}
#todo-list .editing input {
width: 444px;
font-size: 24px;
font-family: inherit;
margin: 0;
line-height: 1.6em;
border: 0;
outline: none;
padding: 10px 7px 0px 27px;
border: 1px solid #999999;
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
-o-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
}
#todo-list .check {
position: relative;
top: 9px;
margin: 0 10px 0 7px;
float: left;
}
#todo-list .done .todo-content {
text-decoration: line-through;
color: #777777;
}
#todo-list .todo-destroy {
position: absolute;
right: 5px;
top: 14px;
display: none;
cursor: pointer;
width: 20px;
height: 20px;
background: url(destroy.png) no-repeat 0 0;
}
#todo-list li:hover .todo-destroy {
display: block;
}
#todo-list .todo-destroy:hover {
background-position: 0 -20px;
}
#todo-stats {
*zoom: 1;
margin-top: 10px;
color: #777777;
}
#todo-stats:after {
content: "\0020";
display: block;
height: 0;
clear: both;
overflow: hidden;
visibility: hidden;
}
#todo-stats .todo-count {
float: left;
}
#todo-stats .todo-count .number {
font-weight: bold;
color: #333333;
}
#todo-stats .todo-clear {
float: right;
}
#todo-stats .todo-clear a {
color: #777777;
font-size: 12px;
}
#todo-stats .todo-clear a:visited {
color: #777777;
}
#todo-stats .todo-clear a:hover {
color: #336699;
}
#instructions {
width: 520px;
margin: 10px auto;
color: #777777;
text-shadow: rgba(255, 255, 255, 0.8) 0 1px 0;
text-align: center;
}
#instructions a {
color: #336699;
}
#credits {
width: 520px;
margin: 30px auto;
color: #999;
text-shadow: rgba(255, 255, 255, 0.8) 0 1px 0;
text-align: center;
}
#credits a {
color: #888;
}
/*
* François 'cahnory' Germain
*/
.ui-tooltip, .ui-tooltip-top, .ui-tooltip-right, .ui-tooltip-bottom, .ui-tooltip-left {
color:#ffffff;
cursor:normal;
display:-moz-inline-stack;
display:inline-block;
font-size:12px;
font-family:arial;
padding:.5em 1em;
position:relative;
text-align:center;
text-shadow:0 -1px 1px #111111;
-webkit-border-top-left-radius:4px ;
-webkit-border-top-right-radius:4px ;
-webkit-border-bottom-right-radius:4px ;
-webkit-border-bottom-left-radius:4px ;
-khtml-border-top-left-radius:4px ;
-khtml-border-top-right-radius:4px ;
-khtml-border-bottom-right-radius:4px ;
-khtml-border-bottom-left-radius:4px ;
-moz-border-radius-topleft:4px ;
-moz-border-radius-topright:4px ;
-moz-border-radius-bottomright:4px ;
-moz-border-radius-bottomleft:4px ;
border-top-left-radius:4px ;
border-top-right-radius:4px ;
border-bottom-right-radius:4px ;
border-bottom-left-radius:4px ;
-o-box-shadow:0 1px 2px #000000, inset 0 0 0 1px #222222, inset 0 2px #666666, inset 0 -2px 2px #444444;
-moz-box-shadow:0 1px 2px #000000, inset 0 0 0 1px #222222, inset 0 2px #666666, inset 0 -2px 2px #444444;
-khtml-box-shadow:0 1px 2px #000000, inset 0 0 0 1px #222222, inset 0 2px #666666, inset 0 -2px 2px #444444;
-webkit-box-shadow:0 1px 2px #000000, inset 0 0 0 1px #222222, inset 0 2px #666666, inset 0 -2px 2px #444444;
box-shadow:0 1px 2px #000000, inset 0 0 0 1px #222222, inset 0 2px #666666, inset 0 -2px 2px #444444;
background-color:#3b3b3b;
background-image:-moz-linear-gradient(top,#555555,#222222);
background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#555555),color-stop(1,#222222));
filter:progid:DXImageTransform.Microsoft.gradient(startColorStr=#555555,EndColorStr=#222222);
-ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorStr=#555555,EndColorStr=#222222);
}
.ui-tooltip:after, .ui-tooltip-top:after, .ui-tooltip-right:after, .ui-tooltip-bottom:after, .ui-tooltip-left:after {
content:"\25B8";
display:block;
font-size:2em;
height:0;
line-height:0;
position:absolute;
}
.ui-tooltip:after, .ui-tooltip-bottom:after {
color:#2a2a2a;
bottom:0;
left:1px;
text-align:center;
text-shadow:1px 0 2px #000000;
-o-transform:rotate(90deg);
-moz-transform:rotate(90deg);
-khtml-transform:rotate(90deg);
-webkit-transform:rotate(90deg);
width:100%;
}
.ui-tooltip-top:after {
bottom:auto;
color:#4f4f4f;
left:-2px;
top:0;
text-align:center;
text-shadow:none;
-o-transform:rotate(-90deg);
-moz-transform:rotate(-90deg);
-khtml-transform:rotate(-90deg);
-webkit-transform:rotate(-90deg);
width:100%;
}
.ui-tooltip-right:after {
color:#222222;
right:-0.375em;
top:50%;
margin-top:-.05em;
text-shadow:0 1px 2px #000000;
-o-transform:rotate(0);
-moz-transform:rotate(0);
-khtml-transform:rotate(0);
-webkit-transform:rotate(0);
}
.ui-tooltip-left:after {
color:#222222;
left:-0.375em;
top:50%;
margin-top:.1em;
text-shadow:0 -1px 2px #000000;
-o-transform:rotate(180deg);
-moz-transform:rotate(180deg);
-khtml-transform:rotate(180deg);
-webkit-transform:rotate(180deg);
}
/*the following changes require some cleanup and integration with the above.**/
/* line 9 */
/* line 17 */
#todoapp {
background: white;
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 2px 6px 0;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 2px 6px 0;
-o-box-shadow: rgba(0, 0, 0, 0.2) 0 2px 6px 0;
box-shadow: rgba(0, 0, 0, 0.2) 0 2px 6px 0;
-moz-border-radius-bottomleft: 5px;
-webkit-border-bottom-left-radius: 5px;
-o-border-bottom-left-radius: 5px;
-ms-border-bottom-left-radius: 5px;
-khtml-border-bottom-left-radius: 5px;
border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-webkit-border-bottom-right-radius: 5px;
-o-border-bottom-right-radius: 5px;
-ms-border-bottom-right-radius: 5px;
-khtml-border-bottom-right-radius: 5px;
border-bottom-right-radius: 5px;
}
/* line 24 */
/* line 32 */
#todoapp .content #create-todo {
position: relative;
}
/* line 34 */
#todoapp .content #create-todo input {
font-size: 24px;
font-family: inherit;
line-height: 1.4em;
border: 0;
outline: none;
padding: 6px;
border: 1px solid #999999;
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
-o-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
}
/* line 47 */
#todoapp .content #create-todo span {
position: absolute;
z-index: 999;
width: 170px;
left: 50%;
margin-left: -85px;
opacity: 0;
}
/* line 55 */
#todoapp .content ul#todo-list {
margin-top: 10px;
}
/* line 57 */
#todoapp .content ul#todo-list li {
padding: 15px 20px 15px 0;
position: relative;
font-size: 24px;
border-bottom: 1px solid #cccccc;
*zoom: 1;
cursor: move;
}
/* line 22, /opt/ree/lib/ruby/gems/1.8/gems/compass-0.10.5/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
#todoapp .content ul#todo-list li:after {
content: "\0020";
display: block;
height: 0;
clear: both;
overflow: hidden;
visibility: hidden;
}
/* line 64 */
#todoapp .content ul#todo-list li.editing {
padding: 0;
border-bottom: 0;
}
/* line 67 */
#todoapp .content ul#todo-list li.editing .todo-input {
display: block;
width: 466px;
font-size: 24px;
font-family: inherit;
line-height: 1.4em;
border: 0;
outline: none;
padding: 6px;
border: 1px solid #999999;
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
-o-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px 0 inset;
}
/* line 79 */
#todoapp .content ul#todo-list li.editing .todo-content {
display: none;
}
/* line 81 */
#todoapp .content ul#todo-list li.editing .todo-check {
display: none;
}
/* line 83 */
#todoapp .content ul#todo-list li.editing .todo-destroy {
display: none !important;
}
/* line 85 */
#todoapp .content ul#todo-list li .todo-input {
display: none;
}
/* line 87 */
#todoapp .content ul#todo-list li .todo-check {
position: relative;
top: 6px;
margin: 0 10px 0 7px;
float: left;
}
/* line 93 */
#todoapp .content ul#todo-list li.done .todo-content {
text-decoration: line-through;
color: #777777;
}
/* line 96 */
#todoapp .content ul#todo-list li .todo-destroy {
position: absolute;
right: 0px;
top: 16px;
display: none;
cursor: pointer;
width: 20px;
height: 20px;
}
/* line 106 */
#todoapp .content ul#todo-list li:hover .todo-destroy {
display: block;
}
/* line 109 */
#todoapp #todo-stats {
*zoom: 1;
margin-top: 10px;
color: #555555;
-moz-border-radius-bottomleft: 5px;
-webkit-border-bottom-left-radius: 5px;
-o-border-bottom-left-radius: 5px;
-ms-border-bottom-left-radius: 5px;
-khtml-border-bottom-left-radius: 5px;
border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-webkit-border-bottom-right-radius: 5px;
-o-border-bottom-right-radius: 5px;
-ms-border-bottom-right-radius: 5px;
-khtml-border-bottom-right-radius: 5px;
border-bottom-right-radius: 5px;
background: #f4fce8;
border-top: 1px solid #ededed;
padding: 0 20px;
line-height: 36px;
}
/* line 22, /opt/ree/lib/ruby/gems/1.8/gems/compass-0.10.5/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
#todoapp #todo-stats:after {
content: "\0020";
display: block;
height: 0;
clear: both;
overflow: hidden;
visibility: hidden;
}
/* line 118 */
#todoapp #todo-stats .todo-count {
float: left;
}
/* line 120 */
#todoapp #todo-stats .todo-count .number {
font-weight: bold;
color: #555555;
}
/* line 123 */
#todoapp #todo-stats .todo-clear {
float: right;
}
/* line 125 */
#todoapp #todo-stats .todo-clear a {
display: block;
line-height: 20px;
text-decoration: none;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
-o-border-radius: 12px;
-ms-border-radius: 12px;
-khtml-border-radius: 12px;
border-radius: 12px;
background: rgba(0, 0, 0, 0.1);
color: #555555;
font-size: 11px;
margin-top: 8px;
padding: 0 10px 1px;
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 0 0;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 0 0;
-o-box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 0 0;
box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 0 0;
}
/* line 136 */
#todoapp #todo-stats .todo-clear a:hover, #todoapp #todo-stats .todo-clear a:focus {
background: rgba(0, 0, 0, 0.15);
-moz-box-shadow: rgba(0, 0, 0, 0.3) 0 -1px 0 0;
-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 -1px 0 0;
-o-box-shadow: rgba(0, 0, 0, 0.3) 0 -1px 0 0;
box-shadow: rgba(0, 0, 0, 0.3) 0 -1px 0 0;
}
/* line 139 */
#todoapp #todo-stats .todo-clear a:active {
position: relative;
top: 1px;
}
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Fidel</title>
<link href="css/app.css" rel="stylesheet">
<!--[if IE]>
<script src="../../../assets/ie.js"></script>
<![endif]-->
</head>
<body>
<div id="todoapp">
<div class="title">
<h1>todos</h1>
</div>
<div class="content">
<div id="create-todo">
<input data-element="input" placeholder="What needs to be done?" type="text">
</div>
<div id="todos">
<ul id="todo-list" data-element="todosContainer"></ul>
</div>
<div id="todo-stats" data-element="statsContainer"></div>
</div>
</div>
<div id="credits">
<p>Created by
<br />
<a href="http://jga.me/">Greg Allen</a> (<a href="http://twitter.com/jgaui">jgaui</a>)</p>
<br />
<p>Part of <a href="http://todomvc.com">TodoMVC</a></p>
</div>
<script type="text/template" id="item-template">
<li class="todo {!= todo.done ? 'done' : '' !}" data-todoid="{!= todo.guid !}">
<div class="display">
<input class="check" type="checkbox" {!= todo.done ? 'checked="checked"' : '' !} />
<div class="todo-content">{!= todo.name !}</div>
<span data-action="destroyTodo" class="todo-destroy"></span>
</div>
<div class="edit">
<input class="todo-input" type="text" value="" />
</div>
</li>
</script>
<script type="text/template" id="stats-template">
{! if (total) { !}
<span class="todo-count">
<span class="number">{!= remaining !}</span>
<span class="word">{!= remaining == 1 ? 'item' : 'items' !}</span> left.
</span>
{! } !}
{! if (done) { !}
<span class="todo-clear">
<a data-action="clearCompleted" href="#">
Clear <span class="number-done">{!= done !}</span>
completed <span class="word-done">{!= done == 1 ? 'item' : 'items' !}</span>
</a>
</span>
{! } !}
</script>
<script src="../../../assets/base.js"></script>
<script src="../../../assets/jquery.min.js"></script>
<script src="js/lib/fidel.js"></script>
<script src="js/app.js"></script>
</body>
</html>
\ No newline at end of file
var localStoreName = 'todos-fidel';
var todoStore = (function() {
return {
get: function() {
var d = localStorage.getItem(localStoreName);
var todos = {};
if (d) {
d = JSON.parse(d);
for (var key in d) {
todos[key] = new Todo(d[key]);
}
}
return todos;
},
save: function(todos) {
localStorage.setItem(localStoreName, JSON.stringify(todos));
}
};
})();
var Todo = Fidel.Class.extend({
defaults: {
name: "empty todo...",
done: false,
order: 0
},
init: function() {
},
toggleDone: function() {
this.done = !this.done;
}
});
var TodoView = Fidel.ViewController.extend({
templates: {
item: "#item-template",
stats: '#stats-template'
},
events: {
'keypress input[type="text"]': 'addOnEnter',
'click .check': 'complete'
},
init: function() {
this.todos = todoStore.get();
this.renderAll();
},
addOnEnter: function(e) {
if (e.keyCode == 13)
this.add();
},
add: function() {
var name = this.input.val();
this.input.val('');
var todo = new Todo({ name: name, order: this.taskCount });
this.taskCount++;
this.todos[todo.guid] = todo;
this.save();
var tmp = this.template(this.templates.item, { todo: todo });
this.todosContainer.prepend(tmp);
this.renderStats();
},
save: function() {
todoStore.save(this.todos);
},
sortTasks: function() {
var sorted = [];
for (var key in this.todos) {
sorted.push(this.todos[key]);
}
sorted.sort(function(a, b) {
return (b.order - a.order);
});
return sorted;
},
renderAll: function() {
var html = [];
var todos = this.sortTasks();
this.taskCount = todos.length;
for (var i = 0, c = todos.length; i < c; i++) {
var todo = todos[i];
var tmp = this.template(this.templates.item, { todo: todo });
html.push(tmp);
}
this.todosContainer.html(html.join(''));
this.renderStats();
},
renderStats: function() {
var todos = this.sortTasks();
var data = {
total: todos.length,
remaining: 0,
done: 0
};
for (var i = 0, c = todos.length; i < c; i++) {
var todo = todos[i];
if (todo.done)
data.done++;
else
data.remaining++;
}
this.render('stats', data, this.statsContainer);
},
complete: function(e) {
var complete = (e.target.value == "on");
var el = $(e.target);
el.parents('li').toggleClass('done');
var todoId = el.parents('li').attr('data-todoid');
this.todos[todoId].toggleDone();
this.save();
this.renderStats();
},
clearCompleted: function() {
var completedTodos = this.find('input:checked');
for (var i = 0, c = completedTodos.length; i < c; i++) {
var item = completedTodos[i];
this.destroyTodo($(item));
}
},
destroyTodo: function(el) {
var parent = el.parents('li');
var guid = parent.attr('data-todoid');
delete this.todos[guid];
parent.remove();
this.save();
this.renderStats();
}
});
//app
var todos = new TodoView({ el: $("#todoapp") });
\ No newline at end of file
/*!
* Fidel - A javascript controller
* v1.2.2
* https://github.com/jgallen23/fidel
* copyright JGA 2011
* MIT License
*/
!function(h,b){"undefined"!=typeof module&&module.exports?module.exports=b():"function"==typeof define&&"object"==typeof define.amd?define(b):this[h]=b()}("Fidel",function(){var h=this,b={guid:function(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,function(a){var c=16*Math.random()|0;return("x"===a?c:c&3|8).toString(16)}).toUpperCase()},extend:function(){throw Error("Fidel.extend is deprecated, please use Fidel.ViewController.extend");}},j=h.Fidel;b.noConflict=function(){h.Fidel=
j;return this};var i=!1,k=/xyz/.test(function(){xyz})?/\b_super\b/:/.*/;b.Class=function(){};b.Class.extend=function(a){function c(a){if(!i){if(this.defaults)for(var c in this.defaults)if("object"!==typeof a||!a[c])this[c]=this.defaults[c];if("object"===typeof a)for(var d in a)this[d]=a[d];this.guid||(this.guid=b.guid());this._initialize&&this._initialize.apply(this,arguments);this.init&&this.init.apply(this,arguments)}}var d=this.prototype;i=!0;var e=new this;i=!1;for(var f in a)e[f]="function"==
typeof a[f]&&"function"==typeof d[f]&&k.test(a[f])?function(a,c){return function(){var b=this._super;this._super=d[a];var e=c.apply(this,arguments);this._super=b;return e}}(f,a[f]):a[f];c.prototype=e;c.prototype.proxy=function(a){var c=this;return function(){if(a)return a.apply(c,arguments)}};c.constructor=c;c.extend=arguments.callee;return c};var g={};b.publish=function(a,c){for(var d=g[a],b=d?d.length:0;b--;)d[b].apply(this,c||[])};b.subscribe=function(a,c){g[a]||(g[a]=[]);g[a].push(c);return[a,
c]};b.unsubscribe=function(a){for(var c=g[a[0]],a=a[1],b=c?c.length:0;b--;)c[b]===a&&c.splice(b,1)};b.Class.prototype.on=b.Class.prototype.bind=function(a,c){return b.subscribe(this.guid+"."+a,this.proxy(c))};b.Class.prototype.emit=b.Class.prototype.trigger=function(a,c){b.publish(this.guid+"."+a,c);b.publish(a,c)};b.Class.prototype.removeListener=b.Class.prototype.unbind=function(a){b.unsubscribe(a)};!function(){var a={};b.template=function d(b,f){var g=!/\W/.test(b)?a[b]=a[b]||d(b):new Function("obj",
"var p=[],print=function(){p.push.apply(p,arguments);};with(obj){p.push('"+b.replace(/[\r\t\n]/g,"").split("{!").join("\t").replace(/((^|!})[^\t]*)'/g,"$1\r").replace(/\t=(.*?)!}/g,"',$1,'").split("\t").join("');").split("!}").join("p.push('").split("\r").join("\\'")+"');}return p.join('');");return f?g(f):g}}();var l=/^(\w+)\s*(.*)$/,m=b.Class.extend({_initialize:function(){if(!this.el)throw"el is required";this._subscribeHandles={};this.events&&this.delegateEvents();this.elements&&this.refreshElements();
this.templates&&this.loadTemplates();this.actionEvent||(this.actionEvent="click");this.subscribe&&this.bindSubscriptions();this.delegateActions();this.getDataElements()},template:b.template,delegateEvents:function(){for(var a in this.events){var c=this.events[a],b=a.match(l),e=b[1],b=b[2],c=this.proxy(this[c]);""===b?this.el.bind(e,c):this.el.delegate(b,e,c)}},delegateActions:function(){var a=this;this.el.delegate("[data-action]",this.actionEvent,function(b){var d=$(this),e=d.attr("data-action");
a[e]&&a[e].call(a,d,b)})},refreshElements:function(){for(var a in this.elements)this[a]=this.find(this.elements[a])},getDataElements:function(){for(var a=this.find("[data-element]"),b=0,d=a.length;b<d;b++){var e=a[b].getAttribute("data-element");if(!this[e]){var f=this.find('[data-element="'+e+'"]');this[e]=f}}},bindSubscriptions:function(){for(var a in this.subscribe)this._subscribeHandles[a]=b.subscribe(a,this.proxy(this[this.subscribe[a]]))},loadTemplates:function(){for(var a in this.templates)this.templates[a]=
$(this.templates[a]).html()},find:function(a){return $(a,this.el[0])},render:function(a,b,d){1==arguments.length&&(b=a,a=this.primaryTemplate);if(template=this.templates[a]){var e=this.template(template,b),d=d?$(d):this.el;d.html(e)}},destroy:function(){for(var a in this._subscribeHandles)b.unsubscribe(this._subscribeHandles[a]);this.el.undelegate("[data-action]",this.actionEvent);this.el=null}});b.ViewController=m;return b});
\ No newline at end of file
......@@ -56,7 +56,6 @@ We also have a number of in-progress applications in Labs:
- [TroopJS](https://github.com/troopjs)
- [soma.js](http://somajs.github.com/somajs)
- [DUEL](https://bitbucket.org/mckamey/duel/wiki/Home)
- [Fidel](https://github.com/jgallen23/fidel)
- [Olives](https://github.com/flams/olives)
- [PlastronJS](https://github.com/rhysbrettbowen/PlastronJS)
- [Dijon](https://github.com/creynders/dijon-framework)
......
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