Combining VBClass with Knockout

by andrewdavey

HTML

<script src="http://vbclass.googlecode.com/svn/trunk/min/VBClass.loader.js"></script>
<script src="https://github.com/SteveSanderson/knockout/raw/master/build/output/knockout-latest.js"></script>
<input type="text" data-bind="value: x"/> + 
<input type="text" data-bind="value: y"/> = 
<span data-bind="text: sum"/>

<p data-bind="text: foo"></p>

JavaScript

VBClass("Test", {
    x_: { value: ko.observable(0) },
    x: {
        get: function() { return this.x_(); },
        set: function(value) { this.x_(value); }
    },
    y_: { value: ko.observable(0) },
    y: {
        get: function() { return this.y_(); },
        set: function(value) { this.y_(value); }
    },
    
    constructor: { value: function() {
     this.sum = ko.dependentObservable(function() {
            return parseInt(this.x,10) + parseInt(this.y,10);
        }, this);
    } }
});

var test = new Test();
test.x = 42;
test.y = 31;
test.x++;


var more = {};
more.__proto__ = test;
more.x = 100;
more.foo = 1;
ko.applyBindings(more);