Add 18n support to the editor.

This commit is contained in:
Paulo Gustavo Veiga
2012-07-01 17:21:02 -03:00
parent cd46647602
commit 2757a5ddb4
16 changed files with 878 additions and 333 deletions

View File

@@ -71,7 +71,7 @@ mindplot.CentralTopic = new Class({
},
_defaultText : function() {
return "Central Topic";
return $msg('CENTRAL_TOPIC');
},
_defaultBackgroundColor : function() {

View File

@@ -17,12 +17,15 @@
*/
mindplot.Designer = new Class({
Extends: Events,
initialize: function(options, divElement) {
Extends:Events,
initialize:function (options, divElement) {
$assert(options, "options must be defined");
$assert(options.zoom, "zoom must be defined");
$assert(divElement, "divElement must be defined");
// Set up i18n location ...
mindplot.Messages.init(options.location);
this._options = options;
// Set full div elem render area ...
@@ -36,7 +39,7 @@ mindplot.Designer = new Class({
this._actionDispatcher = new mindplot.BrixActionDispatcher(commandContext);
}
this._actionDispatcher.addEvent("modelUpdate", function(event) {
this._actionDispatcher.addEvent("modelUpdate", function (event) {
this.fireEvent("modelUpdate", event);
}.bind(this));
@@ -67,7 +70,7 @@ mindplot.Designer = new Class({
/**
* Deactivates the keyboard events so you can enter text into forms
*/
deactivateKeyboard: function() {
deactivateKeyboard:function () {
mindplot.DesignerKeyboard.getInstance().deactivate();
this.deselectAll();
},
@@ -75,12 +78,12 @@ mindplot.Designer = new Class({
/**
* Activates the keyboard events so you can enter text into forms
*/
activateKeyboard: function() {
activateKeyboard:function () {
mindplot.DesignerKeyboard.getInstance().activate();
},
_registerEvents : function() {
_registerEvents:function () {
// Register mouse events ...
this._registerMouseEvents();
@@ -88,7 +91,7 @@ mindplot.Designer = new Class({
mindplot.DesignerKeyboard.register(this);
},
addEvent: function(type, listener) {
addEvent:function (type, listener) {
if (type == mindplot.TopicEvent.EDIT || type == mindplot.TopicEvent.CLICK) {
var editor = mindplot.TopicEventDispatcher.getInstance();
editor.addEvent(type, listener);
@@ -97,15 +100,15 @@ mindplot.Designer = new Class({
}
},
_registerMouseEvents : function() {
_registerMouseEvents:function () {
var workspace = this._workspace;
var screenManager = workspace.getScreenManager();
// Initialize workspace event listeners.
screenManager.addEvent('update', function() {
screenManager.addEvent('update', function () {
// Topic must be set to his original state. All editors must be closed.
var topics = this.getModel().getTopics();
topics.forEach(function(object) {
topics.forEach(function (object) {
object.closeEditors();
});
@@ -116,12 +119,12 @@ mindplot.Designer = new Class({
}.bind(this));
// Deselect on click ...
screenManager.addEvent('click', function(event) {
screenManager.addEvent('click', function (event) {
this.onObjectFocusEvent(null, event);
}.bind(this));
// Create nodes on double click...
screenManager.addEvent('dblclick', function(event) {
screenManager.addEvent('dblclick', function (event) {
if (workspace.isWorkspaceEventsEnabled()) {
var mousePos = screenManager.getWorkspaceMousePosition(event);
@@ -133,7 +136,7 @@ mindplot.Designer = new Class({
}.bind(this));
$(document).addEvent('mousewheel', function(event) {
$(document).addEvent('mousewheel', function (event) {
// Change mousewheel handling so we let the default
//event happen if we are outside the container.
var coords = screenManager.getContainer().getCoordinates();
@@ -155,21 +158,21 @@ mindplot.Designer = new Class({
},
_buildDragManager: function(workspace) {
_buildDragManager:function (workspace) {
var designerModel = this.getModel();
var dragConnector = new mindplot.DragConnector(designerModel, this._workspace);
var dragManager = new mindplot.DragManager(workspace, this._eventBussDispatcher);
var topics = designerModel.getTopics();
dragManager.addEvent('startdragging', function() {
dragManager.addEvent('startdragging', function () {
// Enable all mouse events.
for (var i = 0; i < topics.length; i++) {
topics[i].setMouseEventsEnabled(false);
}
});
dragManager.addEvent('dragging', function(event, dragTopic) {
dragManager.addEvent('dragging', function (event, dragTopic) {
dragTopic.updateFreeLayout(event);
if (!dragTopic.isFreeLayoutOn(event)) {
// The node is being drag. Is the connection still valid ?
@@ -181,7 +184,7 @@ mindplot.Designer = new Class({
}
});
dragManager.addEvent('enddragging', function(event, dragTopic) {
dragManager.addEvent('enddragging', function (event, dragTopic) {
for (var i = 0; i < topics.length; i++) {
topics[i].setMouseEventsEnabled(true);
}
@@ -191,14 +194,14 @@ mindplot.Designer = new Class({
return dragManager;
},
setViewPort : function(size) {
setViewPort:function (size) {
this._workspace.setViewPort(size);
var model = this.getModel();
this._workspace.setZoom(model.getZoom(), true);
},
_buildNodeGraph : function(model, readOnly) {
_buildNodeGraph:function (model, readOnly) {
var workspace = this._workspace;
// Create node graph ...
@@ -210,7 +213,7 @@ mindplot.Designer = new Class({
// Add Topic events ...
if (!readOnly) {
// If a node had gained focus, clean the rest of the nodes ...
topic.addEvent('mousedown', function(event) {
topic.addEvent('mousedown', function (event) {
this.onObjectFocusEvent(topic, event);
}.bind(this));
@@ -243,7 +246,7 @@ mindplot.Designer = new Class({
topic.connectTo(targetTopic, workspace);
}
topic.addEvent('ontblur', function() {
topic.addEvent('ontblur', function () {
var topics = this.getModel().filterSelectedTopics();
var rels = this.getModel().filterSelectedRelations();
@@ -252,7 +255,7 @@ mindplot.Designer = new Class({
}
}.bind(this));
topic.addEvent('ontfocus', function() {
topic.addEvent('ontfocus', function () {
var topics = this.getModel().filterSelectedTopics();
var rels = this.getModel().filterSelectedRelations();
@@ -264,16 +267,16 @@ mindplot.Designer = new Class({
return topic;
},
onObjectFocusEvent : function(currentObject, event) {
onObjectFocusEvent:function (currentObject, event) {
// Close node editors ..
var topics = this.getModel().getTopics();
topics.forEach(function(topic) {
topics.forEach(function (topic) {
topic.closeEditors();
});
var model = this.getModel();
var objects = model.getObjects();
objects.forEach(function(object) {
objects.forEach(function (object) {
// Disable all nodes on focus but not the current if Ctrl key isn't being pressed
if (!$defined(event) || (!event.control && !event.meta)) {
if (object.isOnFocus() && object != currentObject) {
@@ -284,17 +287,17 @@ mindplot.Designer = new Class({
},
selectAll : function() {
selectAll:function () {
var model = this.getModel();
var objects = model.getObjects();
objects.forEach(function(object) {
objects.forEach(function (object) {
object.setOnFocus(true);
});
},
deselectAll : function() {
deselectAll:function () {
var objects = this.getModel().getObjects();
objects.forEach(function(object) {
objects.forEach(function (object) {
object.setOnFocus(false);
});
},
@@ -303,17 +306,16 @@ mindplot.Designer = new Class({
* Set the zoom of the map.
* @param: zoom: number between 0.3 and 1.9
*/
setZoom: function(zoom) {
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 outside allowed range.");
$notify($msg('ZOOM_IN_ERROR'));
return;
}
this.getModel().setZoom(zoom);
this._workspace.setZoom(zoom);
},
zoomOut : function(factor) {
zoomOut:function (factor) {
if (!factor)
factor = 1.2;
@@ -324,12 +326,12 @@ mindplot.Designer = new Class({
this._workspace.setZoom(scale);
}
else {
$notify('No more zoom can be applied');
$notify($msg('ZOOM_ERROR'));
}
},
zoomIn : function(factor) {
zoomIn:function (factor) {
if (!factor)
factor = 1.2;
@@ -341,26 +343,26 @@ mindplot.Designer = new Class({
this._workspace.setZoom(scale);
}
else {
$notify('No more zoom can be applied');
$notify($msg('ZOOM_ERROR'));
}
},
getModel : function() {
getModel:function () {
return this._model;
},
createChildForSelectedNode : function() {
createChildForSelectedNode:function () {
var nodes = this.getModel().filterSelectedTopics();
if (nodes.length <= 0) {
// If there are more than one node selected,
$notify('Could not create a topic. Only one node must be selected.');
$notify($msg('ONE_TOPIC_MUST_BE_SELECTED'));
return;
}
if (nodes.length != 1) {
// If there are more than one node selected,
$notify('Could not create a topic. One topic must be selected.');
$notify($msg('ONLY_ONE_TOPIC_MUST_BE_SELECTED'));
return;
}
@@ -374,7 +376,7 @@ mindplot.Designer = new Class({
},
_createChildModel : function(topic, mousePos) {
_createChildModel:function (topic, mousePos) {
// Create a new node ...
var model = topic.getModel();
var mindmap = model.getMindmap();
@@ -391,7 +393,7 @@ mindplot.Designer = new Class({
return childModel;
},
addDraggedNode: function(event, model) {
addDraggedNode:function (event, model) {
$assert(event, "event can not be null");
$assert(model, "model can not be null");
@@ -405,17 +407,17 @@ mindplot.Designer = new Class({
topic.fireEvent("mousedown", event);
},
createSiblingForSelectedNode : function() {
createSiblingForSelectedNode:function () {
var nodes = this.getModel().filterSelectedTopics();
if (nodes.length <= 0) {
// If there are no nodes selected,
$notify('Could not create a topic. At least one node must be selected.');
$notify($msg('ONE_TOPIC_MUST_BE_SELECTED'));
return;
}
if (nodes.length > 1) {
// If there are more than one node selected,
$notify('Could not create a topic. One topic must be selected.');
$notify($msg('ONLY_ONE_TOPIC_MUST_BE_SELECTED'));
return;
}
@@ -435,12 +437,11 @@ mindplot.Designer = new Class({
}
var parentTopicId = parentTopic.getId();
this._actionDispatcher.addTopic(siblingModel, parentTopicId, true);
}
},
_createSiblingModel : function(topic) {
_createSiblingModel:function (topic) {
var result = null;
var parentTopic = topic.getOutgoingConnectedTopic();
if (parentTopic != null) {
@@ -458,7 +459,7 @@ mindplot.Designer = new Class({
return result;
},
showRelPivot : function(event) {
showRelPivot:function (event) {
// Current mouse position ....
var screen = this._workspace.getScreenManager();
var pos = screen.getWorkspaceMousePosition(event);
@@ -468,7 +469,7 @@ mindplot.Designer = new Class({
this._relPivot.start(selectedTopic, pos);
},
connectByRelation : function(sourceTopic, targetTopic) {
connectByRelation:function (sourceTopic, targetTopic) {
$assert(sourceTopic, "sourceTopic can not be null");
$assert(targetTopic, "targetTopic can not be null");
@@ -480,25 +481,25 @@ mindplot.Designer = new Class({
this._actionDispatcher.connectByRelation(model);
},
needsSave : function() {
needsSave:function () {
//@Todo: Review all this ...
return this._actionDispatcher._actionRunner.hasBeenChanged();
},
getMindmapProperties : function() {
getMindmapProperties:function () {
return {zoom:this.getModel().getZoom()};
},
loadMap : function(mindmapModel) {
loadMap:function (mindmapModel) {
$assert(mindmapModel, "mindmapModel can not be null");
this._mindmap = mindmapModel;
// try {
// Init layout manager ...
var size = {width:25,height:25};
var size = {width:25, height:25};
var layoutManager = new mindplot.layout.LayoutManager(mindmapModel.getCentralTopic().getId(), size);
layoutManager.addEvent('change', function(event) {
layoutManager.addEvent('change', function (event) {
var id = event.getId();
var topic = this.getModel().findTopicById(id);
topic.setPosition(event.getPosition());
@@ -536,27 +537,27 @@ mindplot.Designer = new Class({
// }
},
getMindmap : function() {
getMindmap:function () {
return this._mindmap;
},
undo : function() {
undo:function () {
// @Todo: This is a hack...
this._actionDispatcher._actionRunner.undo();
},
redo : function() {
redo:function () {
this._actionDispatcher._actionRunner.redo();
},
isReadOnly : function() {
isReadOnly:function () {
return this._options.readOnly;
},
_nodeModelToNodeGraph : function(nodeModel, isVisible) {
_nodeModelToNodeGraph:function (nodeModel, isVisible) {
$assert(nodeModel, "Node model can not be null");
var children = nodeModel.getChildren().slice();
children = children.sort(function(a, b) {
children = children.sort(function (a, b) {
return a.getOrder() - b.getOrder()
});
@@ -576,7 +577,7 @@ mindplot.Designer = new Class({
return nodeGraph;
},
_relationshipModelToRelationship : function(model) {
_relationshipModelToRelationship:function (model) {
$assert(model, "Node model can not be null");
var relationship = this._buildRelationship(model);
@@ -593,12 +594,12 @@ mindplot.Designer = new Class({
return relationship;
},
createRelationship : function(model) {
createRelationship:function (model) {
this._mindmap.addRelationship(model);
return this._relationshipModelToRelationship(model);
},
removeRelationship : function(model) {
removeRelationship:function (model) {
this._mindmap.removeRelationship(model);
var relationship = this._relationships[model.getId()];
var sourceTopic = relationship.getSourceTopic();
@@ -609,7 +610,7 @@ mindplot.Designer = new Class({
delete this._relationships[model.getId()];
},
_buildRelationship : function (model) {
_buildRelationship:function (model) {
var elem = this;
var fromNodeId = model.getFromNode();
@@ -651,7 +652,7 @@ mindplot.Designer = new Class({
relationLine.setModel(model);
//Add Listeners
relationLine.addEvent('onfocus', function(event) {
relationLine.addEvent('onfocus', function (event) {
elem.onObjectFocusEvent(relationLine, event);
});
@@ -661,7 +662,7 @@ mindplot.Designer = new Class({
return relationLine;
},
_removeNode : function(node) {
_removeNode:function (node) {
if (node.getTopicType() != mindplot.model.INodeModel.CENTRAL_TOPIC_TYPE) {
var parent = node._parent;
node.disconnect(this._workspace);
@@ -684,9 +685,9 @@ mindplot.Designer = new Class({
}
},
deleteCurrentNode : function() {
deleteCurrentNode:function () {
var validateFunc = function(object) {
var validateFunc = function (object) {
return object.getType() == mindplot.RelationshipLine.type || object.getTopicType() != mindplot.model.INodeModel.CENTRAL_TOPIC_TYPE
};
var validateError = 'Central topic can not be deleted.';
@@ -701,7 +702,7 @@ mindplot.Designer = new Class({
},
changeFontFamily : function(font) {
changeFontFamily:function (font) {
var topicsIds = this.getModel().filterTopicsIds();
if (topicsIds.length > 0) {
this._actionDispatcher.changeFontFamilyToTopic(topicsIds, font);
@@ -709,14 +710,14 @@ mindplot.Designer = new Class({
}
},
changeFontStyle : function() {
changeFontStyle:function () {
var topicsIds = this.getModel().filterTopicsIds();
if (topicsIds.length > 0) {
this._actionDispatcher.changeFontStyleToTopic(topicsIds);
}
},
changeFontColor : function(color) {
changeFontColor:function (color) {
$assert(color, "color can not be null");
var topicsIds = this.getModel().filterTopicsIds();
@@ -725,9 +726,9 @@ mindplot.Designer = new Class({
}
},
changeBackgroundColor : function(color) {
changeBackgroundColor:function (color) {
var validateFunc = function(topic) {
var validateFunc = function (topic) {
return topic.getShapeType() != mindplot.model.TopicShape.LINE;
};
var validateError = 'Color can not be set to line topics.';
@@ -738,8 +739,8 @@ mindplot.Designer = new Class({
}
},
changeBorderColor : function(color) {
var validateFunc = function(topic) {
changeBorderColor:function (color) {
var validateFunc = function (topic) {
return topic.getShapeType() != mindplot.model.TopicShape.LINE;
};
var validateError = 'Color can not be set to line topics.';
@@ -749,15 +750,15 @@ mindplot.Designer = new Class({
}
},
changeFontSize : function(size) {
changeFontSize:function (size) {
var topicsIds = this.getModel().filterTopicsIds();
if (topicsIds.length > 0) {
this._actionDispatcher.changeFontSizeToTopic(topicsIds, size);
}
},
changeTopicShape : function(shape) {
var validateFunc = function(topic) {
changeTopicShape:function (shape) {
var validateFunc = function (topic) {
return !(topic.getType() == mindplot.model.INodeModel.CENTRAL_TOPIC_TYPE && shape == mindplot.model.TopicShape.LINE)
};
@@ -768,38 +769,38 @@ mindplot.Designer = new Class({
}
},
changeFontWeight : function() {
changeFontWeight:function () {
var topicsIds = this.getModel().filterTopicsIds();
if (topicsIds.length > 0) {
this._actionDispatcher.changeFontWeightToTopic(topicsIds);
}
},
addIconType : function(iconType) {
addIconType:function (iconType) {
var topicsIds = this.getModel().filterTopicsIds();
if (topicsIds.length > 0) {
this._actionDispatcher.addFeatureToTopic(topicsIds[0], mindplot.TopicFeature.Icon.id, {id:iconType});
}
},
addLink : function() {
addLink:function () {
var model = this.getModel();
var topic = model.selectedTopic();
topic.showLinkEditor();
},
addNote : function() {
addNote:function () {
var model = this.getModel();
var topic = model.selectedTopic();
topic.showNoteEditor();
},
goToNode : function(node) {
goToNode:function (node) {
node.setOnFocus(true);
this.onObjectFocusEvent(node);
},
getWorkSpace : function() {
getWorkSpace:function () {
return this._workspace;
}
}

View File

@@ -193,12 +193,12 @@ mindplot.MainTopic = new Class({
var result = "";
if ($defined(targetTopic)) {
if (targetTopic.getType() == mindplot.model.INodeModel.CENTRAL_TOPIC_TYPE) {
result = "Main Topic";
result = $msg('MAIN_TOPIC');
} else {
result = "Sub Topic";
result = $msg('SUB_TOPIC');
}
} else {
result = "Isolated Topic";
result = $msg('ISOLATED_TOPIC');;
}
return result;
},

View File

@@ -0,0 +1,129 @@
/*
* 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.
*/
mindplot.Messages = new Class({
Static:{
init:function (location) {
var locale = $defined(location) ? location : 'en';
mindplot.Messages.__bundle = mindplot.Messages.BUNDLES[locale];
console.log(mindplot.Messages.__bundle);
}
}
});
$msg = function (key) {
if (!mindplot.Messages.__bundle) {
mindplot.Messages.init('en');
}
return mindplot.Messages.__bundle[key];
};
mindplot.Messages.BUNDLES = {
'en':{
ZOOM_IN:'Zoom In',
ZOOM_OUT:'Zoom Out',
TOPIC_SHAPE:'Topic Shape',
TOPIC_ADD:'Add Topic',
TOPIC_DELETE:'Delete Topic',
TOPIC_ICON:'Add Icon',
TOPIC_LINK:'Add Link',
TOPIC_RELATIONSHIP:'Relationship',
TOPIC_COLOR:'Topic Color',
TOPIC_BORDER_COLOR:'Topic Border Color',
TOPIC_NOTE:'Add Note',
FONT_FAMILY:'Font Type',
FONT_SIZE:'Text Size',
FONT_BOLD:'Text Bold',
FONT_ITALIC:'Text Italic',
UNDO_EDITION:'Undo Edition',
REDO_EDITION:'Redo Edition',
UNDO:'Undo',
REDO:'Redo',
INSERT:'Insert',
SAVE:'Save',
NOTE:'Note',
ADD_TOPIC:'Add Topic',
LOADING:'Loading ...',
EXPORT:'Export',
PRINT:'Print',
PUBLISH:'Publish',
COLLABORATE:'Share',
HISTORY:'History',
DISCARD_CHANGES:'Discard Changes',
FONT_COLOR:'Text Color',
SAVING:'Saving ...',
SAVE_COMPLETE:'Save Complete',
ZOOM_IN_ERROR:'Zoom too high.',
ZOOM_ERROR:'No more zoom can be applied.',
ONLY_ONE_TOPIC_MUST_BE_SELECTED:'Could not create a topic. Only one node must be selected.',
ONE_TOPIC_MUST_BE_SELECTED:'Could not create a topic. One topic must be selected.',
SAVE_COULD_NOT_BE_COMPLETED:'Save could not be completed. Try latter.',
UNEXPECTED_ERROR_LOADING:"We're sorry, an unexpected error has occurred. Try again reloading the editor.\nIf the problem persists, contact us to support@wisemapping.com.",
MAIN_TOPIC:'Main Topic',
SUB_TOPIC:'Sub Topic',
ISOLATED_TOPIC:'Isolated Topic',
CENTRAL_TOPIC: 'Central Topic'
},
'es':{
DISCARD_CHANGES:'Descartar Cambios',
SAVE:'Guardar',
INSERT:'Insertar',
ZOOM_IN:'Acercar',
ZOOM_OUT:'Alejar',
TOPIC_BORDER_COLOR:'Color del Borde',
TOPIC_SHAPE:'Forma del Tópico',
TOPIC_ADD:'Agregar Tópico',
TOPIC_DELETE:'Borrar Tópico',
TOPIC_ICON:'Agregar Icono',
TOPIC_LINK:'Agregar Enlace',
TOPIC_NOTE:'Agregar Nota',
TOPIC_COLOR:'Color Tópico',
TOPIC_RELATIONSHIP:'Relación',
FONT_FAMILY:'Tipo de Fuente',
FONT_SIZE:'Tamaño de Texto',
FONT_BOLD:'Negrita',
FONT_ITALIC:'Italica',
FONT_COLOR:'Color de Texto',
UNDO_EDITION:'Undo Edition',
REDO_EDITION:'Redo Edition',
UNDO:'Rehacer',
NOTE:'Nota',
LOADING:'Cargando ...',
PRINT:'Imprimir',
PUBLISH:'Publicar',
REDO:'Deshacer',
ADD_TOPIC:'Agregar Tópico',
COLLABORATE:'Compartir',
EXPORT:'Exportar',
HISTORY:'History',
SAVE_COMPLETE:'Grabado Completo',
SAVING:'Grabando ...',
ONE_TOPIC_MUST_BE_SELECTED:'No ha sido posible crear un nuevo tópico. Al menos un tópico debe ser seleccionado.',
ONLY_ONE_TOPIC_MUST_BE_SELECTED:'No ha sido posible crear un nuevo tópico. Solo un tópico debe ser seleccionado.',
SAVE_COULD_NOT_BE_COMPLETED:'Grabación no pudo ser completada. Intentelo mas tarde.',
UNEXPECTED_ERROR_LOADING:"Lo sentimos, un error inesperado ha ocurrido. Intentelo nuevamente recargando el editor.\n Si el problema persiste, contactenos a support@wisemapping.com.",
ZOOM_ERROR:'No es posible aplicar mas zoom.',
ZOOM_IN_ERROR:'El zoom es muy alto.',
MAIN_TOPIC:'Tópico Principal',
SUB_TOPIC:'Tópico Secundario',
ISOLATED_TOPIC:'Tópico Aislado',
CENTRAL_TOPIC: 'Tópico Central'
}
};

View File

@@ -18,7 +18,7 @@
mindplot.widget.IMenu = new Class({
initialize : function(designer, containerId, mapId) {
initialize:function (designer, containerId, mapId) {
$assert(designer, "designer can not be null");
$assert(containerId, "containerId can not be null");
@@ -28,13 +28,13 @@ mindplot.widget.IMenu = new Class({
this._mapId = mapId;
},
clear : function() {
this._toolbarElems.forEach(function(item) {
clear:function () {
this._toolbarElems.forEach(function (item) {
item.hide();
});
},
discard: function() {
discard:function () {
var persistenceManager = mindplot.PersistenceManager.getInstance();
var mindmap = designer.getMindmap();
persistenceManager.discard(mindmap.getId());
@@ -47,7 +47,7 @@ mindplot.widget.IMenu = new Class({
// Display save message ..
if (saveHistory) {
$notify("Saving ...");
$notify($msg('SAVING'));
saveElem.setStyle('cursor', 'wait');
} else {
console.log("Saving without history ...");
@@ -56,16 +56,16 @@ mindplot.widget.IMenu = new Class({
// Call persistence manager for saving ...
var persistenceManager = mindplot.PersistenceManager.getInstance();
persistenceManager.save(mindmap, mindmapProp, saveHistory, {
onSuccess: function() {
onSuccess:function () {
if (saveHistory) {
saveElem.setStyle('cursor', 'pointer');
$notify("Save complete");
$notify($msg('SAVE_COMPLETE'));
}
},
onError: function() {
onError:function () {
if (saveHistory) {
saveElem.setStyle('cursor', 'pointer');
$notify("Save could not be completed. Try latter.");
$notify($msg('SAVE_COULD_NOT_BE_COMPLETED'));
}
}
});

View File

@@ -17,21 +17,21 @@
*/
mindplot.widget.Menu = new Class({
Extends: mindplot.widget.IMenu,
Extends:mindplot.widget.IMenu,
initialize : function(designer, containerId, mapId, readOnly, baseUrl) {
initialize:function (designer, containerId, mapId, readOnly, baseUrl) {
this.parent(designer, containerId, mapId);
baseUrl = !$defined(baseUrl) ? "" : baseUrl;
var widgetsBaseUrl = baseUrl + "css/widget";
// Stop event propagation ...
$(this._containerId).addEvent('click', function(event) {
$(this._containerId).addEvent('click', function (event) {
event.stopPropagation();
return false;
});
$(this._containerId).addEvent('dblclick', function(event) {
$(this._containerId).addEvent('dblclick', function (event) {
event.stopPropagation();
return false;
});
@@ -42,7 +42,7 @@ mindplot.widget.Menu = new Class({
var fontFamilyBtn = $('fontFamily');
if (fontFamilyBtn) {
var fontFamilyModel = {
getValue: function() {
getValue:function () {
var nodes = designerModel.filterSelectedTopics();
var result = null;
for (var i = 0; i < nodes.length; i++) {
@@ -56,19 +56,19 @@ mindplot.widget.Menu = new Class({
return result;
},
setValue: function(value) {
setValue:function (value) {
designer.changeFontFamily(value);
}
};
this._toolbarElems.push(new mindplot.widget.FontFamilyPanel("fontFamily", fontFamilyModel));
this._registerTooltip('fontFamily', "Text font");
this._registerTooltip('fontFamily', $msg('FONT_FAMILY'));
}
var fontSizeBtn = $('fontSize');
if (fontSizeBtn) {
var fontSizeModel = {
getValue: function() {
getValue:function () {
var nodes = designerModel.filterSelectedTopics();
var result = null;
for (var i = 0; i < nodes.length; i++) {
@@ -81,18 +81,18 @@ mindplot.widget.Menu = new Class({
}
return result;
},
setValue: function(value) {
setValue:function (value) {
designer.changeFontSize(value);
}
};
this._toolbarElems.push(new mindplot.widget.FontSizePanel("fontSize", fontSizeModel));
this._registerTooltip('fontSize', "Text size");
this._registerTooltip('fontSize', $msg('FONT_SIZE'));
}
var topicShapeBtn = $('topicShape');
if (topicShapeBtn) {
var topicShapeModel = {
getValue: function() {
getValue:function () {
var nodes = designerModel.filterSelectedTopics();
var result = null;
for (var i = 0; i < nodes.length; i++) {
@@ -105,27 +105,27 @@ mindplot.widget.Menu = new Class({
}
return result;
},
setValue: function(value) {
setValue:function (value) {
designer.changeTopicShape(value);
}
};
this._toolbarElems.push(new mindplot.widget.TopicShapePanel("topicShape", topicShapeModel));
this._registerTooltip('topicShape', "Topic shape");
this._registerTooltip('topicShape', $msg('TOPIC_SHAPE'));
}
var topicIconBtn = $('topicIcon');
if (topicIconBtn) {
// Create icon panel dialog ...
var topicIconModel = {
getValue: function() {
getValue:function () {
return null;
},
setValue: function(value) {
setValue:function (value) {
designer.addIconType(value);
}
};
this._toolbarElems.push(new mindplot.widget.IconPanel('topicIcon', topicIconModel));
this._registerTooltip('topicIcon', "Icon");
this._registerTooltip('topicIcon', $msg('TOPIC_ICON'));
}
// Topic color item ...
@@ -133,7 +133,7 @@ mindplot.widget.Menu = new Class({
if (topicColorBtn) {
var topicColorModel = {
getValue : function() {
getValue:function () {
var nodes = designerModel.filterSelectedTopics();
var result = null;
for (var i = 0; i < nodes.length; i++) {
@@ -146,12 +146,12 @@ mindplot.widget.Menu = new Class({
}
return result;
},
setValue : function (hex) {
setValue:function (hex) {
designer.changeBackgroundColor(hex);
}
};
this._toolbarElems.push(new mindplot.widget.ColorPalettePanel('topicColor', topicColorModel, widgetsBaseUrl));
this._registerTooltip('topicColor', "Topic color");
this._registerTooltip('topicColor', $msg('TOPIC_COLOR'));
}
// Border color item ...
@@ -159,7 +159,7 @@ mindplot.widget.Menu = new Class({
if (topicBorderBtn) {
var borderColorModel =
{
getValue : function() {
getValue:function () {
var nodes = designerModel.filterSelectedTopics();
var result = null;
for (var i = 0; i < nodes.length; i++) {
@@ -172,12 +172,12 @@ mindplot.widget.Menu = new Class({
}
return result;
},
setValue : function (hex) {
setValue:function (hex) {
designer.changeBorderColor(hex);
}
};
this._toolbarElems.push(new mindplot.widget.ColorPalettePanel('topicBorder', borderColorModel, widgetsBaseUrl));
this._registerTooltip('topicBorder', "Border color");
this._registerTooltip('topicBorder', $msg('TOPIC_BORDER_COLOR'));
}
// Font color item ...
@@ -185,7 +185,7 @@ mindplot.widget.Menu = new Class({
if (fontColorBtn) {
var fontColorModel =
{
getValue : function() {
getValue:function () {
var result = null;
var nodes = designerModel.filterSelectedTopics();
for (var i = 0; i < nodes.length; i++) {
@@ -198,107 +198,107 @@ mindplot.widget.Menu = new Class({
}
return result;
},
setValue : function (hex) {
setValue:function (hex) {
designer.changeFontColor(hex);
}
};
this._toolbarElems.push(new mindplot.widget.ColorPalettePanel('fontColor', fontColorModel, baseUrl));
this._registerTooltip('fontColor', "Text color");
this._registerTooltip('fontColor', $msg('FONT_COLOR'));
}
this._addButton('export', false, false, function() {
this._addButton('export', false, false, function () {
var reqDialog = new MooDialog.Request('/c/iframeWrapper.htm?url=c/maps/' + mapId + "/exportf", null,
{'class': 'modalDialog exportModalDialog',
{'class':'modalDialog exportModalDialog',
closeButton:true,
destroyOnClose:true,
title:'Export'
title:$msg('EXPORT')
});
reqDialog.setRequestOptions({
onRequest: function() {
reqDialog.setContent('loading...');
onRequest:function () {
reqDialog.setContent($msg('LOADING'));
}
});
MooDialog.Request.active = reqDialog;
});
this._registerTooltip('export', "Export");
this._registerTooltip('export', $msg('EXPORT'));
this._addButton('print', false, false, function() {
this._addButton('print', false, false, function () {
window.open('/c/maps/' + mapId + '/print');
});
this._registerTooltip('print', "Print");
this._registerTooltip('print', $msg('PRINT'));
this._addButton('zoomIn', false, false, function() {
this._addButton('zoomIn', false, false, function () {
designer.zoomIn();
});
this._registerTooltip('zoomIn', "Zoom in");
this._registerTooltip('zoomIn', $msg('ZOOM_IN'));
this._addButton('zoomOut', false, false, function() {
this._addButton('zoomOut', false, false, function () {
designer.zoomOut();
});
this._registerTooltip('zoomOut', "Zoom out");
this._registerTooltip('zoomOut', $msg('ZOOM_OUT'));
this._addButton('undoEdition', false, false, function() {
this._addButton('undoEdition', false, false, function () {
designer.undo();
});
this._registerTooltip('undoEdition', "Undo", "meta+Z");
this._registerTooltip('undoEdition', $msg('UNDO'), "meta+Z");
this._addButton('redoEdition', false, false, function() {
this._addButton('redoEdition', false, false, function () {
designer.redo();
});
this._registerTooltip('redoEdition', "Redo", "meta+Y");
this._registerTooltip('redoEdition', $msg('REDO'), "meta+Y");
this._addButton('addTopic', true, false, function() {
this._addButton('addTopic', true, false, function () {
designer.createChildForSelectedNode();
});
this._registerTooltip('addTopic', "Add topic", "Enter");
this._registerTooltip('addTopic', $msg('ADD_TOPIC'), "Enter");
this._addButton('deleteTopic', true, true, function() {
this._addButton('deleteTopic', true, true, function () {
designer.deleteCurrentNode();
});
this._registerTooltip('deleteTopic', "Delete topic", "Backspace");
this._registerTooltip('deleteTopic', $msg('TOPIC_DELETE'), "Backspace");
this._addButton('topicLink', true, false, function() {
this._addButton('topicLink', true, false, function () {
designer.addLink();
});
this._registerTooltip('topicLink', "Add link");
this._registerTooltip('topicLink', $msg('TOPIC_LINK'));
this._addButton('topicRelation', true, false, function(event) {
this._addButton('topicRelation', true, false, function (event) {
designer.showRelPivot(event);
});
this._registerTooltip('topicRelation', "Relationship");
this._registerTooltip('topicRelation', $msg('TOPIC_RELATIONSHIP'));
this._addButton('topicNote', true, false, function() {
this._addButton('topicNote', true, false, function () {
designer.addNote();
});
this._registerTooltip('topicNote', "Add note");
this._registerTooltip('topicNote', $msg('TOPIC_NOTE'));
this._addButton('fontBold', true, false, function() {
this._addButton('fontBold', true, false, function () {
designer.changeFontWeight();
});
this._registerTooltip('fontBold', "Text bold", "meta+B");
this._registerTooltip('fontBold', $msg('FONT_BOLD'), "meta+B");
this._addButton('fontItalic', true, false, function() {
this._addButton('fontItalic', true, false, function () {
designer.changeFontStyle();
});
this._registerTooltip('fontItalic', "Text italic", "meta+I");
this._registerTooltip('fontItalic', $msg('FONT_ITALIC'), "meta+I");
var saveElem = $('save');
if (saveElem) {
this._addButton('save', false, false, function() {
this._addButton('save', false, false, function () {
this.save(saveElem, designer, true);
}.bind(this));
this._registerTooltip('save', "Save", "meta+S");
this._registerTooltip('save', $msg('SAVE'), "meta+S");
if (!readOnly) {
@@ -310,7 +310,7 @@ mindplot.widget.Menu = new Class({
}.bind(this));
// Autosave on a fixed period of time ...
(function() {
(function () {
if (designer.needsSave()) {
this.save(saveElem, designer, false);
}
@@ -320,25 +320,25 @@ mindplot.widget.Menu = new Class({
var discardElem = $('discard');
if (discardElem) {
this._addButton('discard', false, false, function() {
this._addButton('discard', false, false, function () {
this.discard();
window.location.reload();
}.bind(this));
this._registerTooltip('discard', "Discard");
this._registerTooltip('discard', $msg('DISCARD_CHANGES'));
}
var tagElem = $('tagIt');
if (tagElem) {
this._addButton('tagIt', false, false, function() {
this._addButton('tagIt', false, false, function () {
var reqDialog = new MooDialog.Request('c/tags?mapId=' + mapId, null,
{'class': 'modalDialog tagItModalDialog',
{'class':'modalDialog tagItModalDialog',
closeButton:true,
destroyOnClose:true,
title:'Tags'
});
reqDialog.setRequestOptions({
onRequest: function() {
reqDialog.setContent('loading...');
onRequest:function () {
reqDialog.setContent($msg('LOADING'));
}
});
});
@@ -347,80 +347,80 @@ mindplot.widget.Menu = new Class({
var shareElem = $('shareIt');
if (shareElem) {
this._addButton('shareIt', false, false, function() {
this._addButton('shareIt', false, false, function () {
var reqDialog = new MooDialog.Request('/c/iframeWrapper?url=c/maps/' + mapId + "/sharef", null,
{'class': 'modalDialog shareModalDialog',
{'class':'modalDialog shareModalDialog',
closeButton:true,
destroyOnClose:true,
title:'Share'
title:$msg('COLLABORATE')
});
reqDialog.setRequestOptions({
onRequest: function() {
reqDialog.setContent('loading...');
onRequest:function () {
reqDialog.setContent($msg('LOADING'));
}
});
MooDialog.Request.active = reqDialog;
});
this._registerTooltip('shareIt', "Share");
this._registerTooltip('shareIt', $msg('COLLABORATE'));
}
var publishElem = $('publishIt');
if (publishElem) {
this._addButton('publishIt', false, false, function() {
this._addButton('publishIt', false, false, function () {
var reqDialog = new MooDialog.Request('/c/iframeWrapper?url=c/maps/' + mapId + "/publishf", null,
{'class': 'modalDialog publishModalDialog',
{'class':'modalDialog publishModalDialog',
closeButton:true,
destroyOnClose:true,
title:'Publish'
title:$msg('PUBLISH')
});
reqDialog.setRequestOptions({
onRequest: function() {
reqDialog.setContent('loading...');
onRequest:function () {
reqDialog.setContent($msg('LOADING'));
}
});
MooDialog.Request.active = reqDialog;
});
this._registerTooltip('publishIt', "Publish");
this._registerTooltip('publishIt', $msg('PUBLISH'));
}
var historyElem = $('history');
if (historyElem) {
this._addButton('history', false, false, function() {
this._addButton('history', false, false, function () {
var reqDialog = new MooDialog.Request('/c/iframeWrapper?url=c/maps/' + mapId + "/historyf", null,
{'class': 'modalDialog historyModalDialog',
{'class':'modalDialog historyModalDialog',
closeButton:true,
destroyOnClose:true,
title:'History'
title:$msg('HISTORY')
});
reqDialog.setRequestOptions({
onRequest: function() {
reqDialog.setContent('loading...');
onRequest:function () {
reqDialog.setContent($msg('LOADING'));
}
});
});
this._registerTooltip('history', "History");
this._registerTooltip('history', $msg('HISTORY'));
}
this._registerEvents(designer);
},
_registerEvents : function(designer) {
_registerEvents:function (designer) {
// Register on close events ...
this._toolbarElems.forEach(function(elem) {
elem.addEvent('show', function() {
this._toolbarElems.forEach(function (elem) {
elem.addEvent('show', function () {
this.clear()
}.bind(this));
}.bind(this));
designer.addEvent('onblur', function() {
designer.addEvent('onblur', function () {
var topics = designer.getModel().filterSelectedTopics();
var rels = designer.getModel().filterSelectedRelations();
this._toolbarElems.forEach(function(button) {
this._toolbarElems.forEach(function (button) {
var disable = false;
if (button.isTopicAction() && button.isRelAction()) {
disable = rels.length == 0 && topics.length == 0;
@@ -442,11 +442,11 @@ mindplot.widget.Menu = new Class({
})
}.bind(this));
designer.addEvent('onfocus', function() {
designer.addEvent('onfocus', function () {
var topics = designer.getModel().filterSelectedTopics();
var rels = designer.getModel().filterSelectedRelations();
this._toolbarElems.forEach(function(button) {
this._toolbarElems.forEach(function (button) {
if (button.isTopicAction() && topics.length > 0) {
button.enable();
}
@@ -462,16 +462,16 @@ mindplot.widget.Menu = new Class({
// Register Events ...
if ($(buttonId)) {
var button = new mindplot.widget.ToolbarItem(buttonId, function(event) {
var button = new mindplot.widget.ToolbarItem(buttonId, function (event) {
fn(event);
this.clear();
}.bind(this), {topicAction:topic,relAction:rel});
}.bind(this), {topicAction:topic, relAction:rel});
this._toolbarElems.push(button);
}
},
_registerTooltip: function(buttonId, text, shortcut) {
_registerTooltip:function (buttonId, text, shortcut) {
if ($(buttonId)) {
var tooltip = text;
if (shortcut) {