From fb5f22aaac0bb4228ecb766e6a612b73a1aa987e Mon Sep 17 00:00:00 2001 From: Paulo Veiga Date: Tue, 9 Aug 2011 09:03:46 -0300 Subject: [PATCH] Fix multple node selection in toolbar. --- core-js/pom.xml | 1 - core-js/src/main/javascript/ColorPicker.js | 94 ------------------- .../javascript/widget/ColorPalettePanel.js | 5 +- mindplot/src/main/javascript/widget/Menu.js | 67 ++++++++++--- wise-doc/bugs.txt | 4 + wise-doc/src/main/webapp/html/editor.html | 1 - 6 files changed, 61 insertions(+), 111 deletions(-) delete mode 100644 core-js/src/main/javascript/ColorPicker.js create mode 100644 wise-doc/bugs.txt diff --git a/core-js/pom.xml b/core-js/pom.xml index b7c33ac3..af3ef427 100644 --- a/core-js/pom.xml +++ b/core-js/pom.xml @@ -49,7 +49,6 @@ ${basedir}/target/classes/core.js ${basedir}/target/tmp/header-min.js - ${basedir}/target/tmp/ColorPicker-min.js ${basedir}/target/tmp/Functions-min.js ${basedir}/target/tmp/log4js-min.js ${basedir}/target/tmp/Monitor-min.js diff --git a/core-js/src/main/javascript/ColorPicker.js b/core-js/src/main/javascript/ColorPicker.js deleted file mode 100644 index 15a501aa..00000000 --- a/core-js/src/main/javascript/ColorPicker.js +++ /dev/null @@ -1,94 +0,0 @@ -/* -* Copyright [2011] [wisemapping] -* -* Licensed under WiseMapping Public License, Version 1.0 (the "License"). -* It is basically the Apache License, Version 2.0 (the "License") plus the -* "powered by wisemapping" text requirement on every single page; -* you may not use this file except in compliance with the License. -* You may obtain a copy of the license at -* -* http://www.wisemapping.org/license -* -* Unless required by applicable law or agreed to in writing, software -* distributed under the License is distributed on an "AS IS" BASIS, -* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -* See the License for the specific language governing permissions and -* limitations under the License. -*/ - -core.ColorPicker = function() -{ - this.palette = "7x10"; - this._palettes = {"7x10": [["fff", "fcc", "fc9", "ff9", "ffc", "9f9", "9ff", "cff", "ccf", "fcf"], - ["ccc", "f66", "f96", "ff6", "ff3", "6f9", "3ff", "6ff", "99f", "f9f"], - ["c0c0c0", "f00", "f90", "fc6", "ff0", "3f3", "6cc", "3cf", "66c", "c6c"], - ["999", "c00", "f60", "fc3", "fc0", "3c0", "0cc", "36f", "63f", "c3c"], - ["666", "900", "c60", "c93", "990", "090", "399", "33f", "60c", "939"], - ["333", "600", "930", "963", "660", "060", "366", "009", "339", "636"], - ["000", "300", "630", "633", "330", "030", "033", "006", "309", "303"]], - - "3x4": [["ffffff"/*white*/, "00ff00"/*lime*/, "008000"/*green*/, "0000ff"/*blue*/], - ["c0c0c0"/*silver*/, "ffff00"/*yellow*/, "ff00ff"/*fuchsia*/, "000080"/*navy*/], - ["808080"/*gray*/, "ff0000"/*red*/, "800080"/*purple*/, "000000"/*black*/]] - //["00ffff"/*aqua*/, "808000"/*olive*/, "800000"/*maroon*/, "008080"/*teal*/]]; - }; -}; - -core.ColorPicker.buildRendering = function () -{ - this.domNode = document.createElement("table"); - // dojo.html.disableSelection(this.domNode); - // dojo.event.connect(this.domNode, "onmousedown", function (e) { - // e.preventDefault(); - // }); - with (this.domNode) { // set the table's properties - cellPadding = "0"; - cellSpacing = "1"; - border = "1"; - style.backgroundColor = "white"; - } - var colors = this._palettes[this.palette]; - for (var i = 0; i < colors.length; i++) { - var tr = this.domNode.insertRow(-1); - for (var j = 0; j < colors[i].length; j++) { - if (colors[i][j].length == 3) { - colors[i][j] = colors[i][j].replace(/(.)(.)(.)/, "$1$1$2$2$3$3"); - } - - var td = tr.insertCell(-1); - with (td.style) { - backgroundColor = "#" + colors[i][j]; - border = "1px solid gray"; - width = height = "15px"; - fontSize = "1px"; - } - - td.color = "#" + colors[i][j]; - - td.onmouseover = function (e) { - this.style.borderColor = "white"; - }; - td.onmouseout = function (e) { - this.style.borderColor = "gray"; - }; - // dojo.event.connect(td, "onmousedown", this, "onClick"); - - td.innerHTML = " "; - } - } -}; - -core.ColorPicker.onClick = function(/*Event*/ e) -{ - this.onColorSelect(e.currentTarget.color); - e.currentTarget.style.borderColor = "gray"; -}; - -core.ColorPicker.onColorSelect = function(color) -{ - // summary: - // Callback when a color is selected. - // color: String - // Hex value corresponding to color. -}; - diff --git a/mindplot/src/main/javascript/widget/ColorPalettePanel.js b/mindplot/src/main/javascript/widget/ColorPalettePanel.js index 4ca0b2ff..639e9ea4 100644 --- a/mindplot/src/main/javascript/widget/ColorPalettePanel.js +++ b/mindplot/src/main/javascript/widget/ColorPalettePanel.js @@ -101,7 +101,7 @@ mindplot.widget.ColorPalettePanel = new Class({ }, show : function() { - if (!this.isVisible()) { + if (!this.isVisible()) { this.parent(); var panelElem = this._getPanelElem(); @@ -115,9 +115,10 @@ mindplot.widget.ColorPalettePanel = new Class({ // Mark the cell as selected ... var colorCells = panelElem.getElements('div[class=palette-colorswatch]'); var model = this.getModel(); + var modelValue = model.getValue(); colorCells.forEach(function(elem) { var color = elem.getStyle("background-color"); - if (model.getValue() == color) { + if (modelValue == color) { elem.parentNode.className = 'palette-cell palette-cell-selected'; } }); diff --git a/mindplot/src/main/javascript/widget/Menu.js b/mindplot/src/main/javascript/widget/Menu.js index 34db3b57..f0bcd21b 100644 --- a/mindplot/src/main/javascript/widget/Menu.js +++ b/mindplot/src/main/javascript/widget/Menu.js @@ -43,9 +43,16 @@ mindplot.widget.Menu = new Class({ var fontFamilyModel = { getValue: function() { var nodes = designer.getSelectedNodes(); - if (nodes.length == 1) { - return nodes[0].getFontFamily(); + var result = null; + for (var i=0; i < nodes.length; i++) { + var fontFamily = nodes[i].getFontFamily(); + if (result != null && result != fontFamily) { + result = null; + break; + } + result = fontFamily; } + return result; }, setValue: function(value) { @@ -58,9 +65,16 @@ mindplot.widget.Menu = new Class({ var fontSizeModel = { getValue: function() { var nodes = designer.getSelectedNodes(); - if (nodes.length == 1) { - return nodes[0].getFontSize(); + var result = null; + for (var i=0; i < nodes.length; i++) { + var fontSize = nodes[i].getFontSize(); + if (result != null && result != fontSize) { + result = null; + break; + } + result = fontSize; } + return result; }, setValue: function(value) { designer.setFontSize2SelectedNode(value); @@ -71,9 +85,16 @@ mindplot.widget.Menu = new Class({ var topicShapeModel = { getValue: function() { var nodes = designer.getSelectedNodes(); - if (nodes.length == 1) { - return nodes[0].getShapeType(); + var result = null; + for (var i=0; i < nodes.length; i++) { + var shapeType = nodes[i].getShapeType(); + if (result != null && result != shapeType) { + result = null; + break; + } + result = shapeType; } + return result; }, setValue: function(value) { designer.setShape2SelectedNode(value); @@ -97,10 +118,16 @@ mindplot.widget.Menu = new Class({ { getValue : function() { var nodes = designer.getSelectedNodes(); - if (nodes.length == 1) { - return nodes[0].getBackgroundColor(); + var result = null; + for (var i=0; i < nodes.length; i++) { + var color = nodes[i].getBackgroundColor(); + if (result != null && result != color) { + result = null; + break; + } + result = color; } - return null; + return result; }, setValue : function (hex) { designer.setBackColor2SelectedNode(hex); @@ -113,9 +140,16 @@ mindplot.widget.Menu = new Class({ { getValue : function() { var nodes = designer.getSelectedNodes(); - if (nodes.length == 1) { - return nodes[0].getBorderColor(); + var result = null; + for (var i=0; i < nodes.length; i++) { + var color = nodes[i].getBorderColor(); + if (result != null && result != color) { + result = null; + break; + } + result = color; } + return result; }, setValue : function (hex) { designer.setBorderColor2SelectedNode(hex); @@ -127,10 +161,17 @@ mindplot.widget.Menu = new Class({ var fontColorModel = { getValue : function() { + var result = null; var nodes = designer.getSelectedNodes(); - if (nodes.length == 1) { - return nodes[0].getFontColor(); + for (var i=0; i < nodes.length; i++) { + var color = nodes[i].getFontColor(); + if (result != null && result != color) { + result = null; + break; + } + result = color; } + return result; }, setValue : function (hex) { designer.setFontColor2SelectedNode(hex); diff --git a/wise-doc/bugs.txt b/wise-doc/bugs.txt new file mode 100644 index 00000000..3069272c --- /dev/null +++ b/wise-doc/bugs.txt @@ -0,0 +1,4 @@ +- Select and unselect de un nodo. +- metaKey for mac +- Si todos los nodos tienen las mismas propiedades, las opciones deberian aparecer marcadas. +- Ver de que algunos de los colores de las paleta sean los utilizados. diff --git a/wise-doc/src/main/webapp/html/editor.html b/wise-doc/src/main/webapp/html/editor.html index 5706ca38..56f95b1d 100644 --- a/wise-doc/src/main/webapp/html/editor.html +++ b/wise-doc/src/main/webapp/html/editor.html @@ -20,7 +20,6 @@ -