Index: js/viewer-f0/js/Viewer.js
===================================================================
--- js/viewer-f0/js/Viewer.js	(revision 193)
+++ js/viewer-f0/js/Viewer.js	(revision 208)
@@ -12,5 +12,5 @@
     this._neuronsContext = undefined;
     this._context = undefined;
-    this._urlToXML = "http://www.framsticks.com/files/apps/config/f0def.xml";
+    this._urlToXML = 'f0def.xml';//"http://www.framsticks.com/files/apps/config/f0def.xml";
     this._xml = undefined;
     this._model = new Model();
@@ -29,15 +29,14 @@
     this.downloadXML();
     this.parseGeneXml();
-}
-
-Viewer.prototype.showVisualization = function(value, context){
-    this._showVisualization = value;
-    this._visualizationContext = context;
-}
-
-Viewer.prototype.showNeuron = function(value, context)
-{
-     this._showNeurons = true;
-     this._neuronsContext = context;
+    this.VisualizationSettings = {
+        context: undefined,
+        width: undefined,
+        height: undefined
+    };
+    this.NetworkSettings = {
+        context: undefined,
+        width: undefined,
+        height: undefined
+    };
 }
 
@@ -165,5 +164,4 @@
 };
 
-
 Viewer.prototype._getCreatureFromLink = function (link) {
     var lines = undefined;
@@ -239,22 +237,9 @@
 };
 
-Viewer.prototype.mainLoop = function () {
-    this._graphicsEngine.initializeScene();
-    this.renderCreature();
-    this._graphicsEngine.debugTest();
-    this._graphicsEngine.renderScene();
-
-    this._neuronDrawer.initializeScene();
-    new SmartLayout(this._neurons, this._neuroConns);
-    this._neuronDrawer.drawNetwork(this._neurons, this._neuroConns, einfos, this._neuroClasses);
-    this._neuronDrawer.renderScene();
-
-};
-
 Viewer.prototype.run = function (mode, content) {
     this.parseCreature(mode, content);
 
-    if (this._showVisualization) {
-        this._graphicsEngine = new GraphicsEngine(this._visualizationContext)
+    if (this.VisualizationSettings.context) {
+        this._graphicsEngine = new GraphicsEngine(this.VisualizationSettings.context, this.VisualizationSettings.width, this.VisualizationSettings.height);
         this._graphicsEngine.initializeScene();
         this.renderCreature();
@@ -262,10 +247,16 @@
         this._graphicsEngine.renderScene();
     }
-    if (this._showNeurons) {
-        this._neuronDrawer = new NeuronDrawer(this._neuronsContext);
+    if (this.NetworkSettings.context) {
+        this._neuronDrawer = new NeuronDrawer(this.NetworkSettings.context, this.NetworkSettings.width, this.NetworkSettings.height );
+        this._neuronDrawer.initializeNewCanvas();
+        new SmartLayout(this._neurons, this._neuroConns);
+        this._neuronDrawer.drawNeuralNetwork(this._neurons, this._neuroConns, einfos, this._neuroClasses);
+        this._neuronDrawer.finalize();
+
+        /*this._neuronDrawer = new NeuronDrawer(this._neuronsContext);
         this._neuronDrawer.initializeScene();
         new SmartLayout(this._neurons, this._neuroConns);
-        this._neuronDrawer.drawNetwork(this._neurons, this._neuroConns, einfos, this._neuroClasses);
-        this._neuronDrawer.renderScene();
+        this._neuronDrawer.drawNeuralNetwork(this._neurons, this._neuroConns, einfos, this._neuroClasses);
+        this._neuronDrawer.renderScene();*/
     }
 }
@@ -274,6 +265,11 @@
     var viewer = new Viewer();
 
-    viewer.showVisualization(true, $("#container"));
-    viewer.showNeuron(true, $("#containerNeuron"));
+    viewer.VisualizationSettings.context = $("#container");
+    viewer.VisualizationSettings.width = 400;
+    viewer.VisualizationSettings.height = 400;
+
+    viewer.NetworkSettings.context =  "containerNeuron";
+    viewer.NetworkSettings.width = 400;
+    viewer.NetworkSettings.height = 400;
     viewer.run(viewer.Mode.TEXTAREA, $("#geno"));
 }
@@ -281,6 +277,11 @@
 function openEmbeddedCreature() {
     var viewer = new Viewer();
-    viewer.showVisualization(true, $("#container1"));
-    viewer.showNeuron(true, $("#containerNeuron1"));
+    viewer.VisualizationSettings.context = $("#container1");
+    viewer.VisualizationSettings.width = 400;
+    viewer.VisualizationSettings.height = 400;
+
+    viewer.NetworkSettings.context =  "containerNeuron1";
+    viewer.NetworkSettings.width = 400;
+    viewer.NetworkSettings.height = 400;
     viewer.run(viewer.Mode.EMBEDDED, "http://ec.framsticks.com/www/index.php?PAGE=view_genotype&ID=55");
 }
@@ -288,7 +289,10 @@
 function openCodeCreature() {
     var viewer = new Viewer();
-
-    viewer.showVisualization(true, $("#container2"));
-    viewer.showNeuron(true, $("#containerNeuron2"));
+    viewer.VisualizationSettings.context = $("#container2");
+    viewer.VisualizationSettings.width = 400;
+    viewer.VisualizationSettings.height = 400;
+    viewer.NetworkSettings.context =  "containerNeuron2";
+    viewer.NetworkSettings.width = 400;
+    viewer.NetworkSettings.height = 400;
     viewer.run(viewer.Mode.CODE, "//0\np:\np: x=1");
 }
@@ -296,8 +300,13 @@
 function openFileCreature() {
     var viewer = new Viewer();
-
-    var debugCreatureName = "example4";
-    viewer.showVisualization(true, $("#container3"));
-    viewer.showNeuron(true, $("#containerNeuron3"));
+    //var debugCreatureName = "example4";
+    //var debugCreatureName = "caterpillar";
+    var debugCreatureName = "Quadro";
+    //viewer.VisualizationSettings.context = $("#container3");
+    //viewer.VisualizationSettings.width = 400;
+    //viewer.VisualizationSettings.height = 400;
+    viewer.NetworkSettings.context =  "containerNeuron3";
+    viewer.NetworkSettings.width = 400;
+    viewer.NetworkSettings.height = 400;
     viewer.run(viewer.Mode.LINK, "http://localhost:63343/FramestickFavi/creatures/" + debugCreatureName + ".txt");
 }
