diff --git a/mindplot/pom.xml b/mindplot/pom.xml index 0288736d..f8e6e751 100644 --- a/mindplot/pom.xml +++ b/mindplot/pom.xml @@ -188,6 +188,7 @@ files="collaboration/framework/brix/BrixCollaborativeModelFactory.js"/> + diff --git a/mindplot/src/main/javascript/Designer.js b/mindplot/src/main/javascript/Designer.js index 33f39ebd..0a503134 100644 --- a/mindplot/src/main/javascript/Designer.js +++ b/mindplot/src/main/javascript/Designer.js @@ -239,7 +239,7 @@ mindplot.Designer = new Class({ this._workspace.setZoom(scale); } else { - core.Monitor.getInstance().logMessage('Sorry, no more zoom can be applied. \n Why do you need more?'); + $notify('No more zoom can be applied'); } }, @@ -256,7 +256,7 @@ mindplot.Designer = new Class({ this._workspace.setZoom(scale); } else { - core.Monitor.getInstance().logMessage('Sorry, no more zoom can be applied. \n Why do you need more?'); + $notify('No more zoom can be applied'); } }, @@ -269,14 +269,14 @@ mindplot.Designer = new Class({ var nodes = this.getModel().filterSelectedTopics(); if (nodes.length <= 0) { // If there are more than one node selected, - core.Monitor.getInstance().logMessage('Could not create a topic. Only one node must be selected.'); + $notify('Could not create a topic. Only one node must be selected.'); return; } if (nodes.length != 1) { // If there are more than one node selected, - core.Monitor.getInstance().logMessage('Could not create a topic. One topic must be selected.'); + $notify('Could not create a topic. One topic must be selected.'); return; } @@ -294,13 +294,13 @@ mindplot.Designer = new Class({ var nodes = this.getModel().filterSelectedTopics(); if (nodes.length <= 0) { // If there are more than one node selected, - core.Monitor.getInstance().logMessage('Could not create a topic. Only one node must be selected.'); + $notify('Could not create a topic. Only one node must be selected.'); return; } if (nodes.length > 1) { // If there are more than one node selected, - core.Monitor.getInstance().logMessage('Could not create a topic. One topic must be selected.'); + $notify('Could not create a topic. One topic must be selected.'); return; } diff --git a/mindplot/src/main/javascript/DesignerModel.js b/mindplot/src/main/javascript/DesignerModel.js index 4bd8ac38..084f2939 100644 --- a/mindplot/src/main/javascript/DesignerModel.js +++ b/mindplot/src/main/javascript/DesignerModel.js @@ -103,7 +103,7 @@ mindplot.DesignerModel = new Class({ if (isValid) { result.push(selectedNode.getId()); } else { - core.Monitor.getInstance().logMessage(errorMsg); + $notify(errorMsg); } } return result; @@ -124,7 +124,7 @@ mindplot.DesignerModel = new Class({ if (isValid) { result.push(selectedLine.getId()); } else { - core.Monitor.getInstance().logMessage(errorMsg); + $notify(errorMsg); } } return result; diff --git a/mindplot/src/main/javascript/PersistanceManager.js b/mindplot/src/main/javascript/PersistanceManager.js index 6eae9330..95c2d8ae 100644 --- a/mindplot/src/main/javascript/PersistanceManager.js +++ b/mindplot/src/main/javascript/PersistanceManager.js @@ -46,7 +46,7 @@ mindplot.PersistanceManager.save = function(mindmap, editorProperties, onSavedHa } }, errorHandler:function(message) { - var monitor = core.Monitor.getInstance(); + var monitor = core.ToolbarNotifier.getInstance(); monitor.logError("Save could not be completed. Please,try again in a couple of minutes."); // wLogger.error(message); }, @@ -75,7 +75,7 @@ mindplot.PersistanceManager.load = function(mapId) { } else { // Handle error message ... var msg = response.msgDetails; - var monitor = core.Monitor.getInstance(); + var monitor = core.ToolbarNotifier.getInstance(); monitor.logFatal("We're sorry, an error has occurred and we can't load your map. Please try again in a few minutes."); // wLogger.error(msg); } @@ -83,7 +83,7 @@ mindplot.PersistanceManager.load = function(mapId) { verb:"GET", async: false, errorHandler:function(msg) { - var monitor = core.Monitor.getInstance(); + var monitor = core.ToolbarNotifier.getInstance(); monitor.logFatal("We're sorry, an error has occurred and we can't load your map. Please try again in a few minutes."); // wLogger.error(msg); } diff --git a/mindplot/src/main/javascript/widget/ToolbarNotifier.js b/mindplot/src/main/javascript/widget/ToolbarNotifier.js index 578c191c..c4f65a3c 100644 --- a/mindplot/src/main/javascript/widget/ToolbarNotifier.js +++ b/mindplot/src/main/javascript/widget/ToolbarNotifier.js @@ -17,32 +17,49 @@ */ mindplot.widget.ToolbarNotifier = new Class({ - initialize : function() { - }, - _showMsg : function(msg, msgKind) { - if (msgKind == core.ToolbarNotifier.MsgKind.ERROR) { - msg = "
" + msg + "
"; - } - this._msgElem.innerHTML = msg; + initialize : function() { + this._container = $('headerNotifier'); + this._effect = new Fx.Elements(this._container, { + onComplete: function() { + this._container.setStyle('display', 'none'); + }.bind(this), + link:'cancel', + duration:8000, + transition: Fx.Transitions.Expo.easeInOut + }); }, logError : function(userMsg) { - this.logMessage(userMsg, core.ToolbarNotifier.MsgKind.ERROR); + this.logMessage(userMsg, mindplot.widget.ToolbarNotifier.MsgKind.ERROR); }, - logMessage : function(msg, msgKind) { - console.log(msg); - }, + logMessage : function(msg) { + $assert(msg, 'msg can not be null'); + this._container.set('text', msg); + this._container.setStyle('display', 'block'); + this._effect.start({ + 0: { + opacity: [1,0] + } + }); + this._container.position({ + relativeTo: $('header'), + position: 'upperCenter', + edge: 'centerTop' + }); + + } }); -core.ToolbarNotifier.MsgKind = { +mindplot.widget.ToolbarNotifier.MsgKind = { INFO:1, WARNING:2, ERROR:3, FATAL:4 }; -$notifier = new mindplot.widget.ToolbarNotifier(); \ No newline at end of file +var toolbarNotifier = new mindplot.widget.ToolbarNotifier(); +$notify = toolbarNotifier.logMessage.bind(toolbarNotifier); \ No newline at end of file diff --git a/mindplot/src/test/javascript/simpleTest.js b/mindplot/src/test/javascript/simpleTest.js index 3194cdb5..4a519c55 100644 --- a/mindplot/src/test/javascript/simpleTest.js +++ b/mindplot/src/test/javascript/simpleTest.js @@ -22,7 +22,7 @@ TestCase("Mindplot test",{ { designer.save(function() { - // var monitor = core.Monitor.getInstance(); + // var monitor = core.ToolbarNotifier.getInstance(); }, false); } }; diff --git a/wise-doc/src/main/webapp/css/editor.css b/wise-doc/src/main/webapp/css/editor.css deleted file mode 100644 index cbcb7594..00000000 --- a/wise-doc/src/main/webapp/css/editor.css +++ /dev/null @@ -1,787 +0,0 @@ -@import "/mindplot/src/main/javascript/widget/lightbox.css"; -@import "/mindplot/src/main/javascript/libraries/moodialog/css/MooDialog.css"; - -@header-height : 75px; -@header-toolbar-height : 35px; -@header-info-height : @header-height - @header-toolbar-height; - -/* Common Default Style */ -html { - overflow: hidden; -} - -body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { - margin: 0; - padding: 0; -} - -table { - border-collapse: collapse; - border-spacing: 0; -} - -fieldset, img { - border: 0; -} - -address, caption, cite, code, dfn, em, strong, th, var { - font-style: normal; - font-weight: normal; -} - -ol, ul { - list-style: none; -} - -caption, th { - text-align: left; -} - -h1, h2, h3, h4, h5, h6 { - font-size: 100%; - font-weight: normal; -} - -q:before, q:after { - content: ''; -} - -abbr, acronym { - border: 0; -} - -/** - * Percents could work for IE, but for backCompat purposes, we are using keywords. - * x-small is for IE6/7 quirks mode. - * - */ -body { - font: 13px arial, helvetica, clean, sans-serif; - font-size: small; - font: x-small; - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -o-user-select: none; - user-select: none; -} - -table { - font-size: inherit; - font-size: 100%; -} - -/** - * 99% for safari; 100% is too large - */ -select, input, textarea { - font: 99% arial, helvetica, clean, sans-serif; -} - -/** - * Bump up !IE to get to 13px equivalent - */ -pre, code { - font: 115% monospace; - font-size: 100%; -} - -/** - * Default line-height based on font-size rather than "computed-value" - * see: http://www.w3.org/TR/CSS21/visudet.html#line-height - */ - -body * { - line-height: 1.22em; -} - -* { - margin: 0; - padding: 0; -} - -body { - font: normal 80% "trebuchet ms", verdana, arial, helvetica, sans-serif; - background-color: #fff; -} - -img { - border: 0; -} - -form { - padding: 0; - margin: 0; -} - -p { - margin: 5px 0 5px 0; -} - -ul { - list-style-position: inside; -} - -a:link, a:visited { - font: bold 100%; - text-decoration: underline; - color: black; -} - -a:hover, a:active { - font: bold 100%; - text-decoration: underline; - color: black; -} - -h2 { - font-size: 160%; - color: #8e9181; -} - -h1 { - font-style: normal; - font-size: 180%; - color: white; - padding-bottom: 2px; -} - -h3 { - /* use as subhead on main body */ - clear: left; - font-style: normal; - font-size: 130%; - color: #6b6f5b; -} - -h4 { - /* use as headers in footer */ - font-weight: bold; - font-size: 120%; - border-bottom: 1px solid #8e9181; - color: #e2e3dd; - padding-bottom: 10px; - width: 400px; -} - -/**********************************************************/ -/* End: Common Default Style */ -/**********************************************************/ - -/**********************************************************/ -/* Error Dialog ... */ -/**********************************************************/ - -#waitDialog { - position: absolute; - top: 10px; - left: 10px; - height: 200px; -} - -#waitingContainer, #errorContainer { - position: relative; - top: 80px; - height: 120px; /*background: whitesmoke;*/ - background: #FEFEFE; - opacity: .99; - padding: 15px; - width: 100%; - border: 1px solid; - border-color: #a9a9a9; - -} - -#errorContainer { - width: 400px; - border: 1px solid red; -} - -#waitingContainer .loadingText { - position: relative; - top: 50%; - margin-top: -35px; - font-size: 30px; - font-weight: bold; - vertical-align: text-bottom; - height: 30px; - float: left; -} - -#errorContainer .loadingText { - position: relative; - top: 50%; - margin-top: -80px; - font-size: 15px; - font-weight: bold; - vertical-align: text-bottom; - height: 30px; - float: right; - padding-left: 120px; -} - -#waitingContainer .loadingIcon { - position: relative; - background: url(../images/loadingIcon.gif) no-repeat; - top: 50%; - margin-top: -65px; - height: 100px; - width: 121px; - float: left; - clear: both; -} - -#errorContainer .loadingIcon { - position: relative; - background: url(../images/errorIcon.png) no-repeat; - top: 50%; - margin-top: -65px; - height: 100px; - width: 121px; - float: left; - clear: both; -} - -/********************************************************************************/ -/* Toolbar Styles */ -/********************************************************************************/ - -div#header { - width: 100%; - height: @header-height; - background: #393939; /* Old browsers */ - background: -moz-linear-gradient(top, #393939 0%, #000000 100%); /* FF3.6+ */ - background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #393939), color-stop(100%, #000000)); /* Chrome,Safari4+ */ - background: -webkit-linear-gradient(top, #393939 0%, #000000 100%); /* Chrome10+,Safari5.1+ */ - background: -o-linear-gradient(top, #393939 0%, #000000 100%); /* Opera11.10+ */ - background: -ms-linear-gradient(top, #393939 0%, #000000 100%); /* IE10+ */ - background: linear-gradient(top, #393939 0%, #000000 100%); /* W3C */ -} - -div#headerLogo { - background: url(../images/logo-small.png) no-repeat center top; - height: 40px; - width: 80px; - float: left; -} - -div#headerInfo { - width: 100%; - height: @header-info-height; - color: white; -} - -div#headerActions { - text-align: right; - margin-top: 13px; - padding-right: 10px; - color: white; - float: right; -} - -div#headerActions span { - border-bottom: 3px solid rgb(247, 201, 49); -} - -div#headerActions a { - color: white; - text-decoration: none; -} - -div#headerMapTitle { - width: 200px; - height:(@header-info-height ) - 13; - text-align: left; - padding-top: 13px; - padding-left: 50px; - color: white; - float: left; - font-style: italic; -} - -div#headerMapTitle span { - padding: 4px 50px; - border: 1px solid rgb(90, 90, 90); - background-color: rgb(45, 45, 45); - -moz-border-radius: 3px; - -webkit-border-radius: 3px; - border-radius: 3px; - box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); -} - -div#toolbar { - width: 100%; - height: @header-toolbar-height; - background-image: linear-gradient(bottom, rgb(229, 227, 209) 47%, rgb(252, 250, 237) 87%); - background-image: -o-linear-gradient(bottom, rgb(229, 227, 209) 47%, rgb(252, 250, 237) 87%); - background-image: -moz-linear-gradient(bottom, rgb(229, 227, 209) 47%, rgb(252, 250, 237) 87%); - background-image: -webkit-linear-gradient(bottom, rgb(229, 227, 209) 47%, rgb(252, 250, 237) 87%); - background-image: -ms-linear-gradient(bottom, rgb(229, 227, 209) 47%, rgb(252, 250, 237) 87%); - - background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.47, rgb(229, 227, 209)), color-stop(0.87, rgb(252, 250, 237))); - border-bottom: 3px double rgb(190, 190, 190); - border-top: 1px solid rgb(190, 190, 190); -} - -div#toolbar .buttonContainer { - height: @header-toolbar-height; - float: left; - margin-left: 5px; -} - -/******************************************************************************************/ -/* Buttons*/ -/******************************************************************************************/ - -div#toolbar .buttonOn, div#toolbar .buttonOff, div#toolbar .buttonActive, div#toolbar .buttonOn:hover { - width: 28px; - height: 28px; - float: left; - text-align: center; - z-index: 4; - margin-top: 3px; - padding-top: 2px; - padding-left: 2px; -} - -div#toolbar .buttonOn:hover { - cursor: pointer; - opacity: 1; - background: url(../images/btn-bg-hover.png) no-repeat center top; -} - -div#toolbar .buttonOn { - opacity: 0.8; - background: url(../images/btn-bg-normal.png) no-repeat center top; -} - -div#toolbar .buttonOff { - opacity: 0.4; - background: url(../images/btn-bg-normal.png) no-repeat center top; -} - -div#exportAnchor { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; -} - -div#toolbar .buttonExtOn, div#toolbar .buttonExtOff, div#toolbar .buttonExtActive, div#toolbar .buttonExtOn:hover { - width: 40px; - height: 28px; - float: left; - text-align: left; - z-index: 4; - margin-top: 3px; - padding-top: 2px; - padding-left: 5px; -} - -div#toolbar .buttonExtOn:hover { - opacity: 1; - background: url(../images/btne-bg-hover.png) no-repeat center top; - -} - -div#toolbar .buttonExtActive { - opacity: 1; - background: url(../images/btne-bg-selected.png) no-repeat center top; - -} - -div#toolbar .buttonExtOn { - opacity: 0.8; - background: url(../images/btne-bg-normal.png) no-repeat center top; -} - -div#toolbar .buttonExtOff { - opacity: 0.4; - background: url(../images/btne-bg-normal.png) no-repeat center top; -} - -div#exportAnchor { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; -} - -/*div#saveButton {*/ -/*background: url(../images/save.png) no-repeat center top;*/ -/*}*/ - -/*div#undoEdition {*/ -/*background: url(../images/undo.png) no-repeat center top;*/ -/*}*/ - -/*div#redoEdition {*/ -/*background: url(../images/redo.png) no-repeat center top;*/ -/*}*/ - -/*div#export {*/ -/*background: url(../images/export.png) no-repeat center top;*/ -/*}*/ - -/*div#zoomIn {*/ -/*background: url(../images/zoom-in.png) no-repeat center top;*/ -/*}*/ - -/*div#zoomOut {*/ -/*background: url(../images/zoom-out.png) no-repeat center top;*/ -/*}*/ - -/*div#addTopic {*/ -/*background: url(../images/topic-add.png) no-repeat center top;*/ -/*}*/ - -/*div#deleteTopic {*/ -/*background: url(../images/topic-delete.png) no-repeat center top;*/ -/*}*/ - -/*div#topicColor {*/ -/*background: url(../images/topic-color.png) no-repeat center top;*/ -/*}*/ - -/*div#topicIcon {*/ -/*background: url(../images/topic-icon.png) no-repeat center top;*/ -/*}*/ - -/*div#topicNote {*/ -/*background: url(../images/note.png) no-repeat center top;*/ -/*}*/ - -/*div#topicNote {*/ -/*background: url(../images/topic-icon.png) no-repeat center top;*/ -/*z-index: 4;*/ -/*}*/ - -/*div#topicLink {*/ -/*background: url(../images/topic-link.png) no-repeat center top;*/ -/*z-index: 4;*/ -/*}*/ - -/*div#topicNote {*/ -/*background-image: url(../images/note.png);*/ -/*z-index: 4;*/ -/*}*/ - -/*div#topicBorder {*/ -/*background: url(../images/topic-border.png) no-repeat center top;*/ -/*}*/ - -/*div#fontFamily {*/ -/*background: url(../images/font-type.png) no-repeat center top;*/ -/*}*/ - -/*div#topicShape {*/ -/*background: url(../images/topic-shape.png) no-repeat center top;*/ -/*}*/ - -/*div#fontBold {*/ -/*background: url(../images/font-bold.png) no-repeat center top;*/ -/*}*/ - -/*div#fontItalic {*/ -/*background: url(../images/font-italic.png) no-repeat center top;*/ -/*}*/ - -/*div#fontColor {*/ -/*background: url(../images/font-color.png) no-repeat center top;*/ -/*}*/ - -/*div#fontSize {*/ -/*background: url(../images/font-size.png) no-repeat center top;*/ -/*}*/ - -/*div#shareIt {*/ -/*background: url(../images/share.png) no-repeat center top;*/ -/*}*/ - -/*div#publishIt {*/ -/*background: url(../images/publish.png) no-repeat center top;*/ -/*}*/ - -/*div#tagIt {*/ -/*background: url(../images/tag.png) no-repeat center top;*/ -/*}*/ - -div#topicRelation { - width: 56px; - background: url(../images/topic-relation.png) no-repeat center top; - z-index: 4; -} - -div#colorPalette { - border: 1px solid #bbb4d6; - display: none; - position: absolute; - z-index: 4; - width: 160px; - top: 89px; -} - -/*.toolbarPanel {*/ -/*z-index: 4;*/ -/*top: @header-height;*/ -/*-moz-transition: opacity 0.218s ease 0s;*/ -/*background: none repeat scroll 0 0 #FFFFFF;*/ -/*border: 1px solid rgba(0, 0, 0, 0.2);*/ -/*box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);*/ -/*cursor: default;*/ -/*font-size: 13px;*/ -/*margin: 0;*/ -/*outline: medium none;*/ -/*padding: 0 0 6px;*/ -/*position: absolute;*/ -/*}*/ - -div.toolbarPanelLink, div.toolbarPanelLinkSelectedLink { - cursor: pointer; - color: black; - margin: 1px; - cursor: pointer; - font-size: 12px; - padding: 5px 10px; - font-weight: bold; -} - -div.toolbarPanelLink:hover, div.toolbarPanelLinkSelectedLink { - cursor: pointer; - background-color: #efefef; -} - -div#mindplot { - position: relative; - top: 0; - left: 0; - width: 100%; - border: 0; -} - -div#workspaceContainer { - /*background: url(../images/grid.gif) bottom left repeat !important;*/ -} - -div#small_error_icon { - padding-left: 18px; - min-height: 16px; - background: url(../images/error_icon.png) bottom left no-repeat !important; -} - -.notesTip { - background-color: #dfcf3c; - padding: 5px 15px; - color: #666666; - /*font-weight: bold;*/ - /*width: 100px;*/ - font-size: 13px; - -moz-border-radius: 3px; - -webkit-border-radius: 3px; - border-radius: 3px; - box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); -} - -.linkTip { - background-color: #dfcf3c; - padding: 5px 15px; - color: #666666; - /*font-weight: bold;*/ - /*width: 100px;*/ - font-size: 13px; - -moz-border-radius: 3px; - -webkit-border-radius: 3px; - border-radius: 3px; - box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); -} - -.toolbarPaneTip { - background-color: rgb(228, 226, 210); - padding: 5px 5px; - color: #f5f5f5; - /*font-weight: bold;*/ - /*width: 100px;*/ - font-size: 11px; - -moz-border-radius: 60px; - -webkit-border-radius: 6px; - border-radius: 6px; - box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2); - border: 3px double rgb(190, 190, 190); -} - -.toolbarTip { - background-color: #000000; - padding: 5px 5px; - color: #f5f5f5; - /*font-weight: bold;*/ - /*width: 100px;*/ - font-size: 11px; -} - -/* */ -.btn-primary { - cursor: pointer; - display: inline-block; - padding: 5px 14px 6px; - text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); - color: #333; - font-size: 13px; - line-height: normal; - border: 1px solid #ccc; - border-bottom-color: #bbb; - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - border-radius: 4px; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); - -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); - -webkit-transition: 0.1s linear all; - -moz-transition: 0.1s linear all; - -ms-transition: 0.1s linear all; - -o-transition: 0.1s linear all; - transition: 0.1s linear all; - color: #ffffff; - background-color: #0064cd; - background-repeat: repeat-x; - background-image: -khtml-gradient(linear, left top, left bottom, from(#049cdb), to(#0064cd)); - background-image: -moz-linear-gradient(top, #049cdb, #0064cd); - background-image: -ms-linear-gradient(top, #049cdb, #0064cd); - background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #049cdb), color-stop(100%, #0064cd)); - background-image: -webkit-linear-gradient(top, #049cdb, #0064cd); - background-image: -o-linear-gradient(top, #049cdb, #0064cd); - background-image: linear-gradient(top, #049cdb, #0064cd); - text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); - border-color: #0064cd #0064cd #003f81; - border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); - margin-top: 7px; -} - -.btn-primary:hover { - background-position: 0 -15px; - text-decoration: none; -} - -.btn-secondary { - cursor: pointer; - display: inline-block; - background-color: #e6e6e6; - background-repeat: no-repeat; - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6)); - background-image: -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); - background-image: -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6); - background-image: -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); - background-image: -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); - background-image: linear-gradient(#ffffff, #ffffff 25%, #e6e6e6); - padding: 5px 14px 6px; - text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); - color: #333; - font-size: 13px; - line-height: normal; - border: 1px solid #ccc; - border-bottom-color: #bbb; - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - border-radius: 4px; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); - -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); - -webkit-transition: 0.1s linear all; - -moz-transition: 0.1s linear all; - -ms-transition: 0.1s linear all; - -o-transition: 0.1s linear all; - transition: 0.1s linear all; - text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); - margin-top: 7px; -} - -.btn-secondary:hover { - background-position: 0 -15px; - text-decoration: none; -} - -/** */ -/* Modal dialogs definitions */ - -.tagItModalDialog, .historyModalDialog, .shareItModalDialog, .exportModalDialog, .publishModalDialog { - position: fixed; - top: 50%; - left: 50%; - z-index: 11000; - width: 400px; - margin: -250px 0 0 -250px; - background-color: #ffffff; - border: 1px solid #999; - border: 1px solid rgba(0, 0, 0, 0.3); - border: 1px solid #999; - /* IE6-7 */ - - -webkit-border-radius: 6px; - -moz-border-radius: 6px; - border-radius: 6px; - -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); - -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); - box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); - -webkit-background-clip: padding-box; - -moz-background-clip: padding-box; - background-clip: padding-box; - padding: 30px; -} - -.shareItModalDialog { - width: 500px; -} - -.publishModalDialog { - width: 600px; -} - -.tagItModalDialog .title, .historyModalDialog .title, .shareItModalDialog .title, .exportModalDialog .title, .publishModalDialog .title { - position: absolute; - top: 0; - left: 0; - right: 0; - border-bottom: 1px solid #a1aec5; - font-weight: bold; - text-shadow: 1px 1px 0 #fff; - border-bottom: 1px solid #eee; - padding: 5px 30px; - font-size: 18px -} - -.tagItModalDialog .content { - height: 130px; -} - -.historyModalDialog .content { - height: 300px; -} - -.shareItModalDialog .content { - height: 300px; -} - -.exportItModalDialog .content { - height: 280px; -} - -.publishModalDialog .content { - height: 330px; -} - -.modalDialog h1 { - font-size: 14px; -} - -.modalDialog h2 { - font-size: 14px; - margin: 5px; -} - -td.formLabel { - text-align: right; - padding: 2px 10px; - font-weight: bolder; - vertical-align: top; -} \ No newline at end of file diff --git a/wise-doc/src/main/webapp/html/editor.html b/wise-doc/src/main/webapp/html/editor.html index 3c5b645d..bf19a041 100644 --- a/wise-doc/src/main/webapp/html/editor.html +++ b/wise-doc/src/main/webapp/html/editor.html @@ -7,9 +7,8 @@ - - + @@ -80,13 +79,11 @@ }); // @Todo: Hack for testing save ... window.MapEditorService = {}; - window.MapEditorService.saveMap = function(mapId, xmlMapStr, pref, saveHistory){ - console.log(xmlMapStr); + window.MapEditorService.saveMap = function(mapId, xmlMapStr, pref, saveHistory) { + console.log(xmlMapStr); }; - - @@ -132,6 +129,7 @@ +
+ Algo de texto +
diff --git a/wise-webapp/src/main/webapp/css/embedded.css b/wise-webapp/src/main/webapp/css/embedded.css index 2e4a60c2..84f4a830 100644 --- a/wise-webapp/src/main/webapp/css/embedded.css +++ b/wise-webapp/src/main/webapp/css/embedded.css @@ -131,4 +131,5 @@ div#mapDetails .title { font-weight: bold; margin-left: 10px; margin-right: 3px; + } \ No newline at end of file diff --git a/wise-webapp/src/main/webapp/css/header.less b/wise-webapp/src/main/webapp/css/header.less index a66beb02..e4af7377 100644 --- a/wise-webapp/src/main/webapp/css/header.less +++ b/wise-webapp/src/main/webapp/css/header.less @@ -61,4 +61,20 @@ div#headerMapTitle span { -webkit-border-radius: 3px; border-radius: 3px; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); +} + +div#headerNotifier { + border: 1px solid rgb(241,163,39); + background-color: rgb(252,235,192); + -moz-border-radius: 3px; + -webkit-border-radius: 3px; + border-radius: 3px; + position: absolute; + padding: 5px 9px; + color:back; + white-space:nowrap; + margin-top:5px; + /*margin-top:-34px;*/ + display:none; + /*right: 5px;*/ } \ No newline at end of file diff --git a/wise-webapp/src/main/webapp/images/ajax-loader.gif b/wise-webapp/src/main/webapp/images/ajax-loader.gif new file mode 100644 index 00000000..baa98851 Binary files /dev/null and b/wise-webapp/src/main/webapp/images/ajax-loader.gif differ diff --git a/wise-webapp/src/main/webapp/js/common.js b/wise-webapp/src/main/webapp/js/common.js index 5895afb0..8d7c773a 100644 --- a/wise-webapp/src/main/webapp/js/common.js +++ b/wise-webapp/src/main/webapp/js/common.js @@ -16,399 +16,7 @@ * limitations under the License. */ -/******************************************************************/ -/* MOOdalBox 1.3.b4 */ -/* A modal box (inline popup), used to display remote content */ -/* loaded using AJAX, written for the mootools framework */ -/* by Razvan Brates, razvan [at] e-magine.ro */ -/******************************************************************/ -/* http://www.e-magine.ro/moodalbox */ -/******************************************************************/ -/* */ -/* MIT style license: */ -/* http://en.wikipedia.org/wiki/MIT_License */ -/* */ -/* mootools found at: */ -/* http://mootools.net/ */ -/* */ -/* Original code based on "Slimbox", by Christophe Beyls: */ -/* http://www.digitalia.be/software/slimbox */ -/******************************************************************/ - -// Constants defined here can be changed for easy config / translation -// (defined as vars, because of MSIE's lack of support for const) - -var _ERROR_MESSAGE = "Oops.. there was a problem with your request.

" + - "Please try again.

" + - "Click anywhere to close."; -// the error message displayed when the request has a problem -var _RESIZE_DURATION = 400; -// Duration of height and width resizing (ms) -var _INITIAL_WIDTH = 250; -// Initial width of the box (px) -var _INITIAL_HEIGHT = 250; -// Initial height of the box (px) -var _CONTENTS_WIDTH = 500; -// Actual width of the box (px) -var _CONTENTS_HEIGHT = 400; -// Actual height of the box (px) -var _DEF_CONTENTS_WIDTH = 500; -// Default width of the box (px) - used for resetting when a different setting was used -var _DEF_CONTENTS_HEIGHT = 400; -// Default height of the box (px) - used for resetting when a different setting was used -var _DEF_FULLSCREEN_WIDTH = 0.95; -// Default fullscreen width (%) -var _DEF_FULLSCREEN_HEIGHT = 0.8; -// Default fullscreen height (%) -var _ANIMATE_CAPTION = true; -// Enable/Disable caption animation -var _EVAL_SCRIPTS = true; -// Option to evaluate scripts in the response text -var _EVAL_RESPONSE = false; -// Option to evaluate the whole response text - -// The MOOdalBox object in its beauty -var MOOdalBox = { - -// init the MOOdalBox - init: function (options) { - - // init default options - this.options = Object.extend({ - resizeDuration: _RESIZE_DURATION, - initialWidth: _INITIAL_WIDTH, - initialHeight: _INITIAL_HEIGHT, - contentsWidth: _CONTENTS_WIDTH, - contentsHeight: _CONTENTS_HEIGHT, - defContentsWidth: _DEF_CONTENTS_WIDTH, - defContentsHeight: _DEF_CONTENTS_HEIGHT, - defFullscreenWidth: _DEF_FULLSCREEN_WIDTH, - defFullscreenHeight:_DEF_FULLSCREEN_HEIGHT, - animateCaption: _ANIMATE_CAPTION, - evalScripts: _EVAL_SCRIPTS, - evalResponse: _EVAL_RESPONSE - }, options || {}); - - // scan anchors for those opening a MOOdalBox - this.anchors = []; - this.scanAnchors(document.body, false); - // scan forms for those opening a MOOdalBox - this.forms = []; - this.scanForms(document.body, false); - // add event listeners - - // @Todo: Deprecated method ... - // this.eventKeyDown = this.keyboardListener.bindWithEvent(this); - - - this.eventPosition = this.position.bind(this); - - // init the HTML elements - // the overlay (clickable to close) - this.overlay = new Element('div').setProperty('id', 'mb_overlay').inject(document.body); - - this.overlayDiv = new Element('div').setOpacity(0).setStyles({position: 'absolute', border: 0, width: '100%', backgroundColor: "black", zIndex: 98}).inject(document.body); - // the center element - this.center = new Element('div').setProperty('id', 'mb_center').setStyles({width: this.options.initialWidth + 'px', height: this.options.initialHeight + 'px', marginLeft: '-' + (this.options.initialWidth / 2) + 'px', display: 'none'}).inject(document.body); - // the actual page contents - this.contents = new Element('div').setProperty('id', 'mb_contents').inject(this.center); - - // the bottom part (caption / close) - this.bottom = new Element('div').setProperty('id', 'mb_bottom').setStyle('display', 'none').inject(document.body); - this.closelink = new Element('a').setProperties({id: 'mb_close_link', href: '#'}).inject(this.bottom); - this.caption = new Element('div').setProperty('id', 'mb_caption').inject(this.bottom); - new Element('div').setStyle('clear', 'both').inject(this.bottom); - - this.error = new Element('div').setProperty('id', 'mb_error').innerHTML = _ERROR_MESSAGE; - - // attach the close event to the close button / the overlay - this.closelink.onclick = this.overlay.onclick = this.close.bind(this); - - // init the effects - var nextEffect = this.nextEffect.bind(this); - this.fx = { - overlay: new Fx.Morph(this.overlay).set({'opacity':0, duration: 500 }).hide(), - resize: this.center.effects({ onComplete: nextEffect }), - contents: this.contents.effect('opacity', { duration: 500, onComplete: nextEffect }), - bottom: this.bottom.effects({ duration: 400, onComplete: nextEffect }) - }; - - // AJAX related options - var ajaxFailure = this.ajaxFailure.bind(this); - this.ajaxOptions = { - update: this.contents, - evalScripts: this.options.evalScripts, - evalResponse: this.options.evalResponse, - onComplete: nextEffect, - onFailure: ajaxFailure, - encoding: 'utf-8' - }; - - this.ajaxRequest = Class.empty; - - }, - - click: function(link) { - return this.open(link.href, link.title, link.rel, false); - }, - - open: function(sLinkHref, sLinkTitle, sLinkRel, oForm) { - //Remove window key event listeners. - this.eventContainer = new Element('div'); - this.eventContainer.cloneEvents($(document), 'keydown'); - $(document).removeEvents('keydown'); - - this.href = sLinkHref; - this.title = sLinkTitle; - this.rel = sLinkRel; - - if (oForm) { - if (oForm.method == 'get') { - this.href += "?" + oForm.toQueryString(); - this.ajaxOptions = Object.extend(this.ajaxOptions, {method: 'get', postBody: ''}); - } else { - this.ajaxOptions = Object.extend(this.ajaxOptions, {method: 'post', postBody: oForm}); - } - } else { - this.ajaxOptions = Object.extend(this.ajaxOptions, {method: 'get', postBody: ''}); - } - this.ajaxOptions.encoding = 'utf-8'; - - this.position(); - this.setup(true); - this.top = Window.getScrollTop() + (Window.getHeight() / 15); - this.center.setStyles({top: this.top + 'px', display: ''}); - this.fx.overlay.custom(0.8); - return this.loadContents(sLinkHref); - }, - - position: function() { - this.overlay.setStyles({top: Window.getScrollTop() + 'px', height: Window.getHeight() + 'px'}); - this.overlayDiv.setStyles({top: Window.getScrollTop() + 'px', height: Window.getHeight() + 'px'}); - }, - - scanAnchors: function(oWhere, bForce) { - - // scan anchors for those opening a MOOdalBox - $$($(oWhere).getElements('a')).each(function(el) { - // we use a regexp to check for links that - // have a rel attribute starting with "moodalbox" - if (el.href && ((el.rel && el.rel.test('^moodalbox', 'i')) || (bForce && !el.onclick))) { - if (bForce && !el.rel) { - // if we're forcing links to open in a moodalbox, we're keeping the current size - el.rel = "moodalbox " + this.options.contentsWidth + "px " + this.options.contentsHeight + "px"; - if (this.wizardMode) el.rel += " wizard"; - } - el.onclick = this.click.pass(el, this); - this.anchors.push(el); - } - }, this); - }, - - scanForms: function (oWhere, bForce) { - // scan forms for those opening a MOOdalBox - $$($(oWhere).getElements('form')).each(function(el) { - // we use a regexp to check for links that - // have a rel attribute starting with "moodalbox" - el.rel = el.getProperty('rel'); - if ((el.rel && el.rel.test('^moodalbox', 'i')) || bForce) { - if (bForce && !el.rel) { - // if we're forcing links to open in a moodalbox, we're keeping the current size - el.rel = "moodalbox " + this.options.contentsWidth + "px " + this.options.contentsHeight + "px"; - if (this.wizardMode) el.rel += " wizard"; - } - el.onsubmit = this.open.pass([el.action, el.title, el.rel, el], this); - this.forms.push(el); - } - }, this); - }, - - setup: function(open) { - //var elements = $A($$('object')); - //elements.extend($$(window.ActiveXObject ? 'select' : 'embed')); - //elements.each(function(el){ el.style.visibility = open ? 'hidden' : ''; }); - - // use an iframe to show under everything - - var fn = open ? 'addEvent' : 'removeEvent'; - window[fn]('scroll', this.eventPosition)[fn]('resize', this.eventPosition); - document[fn]('keydown', this.eventKeyDown); - this.step = 0; - }, - - loadContents: function() { - - if (this.step) return false; - this.step = 1; - - // check to see if there are specified dimensions - // if not, fall back to default values - - // fullscreen switch concept originally by Lennart Pilon (http://ljpilon.nl/) - - // we check for a "fullscreen" switch - if (this.rel.test("fullscreen")) { - - this.options.contentsWidth = this.options.defFullscreenWidth * window.getWidth(); - this.options.contentsHeight = this.options.defFullscreenHeight * window.getHeight(); - - } else { // we check for other specified dimensions (px or %) - - var aDim = this.rel.match(/[0-9.]+(px|%)/g); - - if (aDim && aDim[0]) { //first dimension is interpreted as width - - var w = aDim[0].toInt(); - - if (aDim[0].test("%")) { - this.options.contentsWidth = (w > 0) ? 0.01 * w * window.getWidth() : this.options.defFullscreenWidth * window.getWidth(); - } else { - this.options.contentsWidth = (w > 0) ? w : this.options.defContentsWidth; - } - } else { // we switch to defaults if there aren't any dimensions specified - this.options.contentsWidth = this.options.defContentsWidth; - this.options.contentsHeight = this.options.defContentsHeight; - } - - if (aDim && aDim[1]) { // we have a second dimension specified, which we'll interpret as height - - var h = aDim[1].toInt(); - - if (aDim[1].test("%")) { - this.options.contentsHeight = (h > 0) ? 0.01 * h * window.getHeight() : this.options.defFullscreenHeight * window.getHeight(); - } else { - this.options.contentsHeight = (h > 0) ? h : this.options.defContentsHeight; - } - } else if (aDim && aDim[0]) { - // we have the first dimension specified, but not the second - // so we interpret as width = height = the given value - if (aDim[0].test("%")) { - this.options.contentsHeight = (w > 0) ? 0.01 * w * window.getHeight() : this.options.defFullscreenHeight * window.getHeight(); - } else { - this.options.contentsHeight = (w > 0) ? w : this.options.defContentsHeight; - } - } - // correct a little approximation bug (size flickers) - this.options.contentsWidth = Math.floor(this.options.contentsWidth); - this.options.contentsHeight = Math.floor(this.options.contentsHeight); - - } - - this.wizardMode = this.rel.test("wizard"); - - // this is where we'll check for other options passed via the rel attribute - - this.bottom.setStyles({opacity: '0', height: '0px', display: 'none'}); - this.center.className = 'mb_loading'; - - this.fx.contents.hide(); - - // AJAX call here - this.ajaxRequest = new Ajax(this.href, this.ajaxOptions).request(); - - // make the local timeout call here - - return false; - }, - - ajaxFailure: function () { - this.contents.innerHTML = ''; - this.error.clone().inject(this.contents); - this.nextEffect(); - this.center.setStyle('cursor', 'pointer'); - this.bottom.setStyle('cursor', 'pointer'); - this.center.onclick = this.bottom.onclick = this.close.bind(this); - }, - - -// make the local timeout function here - - - nextEffect: function() { - switch (this.step++) { - case 1: - // remove previous styling from the elements - // (e.g. styling applied in case of an error) - this.center.className = ''; - this.center.setStyle('cursor', 'default'); - this.bottom.setStyle('cursor', 'default'); - this.center.onclick = this.bottom.onclick = ''; - this.caption.innerHTML = this.title; - - this.contents.setStyles({width: this.options.contentsWidth + "px", height: this.options.contentsHeight + "px"}); - - if (this.center.clientHeight != this.contents.offsetHeight) { - this.fx.resize.options.duration = this.options.resizeDuration; - this.fx.resize.custom({height: [this.center.clientHeight, this.contents.offsetHeight]}); - break; - } - this.step++; - - - case 2: - if (this.center.clientWidth != this.contents.offsetWidth) { - this.fx.resize.custom({width: [this.center.clientWidth, this.contents.offsetWidth], marginLeft: [-this.center.clientWidth / 2, -this.contents.offsetWidth / 2]}); - break; - } - this.step++; - - case 3: - this.bottom.setStyles({top: (this.top + this.center.clientHeight) + 'px', width: this.contents.style.width, marginLeft: this.center.style.marginLeft, display: ''}); - - // check to see if in wizard mode and parse links - if (this.wizardMode) this.scanAnchors(this.contents, true); - if (this.wizardMode) this.scanForms(this.contents, true); - - this.fx.contents.custom(0, 1); - break; - - case 4: - if (this.options.animateCaption) { - this.fx.bottom.custom({opacity: [0, 1], height: [0, this.bottom.scrollHeight]}); - break; - } - this.bottom.setStyles({opacity: '1', height: this.bottom.scrollHeight + 'px'}); - - case 5: - this.step = 0; - } - }, - - - keyboardListener: function(event) { - // close the MOOdalBox when the user presses CTRL + W, CTRL + X, ESC - if ((event.control && event.key == 'w') || (event.control && event.key == 'x') || (event.key == 'esc')) { - this.close(); - event.stop(); - } - }, - - close: function() { - //restore key event listeners - $(document).cloneEvents(this.eventContainer, 'keydown'); - this.eventContainer.removeEvents('keydown'); - if (this.step < 0) return; - this.step = -1; - for (var f in this.fx) this.fx[f].clearTimer(); - this.center.style.display = this.bottom.style.display = 'none'; - this.center.className = 'mb_loading'; - this.fx.overlay.chain(this.setup.pass(false, this)).custom(0); - this.overlayDiv.style.display = "none"; - return false; - }, - - config: function(options) { - this.options = Object.extend(this.options, options || {}); - return false; - // to be used on links - } - -}; - -// Moodal Dialog startup -//window.addEvent('domready', MOOdalBox.init.bind(MOOdalBox)); - - +// @Todo: This must be reviewed ... function displayLoading() { $('headerLoading').style.visibility = 'visible'; } \ No newline at end of file diff --git a/wise-webapp/src/main/webapp/js/editor.js b/wise-webapp/src/main/webapp/js/editor.js index 43abe9f3..3ab02089 100644 --- a/wise-webapp/src/main/webapp/js/editor.js +++ b/wise-webapp/src/main/webapp/js/editor.js @@ -35,7 +35,7 @@ function setUpToolbar(designer, readOnly) { if (designer.needsSave()) { designer.save(function() { - var monitor = core.Monitor.getInstance(); + var monitor = core.ToolbarNotifier.getInstance(); }, false); } }).periodical(30000);