Index: /js/viewer-f0/css/styles.css
===================================================================
--- /js/viewer-f0/css/styles.css	(revision 142)
+++ /js/viewer-f0/css/styles.css	(revision 143)
@@ -2,9 +2,9 @@
     display: inline;
     position: fixed;
-    left: 560px;
+    left: 1050px;
 }
 
 
-#container{
+.cont{
     height: 500px;
     width: 500px;
Index: /js/viewer-f0/index.html
===================================================================
--- /js/viewer-f0/index.html	(revision 142)
+++ /js/viewer-f0/index.html	(revision 143)
@@ -15,10 +15,13 @@
 <script src="js/Structures/NeuroConn.js"></script>
 <script src="js/graphicsEngine.js"></script>
+<script src="js/NeuronDrawer.js"></script>
+<script src="js/SmartLayout.js"></script>
+<script src="js/Structures/NeuroClass.js"></script>
 <script src="js/main.js"></script>
 
 
+<div class="cont" id="container"></div>
+<div class="cont" id="containerNeuron"></div>
 
-
-<div id="container"></div>
 <div id="menu">
     <textarea id="geno">//0&#13;&#10;p:</textarea>
Index: /js/viewer-f0/js/Block.js
===================================================================
--- /js/viewer-f0/js/Block.js	(revision 143)
+++ /js/viewer-f0/js/Block.js	(revision 143)
@@ -0,0 +1,51 @@
+function Block(number){
+    this.id = number;
+    this.elements = [];
+    this.w = 1;
+    this.h = 1;
+    this.minx = 0;
+    this.miny = 0;
+    this.maxx = 0;
+    this.maxy = 0;
+    blocks[this.id] = this;
+
+    this.map = [];
+}
+
+Block.prototype.freeMap = function(){
+    if(this.map)
+        this.map = null;
+}
+
+Block.prototype.needMap = function(){
+    if(this.map)
+        return;
+    this.createMap();
+
+}
+
+Block.prototype.createMap = function(){
+    this.freeMap();
+    this.w = this.maxx - this.minx + 1;
+    this.h = this.maxy - this.miny + 1;
+    for(var i = 0; i < w*h; i++)
+        this.map.push(0);
+
+    for (var i = 0; i < this.elements.size(); i++)
+    {
+        var e = this.elements[i];
+        this.map[this.w*(einfos[e].y - this.miny) + (einfos[e].x - this.minx)] = 1;
+    }
+
+
+}
+
+Block.prototype.destroy = function()
+{
+    blocks[this.id] = 0;
+    this.freeMap();
+}
+
+Block.prototype.addElement = function(number, x, y){
+
+}
Index: /js/viewer-f0/js/NeuronDrawer.js
===================================================================
--- /js/viewer-f0/js/NeuronDrawer.js	(revision 143)
+++ /js/viewer-f0/js/NeuronDrawer.js	(revision 143)
@@ -0,0 +1,259 @@
+function NeuronDrawer() {
+    this._scene = undefined;
+    this._camera = undefined;
+    this._renderer = undefined;
+    this._canvasWidth = 500;
+    this._canvasHeight = 500;
+    this._containerContext = undefined;
+    this._controls = undefined;
+    this._showAxis = false;
+}
+
+NeuronDrawer.prototype.showPartAxis = function () {
+    this._showAxis = true;
+}
+
+NeuronDrawer.prototype._createRenderer = function () {
+    this._renderer = new THREE.CanvasRenderer();//WebGLRenderer({antialias: true});
+    this._renderer.setClearColor(0xffffff, 1);
+    this._renderer.setSize(this._canvasWidth, this._canvasHeight);
+    this._containerContext = $("#containerNeuron");
+    this._containerContext.append(this._renderer.domElement);
+}
+
+NeuronDrawer.prototype._prepareCamera = function () {
+    this._camera = new THREE.PerspectiveCamera(45, this._canvasWidth / this._canvasHeight, 1, 4000);
+    this._camera.position.set(0, 0, 10);
+    this._camera.lookAt(this._scene.position);
+    this._scene.add(this._camera);
+}
+
+NeuronDrawer.prototype._addLight = function () {
+    var directionalLight = new THREE.DirectionalLight(0xffffff);
+
+    directionalLight.position = this._camera.position;
+    directionalLight.intensity = 1;
+
+    this._scene.add(directionalLight);
+}
+
+NeuronDrawer.prototype.initializeScene = function () {
+
+    this._createRenderer();
+    this._scene = new THREE.Scene();
+    this._prepareCamera();
+    this._addLight();
+    this._controls = new THREE.TrackballControls(this._camera, this._renderer.domElement)
+    this._debug();
+}
+
+NeuronDrawer.prototype.renderScene = function () {
+
+    var self = this;
+    requestAnimationFrame(
+        function () {
+            self.renderScene();
+        });
+    this._renderer.render(this._scene, this._camera);
+    this._controls.update();
+
+}
+
+NeuronDrawer.prototype._debug = function()
+{
+    this._scene.add( new THREE.AxisHelper( 20 ) );
+}
+
+NeuronDrawer.prototype.drawNeuron = function(x, y){
+    var scheme = [4,4,26,27,26,73,73,73,73,27,26,27,1,73,50,100,50,1,56,68,46,68,2,41,47,51,32,51,68];
+    //pobieranie schematu
+    //inne określenie położeń
+
+
+    var obj = new THREE.Object3D();
+
+    var material = new THREE.LineBasicMaterial({
+        color: 0x0000ff
+    });
+    var position = 0;
+    var noOfBlocks = 0;//number of "blocks" to draw
+    var noOfLines = 0;//number of line to draw
+    noOfBlocks = scheme[position++];
+    for (var i = 0; i < noOfBlocks; i++)
+    {
+        noOfLines = scheme[position++];
+
+        for (var j = 0; j < noOfLines; j++)
+        {
+            var geometry = new THREE.Geometry();
+            geometry.vertices.push(new THREE.Vector3(scheme[position++] + x, scheme[position++] + y, 0));
+            geometry.vertices.push(new THREE.Vector3(scheme[position++] + x, scheme[position++] + y, 0));
+            position = position - 2; //get to last point in list
+            var line = new THREE.Line(geometry, material);
+            obj.add(line);
+        }
+        position = position + 2;//move to value which define number of lines to draw
+    }
+
+    var SCALE = 0.05;
+
+    obj.scale.set(SCALE, SCALE,SCALE);
+    obj.rotateX(Math.PI);//rotate 180 degree
+    obj.translateY(-5.5);
+    this._scene.add(obj)
+
+}
+
+
+
+NeuronDrawer.prototype.drawConnection = function(id, connections, einfos){
+
+    var destination = connections[id].getDestination();
+    var numberOfConnToDest = 0;
+    var numberOfDrawenCon = 0;
+
+    //check how many conenctions have the same destination
+    for(var i = 0; i < connections.length; i++){
+        if(connections[i].getDestination() == destination)
+            numberOfConnToDest++;
+    }
+
+    //check how many connections had been drawen
+    for(var i = 0; i < id; i++){
+        if(connections[i].getDestination() == destination)
+            numberOfDrawenCon++;
+    }
+
+    var positionY = (numberOfDrawenCon + 1) * 100 / (numberOfConnToDest + 1);
+    var positionX = (numberOfDrawenCon + 1) * 10 / (numberOfConnToDest + 1);
+
+    var x1 = einfos[connections[id].getDestination()].x;
+    var y1 = einfos[connections[id].getDestination()].y;
+
+    var x2 = einfos[connections[id].getSource()].x;
+    var y2 = einfos[connections[id].getSource()].y;
+
+    var material = new THREE.LineBasicMaterial({
+        color: 0x0000ff
+    });
+
+    var SCALE = 0.05;
+
+    var geometry = new THREE.Geometry();
+    geometry.vertices.push(new THREE.Vector3(100 + x2 * 100, 10 + 50 + y2 * 100, 0));
+    geometry.vertices.push(new THREE.Vector3(10 + 100 + x2 * 100 , 10 + 50 + y2 * 100, 0));
+    var line = new THREE.Line(geometry, material);
+    line.scale.set(SCALE, SCALE, SCALE);
+    this._scene.add(line);
+
+    var geometry1 = new THREE.Geometry();
+    geometry1.vertices.push(new THREE.Vector3(10 + positionX + x1 * 100, 10 + positionY + y1 * 100, 0));
+    geometry1.vertices.push(new THREE.Vector3(10 + 25 + x1 * 100, 10 + positionY + y1 * 100, 0));
+    var line1 = new THREE.Line(geometry1, material);
+
+    line1.scale.set(SCALE, SCALE, SCALE);
+    this._scene.add(line1);
+
+    //bezposredni poprzednik - to koniec :)
+    if (x1 == x2 + 1)//kazdy polozony w kolumnie po lewej ma jedna ukosna linie
+    {
+        var geometry = new THREE.Geometry();
+        geometry.vertices.push(new THREE.Vector3(10 + positionX + (x1 * 100), 10 + positionY + y1 * 100, 0));
+        geometry.vertices.push(new THREE.Vector3(110 + x2 * 100, 10 + 50 + y2 * 100, 0));
+        var line = new THREE.Line(geometry, material);
+        line.scale.set(SCALE, SCALE, SCALE);
+        this._scene.add(line);
+        return;
+    }
+
+    //pierwszy pionowy
+    if (y1 >= y2)
+    {
+        var geometry = new THREE.Geometry();
+        geometry.vertices.push(new THREE.Vector3(110 + (x2 * 100), 60 + y2 * 100, 0));
+        geometry.vertices.push(new THREE.Vector3(110 + (x2 * 100), 105 + y2 * 100, 0));
+        var line = new THREE.Line(geometry, material);
+        line.scale.set(SCALE, SCALE, SCALE);
+        this._scene.add(line);
+        return;
+    }
+
+    else
+    {
+        var geometry = new THREE.Geometry();
+        geometry.vertices.push(new THREE.Vector3(110 + (x2 * 100), 60 + y2 * 100, 0));
+        geometry.vertices.push(new THREE.Vector3(110 + (x2 * 100), 15 + y2 * 100, 0));
+        var line = new THREE.Line(geometry, material);
+        line.scale.set(SCALE, SCALE, SCALE);
+        this._scene.add(line);
+        return;
+    }
+
+
+    //poziomy
+    if (y1 >= y2)
+    {
+        var geometry = new THREE.Geometry();
+        geometry.vertices.push(new THREE.Vector3(110 + (x2 * 100), 105 + y2 * 100, 0));
+        geometry.vertices.push(new THREE.Vector3(10 + positionX + (x1 * 100), 105 + y2 * 100, 0));
+        var line = new THREE.Line(geometry, material);
+        line.scale.set(SCALE, SCALE, SCALE);
+        this._scene.add(line);
+        return;
+        //g.drawLine((int) ((110 + (x2 * 100)) * zoom), (int) ((105 + y2 * 100) * zoom), (int) ((10 + polozenieX + (x1 * 100)) * zoom), (int) ((105 + y2 * 100) * zoom));
+    }
+
+    else
+    {
+        var geometry = new THREE.Geometry();
+        geometry.vertices.push(new THREE.Vector3(110 + (x2 * 100), 15 + y2 * 100, 0));
+        geometry.vertices.push(new THREE.Vector3(10 + positionX + (x1 * 100), 15 + y2 * 100, 0));
+        var line = new THREE.Line(geometry, material);
+        line.scale.set(SCALE, SCALE, SCALE);
+        this._scene.add(line);
+        return;
+        //g.drawLine((int) ((110 + (x2 * 100)) * zoom), (int) ((15 + y2 * 100) * zoom), (int) ((10 + polozenieX + (x1 * 100)) * zoom), (int) ((15 + y2 * 100) * zoom));
+    }
+
+
+    //drugi pionowy
+    if (y1 >= y2)
+    {
+        var geometry = new THREE.Geometry();
+        geometry.vertices.push(new THREE.Vector3(10 + positionX + (x1 * 100), 10 + positionY + y1 * 100, 0));
+        geometry.vertices.push(new THREE.Vector3(10 + positionX + (x1 * 100), 105 + y2 * 100, 0));
+        var line = new THREE.Line(geometry, material);
+        line.scale.set(SCALE, SCALE, SCALE);
+        this._scene.add(line);
+        return;
+        //g.drawLine((int) ((10 + polozenieX + (x1 * 100)) * zoom), (int) ((10 + polozenieY + y1 * 100) * zoom), (int) ((10 + polozenieX + (x1 * 100)) * zoom), (int) ((105 + y2 * 100) * zoom));
+    }
+    else
+    {
+        var geometry = new THREE.Geometry();
+        geometry.vertices.push(new THREE.Vector3(10 + positionX + (x1 * 100), 10 + positionY + y1 * 100, 0));
+        geometry.vertices.push(new THREE.Vector3(10 + positionX + (x1 * 100), 15 + y2 * 100, 0));
+        var line = new THREE.Line(geometry, material);
+        line.scale.set(SCALE, SCALE, SCALE);
+        this._scene.add(line);
+        return;
+        //g.drawLine((int) ((10 + polozenieX + (x1 * 100)) * zoom), (int) ((10 + polozenieY + y1 * 100) * zoom), (int) ((10 + polozenieX + (x1 * 100)) * zoom), (int) ((15 + y2 * 100) * zoom));
+    }
+
+}
+
+NeuronDrawer.prototype.drawNetwork = function(neurons, connections, layouts){
+
+    for(var i = 0; i < layouts.length; i++){
+        this.drawNeuron(layouts[i].x * 100, -layouts[i].y * 100);
+    }
+
+    for(var i = 0; i < connections.length; i++)
+        this.drawConnection(i, connections, einfos);
+}
+
+NeuronDrawer.prototype.debugTest = function()
+{
+
+}
+
Index: /js/viewer-f0/js/Structures/Neuro.js
===================================================================
--- /js/viewer-f0/js/Structures/Neuro.js	(revision 142)
+++ /js/viewer-f0/js/Structures/Neuro.js	(revision 143)
@@ -5,7 +5,2 @@
 
 Neuro.prototype = new Model();
-
-Neuro.prototype.getXPos = function()
-{
-
-}
Index: /js/viewer-f0/js/Structures/NeuroClass.js
===================================================================
--- /js/viewer-f0/js/Structures/NeuroClass.js	(revision 143)
+++ /js/viewer-f0/js/Structures/NeuroClass.js	(revision 143)
@@ -0,0 +1,39 @@
+function NeuroClass() {
+    this.class = {};//obiekt z cechami klasy
+    this._properties = {};//obiekt z propertisami
+}
+
+//pobranie danych o klasie
+//pobranie danych o propertisach
+
+NeuroClass.prototype.setModel = function(data)
+{
+    var self = this;
+    $(data).each(function () {
+        $.each(this.attributes, function () {
+            self.class[this.name] = this.value;
+        });
+    });
+
+    var nodes = data[0].children;
+
+    for (var i = 0; i < nodes.length; i++) {
+        var node = $(nodes[i]);
+        this.addProperties(node);
+    }
+}
+
+NeuroClass.prototype.addProperties = function (data) {
+    var properties = {};
+
+    $(data).each(function () {
+        $.each(this.attributes, function () {
+            properties[this.name] = this.value;
+        });
+
+    });
+
+    //properties["VALUE"] = typeof(properties["DEF"]) === 'undefined' ? 0 : properties["DEF"];
+
+    this._properties[properties["ID"]] = properties;
+}
Index: /js/viewer-f0/js/Structures/NeuroConn.js
===================================================================
--- /js/viewer-f0/js/Structures/NeuroConn.js	(revision 142)
+++ /js/viewer-f0/js/Structures/NeuroConn.js	(revision 143)
@@ -5,4 +5,8 @@
 
 NeuroConn.prototype.getDestination = function(){
+    return parseInt(this._properties["n1"]["VALUE"]);
+}
+
+NeuroConn.prototype.getSource = function(){
     return parseInt(this._properties["n2"]["VALUE"]);
 }
Index: /js/viewer-f0/js/graphicsEngine.js
===================================================================
--- /js/viewer-f0/js/graphicsEngine.js	(revision 142)
+++ /js/viewer-f0/js/graphicsEngine.js	(revision 143)
@@ -253,72 +253,7 @@
 }
 
