client/js/renderer/nodeeditor.js
changeset 472 6dcff4438175
parent 461 48235ed6b07d
child 468 364c367df7fc
--- a/client/js/renderer/nodeeditor.js	Wed Jun 03 17:27:46 2015 +0200
+++ b/client/js/renderer/nodeeditor.js	Fri Jun 05 12:17:16 2015 +0200
@@ -1,5 +1,5 @@
 
-define(['jquery', 'underscore', 'requtils', 'renderer/baseeditor'], function ($, _, requtils, BaseEditor) {
+define(['jquery', 'underscore', 'requtils', 'renderer/baseeditor', 'renderer/shapebuilder'], function ($, _, requtils, BaseEditor, ShapeBuilder) {
     'use strict';
 
     var Utils = requtils.getUtils();
@@ -32,7 +32,9 @@
                     description: _model.get("description"),
                     image: _model.get("image") || "",
                     image_placeholder: _image_placeholder,
-                    color: _model.get("color") || _created_by.get("color"),
+                    color: (_model.has("style") && _model.get("style").color) || _created_by.get("color"),
+                    thickness: (_model.has("style") && _model.get("style").thickness) || 1,
+                    dash: _model.has("style") && _model.get("style").dash ? "checked" : "",
                     clip_path: _model.get("clip_path") || false,
                     created_by_color: _created_by.get("color"),
                     created_by_title: _created_by.get("title"),
@@ -41,7 +43,8 @@
                 },
                 renkan: this.renkan,
                 options: this.options,
-                shortenText: Utils.shortenText
+                shortenText: Utils.shortenText,
+                shapes : _(ShapeBuilder.builders).omit('svg').keys().value(),
             }));
             this.redraw();
             var _this = this,
@@ -50,8 +53,7 @@
                 _this.editor_$.find("input, textarea, select").off("change keyup paste");
                 _this.editor_$.find(".Rk-Edit-Image-File").off('change');
                 _this.editor_$.find(".Rk-Edit-ColorPicker-Wrapper").off('hover');
-                _this.editor_$.find(".Rk-Edit-Size-Down").off('click');
-                _this.editor_$.find(".Rk-Edit-Size-Up").off('click');
+                _this.editor_$.find(".Rk-Edit-Size-Btn").off('click');
                 _this.editor_$.find(".Rk-Edit-Image-Del").off('click');
                 _this.editor_$.find(".Rk-Edit-ColorPicker").find("li").off('hover click');
                 _this.editor_$.find(".Rk-CloseX").off('click');
@@ -88,6 +90,10 @@
                         if (_this.options.show_node_editor_description) {
                             _data.description = _this.editor_$.find(".Rk-Edit-Description").val();
                         }
+                        if (_this.options.show_node_editor_style) {
+                            var dash = _this.editor_$.find(".Rk-Edit-Dash").is(':checked');
+                            _data.style = _.assign( ((_model.has("style") && _.clone(_model.get("style"))) || {}), {dash: dash});
+                        }
                         if (_this.options.change_shapes) {
                             if(_model.get("shape")!==_this.editor_$.find(".Rk-Edit-Shape").val()){
                                 _data.shape = _this.editor_$.find(".Rk-Edit-Shape").val();
@@ -152,12 +158,12 @@
                         },
                         function(_e) {
                             _e.preventDefault();
-                            _this.editor_$.find(".Rk-Edit-Color").css("background", _model.get("color") || (_model.get("created_by") || Utils._USER_PLACEHOLDER(_this.renkan)).get("color"));
+                            _this.editor_$.find(".Rk-Edit-Color").css("background", (_model.has("style") && _model.get("style").color) || (_model.get("created_by") || Utils._USER_PLACEHOLDER(_this.renkan)).get("color"));
                         }
                 ).click(function(_e) {
                     _e.preventDefault();
                     if (_this.renderer.isEditable()) {
-                        _model.set("color", $(this).attr("data-color"));
+                        _model.set("style", _.assign( ((_model.has("style") && _.clone(_model.get("style"))) || {}), {color: $(this).attr("data-color")}));
                         _picker.hide();
                         paper.view.draw();
                     } else {
@@ -168,7 +174,7 @@
                 var shiftSize = function(n) {
                     if (_this.renderer.isEditable()) {
                         var _newsize = n+(_model.get("size") || 0);
-                        _this.editor_$.find(".Rk-Edit-Size-Value").text((_newsize > 0 ? "+" : "") + _newsize);
+                        _this.editor_$.find("#Rk-Edit-Size-Value").text((_newsize > 0 ? "+" : "") + _newsize);
                         _model.set("size", _newsize);
                         paper.view.draw();
                     } else {
@@ -176,15 +182,45 @@
                     }
                 };
 
-                this.editor_$.find(".Rk-Edit-Size-Down").click(function() {
+                this.editor_$.find("#Rk-Edit-Size-Down").click(function() {
                     shiftSize(-1);
                     return false;
                 });
-                this.editor_$.find(".Rk-Edit-Size-Up").click(function() {
+                this.editor_$.find("#Rk-Edit-Size-Up").click(function() {
                     shiftSize(1);
                     return false;
                 });
 
+                var shiftThickness = function(n) {
+                    if (_this.renderer.isEditable()) {
+                        var _oldThickness = ((_model.has('style') && _model.get('style').thickness) || 1),
+                            _newThickness = n + _oldThickness;
+                        if(_newThickness < 1 ) {
+                            _newThickness = 1;
+                        }
+                        else if (_newThickness > _this.options.node_stroke_witdh_scale) {
+                            _newThickness = _this.options.node_stroke_witdh_scale;
+                        }
+                        if (_newThickness !== _oldThickness) {
+                            _this.editor_$.find("#Rk-Edit-Thickness-Value").text(_newThickness);
+                            _model.set("style", _.assign( ((_model.has("style") && _.clone(_model.get("style"))) || {}), {thickness: _newThickness}));
+                            paper.view.draw();
+                        }
+                    }
+                    else {
+                        closeEditor();
+                    }
+                };
+
+                this.editor_$.find("#Rk-Edit-Thickness-Down").click(function() {
+                    shiftThickness(-1);
+                    return false;
+                });
+                this.editor_$.find("#Rk-Edit-Thickness-Up").click(function() {
+                    shiftThickness(1);
+                    return false;
+                });
+
                 this.editor_$.find(".Rk-Edit-Image-Del").click(function() {
                     _this.editor_$.find(".Rk-Edit-Image").val('');
                     onFieldChange();