From 5d1ab3cb6ee2caaccd26f22e2e07daac441ee77d Mon Sep 17 00:00:00 2001 From: Paulo Veiga Date: Sat, 8 Oct 2011 20:36:47 -0300 Subject: [PATCH] Fix add links. --- mindplot/pom.xml | 7 +- .../src/main/javascript/ActionDispatcher.js | 2 +- mindplot/src/main/javascript/IconGroup.js | 1 + mindplot/src/main/javascript/LinkIcon.js | 185 +++--------------- .../main/javascript/{Note.js => NoteIcon.js} | 8 +- .../javascript/StandaloneActionDispatcher.js | 4 +- mindplot/src/main/javascript/Topic.js | 62 +++--- ...Command.js => ChangeLinkToTopicCommand.js} | 19 +- .../commands/ChangeNoteToTopicCommand.js | 4 +- .../commands/RemoveLinkFromTopicCommand.js | 6 +- .../libraries/moodialog/MooDialog.js | 6 +- .../src/main/javascript/model/LinkModel.js | 14 +- .../src/main/javascript/widget/FloatingTip.js | 8 +- .../src/main/javascript/widget/LinkEditor.js | 41 ++-- .../main/javascript/widget/LinkIconTooltip.js | 91 +++++++++ .../src/main/javascript/widget/NoteEditor.js | 25 ++- web2d/src/main/javascript/Group.js | 2 +- wise-doc/src/main/webapp/css/common.css | 154 +++++++++------ .../src/main/webapp/images/world_link.png | Bin 0 -> 957 bytes 19 files changed, 333 insertions(+), 306 deletions(-) rename mindplot/src/main/javascript/{Note.js => NoteIcon.js} (92%) rename mindplot/src/main/javascript/commands/{AddLinkToTopicCommand.js => ChangeLinkToTopicCommand.js} (73%) create mode 100644 mindplot/src/main/javascript/widget/LinkIconTooltip.js create mode 100644 wise-doc/src/main/webapp/images/world_link.png diff --git a/mindplot/pom.xml b/mindplot/pom.xml index 649957b9..c1e35500 100644 --- a/mindplot/pom.xml +++ b/mindplot/pom.xml @@ -110,7 +110,8 @@ - + + @@ -130,7 +131,7 @@ + files="commands/ChangeLinkToTopicCommand.js"/> + + diff --git a/mindplot/src/main/javascript/ActionDispatcher.js b/mindplot/src/main/javascript/ActionDispatcher.js index 08ca676e..4e613117 100644 --- a/mindplot/src/main/javascript/ActionDispatcher.js +++ b/mindplot/src/main/javascript/ActionDispatcher.js @@ -27,7 +27,7 @@ mindplot.ActionDispatcher = new Class({ throw "method must be implemented."; }, - addLinkToTopic: function(topicId, url) { + changeLinkToTopic: function(topicId, url) { throw "method must be implemented."; }, diff --git a/mindplot/src/main/javascript/IconGroup.js b/mindplot/src/main/javascript/IconGroup.js index 3b57b06a..3cae7278 100644 --- a/mindplot/src/main/javascript/IconGroup.js +++ b/mindplot/src/main/javascript/IconGroup.js @@ -99,6 +99,7 @@ mindplot.IconGroup = new Class({ removeIconByUrl : function(url) { var icon = this._findIconFromUrl(url); + $assert(icon,'icon could not be found'); this._removeIcon(icon); }, diff --git a/mindplot/src/main/javascript/LinkIcon.js b/mindplot/src/main/javascript/LinkIcon.js index bce71f96..7a2227cc 100644 --- a/mindplot/src/main/javascript/LinkIcon.js +++ b/mindplot/src/main/javascript/LinkIcon.js @@ -18,179 +18,40 @@ mindplot.LinkIcon = new Class({ - Extends:mindplot.Icon, - initialize:function(urlModel, topic, designer) { - $assert(urlModel, "urlModel can not be null"); - $assert(designer, "designer can not be null"); - $assert(topic, "topic can not be null"); + Extends: mindplot.Icon, + initialize : function(topic, linkModel) { + $assert(topic, 'topic can not be null'); + $assert(linkModel, 'linkModel can not be null'); + this.parent(mindplot.LinkIcon.IMAGE_URL); - - var divContainer = designer.getWorkSpace().getScreenManager().getContainer(); - var bubbleTip = mindplot.BubbleTip.getInstance(divContainer); - - this._linkModel = urlModel; + this._noteModel = linkModel; this._topic = topic; - this._designer = designer; - var image = this.getImage(); - var imgContainer = new Element('div').setStyles({textAlign:'center', cursor:'pointer'}); - this._img = new Element('img'); - var url = urlModel.getUrl(); - this._img.src = 'http://open.thumbshots.org/image.pxf?url=' + url; - if (url.indexOf('http:') == -1) { - url = 'http://' + url; - } - this._img.alt = url; - this._url = url; - var openWindow = 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'; - var url = this._img.alt; - wOpen = window.open(url, "link", "width=100px, height=100px"); - wOpen.focus(); - wOpen.moveTo(0, 0); - wOpen.resizeTo(screen.availWidth, screen.availHeight); - }; - - this._img.addEvent('click', openWindow.bindWithEvent(this)); - this._img.inject(imgContainer); - - var attribution = new Element('div').setStyles({fontSize:10, textAlign:"center"}); - attribution.innerHTML = "About Thumbshots thumbnails"; - - var container = new Element('div'); - var element = new Element('div').setStyles({borderBottom:'1px solid #e5e5e5'}); - - var title = new Element('div').setStyles({fontSize:12, textAlign:'center'}); - this._link = new Element('span'); - this._link.href = url; - this._link.innerHTML = url; - this._link.setStyle("text-decoration", "underline"); - this._link.setStyle("cursor", "pointer"); - this._link.inject(title); - this._link.addEvent('click', openWindow.bindWithEvent(this)); - title.inject(element); - - imgContainer.inject(element); - attribution.inject(element); - element.inject(container); - - if (!$defined(designer._readOnly) || ($defined(designer._readOnly) && !designer._readOnly)) { - var buttonContainer = new Element('div').setStyles({paddingTop:5, textAlign:'center'}); - var editBtn = new Element('input', {type:'button', 'class':'btn-primary', value:'Edit'}).addClass('button').inject(buttonContainer); - var removeBtn = new Element('input', {type:'button', value:'Remove','class':'btn-primary'}).addClass('button').inject(buttonContainer); - - editBtn.setStyle("margin-right", "3px"); - removeBtn.setStyle("margin-left", "3px"); - - removeBtn.addEvent('click', function(event) { - - var actionDispatcher = mindplot.ActionDispatcher.getInstance(); - actionDispatcher.removeLinkFromTopic(this._topic.getId()); - bubbleTip.forceClose(); - }.bindWithEvent(this)); - - var okButtonId = 'okLinkButtonId'; - editBtn.addEvent('click', function(event) { - var topic = this._topic; - var designer = this._designer; - var link = this; - var okFunction = function(e) { - var result = false; - var url = urlInput.value; - if ("" != url.trim()) { - link._img.src = 'http://open.thumbshots.org/image.pxf?url=' + url; - link._img.alt = url; - link._link.href = url; - link._link.innerHTML = url; - this._linkModel.setUrl(url); - result = true; - } - return result; - }; - var msg = new Element('div'); - var urlText = new Element('div').inject(msg); - urlText.innerHTML = "URL:"; - - var formElem = new Element('form', {'action': 'none', 'id':'linkFormId'}); - var urlInput = new Element('input', {'type': 'text', 'size':30,'value':url}); - urlInput.inject(formElem); - formElem.inject(msg); - - formElem.addEvent('submit', function(e) { - $(okButtonId).fireEvent('click', e); - e = new Event(e); - e.stop(); - }); - - - var dialog = mindplot.LinkIcon.buildDialog(designer, okFunction, okButtonId); - dialog.adopt(msg).show(); - - }.bindWithEvent(this)); - buttonContainer.inject(container); - } - - var linkIcon = this; - image.addEvent('mouseover', function(event) { - bubbleTip.open(event, container, linkIcon); - }); - image.addEvent('mousemove', function(event) { - bubbleTip.updatePosition(event); - }); - image.addEvent('mouseout', function(event) { - bubbleTip.close(event); - }); + this._registerEvents(); }, - getUrl : function() { - return this._url; + _registerEvents : function() { + this._image.setCursor('pointer'); + + // Add on click event to open the editor ... + this.addEvent('click', function(event) { + this._topic.showLinkEditor(); + event.stopPropagation(); + }.bind(this)); + + this._tip = new mindplot.widget.LinkIconTooltip(this); }, getModel : function() { - return this._linkModel; + return this._noteModel; + }, + + remove : function() { + var actionDispatcher = mindplot.ActionDispatcher.getInstance(); + actionDispatcher.removeLinkFromTopic(this._topic.getId()); } }); - -mindplot.LinkIcon.buildDialog = function(designer, okFunction, okButtonId) { - var windoo = new Windoo({ - title: 'Write link URL', - theme: Windoo.Themes.wise, - modal:true, - buttons:{'menu':false, 'close':false, 'minimize':false, 'roll':false, 'maximize':false}, - destroyOnClose:true, - height:130 - }); - - var cancel = new Element('input', {'type': 'button', 'class':'btn-primary', 'value': 'Cancel'}).setStyle('margin-right', "5px"); - cancel.setStyle('margin-left', "5px"); - cancel.addEvent('click', function(event) { - $(document).addEvent('keydown', designer.keyEventHandler.bindWithEvent(designer)); - windoo.close(); - }.bindWithEvent(this)); - - var ok = new Element('input', {'type': 'button', 'class':'btn-primary','value': 'Ok','id':okButtonId}).setStyle('marginRight', 10); - ok.addEvent('click', function(event) { - var couldBeUpdated = okFunction.attempt(); - if (couldBeUpdated) { - $(document).addEvent('keydown', designer.keyEventHandler.bindWithEvent(designer)); - windoo.close(); - } - }.bindWithEvent(this)); - - var panel = new Element('div', {'styles': {'padding-top': 10, 'text-align': 'right'}}).adopt(ok, cancel); - - windoo.addPanel(panel); - $(document).removeEvents('keydown'); - return windoo; -}; - mindplot.LinkIcon.IMAGE_URL = "../images/world_link.png"; \ No newline at end of file diff --git a/mindplot/src/main/javascript/Note.js b/mindplot/src/main/javascript/NoteIcon.js similarity index 92% rename from mindplot/src/main/javascript/Note.js rename to mindplot/src/main/javascript/NoteIcon.js index b3d0ba68..4e27fc7e 100644 --- a/mindplot/src/main/javascript/Note.js +++ b/mindplot/src/main/javascript/NoteIcon.js @@ -16,12 +16,12 @@ * limitations under the License. */ -mindplot.Note = new Class({ +mindplot.NoteIcon = new Class({ Extends: mindplot.Icon, initialize : function(topic, noteModel) { $assert(topic, 'topic can not be null'); - this.parent(mindplot.Note.IMAGE_URL); + this.parent(mindplot.NoteIcon.IMAGE_URL); this._noteModel = noteModel; this._topic = topic; @@ -37,7 +37,7 @@ mindplot.Note = new Class({ event.stopPropagation(); }.bind(this)); - this.tip = new mindplot.widget.FloatingTip(this.getImage()._peer._native, { + this._tip = new mindplot.widget.FloatingTip(this.getImage()._peer._native, { // Content can also be a function of the target element! content: function() { var result = new Element('div'); @@ -82,5 +82,5 @@ mindplot.Note = new Class({ } }); -mindplot.Note.IMAGE_URL = "../images/note.png"; +mindplot.NoteIcon.IMAGE_URL = "../images/note.png"; diff --git a/mindplot/src/main/javascript/StandaloneActionDispatcher.js b/mindplot/src/main/javascript/StandaloneActionDispatcher.js index 04855b44..a2078708 100644 --- a/mindplot/src/main/javascript/StandaloneActionDispatcher.js +++ b/mindplot/src/main/javascript/StandaloneActionDispatcher.js @@ -33,8 +33,8 @@ mindplot.StandaloneActionDispatcher = new Class({ this.execute(command); }, - addLinkToTopic: function(topicId, url) { - var command = new mindplot.commands.AddLinkToTopicCommand(topicId, url); + changeLinkToTopic: function(topicId, url) { + var command = new mindplot.commands.ChangeLinkToTopicCommand(topicId, url); this.execute(command); }, diff --git a/mindplot/src/main/javascript/Topic.js b/mindplot/src/main/javascript/Topic.js index 1fa5b103..205b6f7f 100644 --- a/mindplot/src/main/javascript/Topic.js +++ b/mindplot/src/main/javascript/Topic.js @@ -280,7 +280,6 @@ mindplot.Topic = new Class({ //Links var links = model.getLinks(); for (var i = 0; i < links.length; i++) { - this._hasLink = true; this._link = new mindplot.LinkIcon(links[i], this, designer); result.addIcon(this._link); } @@ -288,22 +287,21 @@ mindplot.Topic = new Class({ //Notes var notes = model.getNotes(); for (var j = 0; j < notes.length; j++) { - this._hasNote = true; - this._note = new mindplot.Note(this, notes[j]); + this._note = new mindplot.NoteIcon(this, notes[j]); result.addIcon(this._note); } return result; }, - addLink : function(url, designer) { + addLink : function(url) { var iconGroup = this.getOrBuildIconGroup(); var model = this.getModel(); var linkModel = model.createLink(url); model.addLink(linkModel); - this._link = new mindplot.LinkIcon(linkModel, this, designer); + + this._link = new mindplot.LinkIcon(this, linkModel); iconGroup.addIcon(this._link); - this._hasLink = true; this._adjustShapes(); }, @@ -314,9 +312,8 @@ mindplot.Topic = new Class({ var noteModel = model.createNote(text); model.addNote(noteModel); - this._note = new mindplot.Note(this, noteModel); + this._note = new mindplot.NoteIcon(this, noteModel); iconGroup.addIcon(this._note); - this._hasNote = true; this._adjustShapes(); }, @@ -349,19 +346,18 @@ mindplot.Topic = new Class({ }, removeLink : function() { + // Update model ... var model = this.getModel(); var links = model.getLinks(); model._removeLink(links[0]); + + // Remove UI ... var iconGroup = this.getIconGroup(); if ($defined(iconGroup)) { - iconGroup.removeIcon(mindplot.LinkIcon.IMAGE_URL); - if (iconGroup.getIcons().length == 0) { - this.get2DElement().removeChild(iconGroup.getNativeElement()); - this._iconsGroup = null; - } + iconGroup.removeIconByUrl(mindplot.LinkIcon.IMAGE_URL); } + this._link = null; - this._hasLink = false; this._adjustShapes(); }, @@ -374,16 +370,19 @@ mindplot.Topic = new Class({ // Remove UI ... var iconGroup = this.getIconGroup(); if ($defined(iconGroup)) { - iconGroup.removeIconByUrl(mindplot.Note.IMAGE_URL); + iconGroup.removeIconByUrl(mindplot.NoteIcon.IMAGE_URL); } this._note = null; - this._hasNote = false; this._adjustShapes(); }, hasNote : function() { - return this._hasNote; + return this.getModel().getNotes().length != 0; + }, + + hasLink : function() { + return this.getModel().getLinks().length != 0; }, addRelationship : function(relationship) { @@ -747,9 +746,8 @@ mindplot.Topic = new Class({ } } }; - - this.closeEditors(); var editor = new mindplot.widget.NoteEditor(editorModel); + this.closeEditors(); editor.show(); }, @@ -759,22 +757,22 @@ mindplot.Topic = new Class({ var model = this.getModel(); var editorModel = { getValue : function() { -// var notes = model.getNotes(); -// var result; -// if (notes.length > 0) -// result = notes[0].getText(); -// -// return result; + var links = model.getLinks(); + var result; + if (links.length > 0) + result = links[0].getUrl(); + + return result; }, setValue : function(value) { -// var dispatcher = mindplot.ActionDispatcher.getInstance(); -// if (!$defined(value)) { -// dispatcher.removeNoteFromTopic(topicId); -// } -// else { -// dispatcher.changeNoteToTopic(topicId, value); -// } + var dispatcher = mindplot.ActionDispatcher.getInstance(); + if (!$defined(value)) { + dispatcher.removeLinkFromTopic(topicId); + } + else { + dispatcher.changeLinkToTopic(topicId, value); + } } }; diff --git a/mindplot/src/main/javascript/commands/AddLinkToTopicCommand.js b/mindplot/src/main/javascript/commands/ChangeLinkToTopicCommand.js similarity index 73% rename from mindplot/src/main/javascript/commands/AddLinkToTopicCommand.js rename to mindplot/src/main/javascript/commands/ChangeLinkToTopicCommand.js index db63891a..1d1314f4 100644 --- a/mindplot/src/main/javascript/commands/AddLinkToTopicCommand.js +++ b/mindplot/src/main/javascript/commands/ChangeLinkToTopicCommand.js @@ -16,7 +16,7 @@ * limitations under the License. */ -mindplot.commands.AddLinkToTopicCommand = new Class({ +mindplot.commands.ChangeLinkToTopicCommand = new Class({ Extends:mindplot.Command, initialize: function(topicId, url) { $assert(topicId, 'topicId can not be null'); @@ -24,12 +24,25 @@ mindplot.commands.AddLinkToTopicCommand = new Class({ this._url = url; this._id = mindplot.Command._nextUUID(); }, + execute: function(commandContext) { var topic = commandContext.findTopics(this._objectsIds)[0]; - topic.addLink(this._url, commandContext._designer); + if (topic.hasLink()) { + var model = topic.getModel(); + var link = model.getLinks()[0]; + this._oldUrl = link.getUrl(); + topic.removeLink(); + } + topic.addLink(this._url); }, + undoExecute: function(commandContext) { var topic = commandContext.findTopics(this._objectsIds)[0]; - topic.removeLink(); + if (this._oldtext) { + topic.removeLink(); + topic.addLink(this._oldUrl); + } else { + topic.removeLink(); + } } }); \ No newline at end of file diff --git a/mindplot/src/main/javascript/commands/ChangeNoteToTopicCommand.js b/mindplot/src/main/javascript/commands/ChangeNoteToTopicCommand.js index 0bf42c52..d556a529 100644 --- a/mindplot/src/main/javascript/commands/ChangeNoteToTopicCommand.js +++ b/mindplot/src/main/javascript/commands/ChangeNoteToTopicCommand.js @@ -25,7 +25,8 @@ mindplot.commands.ChangeNoteToTopicCommand = new Class({ this._oldtext = null; this._id = mindplot.Command._nextUUID(); }, - execute: function(commandContext) { + + execute: function(commandContext) { var topic = commandContext.findTopics(this._objectsIds)[0]; if (topic.hasNote()) { var model = topic.getModel(); @@ -35,6 +36,7 @@ mindplot.commands.ChangeNoteToTopicCommand = new Class({ } topic.addNote(this._text); }, + undoExecute: function(commandContext) { var topic = commandContext.findTopics(this._objectsIds)[0]; if (this._oldtext) { diff --git a/mindplot/src/main/javascript/commands/RemoveLinkFromTopicCommand.js b/mindplot/src/main/javascript/commands/RemoveLinkFromTopicCommand.js index 0639349c..bb759485 100644 --- a/mindplot/src/main/javascript/commands/RemoveLinkFromTopicCommand.js +++ b/mindplot/src/main/javascript/commands/RemoveLinkFromTopicCommand.js @@ -22,11 +22,15 @@ mindplot.commands.RemoveLinkFromTopicCommand = new Class({ $assert(topicId, 'topicId can not be null'); this._objectsIds = topicId; }, + execute: function(commandContext) { var topic = commandContext.findTopics(this._objectsIds)[0]; - this._url = topic._link.getUrl(); + var model = topic.getModel(); + var links = model.getLinks()[0]; + this._text = links.getUrl(); topic.removeLink(); }, + undoExecute: function(commandContext) { var topic = commandContext.findTopics(this._objectsIds)[0]; topic.addLink(this._url, commandContext._designer); diff --git a/mindplot/src/main/javascript/libraries/moodialog/MooDialog.js b/mindplot/src/main/javascript/libraries/moodialog/MooDialog.js index affc08d7..4c3e236d 100644 --- a/mindplot/src/main/javascript/libraries/moodialog/MooDialog.js +++ b/mindplot/src/main/javascript/libraries/moodialog/MooDialog.js @@ -33,11 +33,7 @@ var MooDialog = new Class({ onBeforeClose: function(){ this.wrapper.setStyle('display', 'none'); this.fireEvent('hide'); - }/*, - onOpen: function(){}, - onClose: function(){}, - onShow: function(){}, - onHide: function(){}*/ + } }, initialize: function(options){ diff --git a/mindplot/src/main/javascript/model/LinkModel.js b/mindplot/src/main/javascript/model/LinkModel.js index fd7fc016..dabc18d7 100644 --- a/mindplot/src/main/javascript/model/LinkModel.js +++ b/mindplot/src/main/javascript/model/LinkModel.js @@ -20,9 +20,8 @@ mindplot.model.LinkModel = new Class({ initialize : function(url, topic) { $assert(url, 'url can not be null'); $assert(topic, 'mindmap can not be null'); - - this._url = url; this._topic = topic; + this.setUrl(url); }, getUrl : function() { @@ -31,7 +30,8 @@ mindplot.model.LinkModel = new Class({ setUrl : function(url) { $assert(url, 'url can not be null'); - this._url = url; + this._url = this._fixUrl(url); + this._type = this._url.contains('mailto:') ? 'mail' : 'url'; }, getTopic : function() { @@ -41,4 +41,12 @@ mindplot.model.LinkModel = new Class({ isLinkModel : function() { return true; } + , + _fixUrl : function(url) { + var result = url; + if (!result.contains('http://') && !result.contains('https://') && !result.contains('mailto://')) { + result = "http://" + result; + } + return result; + } }); \ No newline at end of file diff --git a/mindplot/src/main/javascript/widget/FloatingTip.js b/mindplot/src/main/javascript/widget/FloatingTip.js index 75c913a1..2d27edb1 100644 --- a/mindplot/src/main/javascript/widget/FloatingTip.js +++ b/mindplot/src/main/javascript/widget/FloatingTip.js @@ -34,7 +34,7 @@ mindplot.widget.FloatingTip = new Class({ showOn: 'mouseenter', hideOn: 'mouseleave', showDelay: 500, - hideDelay: 0, + hideDelay: 250, className: 'floating-tip', offset: {x: 0, y: 0}, fx: { 'duration': 'short' } @@ -71,9 +71,13 @@ mindplot.widget.FloatingTip = new Class({ return this; } var tip = this._create(element); - if (tip == null) return this; + if (tip == null) + return this; element.store('floatingtip', tip); this._animate(tip, 'in'); + tip.addEvent(this.options.showOn, this.boundShow); + tip.addEvent(this.options.hideOn, this.boundHide); + this.fireEvent('show', [tip, element]); return this; }, diff --git a/mindplot/src/main/javascript/widget/LinkEditor.js b/mindplot/src/main/javascript/widget/LinkEditor.js index ed87f982..157cb999 100644 --- a/mindplot/src/main/javascript/widget/LinkEditor.js +++ b/mindplot/src/main/javascript/widget/LinkEditor.js @@ -64,25 +64,36 @@ mindplot.widget.LinkEditor = new Class({ var result = new Element('div'); var form = new Element('form', {'action': 'none', 'id':'linkFormId'}); - // Add textarea ... - var textArea = new Element('textarea', {placeholder: 'Write your note here ...'}); - if (model.getValue() != null) - textArea.value = model.getValue(); + // Add combo ... + var select = new Element('select'); + select.setStyles({margin: '5px'}); + new Element('option', {text:'URL'}).inject(select); + new Element('option', {text:'Mail'}).inject(select); + select.inject(form); - textArea.setStyles({'width':'100%', 'height':80,resize: 'none' - }); - textArea.inject(form); + // Add Input ... + var input = new Element('input', {placeholder: 'http://www.example.com/',type:'url',required:true}); + if (model.getValue() != null) + input.value = model.getValue(); + + input.setStyles({'width':'70%'}); + input.inject(form); + + // Register submit event ... + form.addEvent('submit', function(event) { + event.stopPropagation(); + event.preventDefault(); + + model.setValue(input.value); + this.close(); + }.bind(this)); // Add buttons ... var buttonContainer = new Element('div').setStyles({paddingTop:5, textAlign:'center'}); // Create accept button ... - var okButton = new Element('input', {type:'button', value:'Accept','class':'btn-primary'}); + var okButton = new Element('input', {type:'submit', value:'Accept','class':'btn-primary'}); okButton.addClass('button'); - okButton.addEvent('click', function() { - model.setValue(textArea.value); - this.close(); - }.bind(this)); okButton.inject(buttonContainer); // Create remove button ... @@ -91,16 +102,16 @@ mindplot.widget.LinkEditor = new Class({ rmButton.setStyle('margin', '5px'); rmButton.addClass('button'); rmButton.inject(buttonContainer); - rmButton.addEvent('click', function() { + rmButton.addEvent('click', function(event) { model.setValue(null); + event.stopPropagation(); this.close(); }.bind(this)); buttonContainer.inject(form); } - // Create cancel button ... - var cButton = new Element('input', {type:'button', value:'Cancel','class':'btn-primary'}); + var cButton = new Element('input', {type:'button', value:'Cancel','class':'btn-secondary'}); cButton.setStyle('margin', '5px'); cButton.addClass('button'); cButton.inject(buttonContainer); diff --git a/mindplot/src/main/javascript/widget/LinkIconTooltip.js b/mindplot/src/main/javascript/widget/LinkIconTooltip.js new file mode 100644 index 00000000..5c6d338c --- /dev/null +++ b/mindplot/src/main/javascript/widget/LinkIconTooltip.js @@ -0,0 +1,91 @@ +/* + * 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.widget.LinkIconTooltip = new Class({ + Extends: mindplot.widget.FloatingTip, + + initialize : function(linkIcon) { + $assert(linkIcon, "linkIcon can not be null"); + this.parent(linkIcon.getImage()._peer._native, { + // Content can also be a function of the target element! + content: this._buildContent.pass(linkIcon, this), + html: true, + position: 'bottom', + arrowOffset : 10, + center: true, + arrowSize: 15, + offset : {x:10,y:20} + }); + }, + + _buildContent : function(linkIcon) { + var result = new Element('div'); + result.setStyles({ + padding:'5px', + width:'100%' + }); + + var title = new Element('div', {text:'Link'}); + title.setStyles({ + 'font-weight':'bold', + color:'black', + 'padding-bottom':'5px', + width: '100px' + }); + title.inject(result); + + var text = new Element('div', {text: "URL: " + linkIcon.getModel().getUrl()}); + text.setStyles({ + 'white-space': 'pre-wrap', + 'word-wrap': 'break-word' + } + ); + text.inject(result); + + var imgContainer = new Element('div'); + imgContainer.setStyles({ + width: '100%', + textAlign: 'center', + 'padding-bottom':'5px', + 'padding-top': '5px' + }); + + var img = new Element('img', { + src: 'http://open.thumbshots.org/image.pxf?url=' + linkIcon.getModel().getUrl(), + img : linkIcon.getModel().getUrl(), + alt : linkIcon.getModel().getUrl() + } + ); + img.setStyles({ + padding: '5px' + } + ); + + var link = new Element('a', { + href : linkIcon.getModel().getUrl(), + alt : 'Open in new window ...', + target : '_blank' + + }); + img.inject(link); + link.inject(imgContainer); + imgContainer.inject(result); + + return result; + } +}); \ No newline at end of file diff --git a/mindplot/src/main/javascript/widget/NoteEditor.js b/mindplot/src/main/javascript/widget/NoteEditor.js index 7c6c87b1..debaed5f 100644 --- a/mindplot/src/main/javascript/widget/NoteEditor.js +++ b/mindplot/src/main/javascript/widget/NoteEditor.js @@ -65,24 +65,33 @@ mindplot.widget.NoteEditor = new Class({ var form = new Element('form', {'action': 'none', 'id':'noteFormId'}); // Add textarea ... - var textArea = new Element('textarea', {placeholder: 'Write your note here ...'}); + var textArea = new Element('textarea', {placeholder: 'Write your note here ...',required:true}); if (model.getValue() != null) textArea.value = model.getValue(); - textArea.setStyles({'width':'100%', 'height':80,resize: 'none' + textArea.setStyles({ + 'width':'100%', + 'height':80 + ,resize: 'none' }); textArea.inject(form); + // Register submit event ... + form.addEvent('submit', function(event) { + event.preventDefault(); + event.stopPropagation(); + + model.setValue(textArea.value); + this.close(); + + }.bind(this)); + // Add buttons ... var buttonContainer = new Element('div').setStyles({paddingTop:5, textAlign:'center'}); // Create accept button ... - var okButton = new Element('input', {type:'button', value:'Accept','class':'btn-primary'}); + var okButton = new Element('input', {type:'submit', value:'Accept','class':'btn-primary'}); okButton.addClass('button'); - okButton.addEvent('click', function() { - model.setValue(textArea.value); - this.close(); - }.bind(this)); okButton.inject(buttonContainer); // Create remove button ... @@ -100,7 +109,7 @@ mindplot.widget.NoteEditor = new Class({ // Create cancel button ... - var cButton = new Element('input', {type:'button', value:'Cancel','class':'btn-primary'}); + var cButton = new Element('input', {type:'button', value:'Cancel','class':'btn-secondary'}); cButton.setStyle('margin', '5px'); cButton.addClass('button'); cButton.inject(buttonContainer); diff --git a/web2d/src/main/javascript/Group.js b/web2d/src/main/javascript/Group.js index 95d320cc..cb7e210d 100644 --- a/web2d/src/main/javascript/Group.js +++ b/web2d/src/main/javascript/Group.js @@ -39,7 +39,7 @@ web2d.Group = new Class({ } if (element == this) { - throw "It's not posible to add the group as a child of itself"; + throw "It's not possible to add the group as a child of itself"; } var elementType = element.getType(); diff --git a/wise-doc/src/main/webapp/css/common.css b/wise-doc/src/main/webapp/css/common.css index 14b98fad..3e6f24d9 100644 --- a/wise-doc/src/main/webapp/css/common.css +++ b/wise-doc/src/main/webapp/css/common.css @@ -130,7 +130,7 @@ h1 { } h3 { -/* use as subhead on main body */ + /* use as subhead on main body */ clear: left; font-style: normal; font-size: 130%; @@ -138,7 +138,7 @@ h3 { } h4 { -/* use as headers in footer */ + /* use as headers in footer */ font-weight: bold; font-size: 120%; border-bottom: 1px solid #8e9181; @@ -249,7 +249,7 @@ span#headerSubTitle { } div#headerButtons a:hover { -/*text-decoration: underline;*/ + /*text-decoration: underline;*/ color: #7e72ad; } @@ -346,57 +346,84 @@ div#printLogo { } .btn-primary { - 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); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0); - 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); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#049cdb', endColorstr='#0064cd', GradientType=0); - 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); + 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); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#049cdb', endColorstr = '#0064cd', GradientType = 0); + 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); } .btn-primary:hover { - background-position: 0 -15px; - /*color: #333;*/ - text-decoration: none; + 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); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#e6e6e6', GradientType = 0); + 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); +} + +.btn-secondary:hover { + background-position: 0 -15px; + text-decoration: none; +} div#paypal { float: left; @@ -610,30 +637,28 @@ span.fieldRequired { padding: 5px; } - div.installCFG { - width:100%; - font-size:130%; + width: 100%; + font-size: 130%; } -div.installCFG h1{ - width:100%; - font-size:130%; +div.installCFG h1 { + width: 100%; + font-size: 130%; } -div.installCFG h2{ - font-size:100%; - border-bottom:0 solid black; +div.installCFG h2 { + font-size: 100%; + border-bottom: 0 solid black; } .chromeFrameInstallDefaultStyle { - position:relative; - left:0; - top:0; - margin:0; + position: relative; + left: 0; + top: 0; + margin: 0; } - .floating-tip { background-color: #dfcf3c; padding: 5px 15px; @@ -645,4 +670,5 @@ div.installCFG h2{ -webkit-border-radius: 3px; border-radius: 3px; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); -} \ No newline at end of file +} + diff --git a/wise-doc/src/main/webapp/images/world_link.png b/wise-doc/src/main/webapp/images/world_link.png new file mode 100644 index 0000000000000000000000000000000000000000..b8edc1265db4bf69814875d1c10b8761f7009e23 GIT binary patch literal 957 zcmV;u148_XP)(^b;|pVbz=yzjpaJj$ zhrpuriKefui_0DvN;1Ymq&%nwWg*IrK!Xz^eJWuq3u2H~0ra?EC@ge%+`A>6mV z9{TYo{=G6 zt@5m|4G+Q2zKv;Ch@O;`PfWArmB5n3gvMsxV&Iu>97{a!2kL74wd@!f_AP^O%_&ND zm}1c*+F;TcH^{p$P_|akvD5o7vmT>HCkP;z;;&+8tDBI;koi9eX`W!oH4`pYaHlFZwV;$>vvfQTw zM-`m&R_SPIBa^FUasC0GCCh%{h`$~db`z&-lFX#%(f>H6JD6Z(sIW`RKE+xOL+?+uQ%q z){?+F%=6pqEH{6=NzusC-*<`PZYiLCGyKD}Z8^V8ul-K=AV@SE1t4~D2*b1(9UUc= zN-;Dv#Ngl{rd7e$ZUPXC##BFmV>$26ZQi?6Po#@{4gllsPbku3Vq${Y+FAf~T}OJb zGWEz9{(zcvI&CUaN&p7GcqMG4&7ULx##68M4k(F4l7Q+Xm&>uSv4N&(w6?a=)YOC{ zoYLN-J?7@-9xGBx007$C+kK7w_2Z$(k&l}jo2#`dO;J#Ipsbc$pS#^Dy3Q&nSeE5x fGMT)t>sS8=`naU3reLNz00000NkvXXu0mjf)bGN+ literal 0 HcmV?d00001