From f82f024fb7e9b43dfc0bb39f16af003e56255bab Mon Sep 17 00:00:00 2001 From: Paulo Gustavo Veiga Date: Tue, 20 Mar 2012 08:56:20 -0300 Subject: [PATCH] Add support for click event node registration. --- mindplot/pom.xml | 2 +- mindplot/src/main/javascript/Designer.js | 17 ++++++++-------- mindplot/src/main/javascript/Topic.js | 20 ++++++++++--------- ...TopicEditor.js => TopicEventDispatcher.js} | 18 +++++++++++++---- wise-editor/src/main/webapp/html/drag.html | 18 +++++++++++++---- 5 files changed, 49 insertions(+), 26 deletions(-) rename mindplot/src/main/javascript/{TopicEditor.js => TopicEventDispatcher.js} (80%) diff --git a/mindplot/pom.xml b/mindplot/pom.xml index 8176743d..329199b0 100644 --- a/mindplot/pom.xml +++ b/mindplot/pom.xml @@ -51,7 +51,7 @@ - + diff --git a/mindplot/src/main/javascript/Designer.js b/mindplot/src/main/javascript/Designer.js index 656bd697..6d1ee115 100644 --- a/mindplot/src/main/javascript/Designer.js +++ b/mindplot/src/main/javascript/Designer.js @@ -61,7 +61,7 @@ mindplot.Designer = new Class({ // Set editor working area ... this.setViewPort(options.viewPort); - mindplot.TopicEditor.configure(this.isReadOnly()); + mindplot.TopicEventDispatcher.configure(this.isReadOnly()); }, /** @@ -71,6 +71,10 @@ mindplot.Designer = new Class({ mindplot.DesignerKeyboard.getInstance().deactivate(); this.deselectAll(); }, + + /** + * Activates the keyboard events so you can enter text into forms + */ activateKeyboard: function() { mindplot.DesignerKeyboard.getInstance().activate(); }, @@ -85,8 +89,8 @@ mindplot.Designer = new Class({ }, addEvent: function(type, listener) { - if (type == "editnode") { - var editor = mindplot.TopicEditor.getInstance(); + if (type == mindplot.TopicEvent.EDIT || type == mindplot.TopicEvent.CLICK) { + var editor = mindplot.TopicEventDispatcher.getInstance(); editor.addEvent(type, listener); } else { this.parent(type, listener); @@ -294,7 +298,7 @@ mindplot.Designer = new Class({ object.setOnFocus(false); }); }, - + /** * Set the zoom of the map. * @param: zoom: number between 0.3 and 1.9 @@ -302,16 +306,13 @@ mindplot.Designer = new Class({ setZoom: function(zoom) { if (zoom > 1.9 || zoom < 0.3) { $notify("Zoom too high. Cannot apply zoom above 1.9 or below 0.3"); - console.log("Tried to set zoom to " + zoom + " which is utside allowed range."); + console.log("Tried to set zoom to " + zoom + " which is outside allowed range."); return; } this.getModel().setZoom(zoom); this._workspace.setZoom(zoom); - }, - - zoomOut : function(factor) { if (!factor) factor = 1.2; diff --git a/mindplot/src/main/javascript/Topic.js b/mindplot/src/main/javascript/Topic.js index 1e6273ca..cbaebb49 100644 --- a/mindplot/src/main/javascript/Topic.js +++ b/mindplot/src/main/javascript/Topic.js @@ -49,7 +49,7 @@ mindplot.Topic = new Class({ }); this.addEvent('dblclick', function (event) { - this._getTopicEditor().show(this); + this._getTopicEventDispatcher().show(this); event.stopPropagation(true); }.bind(this)); }, @@ -583,7 +583,7 @@ mindplot.Topic = new Class({ elem.addEvent('mouseout', outout); // Focus events ... - var mouseDown = function(event) { + elem.addEvent('mousedown', function(event) { var value = true; if ((event.meta && Browser.Platform.mac) || (event.control && !Browser.Platform.mac)) { value = !this.isOnFocus(); @@ -591,8 +591,10 @@ mindplot.Topic = new Class({ event.preventDefault(); } topic.setOnFocus(value); - }.bind(this); - elem.addEvent('mousedown', mouseDown); + + var eventDispatcher = this._getTopicEventDispatcher(); + eventDispatcher.process(mindplot.TopicEvent.CLICK, this); + }.bind(this)); }, areChildrenShrunken : function() { @@ -658,7 +660,7 @@ mindplot.Topic = new Class({ }, showTextEditor : function(text) { - this._getTopicEditor().show(this, {text:text}); + this._getTopicEventDispatcher().show(this, {text:text}); }, showNoteEditor : function() { @@ -735,11 +737,11 @@ mindplot.Topic = new Class({ }, closeEditors : function() { - this._getTopicEditor().close(true); + this._getTopicEventDispatcher().close(true); }, - _getTopicEditor : function() { - return mindplot.TopicEditor.getInstance(); + _getTopicEventDispatcher : function() { + return mindplot.TopicEventDispatcher.getInstance(); }, /** @@ -1128,7 +1130,7 @@ mindplot.Topic = new Class({ } // If a drag node is create for it, let's hide the editor. - this._getTopicEditor().close(); + this._getTopicEventDispatcher().close(); return result; }, diff --git a/mindplot/src/main/javascript/TopicEditor.js b/mindplot/src/main/javascript/TopicEventDispatcher.js similarity index 80% rename from mindplot/src/main/javascript/TopicEditor.js rename to mindplot/src/main/javascript/TopicEventDispatcher.js index c85f70ed..5e37869e 100644 --- a/mindplot/src/main/javascript/TopicEditor.js +++ b/mindplot/src/main/javascript/TopicEventDispatcher.js @@ -16,13 +16,13 @@ * limitations under the License. */ -mindplot.TopicEditor = new Class({ +mindplot.TopicEventDispatcher = new Class({ Extends: Events, Static: { _instance: null, configure: function(readOnly) { - this._instance = new mindplot.TopicEditor(readOnly); + this._instance = new mindplot.TopicEventDispatcher(readOnly); }, getInstance : function() { @@ -44,6 +44,10 @@ mindplot.TopicEditor = new Class({ }, show : function(topic, options) { + this.process(mindplot.TopicEvent.EDIT, topic, options); + }, + + process : function(eventType, topic, options) { // Close all previous open editor .... if (this.isVisible()) { @@ -52,11 +56,11 @@ mindplot.TopicEditor = new Class({ // Open the new editor ... var model = topic.getModel(); - if (model.getShapeType() != mindplot.model.TopicShape.IMAGE && !this._readOnly) { + if (model.getShapeType() != mindplot.model.TopicShape.IMAGE && !this._readOnly && eventType == mindplot.TopicEvent.EDIT) { this._multilineEditor.show(topic, options ? options.text : null); this._activeEditor = this._multilineEditor; } else { - this.fireEvent("editnode", {model:model,readOnly:this._readOnly}); + this.fireEvent(eventType, {model:model,readOnly:this._readOnly}); } }, @@ -65,3 +69,9 @@ mindplot.TopicEditor = new Class({ } }); + +mindplot.TopicEvent = { + EDIT : "editnode", + CLICK : "clicknode" +}; + diff --git a/wise-editor/src/main/webapp/html/drag.html b/wise-editor/src/main/webapp/html/drag.html index c27162a6..901f5509 100644 --- a/wise-editor/src/main/webapp/html/drag.html +++ b/wise-editor/src/main/webapp/html/drag.html @@ -73,12 +73,22 @@ designer.addDraggedNode(event, node); }); - designer.addEvent("editnode", function(event) { + designer.addEvent(mindplot.TopicEvent.EDIT, function(event) { var node = event.model; - alert("Node Id:" + node.getId()); - alert("Node Metadata:" + node.getMetadata()); - alert("Is Read Only:" + event.readOnly); + console.log("Event: edit"); + console.log("Node Id:" + node.getId()); + console.log("Node Metadata:" + node.getMetadata()); + console.log("Is Read Only:" + event.readOnly); + }); + + designer.addEvent(mindplot.TopicEvent.CLICK, function(event) { + var node = event.model; + + console.log("Event: click"); + console.log("Node Id:" + node.getId()); + console.log("Node Metadata:" + node.getMetadata()); + console.log("Is Read Only:" + event.readOnly); }); });