Frontend w. Backbone,Underscore,jQuery - Async handlebars loader
This commit is contained in:
parent
3da2d67aa9
commit
613f382363
12 changed files with 13615 additions and 0 deletions
24
index.html
Executable file
24
index.html
Executable file
|
@ -0,0 +1,24 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Bunti backbone prototype</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="content">
|
||||
|
||||
</div>
|
||||
<script src="js/libs/jquery.js"></script>
|
||||
<script src="js/libs/underscore.js"></script>
|
||||
<script src="js/libs/backbone.js"></script>
|
||||
<script src="js/libs/handlebars.js"></script>
|
||||
|
||||
<!-- Application core (Order matters) -->
|
||||
<script src="js/app.js"></script>
|
||||
|
||||
<!-- Modules (Order does not matter) -->
|
||||
<script src="js/modules/util.js"></script>
|
||||
<script src="js/modules/room.js"></script>
|
||||
</body>
|
||||
</html>
|
50
js/app.js
Executable file
50
js/app.js
Executable file
|
@ -0,0 +1,50 @@
|
|||
var app = {
|
||||
module: function () {
|
||||
var modules = {};
|
||||
|
||||
return function (name) {
|
||||
if (modules[name]) {
|
||||
return modules[name];
|
||||
}
|
||||
|
||||
return modules[name] = { Views: {} };
|
||||
};
|
||||
} ()
|
||||
};
|
||||
|
||||
jQuery(function ($) {
|
||||
// load the modules
|
||||
app.room = app.module('room');
|
||||
app.control = app.module('control');
|
||||
app.option = app.module('option');
|
||||
app.util = app.module('util');
|
||||
|
||||
// load the data -- dummy -- struts/node backend
|
||||
var model = {
|
||||
rooms: [
|
||||
{
|
||||
roomId: 1,
|
||||
title: "Raum 1",
|
||||
controls: [
|
||||
{ controlId: 1, type: "switch", options: [{ status: "off"}] },
|
||||
{ controlId: 2, type: "switch", options: [{ status: "on"}] },
|
||||
]
|
||||
},
|
||||
{ roomId: 2, title: "Raum 2" },
|
||||
{ roomId: 3, title: "Raum 3" },
|
||||
{ roomId: 4, title: "Raum 4" },
|
||||
{ roomId: 5, title: "Raum 5" }
|
||||
]
|
||||
};
|
||||
|
||||
var myTestTemplate = app.util.loadTemplate('js/templates/test.handlebars', function(data) {
|
||||
source = data;
|
||||
template = Handlebars.compile(source);
|
||||
//$('#target').html(template(jsondata));
|
||||
$('#content').append(template(model));
|
||||
});
|
||||
|
||||
// create the model
|
||||
dashboard = new app.room.List(model.rooms);
|
||||
|
||||
});
|
1431
js/libs/backbone.js
Executable file
1431
js/libs/backbone.js
Executable file
File diff suppressed because it is too large
Load diff
1550
js/libs/handlebars.js
Normal file
1550
js/libs/handlebars.js
Normal file
File diff suppressed because it is too large
Load diff
9404
js/libs/jquery.js
vendored
Executable file
9404
js/libs/jquery.js
vendored
Executable file
File diff suppressed because it is too large
Load diff
1059
js/libs/underscore.js
Executable file
1059
js/libs/underscore.js
Executable file
File diff suppressed because it is too large
Load diff
25
js/modules/devices/device.js
Executable file
25
js/modules/devices/device.js
Executable file
|
@ -0,0 +1,25 @@
|
|||
// js/modules/controls.js
|
||||
// Module reference argument, assigned at the bottom
|
||||
// every device gets its model from the base and is rendered into seperate viewbases
|
||||
|
||||
(function (Control) {
|
||||
// Dependencies
|
||||
var Option = app.module("option");
|
||||
|
||||
Device.Model = Backbone.Model.extend({
|
||||
defaults: {
|
||||
options: Option.List
|
||||
},
|
||||
initialize: function () {
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
Device.List = Backbone.Collections.extend({
|
||||
model: Control.Model
|
||||
});
|
||||
|
||||
})(app.module("control"));
|
||||
|
||||
|
||||
|
15
js/modules/devices/option.js
Executable file
15
js/modules/devices/option.js
Executable file
|
@ -0,0 +1,15 @@
|
|||
// js/modules/controls.js
|
||||
// Module reference argument, assigned at the bottom
|
||||
|
||||
(function (Option) {
|
||||
Option.Model = Backbone.Model.extend({
|
||||
});
|
||||
|
||||
Option.List = Backbone.Collections.extend({
|
||||
model: Option.Model
|
||||
});
|
||||
|
||||
})(app.module("option"));
|
||||
|
||||
|
||||
|
9
js/modules/devices/switch.js
Executable file
9
js/modules/devices/switch.js
Executable file
|
@ -0,0 +1,9 @@
|
|||
// js/modules/controls.js
|
||||
// Module reference argument, assigned at the bottom
|
||||
|
||||
(function (Switch) {
|
||||
|
||||
})(app.module("switch"));
|
||||
|
||||
|
||||
|
26
js/modules/room.js
Executable file
26
js/modules/room.js
Executable file
|
@ -0,0 +1,26 @@
|
|||
// js/modules/room.js
|
||||
// Module reference argument, assigned at the bottom
|
||||
|
||||
(function (Room) {
|
||||
|
||||
// Dependencies
|
||||
var Control = app.module("control");
|
||||
|
||||
// The basic person model
|
||||
Room.Model = Backbone.Model.extend({
|
||||
defaults: {
|
||||
roomId: null,
|
||||
title: 'undefined',
|
||||
controls: Control.List
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
Room.List = Backbone.Collection.extend({
|
||||
model: Room.Model
|
||||
});
|
||||
|
||||
})(app.module("room"));
|
||||
|
||||
|
||||
|
17
js/modules/util.js
Normal file
17
js/modules/util.js
Normal file
|
@ -0,0 +1,17 @@
|
|||
// js/modules/util.js
|
||||
// utility functions for template loading / ..
|
||||
|
||||
(function (Util) {
|
||||
|
||||
Util.loadTemplateAjax = function(path, callback) {
|
||||
$.ajax({
|
||||
url: path, //ex. js/templates/mytemplate.handlebars
|
||||
cache: true,
|
||||
success: callback
|
||||
});
|
||||
}
|
||||
|
||||
})(app.module("util"));
|
||||
|
||||
|
||||
|
5
js/templates/test.handlebars
Normal file
5
js/templates/test.handlebars
Normal file
|
@ -0,0 +1,5 @@
|
|||
<ul>
|
||||
{{#rooms}}
|
||||
<li>Id: {{roomId}} - Name: {{title}}</li>
|
||||
{{/rooms}}
|
||||
</ul>
|
Loading…
Reference in a new issue