timestamper/www/js/test.js
2011-04-20 09:40:54 -05:00

132 lines
3.6 KiB
JavaScript

var Test = {};
$(document).ready(function() {
Test.U = Backbone.Model.extend({
url: '/ts_api/users',
initialize: function() {
this.timelines = {};
}
});
Test.E = Backbone.Model.extend({
url: '/ts_api/entries/jdbernard/work'
});
Test.UView = Backbone.View.extend({
el: $("#user"),
model: Test.U,
initialize: function() {
_.bindAll(this, 'render');
this.model.bind('change', this.render);
this.model.view = this;
},
render: function() {
this.$('.fullname').text(this.model.get('name'));
this.$('.username').text(this.model.get('id'));
}
});
Test.EList = Backbone.Collection.extend({
model: Test.E,
url: '/ts_api/entries/jdbernard/work',
initalize: function(models, options) {
this.user = options.user;
},
comparator: function(entry) {
return entry.get('timestamp');
}
});
Test.EView = Backbone.View.extend({
model: Test.E,
initialize: function() {
_.bindAll(this, 'render');
this.model.bind('change', this.render);
this.model.view = this;
},
render: function() {
$(this.el).html("<span class='entry-id'>" + this.model.get('id') + "<span class='mark'>" + this.model.get('mark') + "</span>");
return this;
}
});
Test.EListView = Backbone.View.extend({
el: $("#entry-list"),
initialize: function() {
_.bindAll(this, 'render', 'refresh', 'addOne');
this.collection.bind('add', this.addOne);
this.collection.bind('refresh', this.refresh);
},
addOne: function(entry) {
var view = new Test.EView({model: entry});
$(this.el).append(view.render().el);
},
refresh: function() {
$(this.el).empty();
var thisRef = this;
this.collection.each(function(entry) {thisRef.addOne(entry)});
}
});
Test.currentUser = new Test.U;
Test.userView = new Test.UView({model: Test.currentUser});
// wire the login dialog using jQuery UI
$("#login-dialog").dialog({
autoOpen: false,
height: 400,
width: 400,
modal: true,
buttons: { Login: function(){login()} }
});
$('#login-dialog').dialog('open');
});
function login() {
// lookup the login dialog elements
var name = $("#login-name");
var pwd = $("#login-password");
// call the API via AJAX
$.ajax({
url: "/ts_api/login",
processData: false,
data: JSON.stringify({username: name.val(), password: pwd.val()}),
type: "POST",
error: function(jqXHR, textStatus, error) {
// assuming bad credentials (possible server error or bad request,
// we should check that, FIXME
var tips = $(".validate-tips");
tips.text("Incorrect username/password combination.");
tips.addClass("ui-state-error");
tips.slideDown();
},
success: function(data, textStatus, jqXHR) {
$("#login-dialog").dialog('close');
Test.currentUser.set({id: name.val()}, {silent: true});
Test.currentUser.fetch();
Test.currentEntryList = Test.currentUser.timelines['work'] = new Test.EList([], {user: Test.currentUser});
new Test.EListView({collection: Test.currentEntryList});
Test.currentEntryList.fetch();
}});
}