Backbone view

Movie View

var MovieView = Backbone.View.extend({
  listTemplate: _.template($("#movieTemplate").html()),
  editTemplate: _.template($("#movieEditTemplate").html()),
  initialize: function() {
    this.model.on('change', this.render, this);
    this.model.on('destroy', this.remove, this);
    this.model.on('error', this.invalid, this);
  },
  render: function() {
    this.$el.html(this.listTemplate(this.model.toJSON()));
    return this;
  },
  events: { 
    'dblclick span.title': 'editSelf',
    'click a.delete': 'destroySelf',
    'click span.favorite': 'toggleFavorite',
    'click span.non-favorite': 'toggleFavorite',
    'click a.btn-primary': 'saveButton',
    'click a.cancel': 'cancelButton',
    'keypress input[type=text].title': 'saveEnter'
  },
  editSelf: function() {
    this.$el.html(this.editTemplate(this.model.toJSON()));
    this.$('input.title').focus();
    return this;
  },
  toggleFavorite: function() {
    this.model.toggleFavorite();
  },
  invalid: function() {
    $('input.title').css('background-color', 'red');
  },
  saveEnter: function(e) {
    if(e.keyCode == 13) {
      this.saveButton();
    }
  },
  saveButton: function() {
    this.model.set({title: this.$('input.title').val()});
    this.render();
  },
  cancelButton: function() {
    this.render();
  },
  destroySelf: function() {
    this.model.destroy,
    this.remove()
  }
});