Fix add links.
parent
52587c0eaa
commit
5d1ab3cb6e
|
@ -110,7 +110,8 @@
|
|||
<filelist dir="${basedir}/src/main/javascript/" files="BubbleTip.js"/>
|
||||
<filelist dir="${basedir}/src/main/javascript/" files="Icon.js"/>
|
||||
<filelist dir="${basedir}/src/main/javascript/" files="LinkIcon.js"/>
|
||||
<filelist dir="${basedir}/src/main/javascript/" files="Note.js"/>
|
||||
<filelist dir="${basedir}/src/main/javascript/" files="NoteIcon.js"/>
|
||||
|
||||
<filelist dir="${basedir}/src/main/javascript/" files="ActionIcon.js"/>
|
||||
<filelist dir="${basedir}/src/main/javascript/" files="ImageIcon.js"/>
|
||||
<filelist dir="${basedir}/src/main/javascript/" files="model/IconModel.js"/>
|
||||
|
@ -130,7 +131,7 @@
|
|||
<filelist dir="${basedir}/src/main/javascript/commands/"
|
||||
files="AddTopicCommand.js"/>
|
||||
<filelist dir="${basedir}/src/main/javascript/"
|
||||
files="commands/AddLinkToTopicCommand.js"/>
|
||||
files="commands/ChangeLinkToTopicCommand.js"/>
|
||||
<filelist dir="${basedir}/src/main/javascript/"
|
||||
files="commands/RemoveLinkFromTopicCommand.js"/>
|
||||
<filelist dir="${basedir}/src/main/javascript/"
|
||||
|
@ -189,6 +190,8 @@
|
|||
<filelist dir="${basedir}/src/main/javascript/widget/" files="NoteEditor.js"/>
|
||||
<filelist dir="${basedir}/src/main/javascript/widget/" files="LinkEditor.js"/>
|
||||
<filelist dir="${basedir}/src/main/javascript/widget/" files="FloatingTip.js"/>
|
||||
<filelist dir="${basedir}/src/main/javascript/widget/" files="LinkIconTooltip.js"/>
|
||||
|
||||
|
||||
<filelist dir="${basedir}/src/main/javascript/"
|
||||
files="widget/ColorPickerPanel.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.";
|
||||
},
|
||||
|
||||
|
|
|
@ -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);
|
||||
},
|
||||
|
||||
|
|
|
@ -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 = "<a href='http://www.thumbshots.org' target='_blank' title='About Thumbshots thumbnails' style='color:#08468F'>About Thumbshots thumbnails</a>";
|
||||
|
||||
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";
|
||||
|
||||
|
|
@ -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";
|
||||
|
|
@ -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);
|
||||
},
|
||||
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
@ -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();
|
||||
}
|
||||
}
|
||||
});
|
|
@ -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) {
|
||||
|
|
|
@ -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);
|
||||
|
|
|
@ -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){
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
});
|
|
@ -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;
|
||||
},
|
||||
|
|
|
@ -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);
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
});
|
|
@ -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);
|
||||
|
|
|
@ -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();
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Binary file not shown.
After Width: | Height: | Size: 957 B |
Loading…
Reference in New Issue