mirror of
https://bitbucket.org/wisemapping/wisemapping-open-source.git
synced 2024-11-22 22:27:55 +01:00
LinkIconTooltip reimplemented
This commit is contained in:
parent
0ffcbe39b7
commit
a59c5e7372
@ -23,70 +23,51 @@ mindplot.widget.LinkIconTooltip = new Class({
|
|||||||
$assert(linkIcon, "linkIcon can not be null");
|
$assert(linkIcon, "linkIcon can not be null");
|
||||||
this.parent($(linkIcon.getImage()._peer._native), {
|
this.parent($(linkIcon.getImage()._peer._native), {
|
||||||
// Content can also be a function of the target element!
|
// Content can also be a function of the target element!
|
||||||
content:this._buildContent.pass(linkIcon, this),
|
content:this._buildContent(linkIcon),
|
||||||
html:true,
|
html:true,
|
||||||
position:'bottom',
|
placement:'bottom',
|
||||||
arrowOffset:10,
|
container: 'body',
|
||||||
center:true,
|
title: $msg('LINK')
|
||||||
arrowSize:15,
|
|
||||||
offset:{x:10, y:20},
|
|
||||||
className:'linkTip'
|
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
_buildContent:function (linkIcon) {
|
_buildContent:function (linkIcon) {
|
||||||
var result = new Element('div');
|
var result = $('<div></div>').css({
|
||||||
result.setStyles({
|
|
||||||
padding:'5px',
|
padding:'5px',
|
||||||
width:'100%'
|
width:'100%'
|
||||||
});
|
});
|
||||||
|
|
||||||
var title = new Element('div', {text:$msg('LINK')});
|
var text = $('<div></div>').text("URL: " + linkIcon.getModel().getUrl())
|
||||||
title.setStyles({
|
.css({
|
||||||
'font-weight':'bold',
|
'white-space':'pre-wrap',
|
||||||
color:'black',
|
'word-wrap':'break-word'
|
||||||
'padding-bottom':'5px',
|
|
||||||
width:'100px'
|
|
||||||
});
|
});
|
||||||
title.inject(result);
|
result.append(text);
|
||||||
|
|
||||||
var text = new Element('div', {text:"URL: " + linkIcon.getModel().getUrl()});
|
var imgContainer = $('<div></div>')
|
||||||
text.setStyles({
|
.css({
|
||||||
'white-space':'pre-wrap',
|
|
||||||
'word-wrap':'break-word'
|
|
||||||
}
|
|
||||||
);
|
|
||||||
text.inject(result);
|
|
||||||
|
|
||||||
var imgContainer = new Element('div');
|
|
||||||
imgContainer.setStyles({
|
|
||||||
width:'100%',
|
width:'100%',
|
||||||
textAlign:'right',
|
'textAlign':'right',
|
||||||
'padding-bottom':'5px',
|
'padding-bottom':'5px',
|
||||||
'padding-top':'5px'
|
'padding-top':'5px'
|
||||||
});
|
});
|
||||||
|
|
||||||
var img = new Element('img', {
|
var img = $('<img>')
|
||||||
src:'http://immediatenet.com/t/m?Size=1024x768&URL=' + linkIcon.getModel().getUrl(),
|
.prop('src', 'http://immediatenet.com/t/m?Size=1024x768&URL=' + linkIcon.getModel().getUrl())
|
||||||
img:linkIcon.getModel().getUrl(),
|
.prop('img', linkIcon.getModel().getUrl())
|
||||||
alt:linkIcon.getModel().getUrl()
|
.prop('alt', linkIcon.getModel().getUrl());
|
||||||
}
|
|
||||||
);
|
|
||||||
img.setStyles({
|
|
||||||
padding:'5px'
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
var link = new Element('a', {
|
img.css('padding', '5px');
|
||||||
|
|
||||||
|
var link = $('<a></a>').attr({
|
||||||
href:linkIcon.getModel().getUrl(),
|
href:linkIcon.getModel().getUrl(),
|
||||||
alt:'Open in new window ...',
|
alt:'Open in new window ...',
|
||||||
target:'_blank'
|
target:'_blank'
|
||||||
|
|
||||||
});
|
});
|
||||||
img.inject(link);
|
|
||||||
link.inject(imgContainer);
|
|
||||||
imgContainer.inject(result);
|
|
||||||
|
|
||||||
|
link.append(img);
|
||||||
|
imgContainer.append(link);
|
||||||
|
result.append(imgContainer);
|
||||||
return result;
|
return result;
|
||||||
}
|
}
|
||||||
});
|
});
|
Loading…
Reference in New Issue
Block a user