// load the application once the DOM is ready
$(function(){
// -- Question Collection (History)
var questionHistory = new(Backbone.Collection.extend({
model: Question, // a collection of question Model objects
initialize: function() {
this.records = this.localStorage.records;
this.bind('add', function() {
console.dir( this.localStorage.findAll() );
console.log( this.localStorage );
}, this);
},
localStorage: new Store( 'questionHistory' ), // our localStorage object reference
// grab the current question object or the nth order question in the queue
getCurrent: function( order ) {
if ( order ) {
return this.localStorage.findAll()[ order - 1 ];
} else {
var allQuestions = this.localStorage.findAll();
return ( this.current ) ? this.current : allQuestions[ allQuestions.length - 1 ];
}
},
// get the next order number in the collection history
nextOrder: function() {
if (!this.records.length) return 0;
return this.records.length;
},
// get the previous question model to the current question in the collection
previous: function( question ) {
this.current = this.localStorage.findAll()[ question.order - 1 ];
return this.current;
}
}));
// -- Question Model
var Question = new Backbone.Model.extend({
// default attributes for a question content item
defaults: function() {
return {
text : '',
order : questionHistory.nextOrder()
};
}
});
// -- Editor View
var EditorView = new(Backbone.View.extend({
el: $("#questionEditor"), // common practice to tie a Backbone.View to an el (how the widget comes together)
collection: questionHistory, // tie in our collection for reference
//
template: function(data) {
return Mustache.render($('#question-template').html(), data);
},
//
events: {
'click .store-question' : 'storeQuestion',
'keyup #editor-input' : 'showTooltip',
'click .previous-question' : 'renderPrevious'
},
//
initialize: function() {
this.input = this.$("#editor-input");
this.collection.bind('add', this.renderCurrent, this);
},
renderCurrent: function( order ) { //console.log('Backbone.View.renderCurrent()');
if( $.type(order) === 'string' ) {
var currentQuestion = questionHistory.getCurrent( order );
} else {
var currentQuestion = questionHistory.getCurrent();
}
$('#questionContent').html( this.template( currentQuestion ) );
},
renderPrevious: function() { //console.log('renderPrevious()');
var currentQuestion = questionHistory.getCurrent();
var previousQuestion = questionHistory.previous( currentQuestion );
$('#questionContent').html( this.template( previousQuestion ) );
},
//
storeQuestion: function() { //console.log('Backbone.View.storeQuestion()');
var text = this.input.val();
if ( !text ) return;
questionHistory.create({
text : text,
order : questionHistory.nextOrder()
});
},
//
showTooltip: function(e) {
/*
var tooltip = $(".ui-tooltip-top");
var val = this.input.val();
tooltip.fadeOut();
if (this.tooltipTimeout) {
clearTimeout(this.tooltipTimeout);
}
if (val == '' || val == this.input.attr('placeholder')) return;
var show = function() {
tooltip.show().fadeIn();
};
this.tooltipTimeout = _.delay(show, 1000);
*/
}
}));
// -- Editor Router
var EditorRouter = new(Backbone.Router.extend({
routes: {
'editor' : 'editor', // #editor // event: 'route:editor'
'editor/v:version' : 'editor' // #editor/v7 // event: 'route:editor'
},
// /editor and /editor/v# routes call render in the view
editor: function( version ) {
EditorView.renderCurrent( version );
}
}));
// start monitoring hashchange events & dispatching routes
Backbone.history.start();
});