View inheritance tests

playing around with inheriting views http://stackoverflow.com/questions/9405828/backbone-view-inheritance

by Sander Houttekier

HTML

<script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.2.1/underscore-min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.5.3/backbone-min.js"></script>
<script src="https://raw.github.com/derickbailey/backbone.modelbinding/master/backbone.modelbinding.min.js"></script>
<script src="https://raw.github.com/derickbailey/backbone.memento/master/backbone.memento.min.js"></script>

JavaScript

var myView = Backbone.View.extend({
    foo: "bar"
});

var mySecondView = myView.extend({
    foobar: "f00b@r"
});

var myViewInstance = new myView();
var mySecondViewInstance = new mySecondView();

console.log("myViewInstance.foo: ", myViewInstance.foo);
console.log("myViewInstance.foobar: ", myViewInstance.foobar);
console.log("mySecondViewInstance.foo: ", mySecondViewInstance.foo);
console.log("mySecondViewInstance.foobar: ", mySecondViewInstance.foobar);


myViewInstance.foo = "changed-foo";
mySecondViewInstance.foobar = "changed-foobar";


console.log("myViewInstance.foo: ", myViewInstance.foo);
console.log("myViewInstance.foobar: ", myViewInstance.foobar);
console.log("mySecondViewInstance.foo: ", mySecondViewInstance.foo);
console.log("mySecondViewInstance.foobar: ", mySecondViewInstance.foobar);