SynchronizeTip: added 'left' placement, added option for changing link text and visibility.
Bug with creating several synchronize tips.
This commit is contained in:
parent
d1bdace072
commit
5623c7dd3e
|
@ -43,7 +43,8 @@ define([
|
|||
options : {
|
||||
target : $(document.body),
|
||||
text : '',
|
||||
placement: 'right'
|
||||
placement: 'right',
|
||||
showLink: true
|
||||
},
|
||||
|
||||
template: _.template([
|
||||
|
@ -54,7 +55,9 @@ define([
|
|||
'<div class="tip-text" style="width: 260px;"><%= scope.text %></div>',
|
||||
'<div class="close img-commonctrl"></div>',
|
||||
'</div>',
|
||||
'<div class="show-link"><label><%= scope.textDontShow %></label></div>',
|
||||
'<% if ( scope.showLink ) { %>',
|
||||
'<div class="show-link"><label><%= scope.textLink %></label></div>',
|
||||
'<% } %>',
|
||||
'</div>',
|
||||
'</div>'
|
||||
].join('')),
|
||||
|
@ -65,7 +68,9 @@ define([
|
|||
Common.UI.BaseView.prototype.initialize.call(this, options);
|
||||
this.target = this.options.target;
|
||||
this.text = !_.isEmpty(this.options.text) ? this.options.text : this.textSynchronize;
|
||||
this.textLink = !_.isEmpty(this.options.textLink) ? this.options.textLink : this.textDontShow;
|
||||
this.placement = this.options.placement;
|
||||
this.showLink = this.options.showLink;
|
||||
},
|
||||
|
||||
render: function() {
|
||||
|
@ -95,8 +100,12 @@ define([
|
|||
|
||||
applyPlacement: function () {
|
||||
var showxy = this.target.offset();
|
||||
(this.placement == 'top') ? this.cmpEl.css({bottom : Common.Utils.innerHeight() - showxy.top + 'px', right: Common.Utils.innerWidth() - showxy.left - this.target.width()/2 + 'px'})
|
||||
: this.cmpEl.css({top : showxy.top + this.target.height()/2 + 'px', left: showxy.left + this.target.width() + 'px'});
|
||||
if (this.placement == 'top')
|
||||
this.cmpEl.css({bottom : Common.Utils.innerHeight() - showxy.top + 'px', right: Common.Utils.innerWidth() - showxy.left - this.target.width()/2 + 'px'});
|
||||
else if (this.placement == 'left')
|
||||
this.cmpEl.css({top : showxy.top + this.target.height()/2 + 'px', right: Common.Utils.innerWidth() - showxy.left - 5 + 'px'});
|
||||
else // right
|
||||
this.cmpEl.css({top : showxy.top + this.target.height()/2 + 'px', left: showxy.left + this.target.width() + 'px'});
|
||||
},
|
||||
|
||||
isVisible: function() {
|
||||
|
|
|
@ -23,6 +23,21 @@
|
|||
}
|
||||
}
|
||||
|
||||
&.left {
|
||||
margin: -32px 15px 0 0;
|
||||
|
||||
.tip-arrow {
|
||||
right: -15px;
|
||||
top: 20px;
|
||||
width: 15px;
|
||||
height: 30px;
|
||||
&:after {
|
||||
top: 5px;
|
||||
left: -8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.top {
|
||||
margin: 0 -32px 15px 0;
|
||||
|
||||
|
|
Loading…
Reference in a new issue