( function() {
var ANAME = "swarm";
var app = window[ ANAME ] = window[ ANAME ] || {};
var algo = app.algo = app.algo || {};
var data = algo.data = algo.data || {};
var gui = app.gui = app.gui || {};
var dom = gui.dom = gui.dom || {};
var ccc = console.log;
var $get = function( id ) { return document.getElementById( id ); };
var $make = function( type ) { return document.createElement( type ); };
var $add = function( which, to ) { to.appendChild( which ); };
gui.init = function()
{
initScene();
initInputs();
};
function initInputs()
{
var apc = algo.getParameters();
// //\\ makes input table
var html = '
\n';
// \\// makes input table
// //\\ appends inputs
var iDiv = dom.inputDiv = $make( 'div' );
iDiv.setAttribute( 'id', ANAME + '-inputs' );
$add( iDiv, dom.root );
var toggler = $make( 'button' );
toggler.innerHTML = 'Edit';
$add( toggler, iDiv );
var tableWrap = $make( 'div' );
var istyle = tableWrap.style;
istyle.display = 'none';
$add( tableWrap, iDiv );
tableWrap.innerHTML = html;
// \\// appends inputs
// //\\ stashes access to inputs
dom.inputs = apc.map( function( line, ix ) {
var cssId = ANAME + '-input-' + ix;
return $get( cssId );
});
// \\// stashes access to inputs
// //\\ control buttons' events
function restartSimulation() {
var mp = dom.inputs.map( function( input ) {
return [ input.value ];
});
app.runner.restartSimulation( mp );
}
$get( restartCssId ).addEventListener( 'click', restartSimulation );
$get( resetCssId ).addEventListener( 'click', function() {
dom.inputs.forEach( function( input, ix ) {
input.value = data.ac[ ix ][ 0 ];
});
restartSimulation();
});
toggler.addEventListener( 'click', function() {
if( istyle.display === 'none' ) {
istyle.display = 'block';
toggler.innerHTML = "Hide";
} else {
toggler.innerHTML = "Edit";
istyle.display = 'none';
}
});
// \\// control buttons' events
}
// //\\ Main Scene
function initScene() {
var initialColors = [];
var preInitialColors = data.preInitialColors;
var gParticles = [];
function setView()
{
var rootCssId = ANAME + '-root';
dom.root = $get( rootCssId );
var scene = dom.scene = $make( 'div' );
var sceneCssId = ANAME + '-scene';
scene.setAttribute( 'id', sceneCssId );
$add( scene, dom.root );
//gui.resetParticles();
};
gui.resetParticles = function()
{
var scene = dom.scene;
var ch = scene.children;
for( var ii = 0, len = ch.length; ii < len; ii++ ) {
ch[ii].style.display = 'none';
}
data.pp.forEach( function( part, ix ) {
if( ch[ ix ] ) {
ch[ ix ].style.display = 'block';
} else {
//// adds missed particles
var div = gParticles[ ix ] = $make( 'div' );
//debug: div.setAttribute( 'id', ANAME + '-fly-' + ix );
var st = div.style;
st.position = 'absolute';
var backgroundColor = preInitialColors ? preInitialColors[ ix ] :
'rgba(' +
(Math.random() * 254 ).toFixed() + ',' +
(Math.random() * 254 ).toFixed() + ',' +
(Math.random() * 254 ).toFixed() + ', 1)';
initialColors[ ix ] = backgroundColor;
st.backgroundColor = backgroundColor;
st.width = '0.5%';
st.height = '0.5%';
scene.appendChild( div );
}
});
scene.style.perspective = gui.perspective + 'px';
//save particles:
//c cc( JSON.stringify( initialColors ) );
};
gui.drawParticles = function()
{
var xBoxMin = data.xBoxMin;
var xBoxRange = data.xBoxRange;
data.pp.forEach( function( part ) {
var div = gParticles[ part.iX ];
var st = div.style;
var pX = part.x[0];
var pY = part.x[1];
var pZ = part.x[2];
//c cc( 'or', pX, pY );
var xx = ( pX - xBoxMin ) / xBoxRange * 95;
var yy = ( pY - xBoxMin ) / xBoxRange * 95;
var zz = ( pZ - xBoxMin ) / xBoxRange * 200 + 100;
//c cc( 'css', xx, yy );
st.left = xx + '%';
st.top = yy + '%';
st.transform = "translateZ( " + zz + "px)";
});
};
setView();
}
// \\// Main Scene
}) ();