From e9ed01c87d59da91f86f117fd29ca100d9401b1b Mon Sep 17 00:00:00 2001 From: Paulo Veiga Date: Mon, 8 Aug 2011 09:20:32 -0300 Subject: [PATCH] Minor fixes. --- .../main/javascript/BrixActionDispatcher.js | 8 +- .../src/main/javascript/MindmapDesigner.js | 4 +- .../collaboration/CollaborationManager.js | 35 ++- .../frameworks/brix/BrixFramework.js | 66 +++-- .../src/main/javascript/widget/IconPanel.js | 4 +- mindplot/src/main/javascript/widget/Menu.js | 87 +++++- .../main/javascript/widget/ToolbarPanel.js | 8 +- wise-doc/src/main/webapp/css/editor.css | 27 +- wise-doc/src/main/webapp/html/editor.html | 1 - wise-doc/src/main/webapp/js/editor.js | 77 +----- wise-webapp/src/main/webapp/js/editor.js | 248 +----------------- 11 files changed, 189 insertions(+), 376 deletions(-) diff --git a/mindplot/src/main/javascript/BrixActionDispatcher.js b/mindplot/src/main/javascript/BrixActionDispatcher.js index 4272e797..e22e17da 100644 --- a/mindplot/src/main/javascript/BrixActionDispatcher.js +++ b/mindplot/src/main/javascript/BrixActionDispatcher.js @@ -25,15 +25,15 @@ mindplot.BrixActionDispatcher = new Class({ }, changeTextOnTopic : function(topicsIds, text) { - var framework=$wise_collaborationManager.getCollaborativeFramework(); + var framework = mindplot.collaboration.CollaborationManager.getInstance().getCollaborativeFramework(); if (!(topicsIds instanceof Array)) { topicsIds = [topicsIds]; } var topic = framework.getTopic(topicsIds[0]); - var callback = function(event, topic){ + var callback = function(event, topic) { topic.getBrixModel().removeListener("valueChanged", callback); - this._actionDispatcher.changeTextOnTopic(topic.getId(),event.getNewValue()); - }.bindWithEvent(this,topic); + this._actionDispatcher.changeTextOnTopic(topic.getId(), event.getNewValue()); + }.bindWithEvent(this, topic); topic.setText(text, true, callback); } }); diff --git a/mindplot/src/main/javascript/MindmapDesigner.js b/mindplot/src/main/javascript/MindmapDesigner.js index 05cbfc41..a85e614d 100644 --- a/mindplot/src/main/javascript/MindmapDesigner.js +++ b/mindplot/src/main/javascript/MindmapDesigner.js @@ -24,7 +24,9 @@ mindplot.MindmapDesigner = new Class({ // Dispatcher manager ... var commandContext = new mindplot.CommandContext(this); - this._actionDispatcher = new mindplot.BrixActionDispatcher(commandContext); +// this._actionDispatcher = new mindplot.BrixActionDispatcher(commandContext); + this._actionDispatcher = new mindplot.LocalActionDispatcher(commandContext); + this._actionDispatcher.addEvent("modelUpdate", function(event) { this._fireEvent("modelUpdate", event); }.bind(this)); diff --git a/mindplot/src/main/javascript/collaboration/CollaborationManager.js b/mindplot/src/main/javascript/collaboration/CollaborationManager.js index a6e592b3..c3e4193e 100644 --- a/mindplot/src/main/javascript/collaboration/CollaborationManager.js +++ b/mindplot/src/main/javascript/collaboration/CollaborationManager.js @@ -1,32 +1,45 @@ mindplot.collaboration = {}; mindplot.collaboration.CollaborationManager = new Class({ - initialize:function(){ + initialize:function() { this.collaborativeModelReady = false; this.collaborativeModelReady = null; this.wiseReady = false; }, - isCollaborationFrameworkAvailable:function(){ - return $defined(goog.collab.CollaborativeApp); + + isCollaborationFrameworkAvailable:function() { + return (typeof goog != "undefined") && (typeof goog.collab != "undefined"); }, - setCollaborativeFramework:function(framework){ + + setCollaborativeFramework:function(framework) { this._collaborativeFramework = framework; this.collaborativeModelReady = true; - if(this.wiseReady){ + if (this.wiseReady) { buildCollaborativeMindmapDesigner(); } }, - setWiseReady:function(ready){ - this.wiseReady=ready; + + setWiseReady:function(ready) { + this.wiseReady = ready; }, - isCollaborativeFrameworkReady:function(){ + + isCollaborativeFrameworkReady:function() { return this.collaborativeModelReady; }, - buildWiseModel: function(){ + + buildWiseModel: function() { return this._collaborativeFramework.buildWiseModel(); }, - getCollaborativeFramework:function(){ + + getCollaborativeFramework:function() { return this._collaborativeFramework; } + }); -$wise_collaborationManager = new mindplot.collaboration.CollaborationManager(); +mindplot.collaboration.CollaborationManager.getInstance = function() { + if (!$defined(mindplot.collaboration.CollaborationManager.__collaborationManager)) { + mindplot.collaboration.CollaborationManager.__collaborationManager = new mindplot.collaboration.CollaborationManager(); + } + return mindplot.collaboration.CollaborationManager.__collaborationManager; +} +mindplot.collaboration.CollaborationManager.getInstance(); diff --git a/mindplot/src/main/javascript/collaboration/frameworks/brix/BrixFramework.js b/mindplot/src/main/javascript/collaboration/frameworks/brix/BrixFramework.js index aeeb0199..76391a77 100644 --- a/mindplot/src/main/javascript/collaboration/frameworks/brix/BrixFramework.js +++ b/mindplot/src/main/javascript/collaboration/frameworks/brix/BrixFramework.js @@ -1,68 +1,66 @@ - - mindplot.collaboration.frameworks.brix.BrixFramework = new Class({ Extends: mindplot.collaboration.frameworks.AbstractCollaborativeFramework, - initialize: function(model, app){ + initialize: function(model, app) { this._app = app; var collaborativeModelFactory = new mindplot.collaboration.frameworks.brix.BrixCollaborativeModelFactory(this); var cModel = null; var root = this.getBrixModel().getRoot(); - if(!root.isEmpty()){ + if (!root.isEmpty()) { cModel = collaborativeModelFactory.buildCollaborativeModelFor(root.get("mindmap")); } this.parent(cModel, collaborativeModelFactory); }, - addMindmap:function(model){ + addMindmap:function(model) { var root = this.getBrixModel().getRoot(); - root.put("mindmap",model); + root.put("mindmap", model); }, - getBrixModel:function(){ + getBrixModel:function() { return this._app.getModel(); }, - buildWiseModel: function(){ - return this.parent(); + buildWiseModel: function() { + return this.parent(); } }); -instanciated=false; -mindplot.collaboration.frameworks.brix.BrixFramework.instanciate=function(){ - if($defined(isGoogleBrix) && !instanciated){ - instanciated=true; +instanciated = false; +mindplot.collaboration.frameworks.brix.BrixFramework.instanciate = function() { + if ((typeof isGoogleBrix != "undefined") && !instanciated) { + instanciated = true; var app = new goog.collab.CollaborativeApp(); mindplot.collaboration.frameworks.brix.BrixFramework.buildMenu(app); app.start(); - app.addListener('modelLoad', function(model){ + app.addListener('modelLoad', function(model) { var framework = new mindplot.collaboration.frameworks.brix.BrixFramework(model, app); - $wise_collaborationManager.setCollaborativeFramework(framework); + mindplot.collaboration.CollaborationManager.getInstance().setCollaborativeFramework(framework); }.bind(this)); } }; -mindplot.collaboration.frameworks.brix.BrixFramework.buildMenu=function(app){ +mindplot.collaboration.frameworks.brix.BrixFramework.buildMenu = function(app) { var menuBar = new goog.collab.ui.MenuBar(); - // Configure toolbar menu ... - var fileMenu = menuBar.addSubMenu("File"); - fileMenu.addItem("Save", function() { - }); - fileMenu.addItem("Export", function() { - }); + // Configure toolbar menu ... + var fileMenu = menuBar.addSubMenu("File"); + fileMenu.addItem("Save", function() { + }); + fileMenu.addItem("Export", function() { + }); - var editMenu = menuBar.addSubMenu("Edit"); - editMenu.addItem("Undo", function() { - }); - editMenu.addItem("Redo", function() { - }); + var editMenu = menuBar.addSubMenu("Edit"); + editMenu.addItem("Undo", function() { + }); + editMenu.addItem("Redo", function() { + }); - var formatMenu = menuBar.addSubMenu("Format"); - formatMenu.addItem("Bold", function() { - }); + var formatMenu = menuBar.addSubMenu("Format"); + formatMenu.addItem("Bold", function() { + }); - var helpMenu = menuBar.addSubMenu("Help"); - helpMenu.addItem("Shortcuts", function() { - }); + var helpMenu = menuBar.addSubMenu("Help"); + helpMenu.addItem("Shortcuts", function() { + }); - app.setMenuBar(menuBar); + app.setMenuBar(menuBar); }; mindplot.collaboration.frameworks.brix.BrixFramework.instanciate(); diff --git a/mindplot/src/main/javascript/widget/IconPanel.js b/mindplot/src/main/javascript/widget/IconPanel.js index 24195717..8b26f4be 100644 --- a/mindplot/src/main/javascript/widget/IconPanel.js +++ b/mindplot/src/main/javascript/widget/IconPanel.js @@ -69,6 +69,8 @@ mindplot.widget.IconPanel = new Class({ show:function() { this.fireEvent("show"); + $(this._buttonId).className = 'buttonActive'; + if (this.options.state == 'close') { if (!$defined(this.options.panel)) { this.init(); @@ -84,7 +86,6 @@ mindplot.widget.IconPanel = new Class({ this.fireEvent('onStart'); this.registerClosePanel(); this.options.state = 'open'; - } }, @@ -94,6 +95,7 @@ mindplot.widget.IconPanel = new Class({ this.options.panel.setStyles({border: '1px solid transparent', opacity:0}); this.registerOpenPanel(); this.options.state = 'close'; + $(this._buttonId).className = 'button'; } }, diff --git a/mindplot/src/main/javascript/widget/Menu.js b/mindplot/src/main/javascript/widget/Menu.js index 8205d1a6..99f624a5 100644 --- a/mindplot/src/main/javascript/widget/Menu.js +++ b/mindplot/src/main/javascript/widget/Menu.js @@ -37,7 +37,9 @@ mindplot.widget.Menu = new Class({ } }; var fontFamilyPanel = new mindplot.widget.FontFamilyPanel("fontFamily", fontFamilyModel); - fontFamilyPanel.addEvent('show',function(){this.clear()}.bind(this)); + fontFamilyPanel.addEvent('show', function() { + this.clear() + }.bind(this)); this._toolbarElems.push(fontFamilyPanel); var fontSizeModel = { @@ -53,7 +55,9 @@ mindplot.widget.Menu = new Class({ } }; var fontSizePanel = new mindplot.widget.FontSizePanel("fontSize", fontSizeModel); - fontSizePanel.addEvent('show',function(){this.clear()}.bind(this)); + fontSizePanel.addEvent('show', function() { + this.clear() + }.bind(this)); this._toolbarElems.push(fontSizePanel); var topicShapeModel = { @@ -69,7 +73,9 @@ mindplot.widget.Menu = new Class({ } }; var topicShapePanel = new mindplot.widget.TopicShapePanel("topicShape", topicShapeModel); - topicShapePanel.addEvent('show',function(){this.clear()}.bind(this)); + topicShapePanel.addEvent('show', function() { + this.clear() + }.bind(this)); this._toolbarElems.push(topicShapePanel); // Create icon panel dialog ... @@ -82,11 +88,13 @@ mindplot.widget.Menu = new Class({ } }; var iconPanel = new mindplot.widget.IconPanel('topicIcon', topicIconModel); - iconPanel.addEvent('show',function(){this.clear()}.bind(this)); + iconPanel.addEvent('show', function() { + this.clear() + }.bind(this)); this._toolbarElems.push(iconPanel); - var topicColorPicker = new MooRainbow('topicColor', { + var colorPickerOptions = { id: 'topicColor', imgPath: '../images/', startColor: [255, 255, 255], @@ -100,7 +108,8 @@ mindplot.widget.Menu = new Class({ onComplete: function() { this.clear(); }.bind(this) - }); + }; + var topicColorPicker = new MooRainbow('topicColor', colorPickerOptions); this._colorPickers.push(topicColorPicker); var borderColorPicker = new MooRainbow('topicBorder', { @@ -135,6 +144,72 @@ mindplot.widget.Menu = new Class({ }.bind(this) }); this._colorPickers.push(fontColorPicker); + + + // Register Events ... + $('zoomIn').addEvent('click', function(event) { + designer.zoomIn(); + }); + + $('zoomOut').addEvent('click', function(event) { + designer.zoomOut(); + }); + + $('undoEdition').addEvent('click', function(event) { + designer.undo(); + }); + + $('redoEdition').addEvent('click', function(event) { + designer.redo(); + }); + + designer.addEventListener("modelUpdate", function(event) { + if (event.undoSteps > 0) { + $("undoEdition").setStyle("background-image", "url(../images/file_undo.png)"); + } else { + $("undoEdition").setStyle("background-image", "url(../images/file_undo_dis.png)"); + } + + if (event.redoSteps > 0) { + $("redoEdition").setStyle("background-image", "url(../images/file_redo.png)"); + } else { + $("redoEdition").setStyle("background-image", "url(../images/file_redo_dis.png)"); + } + + }); + + $('addTopic').addEvent('click', function(event) { + designer.createSiblingForSelectedNode(); + }); + + $('deleteTopic').addEvent('click', function(event) { + designer.deleteCurrentNode(); + }); + + + $('topicLink').addEvent('click', function(event) { + designer.addLink2SelectedNode(); + + }); + + $('topicRelation').addEvent('click', function(event) { + designer.addRelationShip2SelectedNode(event); + }); + + $('topicNote').addEvent('click', function(event) { + designer.addNote2SelectedNode(); + + }); + + $('fontBold').addEvent('click', function(event) { + designer.setWeight2SelectedNode(); + }); + + $('fontItalic').addEvent('click', function(event) { + designer.setStyle2SelectedNode(); + }); + + }, clear : function() { diff --git a/mindplot/src/main/javascript/widget/ToolbarPanel.js b/mindplot/src/main/javascript/widget/ToolbarPanel.js index 17df4b6d..acd437d7 100644 --- a/mindplot/src/main/javascript/widget/ToolbarPanel.js +++ b/mindplot/src/main/javascript/widget/ToolbarPanel.js @@ -22,6 +22,7 @@ mindplot.widget.ToolbarPanel = new Class({ $assert(buttonId, "buttonId can not be null"); $assert(model, "model can not be null"); this._model = model; + this._buttonId = buttonId; this._panelId = this.initPanel(buttonId); }, @@ -42,10 +43,11 @@ mindplot.widget.ToolbarPanel = new Class({ // Register on toolbar elements ... var menuElems = panelElem.getElements('div'); menuElems.forEach(function(elem) { - elem.addEvent('click', function() { + elem.addEvent('click', function(event) { var value = $defined(elem.getAttribute('model')) ? elem.getAttribute('model') : elem.id; this._model.setValue(value); this.hide(); + event.stopPropagation(); }.bind(this)); }.bind(this)); @@ -77,10 +79,14 @@ mindplot.widget.ToolbarPanel = new Class({ }); $(this._panelId).setStyle('display', 'block'); + // Mark the button as active... + $(this._buttonId).className = 'buttonActive'; }, hide : function() { $(this._panelId).setStyle('display', 'none'); + $(this._buttonId).className = 'button'; + }, isVisible : function() { diff --git a/wise-doc/src/main/webapp/css/editor.css b/wise-doc/src/main/webapp/css/editor.css index 28ae4ea8..86a0670d 100644 --- a/wise-doc/src/main/webapp/css/editor.css +++ b/wise-doc/src/main/webapp/css/editor.css @@ -177,6 +177,27 @@ div#toolbar .button:hover { border: 1px solid black; border-top-color: white; border-left-color: white; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -o-user-select: none; + user-select: none; +} + +div#toolbar .buttonActive { + width: 32px; + height: 36px; + float: left; + margin: 0 1px; + cursor: pointer; + border: 1px solid black; + border-top-color: white; + border-left-color: white; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -o-user-select: none; + user-select: none; } div#toolbar .comboButton:hover { @@ -395,19 +416,13 @@ div#fontColor { div.toolbarPanelLink { cursor: pointer; - font-size: 14px; color: black; font-weight: bold; padding: 0 3px 0 4px; margin: 1px; -} - -div.toolbarPanelLink { cursor: pointer; font-size: 12px; font-weight: bold; - padding: 0 3px 0 4px; - margin: 1px; } div.toolbarPanelLink:hover { diff --git a/wise-doc/src/main/webapp/html/editor.html b/wise-doc/src/main/webapp/html/editor.html index 47c80791..073e2320 100644 --- a/wise-doc/src/main/webapp/html/editor.html +++ b/wise-doc/src/main/webapp/html/editor.html @@ -14,7 +14,6 @@ - diff --git a/wise-doc/src/main/webapp/js/editor.js b/wise-doc/src/main/webapp/js/editor.js index 9c0aa37e..e323c369 100644 --- a/wise-doc/src/main/webapp/js/editor.js +++ b/wise-doc/src/main/webapp/js/editor.js @@ -181,68 +181,6 @@ function afterMindpotLibraryLoading() { $(document).addEvent('keydown', designer.keyEventHandler.bind(designer)); $("ffoxWorkarroundInput").addEvent('keydown', designer.keyEventHandler.bind(designer)); - // Register toolbar events ... - $('zoomIn').addEvent('click', function(event) { - designer.zoomIn(); - }); - - $('zoomOut').addEvent('click', function(event) { - designer.zoomOut(); - }); - - $('undoEdition').addEvent('click', function(event) { - designer.undo(); - }); - - $('redoEdition').addEvent('click', function(event) { - designer.redo(); - }); - - designer.addEventListener("modelUpdate", function(event) { - if (event.undoSteps > 0) { - $("undoEdition").setStyle("background-image", "url(../images/file_undo.png)"); - } else { - $("undoEdition").setStyle("background-image", "url(../images/file_undo_dis.png)"); - } - - if (event.redoSteps > 0) { - $("redoEdition").setStyle("background-image", "url(../images/file_redo.png)"); - } else { - $("redoEdition").setStyle("background-image", "url(../images/file_redo_dis.png)"); - } - - }); - - $('addTopic').addEvent('click', function(event) { - designer.createSiblingForSelectedNode(); - }); - - $('deleteTopic').addEvent('click', function(event) { - designer.deleteCurrentNode(); - }); - - $('topicLink').addEvent('click', function() { - designer.addLink2SelectedNode(); - - }); - - $('topicRelation').addEvent('click', function(event) { - designer.addRelationShip2SelectedNode(event); - }); - - $('topicNote').addEvent('click', function() { - designer.addNote2SelectedNode(); - - }); - - $('fontBold').addEvent('click', function() { - designer.setWeight2SelectedNode(); - }); - - $('fontItalic').addEvent('click', function() { - designer.setStyle2SelectedNode(); - }); - // To prevent the user from leaving the page with changes ... window.onbeforeunload = function () { if (designer.needsSave()) { @@ -252,10 +190,12 @@ function afterMindpotLibraryLoading() { var menu = new mindplot.widget.Menu(designer); // If a node has focus, focus can be move to another node using the keys. - designer._cleanScreen = function(){menu.clear()}; + designer._cleanScreen = function() { + menu.clear() + }; - // If not problem has arisen, close the dialog ... + // If not problem has arisen, close the dialog ... var closeDialog = function() { if (!window.hasUnexpectedErrors) { @@ -283,7 +223,7 @@ function buildMindmapDesigner() { editorProperties.height = screenHeight; designer = new mindplot.MindmapDesigner(editorProperties, container); - if($wise_collaborationManager.isCollaborationFrameworkAvailable()){ + if(mindplot.collaboration.CollaborationManager.getInstance().isCollaborationFrameworkAvailable()){ buildCollaborativeMindmapDesigner(); }else{ buildStandaloneMindmapDesigner(); @@ -295,10 +235,11 @@ function buildStandaloneMindmapDesigner(){ } function buildCollaborativeMindmapDesigner(){ - if($wise_collaborationManager.isCollaborativeFrameworkReady()){ - designer.loadFromCollaborativeModel($wise_collaborationManager); + var collaborationManager = mindplot.collaboration.CollaborationManager.getInstance(); + if(collaborationManager.isCollaborativeFrameworkReady()){ + designer.loadFromCollaborativeModel(collaborationManager); }else{ - $wise_collaborationManager.setWiseReady(true); + collaborationManager.setWiseReady(true); } } diff --git a/wise-webapp/src/main/webapp/js/editor.js b/wise-webapp/src/main/webapp/js/editor.js index 40bac79b..bf9967b6 100644 --- a/wise-webapp/src/main/webapp/js/editor.js +++ b/wise-webapp/src/main/webapp/js/editor.js @@ -157,8 +157,6 @@ Tabs.Init(); // Hide the content while waiting for the onload event to trigger. var contentId = window.location.hash || "#Introduction"; -var iconPanel = null; - function afterMindpotLibraryLoading() { buildMindmapDesigner(); @@ -184,125 +182,11 @@ function afterMindpotLibraryLoading() { }); } - // Crate icon panel dialog ... - iconPanel = new mindplot.widget.IconPanel({button:$('topicIcon'), onStart:cleanScreenEvent}); - iconPanel.addEvent("selected", function(event) { - designer.addIconType2SelectedNode(event.iconType); - }); - // Register Events ... $(document).addEvent('keydown', designer.keyEventHandler.bindWithEvent(designer)); $("ffoxWorkarroundInput").addEvent('keydown', designer.keyEventHandler.bindWithEvent(designer)); - // - $('zoomIn').addEvent('click', function(event) { - designer.zoomIn(); - }); - $('zoomOut').addEvent('click', function(event) { - designer.zoomOut(); - }); - $('undoEdition').addEvent('click', function(event) { - designer.undo(); - }); - - $('redoEdition').addEvent('click', function(event) { - designer.redo(); - }); - - designer.addEventListener("modelUpdate", function(event) { - if (event.undoSteps > 0) { - $("undoEdition").setStyle("background-image", "url(../images/file_undo.png)"); - } else { - $("undoEdition").setStyle("background-image", "url(../images/file_undo_dis.png)"); - } - - if (event.redoSteps > 0) { - $("redoEdition").setStyle("background-image", "url(../images/file_redo.png)"); - } else { - $("redoEdition").setStyle("background-image", "url(../images/file_redo_dis.png)"); - } - - }); - - $('addTopic').addEvent('click', function(event) { - designer.createSiblingForSelectedNode(); - }); - - $('deleteTopic').addEvent('click', function(event) { - designer.deleteCurrentNode(); - }); - - var context = this; - var colorPicker1 = new MooRainbow('topicColor', { - id: 'topicColor', - imgPath: '../images/', - startColor: [255, 255, 255], - onInit: function(color) { - cleanScreenEvent.bind(context).attempt(); - setCurrentColorPicker.attempt(colorPicker1, context); - }, - onChange: function(color) { - designer.setBackColor2SelectedNode(color.hex); - }, - onComplete: function(color) { - removeCurrentColorPicker.attempt(colorPicker1, context); - } - }); - - var colorPicker2 = new MooRainbow('topicBorder', { - id: 'topicBorder', - imgPath: '../images/', - startColor: [255, 255, 255], - onInit: function(color) { - cleanScreenEvent.bind(context).attempt(); - setCurrentColorPicker.attempt(colorPicker2, context); - }, - onChange: function(color) { - designer.setBorderColor2SelectedNode(color.hex); - }, - onComplete: function(color) { - removeCurrentColorPicker.attempt(colorPicker2, context); - } - }); - - $('topicLink').addEvent('click', function(event) { - designer.addLink2SelectedNode(); - - }); - - $('topicRelation').addEvent('click', function(event) { - designer.addRelationShip2SelectedNode(event); - }); - - $('topicNote').addEvent('click', function(event) { - designer.addNote2SelectedNode(); - - }); - - $('fontBold').addEvent('click', function(event) { - designer.setWeight2SelectedNode(); - }); - - $('fontItalic').addEvent('click', function(event) { - designer.setStyle2SelectedNode(); - }); - - var colorPicker3 = new MooRainbow('fontColor', { - id: 'fontColor', - imgPath: '../images/', - startColor: [255, 255, 255], - onInit: function(color) { - cleanScreenEvent.bind(context).attempt(); - setCurrentColorPicker.attempt(colorPicker3, context); - }, - onChange: function(color) { - designer.setFontColor2SelectedNode(color.hex); - }, - onComplete: function(color) { - removeCurrentColorPicker.attempt(colorPicker3, context); - } - }); // Save event handler .... var saveButton = $('saveButton'); @@ -402,10 +286,11 @@ function afterMindpotLibraryLoading() { } } } - // Build panels ... - var fontPanel = new mindplot.widget.FontFamilyPanel(); -// shapeTypePanel(); -// fontSizePanel(); + + var menu = new mindplot.widget.Menu(designer); + + // If a node has focus, focus can be move to another node using the keys. + designer._cleanScreen = function(){menu.clear()}; // If not problem has occured, I close the dialod ... var closeDialog = function() { @@ -416,14 +301,6 @@ function afterMindpotLibraryLoading() { }.delay(500); } -function setCurrentColorPicker(colorPicker) { - this.currentColorPicker = colorPicker; -} - -function removeCurrentColorPicker(colorPicker) { - $clear(this.currentColorPicker); -} - function buildMindmapDesigner() { // Initialize message logger ... @@ -448,10 +325,6 @@ function buildMindmapDesigner() { designer = new mindplot.MindmapDesigner(editorProperties, container); designer.loadFromXML(mapId, mapXml); - // If a node has focus, focus can be move to another node using the keys. - designer._cleanScreen = cleanScreenEvent.bind(this); - - // Save map on load .... if (editorProperties.saveOnLoad) { var saveOnLoad = function() { @@ -462,114 +335,3 @@ function buildMindmapDesigner() { }; -function createColorPalette(container, onSelectFunction, event) { - cleanScreenEvent(); - _colorPalette = new core.ColorPicker(); - _colorPalette.onSelect = function(color) { - onSelectFunction.call(this, color); - cleanScreenEvent(); - }; - - // dojo.event.kwConnect({srcObj: this._colorPalette,srcFunc:"onColorSelect",targetObj:this._colorPalette, targetFunc:"onSelect", once:true}); - var mouseCoords = core.Utils.getMousePosition(event); - var colorPaletteElement = $("colorPalette"); - colorPaletteElement.setStyle('left', (mouseCoords.x - 80) + "px"); - colorPaletteElement.setStyle('display', "block"); -} -; - -function cleanScreenEvent() { - if (this.currentColorPicker) { - this.currentColorPicker.hide(); - } - $("fontFamilyPanel").setStyle('display', "none"); - $("fontSizePanel").setStyle('display', "none"); - $("topicShapePanel").setStyle('display', "none"); - iconPanel.close(); -} - -function shapeTypePanel() { - var shapeTypePanel = ['rectagle','rounded_rectagle','line','elipse']; - var updateFunction = function(value) { - designer.setShape2SelectedNode(value.replace('_', ' ')); - }; - - var onFocusValue = function(selectedNode) { - - return selectedNode.getShapeType().replace(' ', '_'); - }; - - buildPanel('topicShape', 'topicShapePanel', shapeTypePanel, updateFunction, onFocusValue); -} - -function fontSizePanel() { - var shapeTypePanel = ['small','normal','large','huge']; - var map = {small:'6',normal:'8',large:'10',huge:'15'}; - var updateFunction = function(value) { - var nodes = designer.getSelectedNodes(); - var value = map[value]; - designer.setFontSize2SelectedNode(value); - }; - - var onFocusValue = function(selectedNode) { - var fontSize = selectedNode.getFontSize(); - var result = ""; - if (fontSize <= 6) { - result = 'small'; - } else if (fontSize <= 8) { - result = 'normal'; - } else if (fontSize <= 10) { - result = 'large'; - } else if (fontSize >= 15) { - result = 'huge'; - } - return result; - }; - buildPanel('fontSize', 'fontSizePanel', shapeTypePanel, updateFunction, onFocusValue); -} - -function buildPanel(buttonElemId, elemLinksContainer, elemLinkIds, updateFunction, onFocusValue) { - // Font family event handling .... - $(buttonElemId).addEvent('click', function(event) { - var container = $(elemLinksContainer); - var isRendered = container.getStyle('display') == 'block'; - cleanScreenEvent(); - - // Restore default css. - for (var i = 0; i < elemLinkIds.length; i++) { - var elementId = elemLinkIds[i]; - $(elementId).className = 'toolbarPanelLink'; - } - - // Select current element ... - var nodes = designer.getSelectedNodes(); - var lenght = nodes.length; - if (lenght == 1) { - var selectedNode = nodes[0]; - var selectedElementId = onFocusValue(selectedNode); - selectedElementId = selectedElementId.toLowerCase(); - var selectedElement = $(selectedElementId); - selectedElement.className = 'toolbarPanelLinkSelectedLink'; - } - - container.setStyle('display', 'block'); - - var mouseCoords = core.Utils.getMousePosition(event); - if (!isRendered) { - container.setStyle('left', (mouseCoords.x - 10) + "px"); - } - - }); - - var fontOnClick = function(event) { - var value = this.getAttribute('id'); - updateFunction(value); - cleanScreenEvent(); - }; - - // Register event listeners on elements ... - for (var i = 0; i < elemLinkIds.length; i++) { - var elementId = elemLinkIds[i]; - $(elementId).addEvent('click', fontOnClick.bind($(elementId))); - } -}