foam-framework
Version:
MVC metaprogramming framework
184 lines (162 loc) • 6.01 kB
HTML
<html>
<head>
<link rel="stylesheet" type="text/css" href="..//core/foam.css" />
<script language="javascript" src="../core/bootFOAM.js"></script>
<script language="javascript" src="demos.js"></script>
<title>Google Simulator</title>
</head>
<body>
<table><tr><td>
<script language="javascript">
var timer;
var turnFOAM;
apar(
arequire('Canvas'),
arequire('Developer'),
arequire('System'),
arequire('foam.util.Timer'),
arequire('foam.ui.DetailView'),
arequire('foam.ui.View')
)(function() {
timer = foam.util.Timer.create({interval:20});
var space = Canvas.create({width: 1000, height: 750, background:'#fff'});
// timer.write();
space.write();
var oldAddCode = System.getPrototype().addCode;
System.getPrototype().addCode = function() { };
var sys = [System.create({
parent: space,
title: 'Google',
devColor: 'google',
numDev: 2,
y:0,
features: ['search'],
entities: ['web pages'],
})];
sys[0].architecture = System.getPrototype().mixed;
// sys[0].architecture = System.getPrototype().foam;
Events.dynamic(function () {
//timer.second;
timer.time;
},
function () {
for (var i = 0 ; i < sys.length ; i++ ) sys[i].tick(timer);
space.paint();
});
// space.paint();
timer.start();
function addEntity(title) {
sys[0].entities.push(title);
space.$.height += 50;
space.height += 50;
for (var i = 0 ; i < sys.length ; i++ ) sys[i].height += 50;
}
function addFeature(title) {
sys[0].features.push(title);
space.$.width += 50;
space.width += 50;
for (var i = 0 ; i < sys.length ; i++ ) sys[i].width += 50;
}
function addPlatform(title) {
var i = sys.length+1;
var s = System.create({
parent: space,
title: title,
devColor: sys[0].devColor,
numDev: sys[0].numDev,
x: i*25,
y: 0,
width: sys[0].width-40,
height: sys[0].height-30,
features: sys[0].features,
entities: sys[0].entities
});
s.architecture = sys[0].architecture;
sys[0].height -= 30;
for ( var j = 0 ; j < sys.length ; j++ ) {
sys[j].y += 30;
sys[j].width -= 30;
sys[j].height = sys[0].height;
}
sys.push(s);
space.children.unshift(space.children.pop());
}
/*
space.paint = function() {
this.canvas.globalAlpha = 0.2;
Canvas.getPrototype().paint.call(this);
}
*/
var g;
var l;
function addGraph() {
System.getPrototype().addCode = oldAddCode;
g = Graph.create({graphColor: 'red', x:810, y:550, width: 100, height: 100});
l = Label.create({x:g.x+50, y: g.y+180, font: '22pt Arial'});
space.addChildren(g,l);
Events.dynamic(function() { timer.second; }, function() {
var d = (sys[0].totalUtility() / sys[0].totalCode);
g.addData(d, 6000);
l.text = d;
// timer.second; g.addData(sys[0].totalUtility()/sys[0].totalCode);
});
}
function turnBlue() {
sys.forEach(function(sys) { sys.devs.forEach(function(dev) { dev.color = 'blue'; }); });
}
/*
function turnRed(n) {
sys[0].devs.forEach(function(dev) { if (n-- >0) dev.color = 'red'; });
}
*/
turnFOAM = function() {
sys.forEach(function(sys) { sys.architecture = System.getPrototype().foam; });
};
space.$.addEventListener('click', turnFOAM);
function grow() {
var M = Movement;
var s = sys[0];
// Events.dynamic(function() { timer.second; s.numDev = s.features.length * s.entities.length + 1; });
Events.dynamic(function() { timer.second; for ( var i = 0 ; i < sys.length ; i++ ) sys[i].numDev = s.features.length * s.entities.length *2; });
M.compile([
[8000],
function() { s.features.push('Ads'); },
[4000],
function() { s.entities.push('Images'); },
[1000], function() { s.entities.push('Maps'); },
[1000], function() { s.entities.push('Mail'); s.features.push('Storage'); },
[1000], function() { s.entities.push('Contacts'); addPlatform('Mobile'); s.title = 'Desktop'; },
[1000], function() { s.features.push('Print'); addPlatform('Mac'); },
[1000], function() { s.entities.push('Calendar'); addPlatform('iPhone');},
[1000], function() { s.entities.push('Groups'); },
[1000], function() { s.entities.push('News'); },
[1000], function() { s.entities.push('ToDo'); addPlatform('Android');},
[1000], function() { s.entities.push('Photos'); },
[1000], function() { s.entities.push('Video'); },
[1000], function() { s.features.push('Rating'); },
[1000], function() { s.features.push('Discussion'); addPlatform('Chrome');},
[1000], function() { s.features.push('Translate'); },
[1000], function() { s.entities.push('Books'); },
[1000], function() { s.entities.push('Docs'); s.features.push('Sort'); },
[1000], function() { s.entities.push('Chat'); },
[1000], function() { s.entities.push('Music'); },
[1000], function() { s.features.push('Sharing'); },
[1000], function() { s.features.push('Offline'); },
[1000], function() { s.features.push('Sync'); },
[1000], function() { s.entities.push('Bookmarks'); },
[1000], function() { s.entities.push('Presentations'); },
[1000], function() { s.entities.push('Spreadsheets'); },
[1000], function() { s.entities.push('Blogs'); addPlatform("Glass"); },
[1000], function() { s.entities.push('Sites'); },
[1000], function() { s.features.push('Drive'); },
[1000], function() { s.features.push('+'); s.entities.push('Circles'); },
[1000], function() { s.entities.push('Flights'); },
[1000], function() { s.entities.push('Apps'); addPlatform("Android Wear");},
])();
}
grow();
});
</script>
</td><tr></table>
</body>
</html>