vmario/wisemapping-open-source
1
0
Fork 0
mirror of https://bitbucket.org/wisemapping/wisemapping-open-source.git synced 2024-07-07 08:50:45 +02:00
Code Issues Packages Projects Releases Wiki Activity

More refactors.

Browse Source
This commit is contained in:
Paulo Veiga 2012-02-04 12:51:50 -03:00
parent 0101ec2ae7
commit 6f7567abea
19 changed files with 348 additions and 694 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
core-js/pom.xml
View File

@ -25,7 +25,7 @@
</goals>
<configuration>
<tasks>
<mkdir dir="${basedir}/target/classes"/>
<mkdir dir="${basedir}/target/classes"/>
</tasks>
</configuration>
</execution>
@ -54,9 +54,21 @@
<include>${basedir}/target/tmp/Monitor-min.js</include>
<include>${basedir}/target/tmp/Point-min.js</include>
<include>${basedir}/target/tmp/Utils-min.js</include>
<include>${basedir}/target/tmp/WaitDialog-min.js</include>
<!--<include>${basedir}/target/tmp/LoadingDialog-min.js</include>-->
<!-- @Todo:Review this -->
<include>
${basedir}/../mindplot/src/main/javascript/libraries/moodialog/Overlay.js
</include>
<include>
${basedir}/../mindplot/src/main/javascript/libraries/moodialog/MooDialog.js
</include>
<include>
${basedir}/../mindplot/src/main/javascript/libraries/moodialog/MooDialog.Request.js
</include>
<include>
${basedir}/../mindplot/src/main/javascript/libraries/moodialog/MooDialog.Fx.js
</include>
<include>${basedir}/target/tmp/footer-min.js</include>
</includes>
</aggregation>
</aggregations>

56
core-js/src/main/javascript/LoadingDialog.js
View File

@ -1,56 +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.LoadingDiaglog = new Class({
Extends:MooDialog,
initialize : function() {
this.parent({
closeButton:false,
useEscKey:false
});
var panel = this._buildPanel();
this.setContent(panel);
},
_buildPanel : function () {
var result = new Element('div');
var content = new Element('p', {text:"sample"});
result.addEvent('keydown', function(event) {
event.stopPropagation();
});
// waitDialog.activate(true, $("waitDialog"));
// $(window).addEvent("error", function(event) {
//
// // Show error dialog ...
// waitDialog.changeContent($("errorDialog"), false);
// return false;
// });
content.inject(result);
return result;
},
show : function() {
this.open();
}
});

135
core-js/src/main/javascript/WaitDialog.js
View File

@ -1,135 +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.
*/
/*
Created By: Chris Campbell
Website: http://particletree.com
Date: 2/1/2006
Inspired by the lightbox implementation found at http://www.huddletogether.com/projects/lightbox/
/*-----------------------------------------------------------------------------------------------*/
core.WaitDialog = new Class({
yPos : 0,
xPos : 0,
initialize: function() {
},
// Turn everything on - mainly the IE fixes
activate: function(changeCursor, dialogContent)
{
this.content = dialogContent;
this._initLightboxMarkup();
this.displayLightbox("block");
// Change to loading cursor.
if (changeCursor)
{
window.document.body.style.cursor = "wait";
}
},
changeContent: function(dialogContent, changeCursor)
{
this.content = dialogContent;
if (!$('lbContent'))
{
// Dialog is not activated. Nothing to do ...
window.document.body.style.cursor = "pointer";
return;
}
this.processInfo();
// Change to loading cursor.
if (changeCursor)
{
window.document.body.style.cursor = "wait";
}else
{
window.document.body.style.cursor = "auto";
}
},
displayLightbox: function(display) {
if (display != 'none')
this.processInfo();
$('overlay-lightbox').style.display = display;
$('lightbox').style.display = display;
},
// Display dialog content ...
processInfo: function() {
if ($('lbContent'))
$('lbContent').dispose();
var lbContentElement = new Element('div').setProperty('id', 'lbContent');
lbContentElement.innerHTML = this.content.innerHTML;
lbContentElement.inject($('lbLoadMessage'),'before');
$('lightbox').className = "done";
},
// Search through new links within the lightbox, and attach click event
actions: function() {
lbActions = document.getElementsByClassName('lbAction');
for (i = 0; i < lbActions.length; i++) {
$(lbActions[i]).addEvent('click', function() {
this[lbActions[i].rel].pass(this)
}.bind(this));
lbActions[i].onclick = function() {
return false;
};
}
},
// Example of creating your own functionality once lightbox is initiated
deactivate: function(time) {
if ($('lbContent'))
$('lbContent').dispose();
this.displayLightbox("none");
window.document.body.style.cursor = "default";
}
, _initLightboxMarkup:function()
{
// Add overlay element inside body ...
var bodyElem = document.getElementsByTagName('body')[0];
var overlayElem = new Element('div').setProperty('id', 'overlay-lightbox');
overlayElem.inject(bodyElem);
// Add lightbox element inside body ...
var lightboxElem = new Element('div').setProperty('id', 'lightbox');
lightboxElem.addClass('loading');
var lbLoadMessageElem = new Element('div').setProperty('id', 'lbLoadMessage');
lbLoadMessageElem.inject(lightboxElem);
lightboxElem.inject(bodyElem);
}
});

