foam-framework
Version:
MVC metaprogramming framework
138 lines (105 loc) • 4.2 kB
HTML
<html>
<head>
<style type="text/css">
.bar {
color: white;
margin-left:8px;
font-family: Arial, sans-serif;
font-size: 14px;
font-style: normal;
font-variant: normal;
font-weight: normal;
}
</style>
<link rel="stylesheet" type="text/css" href="..//core/foam.css" />
<script language="javascript" src="../core/bootFOAM.js"></script>
<title>FOAM Test2</title>
</head>
<body>
<script language="javascript">
var models = [Model, Property];
var tv1 = TableView.create({model: Model});
tv1.objs = models;
document.writeln(tv1.toHTML());
tv1.init();
var dv = DetailView.create({model: Model});
document.writeln(dv.toHTML());
dv.init();
tv1.selection.addListener(function (src, property, oldValue, newValue) {
if ( newValue )
dv.set(tv1.selection.get().clone());
});
// Events.follow(tv1.selection, dv);
// dv.setModel(tv1.selection);
document.writeln(Model);
document.writeln(Model.getPrototype());
document.writeln(Model.getPrototype().create());
var o = Model.create({ name: 'User', label: 'User' });
document.writeln("ModelObj: " + o);
document.writeln("Model: " + o.model_);
document.writeln("Model.name: " + o.name_);
document.writeln("</br><h2>Test Events</h2>");
var l = function(obj, property, oldValue, newValue) {
document.writeln("obj: " + obj + " property: " + property+ " oldValue: " + oldValue+ " newValue: " + newValue);
}
var pm = o.propertyValue('name');
document.writeln(pm + " val: " + pm.get());
// pm.addListener(function() {document.writeln("name updated via property model")});
// o.addListener(l);
// o.addPropertyListener('name', l);
// o.addPropertyListener('label',l);
pm.set("foo");
pm.set("bar");
o.name = 'Group';
o.label = 'Group'
// l("foo","bar","old", "new");
o.globalChange();
document.writeln(o);
var sm = SimpleValue.create("foo");
sm.addPropertyListener(l);
document.writeln(sm.get());
sm.set("bar");
document.writeln(sm.get());
document.writeln("</br><h2>Test New Events</h2>");
var e = { __proto__: PropertyChangeSupport };
e.subscribe(['property','lname'], l);
e.subscribe(['property','age'], l);
e.subscribe(['property'], function (source,topic) { document.writeln("property: " + topic); });
e.subscribe([], function (source,topic) { document.writeln("global: " + topic); });
e.subscribe([], e.oneTime(function (source,topic) { document.writeln("one-time: " + topic); }));
// document.writeln("subs: " + e.publishAsync(['property','age'], "************async***********", "*********async********"));
document.writeln("subs: " + e.publish(['property','age'], "old", "new"));
document.writeln("subs: " + e.publish(['property','lname'], "old", "new"));
document.writeln("subs: " + e.publish(['property','company'], "old", "new"));
document.writeln("subs: " + e.publish(['on','focus'], "old", "new"));
e.publish(['property','*'], "old", "new");
e.publish(['property','*'], "old", "new");
e.propertyChange('age', 10, 11);
/*
e.subscribe(['test'], function (source,topic) { document.writeln("normal: " + topic); });
e.subscribe(['test'], e.async(function (source,topic) { document.writeln("async: " + topic); }));
e.subscribe(['test'], e.merged(function (source,topic) { document.writeln("merged: " + topic); }));
e.publish(['test'], "foo", "bar");
e.publish(['test'], "foo", "bar");
e.publish(['test'], "foo", "bar");
e.publish(['test'], "foo", "bar");
e.publish(['test'], "foo", "bar");
e.publish(['test'], "foo", "bar");
*/
example = $('view');
var v1 = TextFieldView.create();
var v2 = TextFieldView.create();
var v3 = ProgressView.create();
document.writeln("<br/>");
document.writeln(v1.toHTML());
v1.init();
document.writeln(v2.toHTML());
v2.init();
document.writeln(v3.toHTML());
v3.init();
v2.setValue(v1.value);
v3.setValue(v1.value);
document.writeln("<br/>subs: " + e.subs_);
</script>
</body>
</html>