Untitled

dabblet.css

div {
    display: inline-block;
    width: 15%;
    text-align: center;
    padding: 10px;
    font-family: Arial, Verdana;
    font-size: 18px;
    margin: 3px;
    color: white;
    background: #FAFAFA;
}

div.local {
    color: green;
    background: #E5FFE5;
}
div.extern {
    color: red;
    background: #FFF5F5;
}

body {
    background: url(http://static.jsbin.com/images/logo.png) no-repeat right bottom;
    background-color: #3FA6C5;
    height: 100%;
    margin: 0px;
}
html { height: 100%; margin: 0px; }

dabblet.html

<script type="text/javascript" src="http://requirejs.org/docs/release/2.1.10/minified/require.js"></script>
<div id="prop_1">1</div>
<div id="prop_2">2</div>
<div id="prop_3">3</div>
<div id="prop_4">4</div>
<div id="prop_5">5</div>
<div id="prop_6">6</div>
<div id="prop_7">7</div>
<div id="prop_8">8</div>
<div id="prop_9">9</div>
<script>
requirejs.config({
    paths: {
        "vapaee-core": 'http://127.0.0.1/jwebdesk/js/vapaee-core',
        "vapaee-model": 'http://127.0.0.1/jwebdesk/js/vapaee-model',
        "vapaee-global": 'http://127.0.0.1/jwebdesk/js/vapaee-global'
    }
});

require(["vapaee-model/vapaee.model", "vapaee-global/vapaee.global"], function (vapaee, global) {
    console.log(global.whoami(true));
    var href = window.location.href;
    var t = href.substring(href.lastIndexOf("=")+1);
    var n = parseInt(t);
    
    var proxy = global.proxy("Proxy Test");
    proxy.on("change", function (ev_name, ev) {
        console.log(global.whoami(true), ev_name, ev.path, ev.value);
        $("#"+ev.path).addClass("extern").text(ev.value);
    });
    
    setTimeout(function () {
        var prop = "prop_"+n;
        console.log("timeout N:",n);
        proxy.set(prop, n * 2);
        $("#"+prop).attr("class", "local");
    }, 1000 * n);
    
});
</script>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"result"}