9
mindplot/pom.xml
View File

@ -52,15 +52,6 @@
<concat destfile="${basedir}/target/tmp/mindplot.js" append="false">
<filelist dir="${basedir}/src/main/javascript/" files="header.js"/>
<filelist dir="${basedir}/src/main/javascript/libraries/moodialog/"
files="Overlay.js"/>
<filelist dir="${basedir}/src/main/javascript/libraries/moodialog/"
files="MooDialog.js"/>
<filelist dir="${basedir}/src/main/javascript/libraries/moodialog/"
files="MooDialog.Request.js"/>
<filelist dir="${basedir}/src/main/javascript/libraries/moodialog/"
files="MooDialog.Fx.js"/>
<filelist dir="${basedir}/src/main/javascript/" files="model/IMindmap.js"/>
<filelist dir="${basedir}/src/main/javascript/" files="model/Mindmap.js"/>
<filelist dir="${basedir}/src/main/javascript/" files="model/INodeModel.js"/>

68
mindplot/src/main/javascript/Designer.js
View File

@ -422,41 +422,47 @@ mindplot.Designer = new Class({
$assert(mindmapModel, "mindmapModel can not be null");
this._mindmap = mindmapModel;
// Init layout manager ...
var size = {width:25,height:25};
var layoutManager = new mindplot.layout.LayoutManager(mindmapModel.getCentralTopic().getId(), size);
layoutManager.addEvent('change', function(event) {
var id = event.getId();
var topic = this.getModel().findTopicById(id);
topic.setPosition(event.getPosition());
topic.setOrder(event.getOrder());
}.bind(this));
this._eventBussDispatcher.setLayoutManager(layoutManager);
try {
// Init layout manager ...
var size = {width:25,height:25};
var layoutManager = new mindplot.layout.LayoutManager(mindmapModel.getCentralTopic().getId(), size);
layoutManager.addEvent('change', function(event) {
var id = event.getId();
var topic = this.getModel().findTopicById(id);
topic.setPosition(event.getPosition());
topic.setOrder(event.getOrder());
}.bind(this));
this._eventBussDispatcher.setLayoutManager(layoutManager);
// Building node graph ...
var branches = mindmapModel.getBranches();
for (var i = 0; i < branches.length; i++) {
// NodeModel -> NodeGraph ...
var nodeModel = branches[i];
var nodeGraph = this._nodeModelToNodeGraph(nodeModel, false);
// Building node graph ...
var branches = mindmapModel.getBranches();
for (var i = 0; i < branches.length; i++) {
// NodeModel -> NodeGraph ...
var nodeModel = branches[i];
var nodeGraph = this._nodeModelToNodeGraph(nodeModel, false);
// Update shrink render state...
nodeGraph.setBranchVisibility(true);
// Update shrink render state...
nodeGraph.setBranchVisibility(true);
}
var relationships = mindmapModel.getRelationships();
for (var j = 0; j < relationships.length; j++) {
this._relationshipModelToRelationship(relationships[j]);
}
// Place the focus on the Central Topic
var centralTopic = this.getModel().getCentralTopic();
this.goToNode(centralTopic);
// Finally, sort the map ...
mindplot.EventBus.instance.fireEvent(mindplot.EventBus.events.DoLayout);
this.fireEvent('loadSuccess');
} catch(e) {
this.fireEvent('loadError',e);
}
var relationships = mindmapModel.getRelationships();
for (var j = 0; j < relationships.length; j++) {
this._relationshipModelToRelationship(relationships[j]);
}
// Place the focus on the Central Topic
var centralTopic = this.getModel().getCentralTopic();
this.goToNode(centralTopic);
// Finally, sort the map ...
mindplot.EventBus.instance.fireEvent(mindplot.EventBus.events.DoLayout);
},
getMindmap : function() {

1
wise-editor/src/main/webapp/css/editor.less
View File

@ -1,5 +1,4 @@
@import "compatibility.less";
@import "../css/widget/lightbox.css";
@import "../css/libraries/moodialog/css/MooDialog.css";

1
wise-editor/src/main/webapp/css/widget/lightbox.css
View File

@ -1 +0,0 @@
../../../../../../mindplot/src/main/javascript/widget/lightbox.css

4
wise-editor/src/main/webapp/html/container.html
View File

@ -50,7 +50,9 @@
<li>zoom: Scale to be applied to the map</li>
<li>readOnly: If the map could be modified.</li>
<li>persistenceManager: Persistence managers to be used. By default, local browser storage is used.</li>
<li>mapId: UUID of the map to be loaded..</li>
<li>mapId: UUID of the map to be loaded.</li>
<li>container: div element where the mindmap will be embedded..</li>
</ul>
<p>
It's important to point out that embedded.html is a static html page that it's mean to be a template page

3
wise-editor/src/main/webapp/html/container.json
View File

@ -11,5 +11,6 @@
"height":400
},
"persistenceManager": "mindplot.LocalStorageManager",
"mapId": "welcome"
"mapId": "welcome",
"container":"mindplot"
}

43
wise-editor/src/main/webapp/html/editor.html
View File

@ -24,9 +24,6 @@
var options = loadDesignerOptions();
var designer = buildDesigner(options);
// Configure default persistence manager ...
mindplot.PersistenceManager.init(new mindplot.LocalStorageManager());
// Load map from XML ...
var persistence = mindplot.PersistenceManager.getInstance();
var mindmap;
@ -37,11 +34,6 @@
mindmap = mindplot.model.Mindmap.buildEmpty(mapId);
}
designer.loadMap(mindmap);
// If not problem has arisen, close the dialog ...
if (!window.hasUnexpectedErrors) {
waitDialog.deactivate();
}
});
@ -49,37 +41,6 @@
</head>
<body>
<div id="waitDialog" style="display:none">
<div id="waitingContainer">
<div class="loadingIcon"></div>
<div class="loadingText">
Loading ...
</div>
</div>
</div>
<div id="errorDialog" style="display:none">
<div id="errorContainer">
<div class="loadingIcon"></div>
<div class="loadingText">
Unexpected error loading your map :(
</div>
</div>
</div>
<script type="text/javascript">
var waitDialog = new core.WaitDialog();
waitDialog.activate(true, $("waitDialog"));
$(window).addEvent("error", function(event) {
// Show error dialog ...
waitDialog.changeContent($("errorDialog"), false);
return false;
});
</script>
<div id="header">
<div id="headerInfo">
@ -123,7 +84,7 @@
<div id="deleteTopic" class="buttonOn" title="Delete">
<img src="../images/topic-delete.png"/>
</div>
<div id="topicBorder" class="buttonOn" title="Border Color">
<div id="topicBorder" class="buttonExtOn" title="Border Color">
<img src="../images/topic-border.png"/>
</div>
<div id="topicColor" class="buttonExtOn" title="Background Color">
@ -143,7 +104,7 @@
</div>
</div>
<div id="font" class="buttonContainer">
<div id="fontFamily" class="buttonOn" title="Font Style">
<div id="fontFamily" class="buttonExtOn" title="Font Style">
<img src="../images/font-type.png"/>
</div>
<div id="fontSize" class="buttonExtOn" title="Font Size">

49
wise-editor/src/main/webapp/html/embedded.html
View File

@ -19,64 +19,33 @@
<script type="text/javascript">
var mapId = 'welcome';
$(document).addEvent('loadcomplete', function(resource) {
var options = loadDesignerOptions();
// Options has been defined in by a external ile ?
var uri = new URI(window.location);
var query = String.parseQueryString(uri.get('query'));
var confUrl = query.confUrl;
var options = loadDesignerOptions(confUrl);
var designer = buildDesigner(options);
// Load map from XML ...
var mapId = options.mapId ? options.mapId : 'welcome';
var persistence = mindplot.PersistenceManager.getInstance();
var mindmap;
try {
var persistence = mindplot.PersistenceManager.getInstance();
mindmap = persistence.load(mapId);
} catch(e) {
// If the map could not be loaded, create a new empty map...
mindmap = mindplot.model.Mindmap.buildEmpty(mapId);
}
designer.loadMap(mindmap);
// If not problem has arisen, close the dialog ...
if (!window.hasUnexpectedErrors) {
waitDialog.deactivate();
}
});
</script>
</head>
<body>
<div id="waitDialog" style="display:none">
<div id="waitingContainer">
<div class="loadingIcon"></div>
<div class="loadingText">
Loading ...
</div>
</div>
</div>
<div id="errorDialog" style="display:none">
<div id="errorContainer">
<div class="loadingIcon"></div>
<div class="loadingText">
Unexpected error loading your map :(
</div>
</div>
</div>
<script type="text/javascript">
var waitDialog = new core.WaitDialog();
waitDialog.activate(true, $("waitDialog"));
$(window).addEvent("error", function(event) {
// Show error dialog ...
waitDialog.changeContent($("errorDialog"), false);
return false;
});
</script>
<div id="header">
<div id="headerInfo">

199
wise-editor/src/main/webapp/html/fulleditor.html
View File

@ -1,199 +0,0 @@
<!DOCTYPE HTML>
<html>
<head>
<title>WiseMapping - Editor </title>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
<!--[if lt IE 9]>
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<![endif]-->
<link rel="stylesheet/less" type="text/css" href="../css/editor.less"/>
<script type='text/javascript' src='../js/mootools-core-1.3.2.js'></script>
<script type='text/javascript' src='../js/mootools-more-1.3.2.js'></script>
<script type='text/javascript' src='../js/core.js'></script>
<script type='text/javascript' src='../js/less-1.1.3.min.js'></script>
<link rel="icon" href="../images/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="../images/favicon.ico" type="image/x-icon">
<script type="text/javascript">
var mapId = 'welcome';
var viewMode = false;
$(document).addEvent('loadcomplete', function(resource) {
var designer = buildDesigner(viewMode);
// Configure default persistence manager ...
mindplot.PersistenceManager.init(new mindplot.LocalStorageManager());
// Load map from XML ...
var persistence = mindplot.PersistenceManager.getInstance();
var mindmap;
try {
mindmap = persistence.load(mapId);
} catch(e) {
// If the map could not be loaded, create a new empty map...
mindmap = mindplot.model.Mindmap.buildEmpty(mapId);
}
designer.loadMap(mindmap);
// If not problem has arisen, close the dialog ...
if (!window.hasUnexpectedErrors) {
waitDialog.deactivate();
}
});
</script>
</head>
<body>
<form method="post" id="printForm" name="printForm" action='' style="height:100%;" target="${mindmap.title}">
<input type="hidden" name="action" value="print">
<input type="hidden" name="mapId" value="${mindmap.id}">
<input type="hidden" name="mapSvg" value="">
</form>
<div id="waitDialog" style="display:none">
<div id="waitingContainer">
<div class="loadingIcon"></div>
<div class="loadingText">
Loading ...
</div>
</div>
</div>
<div id="errorDialog" style="display:none">
<div id="errorContainer">
<div class="loadingIcon"></div>
<div class="loadingText">
Unexpected error loading your map :(
</div>
</div>
</div>
<script type="text/javascript">
var waitDialog = new core.WaitDialog();
waitDialog.activate(true, $("waitDialog"));
$(window).addEvent("error", function(event) {
// Show error dialog ...
waitDialog.changeContent($("errorDialog"), false);
return false;
});
</script>
<div id="header">
<div id="headerInfo">
<div id="headerActions">
<span>MyWiseMappigs</span> | <span>Settings</span> | <span>Logout</span>
</div>
<div id="headerLogo"></div>
<div id="headerMapTitle">Title: <span>Welcome</span></div>
</div>
<div id="toolbar">
<div id="editTab" class="tabContent">
<div id="persist" class="buttonContainer">
<div id="save" class="buttonOn" title="Save">
<img src="../images/save.png"/>
</div>
<div id="discard" class="buttonOn" title="Discard">
<img src="../images/discard.png"/>
</div>
<div id="print" class="buttonOn" title="Print">
<img src="../images/print.png"/>
</div>
<div id="export" class="buttonOn" title="Export">
<img src="../images/export.png"/>
</div>
</div>
<div id="edit" class="buttonContainer">
<div id="undoEdition" class="buttonOn" title="Undo Edition">
<img src="../images/undo.png"/>
</div>
<div id="redoEdition" class="buttonOn" title="Redo Edition">
<img src="../images/redo.png"/>
</div>
</div>
<div id="zoom" class="buttonContainer">
<div id="zoomIn" class="buttonOn" title="Zoom In">
<img src="../images/zoom-in.png"/>
</div>
<div id="zoomOut" class="buttonOn" title="Zoom Out">
<img src="../images/zoom-out.png"/>
</div>
</div>
<div id="node" class="buttonContainer">
<div id="topicShape" class="buttonExtOn" title="Topic Shape">
<img src="../images/topic-shape.png"/>
</div>
<div id="addTopic" class="buttonOn" title="Add Topic">
<img src="../images/topic-add.png"/>
</div>
<div id="deleteTopic" class="buttonOn" title="Delete">
<img src="../images/topic-delete.png"/>
</div>
<div id="topicBorder" class="buttonOn" title="Border Color">
<img src="../images/topic-border.png"/>
</div>
<div id="topicColor" class="buttonExtOn" title="Background Color">
<img src="../images/topic-color.png"/>
</div>
<div id="topicIcon" class="buttonExtOn" title="Add Icon">
<img src="../images/topic-icon.png"/>
</div>
<div id="topicNote" class="buttonOn" title="Add Note">
<img src="../images/topic-note.png"/>
</div>
<div id="topicLink" class="buttonOn" title="Add Link">
<img src="../images/topic-link.png"/>
</div>
<div id="topicRelation" class="buttonOn" title="Add Relationship">
<img src="../images/topic-relation.png"/>
</div>
</div>
<div id="font" class="buttonContainer">
<div id="fontFamily" class="buttonOn" title="Font Style">
<img src="../images/font-type.png"/>
</div>
<div id="fontSize" class="buttonExtOn" title="Font Size">
<img src="../images/font-size.png"/>
</div>
<div id="fontBold" class="buttonOn" title="Bold Style">
<img src="../images/font-bold.png"/>
</div>
<div id="fontItalic" class="buttonOn" title="Italic Style">
<img src="../images/font-italic.png"/>
</div>
<div id="fontColor" class="buttonExtOn" title="Fond Color" style="padding-top:4px">
<img src="../images/font-color.png"/>
</div>
</div>
<div id="collaboration" class="buttonContainer">
<div id="tagIt" class="buttonOn" title="Tag">
<img src="../images/tag.png"/>
</div>
<div id="shareIt" class="buttonOn" title="Share">
<img src="../images/share.png"/>
</div>
<div id="publishIt" class="buttonOn" title="Publish">
<img src="../images/public.png"/>
</div>
<div id="history" class="buttonOn" title="History">
<img src="../images/history.png"/>
</div>
</div>
</div>
</div>
<div id="headerNotifier"></div>
</div>
<div id="mindplot"></div>
<script type="text/javascript" src="../js/editor.js"></script>
</body>
</html>

123
wise-editor/src/main/webapp/html/viewmode.html
View File

@ -1,34 +1,36 @@
<!DOCTYPE HTML>
<html>
<head>
<title>WiseMapping - View </title>
<title>WiseMapping - View Mode </title>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
<!--[if lt IE 9]>
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<![endif]-->
<link rel="stylesheet" type="text/css" href="../css/viewmode.css"/>
<link rel="stylesheet/less" type="text/css" href="../css/editor.less"/>
<script type='text/javascript' src='../js/mootools-core-1.3.2.js'></script>
<script type='text/javascript' src='../js/mootools-more-1.3.2.js'></script>
<script type='text/javascript' src='../js/core.js'></script>
<script type='text/javascript' src='../js/less-1.1.3.min.js'></script>
<link rel="icon" href="../images/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="../images/favicon.ico" type="image/x-icon">
<script type="text/javascript">
var mapId = 'welcome';
var viewMode = true;
$(document).addEvent('loadcomplete', function(resource) {
var designer = buildDesigner(viewMode);
// Configure default persistence manager ...
mindplot.PersistenceManager.init(new mindplot.LocalStorageManager());
// Configure the map as read only ...
var options = loadDesignerOptions();
options.readOnly = true;
// Load designer ...
var designer = buildDesigner(options);
// Load map from XML ...
var persistence = mindplot.PersistenceManager.getInstance();
var mapId = 'welcome';
var mindmap;
try {
mindmap = persistence.load(mapId);
@ -37,33 +39,100 @@
mindmap = mindplot.model.Mindmap.buildEmpty(mapId);
}
designer.loadMap(mindmap);
$('zoomIn').addEvent('click', function() {
designer.zoomIn();
});
$('zoomOut').addEvent('click', function() {
designer.zoomOut();
});
});
</script>
</head>
<body>
<div id="mapContainer">
<div id="mindplot"></div>
<div id="embFooter">
<div id="logo"></div>
<div id="zoomIn" class="button"></div>
<div id="zoomOut" class="button"></div>
<div id="mapDetails">
View Mode Sample
<div id="header">
<div id="headerInfo">
<div id="headerActions"></div>
<div id="headerLogo"></div>
<div id="headerMapTitle">Title: <span>Welcome</span></div>
</div>
<div id="toolbar">
<div id="editTab" class="tabContent">
<div id="persist" class="buttonContainer">
<div id="save" class="buttonOn" title="Save">
<img src="../images/save.png"/>
</div>
<div id="discard" class="buttonOn" title="Discard">
<img src="../images/discard.png"/>
</div>
</div>
<div id="edit" class="buttonContainer">
<div id="undoEdition" class="buttonOn" title="Undo Edition">
<img src="../images/undo.png"/>
</div>
<div id="redoEdition" class="buttonOn" title="Redo Edition">
<img src="../images/redo.png"/>
</div>
</div>
<div id="zoom" class="buttonContainer">
<div id="zoomIn" class="buttonOn" title="Zoom In">
<img src="../images/zoom-in.png"/>
</div>
<div id="zoomOut" class="buttonOn" title="Zoom Out">
<img src="../images/zoom-out.png"/>
</div>
</div>
<div id="node" class="buttonContainer">
<div id="topicShape" class="buttonExtOn" title="Topic Shape">
<img src="../images/topic-shape.png"/>
</div>
<div id="addTopic" class="buttonOn" title="Add Topic">
<img src="../images/topic-add.png"/>
</div>
<div id="deleteTopic" class="buttonOn" title="Delete">
<img src="../images/topic-delete.png"/>
</div>
<div id="topicBorder" class="buttonExtOn" title="Border Color">
<img src="../images/topic-border.png"/>
</div>
<div id="topicColor" class="buttonExtOn" title="Background Color">
<img src="../images/topic-color.png"/>
</div>
<div id="topicIcon" class="buttonExtOn" title="Add Icon">
<img src="../images/topic-icon.png"/>
</div>
<div id="topicNote" class="buttonOn" title="Add Note">
<img src="../images/topic-note.png"/>
</div>
<div id="topicLink" class="buttonOn" title="Add Link">
<img src="../images/topic-link.png"/>
</div>
<div id="topicRelation" class="buttonOn" title="Add Relationship">
<img src="../images/topic-relation.png"/>
</div>
</div>
<div id="font" class="buttonContainer">
<div id="fontFamily" class="buttonExtOn" title="Font Style">
<img src="../images/font-type.png"/>
</div>
<div id="fontSize" class="buttonExtOn" title="Font Size">
<img src="../images/font-size.png"/>
</div>
<div id="fontBold" class="buttonOn" title="Bold Style">
<img src="../images/font-bold.png"/>
</div>
<div id="fontItalic" class="buttonOn" title="Italic Style">
<img src="../images/font-italic.png"/>
</div>
<div id="fontColor" class="buttonExtOn" title="Fond Color" style="padding-top:4px">
<img src="../images/font-color.png"/>
</div>
</div>
</div>
</div>
<div id="headerNotifier"></div>
<div id="footer">
<div id="footerLogo"></div>
</div>
</div>
<div id="mindplot"></div>
<script type="text/javascript" src="../js/editor.js"></script>
</body>
</html>

BIN
wise-editor/src/main/webapp/images/ajax-loader.gif
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 673 B

After

Width:  |  Height:  |  Size: 6.7 KiB

BIN
wise-editor/src/main/webapp/images/rebota.gif
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 213 KiB

175
wise-editor/src/main/webapp/js/editor.js
View File

@ -20,8 +20,22 @@ var designer = null;
function buildDesigner(options) {
var container = $('mindplot');
var container = $(options.container);
$assert(container, 'container could not be null');
// Register load events ...
designer = new mindplot.Designer(options, container);
designer.addEvent('loadSuccess', function() {
window.waitDialog.close();
window.waitDialog.destroy();
});
designer.addEvent('loadError', function(e) {
window.waitDialog.close();
window.waitDialog.destroy();
console.log(e);
});
// Configure default persistence manager ...
var persistence;
@ -33,29 +47,23 @@ function buildDesigner(options) {
}
mindplot.PersistenceManager.init(persistence);
// Register toolbar event ...
if ($('toolbar')) {
var menu = new mindplot.widget.Menu(designer, 'toolbar');
if (!options.readOnly) {
if ($('toolbar')) {
var menu = new mindplot.widget.Menu(designer, 'toolbar');
// If a node has focus, focus can be move to another node using the keys.
designer._cleanScreen = function() {
menu.clear()
};
}
// If a node has focus, focus can be move to another node using the keys.
designer._cleanScreen = function() {
menu.clear()
};
}
return designer;
}
function loadDesignerOptions() {
function loadDesignerOptions(jsonConf) {
// Load map options ...
var uri = new URI(window.location);
var query = String.parseQueryString(uri.get('query'));
var jsonConf = query.confUrl;
var result;
if (jsonConf) {
var request = new Request.JSON({
url: jsonConf,
async:false,
@ -80,10 +88,143 @@ function loadDesignerOptions() {
height: parseInt(window.innerHeight - 70), // Footer and Header
width: parseInt(window.innerWidth)
};
result = {readOnly:false,zoom:0.85,saveOnLoad:true,size:containerSize,viewPort:viewPort};
result = {readOnly:false,zoom:0.85,saveOnLoad:true,size:containerSize,viewPort:viewPort,container:'mindplot'};
}
return result;
}
editor = {};
editor.WaitDialog = new Class({
Extends:MooDialog,
initialize : function() {
var panel = this._buildPanel();
this.parent({
closeButton:false,
destroyOnClose:true,
autoOpen:true,
useEscKey:false,
title:'Loading ...',
onInitialize: function(wrapper) {
wrapper.setStyle('opacity', 0);
this.fx = new Fx.Morph(wrapper, {
duration: 100,
transition: Fx.Transitions.Bounce.easeOut
});
this.overlay = new Overlay(this.options.inject, {
duration: this.options.duration
});
if (this.options.closeOnOverlayClick) this.overlay.addEvent('click', this.close.bind(this));
}
,
onBeforeOpen: function() {
this.overlay.open();
this.fx.start({
'margin-top': [-200, -100],
opacity: [0, 1]
}).chain(function() {
this.fireEvent('show');
}.bind(this));
}
,
onBeforeClose: function() {
this.fx.start({
'margin-top': [-100, 0],
opacity: 0,
duration: 200
}).chain(function() {
this.fireEvent('hide');
}.bind(this));
this.overlay.close();
}}
)
;
this.setContent(panel);
},
_buildPanel : function () {
var result = new Element('div');
result.setStyles({
'text-align':'center',
width: '400px'
});
var img = new Element('img', {'src': '../images/ajax-loader.gif'});
img.inject(result);
return result;
},
show : function() {
this.open();
}
});
editor.Help = {
buildHelp:function(panel){
var container = new Element('div');
container.setStyles({width:'100%', textAlign:'center'});
var content1 = Help.buildContentIcon('../images/black-keyboard.png', 'Keyboard Shortcuts', function(){MOOdalBox.open('keyboard.htm','KeyBoard Shortcuts', '500px 400px', false);panel.hidePanel();});
var content2 = Help.buildContentIcon('../images/firstSteps.png', 'Editor First Steps', function(){
var wOpen;
var sOptions;
sOptions = 'status=yes,menubar=yes,scrollbars=yes,resizable=yes,toolbar=yes';
sOptions = sOptions + ',width=' + (screen.availWidth - 10).toString();
sOptions = sOptions + ',height=' + (screen.availHeight - 122).toString();
sOptions = sOptions + ',screenX=0,screenY=0,left=0,top=0';
wOpen = window.open("firststeps.htm", "WiseMapping", "width=100px, height=100px");
wOpen.focus();
wOpen.moveTo( 0, 0 );
wOpen.resizeTo( screen.availWidth, screen.availHeight );
panel.hidePanel();
});
container.addEvent('show', function(){
content1.effect('opacity',{duration:800}).start(0,100);
var eff = function(){content2.effect('opacity',{duration:800}).start(0,100);};
eff.delay(150);
});
container.addEvent('hide', function(){
content1.effect('opacity').set(0);
content2.effect('opacity').set(0)
});
content1.inject(container);
content2.inject(container);
return container;
},
buildContentIcon:function(image, text, onClickFn){
var container = new Element('div').setStyles({margin:'15px 0px 0px 0px', opacity:0, padding:'5px 0px', border: '1px solid transparent', cursor:'pointer'});
var icon = new Element('div');
icon.addEvent('click',onClickFn);
var img = new Element('img');
img.setProperty('src',image);
img.inject(icon);
icon.inject(container);
var textContainer = new Element('div').setStyles({width:'100%', color:'white'});
textContainer.innerHTML=text;
textContainer.inject(container);
container.addEvent('mouseover', function(event){
$(this).setStyle('border-top', '1px solid #BBB4D6');
$(this).setStyle('border-bottom', '1px solid #BBB4D6');
}.bindWithEvent(container));
container.addEvent('mouseout', function(event){
$(this).setStyle('border-top', '1px solid transparent');
$(this).setStyle('border-bottom', '1px solid transparent');
}.bindWithEvent(container));
return container;
}
};
// Show loading dialog ...
waitDialog = new editor.WaitDialog();
waitDialog.show();
// Loading libraries ...
Asset.javascript("../js/mindplot-min.js");

60
wise-webapp/src/main/webapp/js/editor.js
View File

@ -1,60 +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.
*/
Asset.javascript('../js/mindplot-min.js', {
id: 'MindplotSVGLib',
onLoad: function() {
$(document).fireEvent('loadcomplete', 'mind')
}
});
var designer = null;
/* JavaScript tabs changer */
function setUpToolbar(designer, readOnly) {
var menu = new mindplot.widget.Menu(designer, 'toolbar', mapId);
// If a node has focus, focus can be move to another node using the keys.
designer._cleanScreen = function() {
menu.clear()
};
}
function buildDesigner(properties) {
$assert(properties, "properties can not be null");
var container = $('mindplot');
container.setStyles({
height: parseInt(screen.height),
width: parseInt(screen.width)
});
designer = new mindplot.Designer(properties, container);
designer.setViewPort({
height: parseInt(window.innerHeight - 151), // Footer and Header
width: parseInt(window.innerWidth)
});
// Toolbar is only loaded if it was defined ...
if ($('toolbar')) {
setUpToolbar(designer, properties.readOnly);
}
return designer;
}

96
wise-webapp/src/main/webapp/jsp/mindmapEditor.jsp
View File

@ -14,53 +14,43 @@
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<![endif]-->
<title><spring:message code="SITE.TITLE"/> - ${mindmap.title} </title>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8"/>
<link rel="icon" href="../images/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="../images/favicon.ico" type="image/x-icon">
<link rel="stylesheet/less" type="text/css" href="../css/editor.less"/>
<script type='text/javascript' src='../js/libraries/mootools/mootools-core-1.3.2-full-compress.js'></script>
<script type='text/javascript' src='../js/libraries/mootools/mootools-more-1.3.2.1-yui.js'></script>
<script type="text/javascript" src="../dwr/engine.js"></script>
<script type="text/javascript" src="../dwr/interface/MapEditorService.js"></script>
<script type="text/javascript" src="../dwr/interface/LoggerService.js"></script>
<script type='text/javascript' src='../js/mootools-core-1.3.2.js'></script>
<script type='text/javascript' src='../js/mootools-more-1.3.2.js'></script>
<script type='text/javascript' src='../js/core.js'></script>
<script type='text/javascript' src='../js/less-1.1.3.min.js'></script>
<link rel="icon" href="../images/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="../images/favicon.ico" type="image/x-icon">
<script type="text/javascript">
var mapId = '${mindmap.id}';
var mapXml = '${mapXml}';
var mindReady = false;
$(document).addEvent('loadcomplete', function(resource) {
mindReady = resource == 'mind' ? true : mindReady;
if (mindReady) {
// Configure default persistence ...
mindplot.PersistenceManager.init(new mindplot.DwrPersitenceManager());
var persistence = mindplot.PersistenceManager.getInstance();
var mapId = '${mindmap.id}';
var mapXml = '${mapXml}';
// Initialize editor ...
var editorProperties = ${mindmap.properties};
editorProperties.collab = 'standalone';
editorProperties.readOnly = false;
designer = buildDesigner(editorProperties);
// Configure designer options ...
var options = loadDesignerOptions();
options.persistenceManager = "mindplot.DwrPersitenceManager";
var userOptions = ${mindmap.properties};
options.zoom = userOptions.zoom;
var domDocument = core.Utils.createDocumentFromText(mapXml);
var mindmap = persistence.loadFromDom(mapId, domDocument);
// Build designer ...
var designer = buildDesigner(options);
// Now, load the map ...
designer.loadMap(mindmap);
// If not problem has arisen, close the dialog ...
if (!window.hasUnexpectedErrors) {
waitDialog.deactivate();
}
}
// Load map from XML ...
var domDocument = core.Utils.createDocumentFromText(mapXml);
var persistence = mindplot.PersistenceManager.getInstance();
var mindmap = persistence.loadFromDom(mapId, domDocument);
designer.loadMap(mindmap);
});
</script>
function printMap() {
document.printForm.mapSvg.value = $("workspaceContainer").innerHTML;
document.printForm.submit();
}
</script>
</head>
<body>
@ -71,42 +61,6 @@
<input type="hidden" name="mapSvg" value="">
</form>
<div id="waitDialog" style="display:none">
<div id="waitingContainer">
<div class="loadingIcon"></div>
<div class="loadingText">
Loading ...
</div>
</div>
</div>
<div id="errorDialog" style="display:none">
<div id="errorContainer">
<div class="loadingIcon"></div>
<div class="loadingText">
Unexpected error loading your map :(
</div>
</div>
</div>
<script type="text/javascript">
var waitDialog = new core.WaitDialog();
waitDialog.activate(true, $("waitDialog"));
$(window).addEvent("error", function(event) {
// Show error dialog ...
waitDialog.changeContent($("errorDialog"), false);
return false;
});
function printMap() {
document.printForm.mapSvg.value = $("workspaceContainer").innerHTML;
document.printForm.submit();
}
</script>
<div id="actionsContainer"></div>
<div>
<c:url value="mymaps.htm" var="shareMap">

2
wise-webapp/src/main/webapp/jsp/toolbar.jsf
View File

@ -39,7 +39,7 @@
<div id="deleteTopic" class="buttonOn" title="Delete">
<img src="../images/topic-delete.png"/>
</div>
<div id="topicBorder" class="buttonOn" title="Border Color">
<div id="topicBorder" class="buttonExtOn" title="Border Color">
<img src="../images/topic-border.png"/>
</div>
<div id="topicColor" class="buttonExtOn" title="Background Color">