support for switching layers

web/app/3d/main.js

@@ -298,26 +298,3 @@ TCAD.App.prototype.save = function() {
 
   }
 };
-
-TCAD.Bus = function() {
-  this.listeners = {};
-};
-
-TCAD.Bus.prototype.subscribe = function(event, callback) {
-  var listenerList = this.listeners[event];
-  if (listenerList === undefined) {
-    listenerList = [];
-    this.listeners[event] = listenerList;
-  }
-  listenerList.push(callback);
-};
-
-TCAD.Bus.prototype.notify = function(event, data) {
-  var listenerList = this.listeners[event];
-  if (listenerList !== undefined) {
-    for (var i = 0; i < listenerList.length; i++) {
-      listenerList[i](data);
-    }
-  }
-
-};

web/app/app-init.js

@@ -2,6 +2,16 @@ function start() {
   var app = new TCAD.App2D();
   app.loadFromLocalStorage();
   app.fit();
+
+  function addLayer(name, style) {
+    if (app.viewer.findLayerByName(name) === null) {
+      app.viewer.layers.push(new TCAD.TWO.Layer(name, style));
+    }
+  }
+
+  addLayer("sketch", TCAD.TWO.Styles.DEFAULT);
+  addLayer("_construction_", TCAD.TWO.Styles.CONSTRUCTION);
+  
   var actionsWin = new TCAD.ui.Window($('#actions'));
 
   TCAD.ui.bindOpening( $('#showActions'), actionsWin );
@@ -68,6 +78,27 @@ function start() {
   });
   app.viewer.parametricManager.listeners.push(function() {constrList.refresh()});
   constrList.refresh();
+
+  var updateLayersList = function () {
+    var options = '';
+    for (var i = 0; i < app.viewer.layers.length; i++) {
+      var layer = app.viewer.layers[i];
+      options += "<option value='"+layer.name+"'>"+layer.name+"</option>"
+    }
+    $('#layersList').html(options).val(app.viewer.activeLayer.name);
+  };
+  updateLayersList();
+  app.viewer.bus.subscribe("activeLayer", function() {
+    updateLayersList();
+  });
+  $('#layersList')
+    .mousedown(updateLayersList)
+    .change(function () {
+      var layer = app.viewer.findLayerByName($('#layersList').val());
+      if (layer != null) {
+        app.viewer.activeLayer = layer;
+      }
+    });
 }
 window.___log = function(log) {
     $('#log').append( " *****************<br><br><br><br>");

web/app/sketcher/canvas.js

@@ -37,6 +37,12 @@ TCAD.TWO.Styles = {
     lineWidth : 2,
     strokeStyle : "#fff5c3",
     fillStyle : "#000000"
+  },
+  
+  CONSTRUCTION : {
+    lineWidth : 1,
+    strokeStyle : "#aaaaaa",
+    fillStyle : "#000000"
   }
 };
 
@@ -87,7 +93,13 @@ TCAD.TWO.Viewer = function(canvas) {
   }
   updateCanvasSize();
   window.addEventListener( 'resize', onWindowResize, false );
-  
+
+  Object.defineProperty(this, "activeLayer", {
+    get: viewer.getActiveLayer ,
+    set: viewer.setActiveLayer
+  });
+
+  this.bus = new TCAD.Bus();
   this.ctx = this.canvas.getContext("2d");
   this._activeLayer = null;
   this.layers = [];
@@ -345,7 +357,7 @@ TCAD.TWO.Viewer.prototype.mark = function(obj, style) {
   this.selected.push(obj);
 };
 