-GraphicsEngine.prototype.drawNeuron = function(){
-    var scheme = [4,4,26,27,26,73,73,73,73,27,26,27,1,73,50,100,50,1,56,68,46,68,2,41,47,51,32,51,68];
-    //pobieranie schematu
-    //inne określenie położeń
-
-
-    var obj = new THREE.Object3D();
-
-    var material = new THREE.LineBasicMaterial({
-        color: 0x0000ff
-    });
-    var position = 0;
-    var noOfBlocks = 0;//number of "blocks" to draw
-    var noOfLines = 0;//number of line to draw
-    noOfBlocks = scheme[position++];
-    for (var i = 0; i < noOfBlocks; i++)
-    {
-        noOfLines = scheme[position++];
-
-        for (var j = 0; j < noOfLines; j++)
-        {
-            var geometry = new THREE.Geometry();
-            geometry.vertices.push(new THREE.Vector3(scheme[position++], scheme[position++], 0));
-            geometry.vertices.push(new THREE.Vector3(scheme[position++], scheme[position++], 0));
-            position = position - 2; //get to last point in list
-            var line = new THREE.Line(geometry, material);
-            obj.add(line);
-        }
-        position = position + 2;//move to value which define number of lines to draw
-    }
-
-    obj.scale.set(0.1,0.1,0.1)
-    this._scene.add(obj)
-}
-
-GraphicsEngine.prototype.drawConnection = function(connection, id, connestions, neurons){
-
-    var destination = connection.getDestination();
-    var numberOfConnToDest = 0;
-    var numberOfDrawenCon = 0;
-
-    //check how many conenctions have the same destination
-    for(var i = 0; i < connestions.length; i++){
-        if(connestions[i].getDestination() == destination)
-            numberOfConnToDest++;
-    }
-
-    //check how many connections had been drawen
-    for(var i = 0; i < id; i++){
-        if(connestions[i].getDestination() == destination)
-            numberOfDrawenCon++;
-    }
-
-    var positionY = (numberOfDrawenCon + 1) * 100 / (numberOfConnToDest + 1);
-    var positionX = (numberOfDrawenCon + 1) * 10 / (numberOfConnToDest + 1);
-
-    /*var x1 =
-    var x2
-    var y1
-    var y2*/
-
-}
-
 GraphicsEngine.prototype.debugTest = function()
 {
-    this.drawNeuron();
-
-
-}
-
+
+}
+
Index: /js/viewer-f0/js/main.js
===================================================================
--- /js/viewer-f0/js/main.js	(revision 142)
+++ /js/viewer-f0/js/main.js	(revision 143)
@@ -14,10 +14,12 @@
     neurons: [],
     neuroConns: [],
