diff --git a/mindplot/src/main/javascript/DragManager.js b/mindplot/src/main/javascript/DragManager.js index 95704413..3c34a154 100644 --- a/mindplot/src/main/javascript/DragManager.js +++ b/mindplot/src/main/javascript/DragManager.js @@ -20,6 +20,7 @@ mindplot.DragManager = function(workspace) { this._workspace = workspace; this._listeners = {}; + }; mindplot.DragManager.prototype.add = function(node) @@ -43,11 +44,11 @@ mindplot.DragManager.prototype.add = function(node) // Register mouse move listener ... var mouseMoveListener = dragManager._buildMouseMoveListener(workspace, dragNode, dragManager); - screen.addEventListener('mousemove', mouseMoveListener); + screen.addEvent('mousemove', mouseMoveListener); // Register mouse up listeners ... var mouseUpListener = dragManager._buildMouseUpListener(workspace, node, dragNode, dragManager); - screen.addEventListener('mouseup', mouseUpListener); + screen.addEvent('mouseup', mouseUpListener); // Execute Listeners .. var startDragListener = dragManager._listeners['startdragging']; @@ -57,8 +58,6 @@ mindplot.DragManager.prototype.add = function(node) window.document.body.style.cursor = 'move'; } }; - dragManager._mouseDownListener = mouseDownListener; - node.addEventListener('mousedown', mouseDownListener); }; @@ -102,7 +101,8 @@ mindplot.DragManager.prototype._buildMouseMoveListener = function(workspace, dra } event.preventDefault(); - }.bindWithEvent(this); + + }.bind(this); dragManager._mouseMoveListener = result; return result; }; @@ -122,8 +122,8 @@ mindplot.DragManager.prototype._buildMouseUpListener = function(workspace, node, } // Remove all the events. - screen.removeEventListener('mousemove', dragManager._mouseMoveListener); - screen.removeEventListener('mouseup', dragManager._mouseUpListener); + screen.removeEvent('mousemove', dragManager._mouseMoveListener); + screen.removeEvent('mouseup', dragManager._mouseUpListener); // Help GC dragManager._mouseMoveListener = null; @@ -157,6 +157,4 @@ mindplot.DragManager.prototype._buildMouseUpListener = function(workspace, node, mindplot.DragManager.prototype. addEventListener = function(type, listener) { this._listeners[type] = listener; -}; - -mindplot.DragManager.DRAG_PRECISION_IN_SEG = 100; +}; \ No newline at end of file diff --git a/mindplot/src/main/javascript/MindmapDesigner.js b/mindplot/src/main/javascript/MindmapDesigner.js index bd1e986f..467b587e 100644 --- a/mindplot/src/main/javascript/MindmapDesigner.js +++ b/mindplot/src/main/javascript/MindmapDesigner.js @@ -24,8 +24,8 @@ mindplot.MindmapDesigner = new Class({ // Dispatcher manager ... var commandContext = new mindplot.CommandContext(this); - this._actionDispatcher = new mindplot.BrixActionDispatcher(commandContext); -// this._actionDispatcher = new mindplot.LocalActionDispatcher(commandContext); +// this._actionDispatcher = new mindplot.BrixActionDispatcher(commandContext); + this._actionDispatcher = new mindplot.LocalActionDispatcher(commandContext); this._actionDispatcher.addEvent("modelUpdate", function(event) { this._fireEvent("modelUpdate", event); @@ -39,7 +39,6 @@ mindplot.MindmapDesigner = new Class({ // Init Screen manager.. var screenManager = new mindplot.ScreenManager(profile.width, profile.height, divElement); - this._workspace = new mindplot.Workspace(profile, screenManager, this._zoom); //create editor @@ -77,35 +76,37 @@ mindplot.MindmapDesigner = new Class({ }, _registerEvents : function() { - var mindmapDesigner = this; var workspace = this._workspace; var screenManager = workspace.getScreenManager(); if (!$defined(this._viewMode) || ($defined(this._viewMode) && !this._viewMode)) { // Initialize workspace event listeners. - // Create nodes on double click... - screenManager.addEventListener('click', function(event) { - if (workspace.isWorkspaceEventsEnabled()) { - mindmapDesigner.getEditor().isVisible(); - mindmapDesigner.getEditor().lostFocus(); - // @todo: Puaj hack... - mindmapDesigner._cleanScreen(); - } - }); + screenManager.addEvent('drag', function(event) { + // Clean some selected nodes on envet .. + this.getEditor().lostFocus(); + this._cleanScreen(); + }.bind(this)); - screenManager.addEventListener('dblclick', function(event) { + // Deselect on click ... + // @Todo: Arreglar en el screen manager que si hay drag, no hay click... + screenManager.addEvent('click', function(event) { + this.onObjectFocusEvent(null, event); + }.bind(this)); + + // Create nodes on double click... + screenManager.addEvent('dblclick', function(event) { if (workspace.isWorkspaceEventsEnabled()) { - mindmapDesigner.getEditor().lostFocus(); + this.getEditor().lostFocus(); // Get mouse position var pos = screenManager.getWorkspaceMousePosition(event); // Create a new topic model ... - var mindmap = mindmapDesigner.getMindmap(); + var mindmap = this.getMindmap(); var model = mindmap.createNode(mindplot.model.NodeModel.MAIN_TOPIC_TYPE); model.setPosition(pos.x, pos.y); // Get central topic ... - var centralTopic = mindmapDesigner.getCentralTopic(); + var centralTopic = this.getCentralTopic(); var centralTopicId = centralTopic.getId(); // Execute action ... @@ -159,7 +160,7 @@ mindplot.MindmapDesigner = new Class({ var selectableObjects = this.getSelectedObjects(); // Disable all nodes on focus but not the current if Ctrl key isn't being pressed - if (!$defined(event) || (event.ctrlKey == false && event.metaKey == false)) { + if (!$defined(event) || (!event.ctrlKey && !event.metaKey)) { selectableObjects.forEach(function(selectableObject) { if (selectableObject.isOnFocus() && selectableObject != currentObject) { selectableObject.setOnFocus(false); @@ -262,8 +263,9 @@ mindplot.MindmapDesigner = new Class({ this._creatingRelationship = true; this._relationshipMouseMoveFunction = this._relationshipMouseMove.bindWithEvent(this); this._relationshipMouseClickFunction = this._relationshipMouseClick.bindWithEvent(this, selectedTopics[0]); - this._workspace.getScreenManager().addEventListener('mousemove', this._relationshipMouseMoveFunction); - this._workspace.getScreenManager().addEventListener('click', this._relationshipMouseClickFunction); + + screen.addEvent('mousemove', this._relationshipMouseMoveFunction); + screen.addEvent('click', this._relationshipMouseClickFunction); } }, @@ -287,8 +289,8 @@ mindplot.MindmapDesigner = new Class({ } this._workspace.removeChild(this._relationship); this._relationship = null; - this._workspace.getScreenManager().removeEventListener('mousemove', this._relationshipMouseMoveFunction); - this._workspace.getScreenManager().removeEventListener('click', this._relationshipMouseClickFunction); + this._workspace.getScreenManager().removeEvent('mousemove', this._relationshipMouseMoveFunction); + this._workspace.getScreenManager().removeEvent('click', this._relationshipMouseClickFunction); this._creatingRelationship = false; this._workspace.enableWorkspaceEvents(true); event.preventDefault(); @@ -894,6 +896,8 @@ mindplot.MindmapDesigner = new Class({ this._goToChild(node); } } + } else { + this._goToNode(this._topics[0]); } break; case 'left': @@ -911,6 +915,8 @@ mindplot.MindmapDesigner = new Class({ this._goToChild(node); } } + } else { + this._goToNode(this._topics[0]); } break; case'up': @@ -920,6 +926,8 @@ mindplot.MindmapDesigner = new Class({ if (node.getTopicType() != mindplot.model.NodeModel.CENTRAL_TOPIC_TYPE) { this._goToBrother(node, 'UP'); } + } else { + this._goToNode(this._topics[0]); } break; case 'down': @@ -929,6 +937,8 @@ mindplot.MindmapDesigner = new Class({ if (node.getTopicType() != mindplot.model.NodeModel.CENTRAL_TOPIC_TYPE) { this._goToBrother(node, 'DOWN'); } + } else { + this._goToNode(this._topics[0]); } break; case 'f2': diff --git a/mindplot/src/main/javascript/ScreenManager.js b/mindplot/src/main/javascript/ScreenManager.js index 1ca5364c..f7d1fe4b 100644 --- a/mindplot/src/main/javascript/ScreenManager.js +++ b/mindplot/src/main/javascript/ScreenManager.js @@ -21,6 +21,10 @@ mindplot.ScreenManager = new Class({ $assert(divElement, "can not be null"); this._divContainer = divElement; this._offset = {x:0,y:0}; + + // Ignore default click event propagation. Prevent 'click' event on drad. + this._clickEvents = []; + this._divContainer.addEvent('click',function(event){event.stopPropagation()}); }, setScale : function(scale) { @@ -28,12 +32,30 @@ mindplot.ScreenManager = new Class({ this._workspaceScale = scale; }, - addEventListener : function(event, listener) { - $(this._divContainer).addEvent(event, listener); + addEvent : function(event, listener) { + if (event == 'click') + this._clickEvents.push(listener); + else + $(this._divContainer).addEvent(event, listener); }, - removeEventListener : function(event, listener) { - $(this._divContainer).removeEvent(event, listener); + removeEvent : function(event, listener) { + if (event == 'click') + this._clickEvents.remove(listener); + else + $(this._divContainer).removeEvent(event, listener); + }, + + fireEvent : function(type, event) { + if (type == 'click') { + this._clickEvents.forEach(function(listener) + { + listener(type,event); + }); + } + else { + $(this._divContainer).fireEvent(type, event); + } }, getWorkspaceElementPosition : function(e) { @@ -94,7 +116,7 @@ mindplot.ScreenManager = new Class({ }, getWorkspaceMousePosition : function(e) { - // Retrive current mouse position. + // Retrieve current mouse position. var mousePosition = this._getMousePosition(e); var x = mousePosition.x; var y = mousePosition.y; diff --git a/mindplot/src/main/javascript/Topic.js b/mindplot/src/main/javascript/Topic.js index f4cb264d..05eb5c4c 100644 --- a/mindplot/src/main/javascript/Topic.js +++ b/mindplot/src/main/javascript/Topic.js @@ -63,7 +63,6 @@ mindplot.Topic = new Class({ innerShape = this.getInnerShape(); //Let's register all the events. The first one is the default one. The others will be copied. - //this._registerDefaultListenersToElement(innerShape, this); var dispatcher = dispatcherByEventType['mousedown']; if ($defined(dispatcher)) { @@ -416,7 +415,7 @@ mindplot.Topic = new Class({ } } - // Positionate node ... + // Position node ... this._offset = this.getOffset(); var iconOffset = this.getIconOffset(); result.setPosition(iconOffset + this._offset, this._offset / 2); @@ -664,9 +663,6 @@ mindplot.Topic = new Class({ // Register listeners ... this._registerDefaultListenersToElement(group, this); -// this._registerDefaultListenersToElement(innerShape, this); -// this._registerDefaultListenersToElement(textShape, this); - }, _registerDefaultListenersToElement : function(elem, topic) { @@ -1051,12 +1047,12 @@ mindplot.Topic = new Class({ targetTopic._appendChild(this); this._parent = targetTopic; -// Update model ... + // Update model ... var targetModel = targetTopic.getModel(); var childModel = this.getModel(); childModel.connectTo(targetModel); -// Update topic position based on the state ... + // Update topic position based on the state ... mindplot.EventBus.instance.fireEvent(mindplot.EventBus.events.NodeConnectEvent, [targetTopic, this]); // Create a connection line ... diff --git a/mindplot/src/main/javascript/Workspace.js b/mindplot/src/main/javascript/Workspace.js index 31250991..98707115 100644 --- a/mindplot/src/main/javascript/Workspace.js +++ b/mindplot/src/main/javascript/Workspace.js @@ -142,23 +142,25 @@ mindplot.Workspace = new Class({ }, dumpNativeChart: function() { - var workspace = this._workspace; - return workspace.dumpNativeChart(); + return this._workspace.dumpNativeChart(); }, + _registerDragEvents: function() { var workspace = this._workspace; var screenManager = this._screenManager; - this._dragging = true; var mWorkspace = this; var mouseDownListener = function(event) { - if (!$defined(workspace.mouseMoveListener)) { - if (mWorkspace.isWorkspaceEventsEnabled()) { + if (!$defined(workspace._mouseMoveListener)) + { + if (mWorkspace.isWorkspaceEventsEnabled()) + { mWorkspace.enableWorkspaceEvents(false); var mouseDownPosition = screenManager.getWorkspaceMousePosition(event); var originalCoordOrigin = workspace.getCoordOrigin(); - workspace.mouseMoveListener = function(event) { + var wasDragged = false; + workspace._mouseMoveListener = function(event) { var currentMousePosition = screenManager.getWorkspaceMousePosition(event); @@ -177,30 +179,41 @@ mindplot.Workspace = new Class({ window.document.body.style.cursor = "move"; } event.preventDefault(); - }.bindWithEvent(this); - screenManager.addEventListener('mousemove', workspace.mouseMoveListener); + + // Fire drag event ... + screenManager.fireEvent('drag',new Event()); + wasDragged = true; + + + }.bind(this); + screenManager.addEvent('mousemove', workspace._mouseMoveListener); // Register mouse up listeners ... - workspace.mouseUpListener = function(event) { + workspace._mouseUpListener = function(event) { - screenManager.removeEventListener('mousemove', workspace.mouseMoveListener); - screenManager.removeEventListener('mouseup', workspace.mouseUpListener); - workspace.mouseUpListener = null; - workspace.mouseMoveListener = null; + screenManager.removeEvent('mousemove', workspace._mouseMoveListener); + screenManager.removeEvent('mouseup', workspace._mouseUpListener); + workspace._mouseUpListener = null; + workspace._mouseMoveListener = null; window.document.body.style.cursor = 'default'; // Update screen manager offset. var coordOrigin = workspace.getCoordOrigin(); screenManager.setOffset(coordOrigin.x, coordOrigin.y); mWorkspace.enableWorkspaceEvents(true); - }, - screenManager.addEventListener('mouseup', workspace.mouseUpListener); + + if(!wasDragged) + { + screenManager.fireEvent('click',new Event()); + } + }; + screenManager.addEvent('mouseup', workspace._mouseUpListener); } } else { - workspace.mouseUpListener(); + workspace._mouseUpListener(); } }; - screenManager.addEventListener('mousedown', mouseDownListener); + screenManager.addEvent('mousedown', mouseDownListener); } }); diff --git a/mindplot/src/main/javascript/layout/OriginalLayoutManager.js b/mindplot/src/main/javascript/layout/OriginalLayoutManager.js index fb08b1bd..8ddd55ef 100644 --- a/mindplot/src/main/javascript/layout/OriginalLayoutManager.js +++ b/mindplot/src/main/javascript/layout/OriginalLayoutManager.js @@ -124,8 +124,11 @@ mindplot.layout.OriginalLayoutManager = new Class({ registerListenersOnNode : function(topic) { // Register node listeners ... var designer = this.getDesigner(); - topic.addEventListener('onfocus', function(event) { + topic.addEventListener('click', function(event) { designer.onObjectFocusEvent(topic, event); + + // Prevent click on the topics being propagated ... + event.stopPropagation(); }); // Add drag behaviour ... diff --git a/wise-doc/bugs.txt b/wise-doc/bugs.txt index 3069272c..032e0706 100644 --- a/wise-doc/bugs.txt +++ b/wise-doc/bugs.txt @@ -1,4 +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. +- Que el click del workspace unseleccione los nodos. +- Resize de la ventana ajuste el workspace +- Fixiar metodo de drag del workspace... diff --git a/wise-doc/src/main/webapp/html/editor.html b/wise-doc/src/main/webapp/html/editor.html index c990ca8b..9d327830 100644 --- a/wise-doc/src/main/webapp/html/editor.html +++ b/wise-doc/src/main/webapp/html/editor.html @@ -5,7 +5,7 @@ - +