drawinggeo ok

adim_project/adim_app/static/_src/adim/tools.js

@@ -43,8 +43,9 @@ define([
     "tools/marker",
 
     // ----- GEOMO tool
-    "tools/rectanglegeo",
-    "tools/ellipsegeo"
+    "tools/drawinggeo",
+    "tools/ellipsegeo",
+    "tools/rectanglegeo"
 ],
 function(_, Signal){
     // ----- Locale variables -----------------------------

adim_project/adim_app/static/_src/adim/tools/drawinggeo.js

+define(["paper", "tools/Shape.class","adim/category"], function(paper, Shape, Category) {
+
+    // ----- Const ---------------------------------------
+    var TOOL_TYPE = "drawinggeo";
+    var _tool;  // The tool itself
+
+    // ----- Locale variables -----------------------------
+    var _startPoint = null;
+    var _editedRecGeo = null;
+    var _editedSegmentIdx = null;
+    var _drawingLine = null;
+    var terminateOnRelease = null;
+    var _recGeoChanged = null;
+    var create = true;
+    var _path = null;
+    var _ro = false;
+
+    // Events
+    var _events = {
+        annotationAdded: null,
+        annotationSelected: null,
+        annotationChanged: null
+    };
+
+    // Properties
+    var defaultProperties = {
+        comment: "",
+        category: "cat_geo_1",
+        fill: false
+    };
+
+    var hitOptions = {
+        stroke: true,
+        fill: false,
+        tolerance: 5,
+        bounds: false,
+        handles: true
+    };
+
+    // ----- Serialization ---------------------------------
+
+    function exportJSON(param) {
+        var sel = this.selected,
+            fullSel = this.fullySelected;
+        this.selected = this.fullySelected = false;
+
+        var json = this.exportJSON({asString:false});
+        delete(json[1].fontFamily);
+        delete(json[1].font);
+        delete(json[1].fontSize);
+        delete(json[1].leading);
+
+        json = (param && param.asString === false) ? json : JSON.stringify(json);
+
+        this.fullySelected = fullSel;
+        this.selected = sel;
+        return json;
+    }
+
+
+    function importJSON(itemDef, layer, listening) {
+        var item = layer.importJSON(itemDef);
+        var drawgeo = createDrawingGeo(item,item.data,listening);
+        //attachListeners(item);
+        //return item;
+
+
+
+        // Sanitize data
+        //var itemData = itemDef[1];
+
+        // Keep copy of current category
+        var curCat = defaultProperties.category;
+
+        if (item.data.prop.category) {
+            _setCategory.call(drawgeo, item.data.prop.category);
+        }
+
+        // Restore states
+        defaultProperties.category = curCat;
+
+        return drawgeo;
+    }
+
+    // ----- Functions ------------------------------------
+    function createDrawingGeo(path,config, eventListening){
+        var newPath = path;
+
+        // Extend tool's item properties with default values
+        var properties = (config && typeof config.prop === 'object') ? config.prop : {};
+        for (var p in defaultProperties) {
+            if (!properties.hasOwnProperty(p))
+                properties[p] = defaultProperties[p];
+        }
+
+        newPath.data = {
+            tId: "a" + newPath._id,
+            type: TOOL_TYPE,
+
+            // Properties
+            prop: properties,
+
+            setCategory: _setCategory,
+            getColorBgD: _getColorBgD,
+
+            //origin: path,
+
+            // Mouse Event
+            /*itemMouseDrag: itemMouseDrag,
+            itemMouseUp: itemMouseUp,
+            itemMouseDown: itemMouseDown,
+            setDragMode: itemResize,*/
+        };
+
+        /*newPath.itemMouseDown =itemMouseDown,
+        newPath.onMouseDown = itemMouseDown;
+        newPath.itemMouseDrag = itemMouseDrag;
+        newPath.setDragMode = itemMouseDrag;*/
+        newPath.onPropertyChange = itemPropertyChange;
+
+        newPath.style = {
+            strokeColor: _getColor(properties.category),
+            //strokeWidth: 7
+        };
+        if (properties.fill)
+            newPath.style = {
+                fillColor: _getColorBg(properties.category),
+            };
+        newPath._boundsSelected = true;
+
+        return newPath;
+    }
+
+    function itemPropertyChange(property, value) {
+        if (property === 'category') {
+            _setCategory.call(this, value);
+            if (this.data.prop.fill) {
+                this.style = {
+                    fillColor: _getColorBg(value),
+                    strokeColor: _getColor(value)
+                };
+            }else{
+                this.style = {
+                    strokeColor: _getColor(value)
+                };
+            }
+            paper.view.draw();
+        }
+    }
+
+    // ----- Functions ------------------------------------
+
+    function _setCategory(catId) {
+        defaultProperties.category = catId;
+    }
+
+    function _getColor(catId) {
+        var category = Category.getCategory(catId),
+            color = (category && category.color) || "#000000";
+        return color;
+    }
+
+    function _getColorBg(catId) {
+        var category = Category.getCategory(catId),
+            color = (category && category.colorbg) || "#000000";
+        return color;
+    }
+
+    function _getColorBgD() {
+        if (this.prop){
+            var category = Category.getCategory(this.prop.category),
+            color = (category && category.colorbg) || "#000000";
+            return color;
+        } else {
+            return "#000000";
+        }
+    }
+
+    // ----- Tool Def -------------------------------------
+    var toolDef = {
+        onMouseDown: function(event) {
+            paper.project.deselectAll();
+            _path = new paper.Path({fillColor: null, strokeCap: 'round'});
+            _path.add(event.point);
+        },
+
+        minDistance: 5,
+
+        onMouseDrag: function(event){
+            if(_path) {
+                _path.add(event.point);
+            }
+        },
+        onMouseUp: function() {
+            if(_path) {
+                _path.simplify(20);
+                var newPath = createDrawingGeo(_path.clone());
+                _path.remove();
+                _path = null;
+                paper.view.draw();
+
+                newPath.fullySelected = true;
+                _events.annotationAdded.dispatch(newPath);
+            }
+        }
+
+    }
+
+    _tool = new paper.Tool(toolDef);
+    return {
+        name: TOOL_TYPE,
+        tool: _tool,
+        exportJSON: exportJSON,
+        importJSON: importJSON,
+        registerEvent: function(eventName, evt) { _events[eventName] = evt; }
+    };
+});
\ No newline at end of file

adim_project/adim_app/static/_src/adim/tools/ellipsegeo.js

@@ -69,12 +69,6 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C
         return ellgeo;
     }
 
-
-    //var toolDef = new Shape('ellipse', _events);
-
-    // ----- Initialisations ------------------------------
-
-
     // ----- Functions ------------------------------------
     function createEllipseGeo(origin, config, eventListening) {
 

adim_project/templates/adim/env/geomo/annotation.html

@@ -26,11 +26,11 @@
     </label>
 
     <label class="btn btn-lg-off btn-primary">
-        <input type="radio" name="toolType" value="drawing" id="tool-drawing" data-tool-name="drawing">
+        <input type="radio" name="toolType" value="drawing" id="tool-drawing" data-tool-name="drawinggeo">
         <span class="icon-pencil"></span><span class="tool-text"> Dessin</span>
     </label>
     <label class="btn btn-lg-off btn-primary">
-        <input type="radio" name="toolType" value="lines" id="tool-lines" data-tool-name="lines">
+        <input type="radio" name="toolType" value="lines" id="tool-lines" data-tool-name="linesgeo">
         <span class="icon-line"></span><span class="tool-text"> Lignes</span>
     </label>
     <label class="btn btn-lg-off btn-primary">