+    neuroClasses: [],
     modelOne: undefined,
     _graphicsEngine: new GraphicsEngine(),
+    _neuronDrawer: new NeuronDrawer(),
     downloadXML: function () {
         var local = this;
         $.ajax({
-            url: "http://localhost:63342/FramestickFavi/f0def.xml",
+            url: "http://www.framsticks.com/files/dev/files/f0def.xml",
             dataType: "xml",
             async: false,
@@ -31,8 +33,10 @@
             }
         })
-
     },
     parseGeneXml: function () {
-        var nodes = $(this.xml.find("CLASS"));
+        this._parseClass($(this.xml.find("CLASS")));
+        this._parseNeuroClass($(this.xml.find("NEUROCLASS")))
+    },
+    _parseClass: function(nodes){
         var local = this;
 
@@ -56,4 +60,13 @@
 
         });
+    },
+    _parseNeuroClass: function(data){
+
+        for(var i = 0; i < data.length; i++)
+        {
+            var neuroClass = new NeuroClass();
+            neuroClass.setModel(data);
+            this.neuroClasses.push(neuroClass);
+        }
     },
     analyseLine: function (line) {
@@ -108,6 +121,6 @@
     downloadCreature: function () {
         var lines;
-        /*$.ajax({
-            url: "http://localhost:63342/FramestickFavi/creatures/" + this.debugCreatureName + ".txt",
+        $.ajax({
+            url: "http://localhost:63343/FramestickFavi/creatures/" + this.debugCreatureName + ".txt",
             async: false,
             dataType: "text",
@@ -120,8 +133,8 @@
             }
 
-        });*/
+        });
 
-        lines = $("#geno").val();
-        lines = lines.split("\n");
+        //lines = $("#geno").val();
+        //lines = lines.split("\n");
 
         return lines;
@@ -153,4 +166,10 @@
         //this._graphicsEngine.debugTest();
         this._graphicsEngine.renderScene();
+
+        this._neuronDrawer.initializeScene();
+        new SmartLayout(this.neurons, this.neuroConns);
+        this._neuronDrawer.drawNetwork(this.neurons, this.neuroConns, einfos);
+        this._neuronDrawer.renderScene();
+
     }
 
@@ -162,5 +181,4 @@
     geneWindow.parseCreature();
     geneWindow.mainLoop();
-    //geneWindow.context = window.open("window.html", "Window", "width=200,height=100");
 
 }