-TCAD.TWO.Viewer.prototype.activeLayer = function() {
+TCAD.TWO.Viewer.prototype.getActiveLayer = function() {
   var layer = this._activeLayer;
   if (layer == null || layer.readOnly) {
     layer = null;
@@ -367,6 +379,7 @@ TCAD.TWO.Viewer.prototype.activeLayer = function() {
 TCAD.TWO.Viewer.prototype.setActiveLayer = function(layer) {
   if (!layer.readOnly) {
     this._activeLayer = layer;
+    this.bus.notify("activeLayer");
   }
 };
 
@@ -789,9 +802,18 @@ TCAD.TWO.PanTool.prototype.mousedown = function(e) {
         this.viewer.select([picked[0]], false);
         this.deselectOnUp = false;
       } else {
-        this.viewer.select([picked[0]], true);
-        if (!picked[0].isAuxOrLinkedTo()) {
-          var tool = picked[0].getDefaultTool(this.viewer);
+        var toSelect = picked[0];
+        if (this.viewer.selected.length === 1) {
+          for (var i = 0; i < picked.length - 1; i++) {
+            if (picked[i].id == this.viewer.selected[0].id) {
+              toSelect = picked[i + 1];
+              break;
+            }
+          }
+        }
+        this.viewer.select([toSelect], true);
+        if (!toSelect.isAuxOrLinkedTo()) {
+          var tool = toSelect.getDefaultTool(this.viewer);
           tool.mousedown(e);
           this.viewer.toolManager.takeControl(tool);
         }

web/app/sketcher/io.js

@@ -64,8 +64,10 @@ TCAD.IO.prototype._loadSketch = function(sketch) {
   var sketchLayers = sketch['layers'];
   if (sketchLayers !== undefined) {
     for (var l = 0; l < sketchLayers.length; ++l) {
-      var layer = getLayer(this.viewer, sketchLayers[l]['name']);
-      var layerData = sketchLayers[l]['data'];
+      var ioLayer = sketchLayers[l];
+      var layer = getLayer(this.viewer, ioLayer['name']);
+      if (!!ioLayer.style) layer.style = ioLayer.style;
+      var layerData = ioLayer['data'];
       for (var i = 0; i < layerData.length; ++i) {
         var obj = layerData[i];
         var skobj = null;
@@ -164,7 +166,7 @@ TCAD.IO.prototype._serializeSketch = function() {
     var layers = toSave[t];
     for (var l = 0; l < layers.length; ++l) {
       var layer = layers[l];
-      var toLayer = {'name' : layer.name, 'data' : []};
+      var toLayer = {'name' : layer.name, style : layer.style, 'data' : []};
       sketch['layers'].push(toLayer);
       for (var i = 0; i < layer.objects.length; ++i) {
         var obj = layer.objects[i];

web/app/sketcher/shapes/arc.js

@@ -140,7 +140,7 @@ TCAD.TWO.AddArcTool.prototype.mouseup = function(e) {
       new TCAD.TWO.EndPoint(p.x, p.y)
     );
     this.point = this.arc.a;
-    this.viewer.activeLayer().objects.push(this.arc);
+    this.viewer.activeLayer.objects.push(this.arc);
     this.viewer.refresh();
   } else if (this.point.id === this.arc.a.id) {
     this.point = this.arc.b;

web/app/sketcher/shapes/circle.js

@@ -84,7 +84,7 @@ TCAD.TWO.EditCircleTool.prototype.mouseup = function(e) {
       new TCAD.TWO.EndPoint(p.x, p.y)
     );
     if (needSnap) this.viewer.parametricManager.linkObjects([this.circle.c, p]);
-    this.viewer.activeLayer().objects.push(this.circle);
+    this.viewer.activeLayer.objects.push(this.circle);
     this.viewer.refresh();
   } else {
     this.solveRequest(false);

web/app/sketcher/shapes/segment.js

@@ -37,7 +37,7 @@ TCAD.TWO.AddSegmentTool.prototype.mouseup = function(e) {
       this.viewer.cleanSnap();
       needSnap = true;
     }
-    this.line = this.viewer.addSegment(a.x, a.y, b.x, b.y, this.viewer.activeLayer());
+    this.line = this.viewer.addSegment(a.x, a.y, b.x, b.y, this.viewer.activeLayer);
     if (needSnap) {
       this.viewer.parametricManager.linkObjects([this.line.a, a]);
     }
@@ -53,7 +53,7 @@ TCAD.TWO.AddSegmentTool.prototype.mouseup = function(e) {
     }
     if (this.multi) {
       var b = this.line.b; 
-      this.line = this.viewer.addSegment(b.x, b.y, b.x, b.y, this.viewer.activeLayer());
+      this.line = this.viewer.addSegment(b.x, b.y, b.x, b.y, this.viewer.activeLayer);
       this.viewer.parametricManager.linkObjects([this.line.a, b]);
     } else {
       this.line = null;
@@ -103,7 +103,7 @@ TCAD.TWO.AddPointTool.prototype.mouseup = function(e) {
   this.viewer.historyManager.checkpoint();
   var a = this.viewer.screenToModel(e);
   var p = new TCAD.TWO.EndPoint(a.x, a.y);
-  var layer = this.viewer.activeLayer();
+  var layer = this.viewer.activeLayer;
   layer.objects.push(p);
   p.layer = layer;
   this.viewer.refresh();

web/app/ui/toolkit.js

@@ -162,3 +162,25 @@ TCAD.toolkit.Tree.prototype._fill = function(data, level) {
     }
   }
 };
+
+TCAD.Bus = function() {
+  this.listeners = {};
+};
+
+TCAD.Bus.prototype.subscribe = function(event, callback) {
+  var listenerList = this.listeners[event];
+  if (listenerList === undefined) {
+    listenerList = [];
+    this.listeners[event] = listenerList;
+  }
+  listenerList.push(callback);
+};
+
+TCAD.Bus.prototype.notify = function(event, data) {
+  var listenerList = this.listeners[event];
+  if (listenerList !== undefined) {
+    for (var i = 0; i < listenerList.length; i++) {
+      listenerList[i](data);
+    }
+  }
+};

web/app/workbench.js

@@ -14,8 +14,10 @@ TCAD.workbench.readSketchGeom = function(sketch) {
   var out = {connections : [], loops : []};
   if (sketch.layers !== undefined) {
     for (var l = 0; l < sketch.layers.length; ++l) {
-      for (var i = 0; i < sketch.layers[l].data.length; ++i) {
-        var obj = sketch.layers[l].data[i];
+      var layer = sketch.layers[l];
+      if (layer.name == "_construction_") continue;
+      for (var i = 0; i < layer.data.length; ++i) {
+        var obj = layer.data[i];
         if (obj.edge !== undefined) continue;
         if (!!obj.aux) continue;
         if (obj._class === 'TCAD.TWO.Segment') {

web/sketcher.html

@@ -35,6 +35,7 @@
   <script src="app/engine.js"></script>
   <script src="app/sketcher/main2d.js"></script>
   <script src="app/ui.js"></script>
+  <script src="app/ui/toolkit.js"></script>
   <script src="app/math/graph.js"></script>
   <script src="app/app-init.js"></script>
   <!--$$$javascript_end$$$-->
@@ -42,6 +43,7 @@
 <body>
   <a id="downloader" style="display: none;" ></a>
   <div class="panel b-bot" style="width: 100%; height: 35px; text-align:right;">
+       <select id="layersList"></select>  
        <span class="logo" style="float:left">sketcher.js <span style="font-size: 10px">(alpha)</span></span>
 
        <button class="btn tbtn act-undo" ><i class="fa fa-arrow-left"></i></button><!--