Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[common] Update bootstrap (fix tooltip)

Browse source
This commit is contained in:
JuliaSvinareva 2020-07-21 22:42:05 +03:00
parent 08f227b74c
commit cb88f90710
7 changed files with 155 additions and 130 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
apps/common/main/lib/component/Button.js
View file

@ -387,7 +387,7 @@ define([
}); });
if (modalParents.length > 0) { if (modalParents.length > 0) {
me.btnEl.data('bs.tooltip').tip().css('z-index', parseInt(modalParents.css('z-index')) + 10); $(me.btnEl.data('bs.tooltip').getTipElement()).css('z-index', parseInt(modalParents.css('z-index')) + 10);
me.btnMenuEl && me.btnMenuEl.data('bs.tooltip').tip().css('z-index', parseInt(modalParents.css('z-index')) + 10); me.btnMenuEl && me.btnMenuEl.data('bs.tooltip').tip().css('z-index', parseInt(modalParents.css('z-index')) + 10);
var onModalClose = function(dlg) { var onModalClose = function(dlg) {
if (modalParents[0] !== dlg.$window[0]) return; if (modalParents[0] !== dlg.$window[0]) return;

2
apps/common/main/lib/component/ComboDataView.js
View file

@ -473,7 +473,7 @@ define([
var picker = this.menuPicker; var picker = this.menuPicker;
_.each(picker.dataViewItems, function(item) { _.each(picker.dataViewItems, function(item) {
var tip = item.$el.data('bs.tooltip'); var tip = item.$el.data('bs.tooltip');
if (tip) (tip.tip()).remove(); if (tip) $(tip.getTipElement()).remove();
}, picker); }, picker);
} }
}) })

10
apps/common/main/lib/component/DataView.js
View file

@ -447,7 +447,7 @@ define([
if (tip) { if (tip) {
if (tip.dontShow===undefined) if (tip.dontShow===undefined)
tip.dontShow = true; tip.dontShow = true;
(tip.tip()).remove(); $(tip.getTipElement()).remove();
} }
}, this); }, this);
@ -501,7 +501,7 @@ define([
if (tip) { if (tip) {
if (tip.dontShow===undefined) if (tip.dontShow===undefined)
tip.dontShow = true; tip.dontShow = true;
(tip.tip()).remove(); $(tip.getTipElement()).remove();
} }
this.stopListening(view); this.stopListening(view);
view.stopListening(); view.stopListening();
@ -533,7 +533,7 @@ define([
this.lastSelectedRec = null; this.lastSelectedRec = null;
var tip = view.$el.data('bs.tooltip'); var tip = view.$el.data('bs.tooltip');
if (tip) (tip.tip()).remove(); if (tip) $(tip.getTipElement()).remove();
if (!this.isSuspendEvents) { if (!this.isSuspendEvents) {
this.trigger('item:click', this, view, record, e); this.trigger('item:click', this, view, record, e);
@ -932,7 +932,7 @@ define([
if (tip) { if (tip) {
if (tip.dontShow===undefined) if (tip.dontShow===undefined)
tip.dontShow = true; tip.dontShow = true;
(tip.tip()).remove(); $(tip.getTipElement()).remove();
} }
}, this); }, this);
this.dataViewItems = null; this.dataViewItems = null;
@ -986,7 +986,7 @@ define([
record.set({selected: true}); record.set({selected: true});
var tip = view.el.data('bs.tooltip'); var tip = view.el.data('bs.tooltip');
if (tip) (tip.tip()).remove(); if (tip) $(tip.getTipElement()).remove();
if (!this.isSuspendEvents) { if (!this.isSuspendEvents) {
this.trigger('item:click', this, view.el, record, e); this.trigger('item:click', this, view.el, record, e);

4
apps/common/main/lib/component/Tooltip.js
View file

@ -100,8 +100,8 @@
this.$element.tooltip({ this.$element.tooltip({
title : opts.title, title : opts.title,
trigger : 'manual', trigger : 'manual',
placement : opts.placement, placement : opts.placement || 'top',
offset : opts.offset, offset : opts.offset || 0,
cls : opts.cls, cls : opts.cls,
html : opts.html, html : opts.html,
hideonclick : opts.hideonclick hideonclick : opts.hideonclick

250
apps/common/main/lib/util/Tip.js
View file

@ -77,137 +77,151 @@
* *
*/ */
(function ($) { define([
'jquery',
'popper'
], function ($, Popper) {
var _superclass = $.fn.tooltip; var _superclass = $.fn.tooltip;
_superclass.prototype = $.fn.tooltip.Constructor.prototype; _superclass.prototype = $.fn.tooltip.Constructor.prototype;
$.extend($.fn.tooltip.Constructor.DEFAULTS, {
container: 'body',
delay: {show:500},
arrow: false
});
var Tip = function (element, options) { var Tip = function (element, options) {
this.init('tooltip', element, options); this.init(element, options);
}; };
Tip['VERSION'] = $.fn.tooltip.Constructor['VERSION'];
Tip['Default'] = $.extend($.fn.tooltip.Constructor['Default'], {container: 'body', delay: {show:500}, arrow: false});
Tip['NAME'] = $.fn.tooltip.Constructor['NAME'];
Tip['DATA_KEY'] = $.fn.tooltip.Constructor['DATA_KEY'];
Tip['Event'] = $.fn.tooltip.Constructor['Event'];
Tip['EVENT_KEY'] = $.fn.tooltip.Constructor['EVENT_KEY'];
Tip['DefaultType'] = $.fn.tooltip.Constructor['DefaultType'];
Tip.prototype = $.extend({}, $.fn.tooltip.Constructor.prototype, { Tip.prototype = $.extend({}, $.fn.tooltip.Constructor.prototype, {
constructor: Tip, constructor: Tip,
init: function() { init: function(element, config) {
_superclass.prototype.init.apply(this, arguments); this._isEnabled = true;
this._timeout = 0;
this._hoverState = '';
this._activeTrigger = {};
this._popper = null; // Protected
this.element = element;
this.config = this._getConfig(config);
this.tip = null;
if (this.options.placement == 'cursor') { this._setListeners();
if (/hover/.exec(this.options.trigger)) {
this.$element.on('mousemove.tooltip', this.options.selector, $.proxy(this.mousemove, this))
}
}
if (this.options.zIndex) { /*if (this.config.placement == 'cursor') {
this.tip().css('z-index', this.options.zIndex); if (/hover/.exec(this.config.trigger)) {
$(this.element).on('mousemove.tooltip', this.config.selector, $.proxy(this.mousemove, this))
}
}*/
if (this.config.zIndex) {
$(this.getTipElement()).css('z-index', this.config.zIndex);
} }
var me = this; var me = this;
Common.NotificationCenter.on({'layout:changed': function(e){ Common.NotificationCenter.on({'layout:changed': function(e){
if (!me.options.hideonclick && me.tip().is(':visible')) if (!me.config.hideonclick && $(me.getTipElement()).is(':visible'))
me.hide(); me.hide();
}}); }});
}, },
mousemove: function (e) { /*mousemove: function (e) {
this.targetXY = [e.clientX*Common.Utils.zoom(), e.clientY*Common.Utils.zoom()]; this.mouse = {clientX: e.clientX*Common.Utils.zoom(), clientY: e.clientY*Common.Utils.zoom()};
}, },*/
leave: function(obj) { _leave: function(obj) {
_superclass.prototype.leave.apply(this, arguments); _superclass.prototype._leave.apply(this, arguments);
this.dontShow = undefined; this.dontShow = undefined;
this.mouse = undefined;
}, },
show: function (at) { show: function (at) {
if (this.hasContent() && this.enabled && !this.dontShow) { var _this = this;
if (!this.$element.is(":visible") && this.$element.closest('[role=menu]').length>0) return;
var $tip = this.tip();
if (this.options.arrow === false) $tip.addClass('arrow-free'); if (this.isWithContent() && this._isEnabled && !this.dontShow) {
if (this.options.cls) $tip.addClass(this.options.cls);
var placementEx = (typeof this.options.placement !== 'function') ? /^([a-zA-Z]+)-?([a-zA-Z]*)$/.exec(this.options.placement) : null; if (!$(this.element).is(":visible") && $(this.element).closest('[role=menu]').length > 0) return;
if (!at && placementEx && !placementEx[2].length) {
var placementEx = (typeof this.config.placement !== 'function') ? /^([a-zA-Z]+)-?([a-zA-Z]*)$/.exec(this.config.placement) : null;
if (!at && placementEx && !placementEx[2].length && this.config.placement !== 'cursor' || typeof this.config.placement === 'function') {
_superclass.prototype.show.apply(this, arguments); _superclass.prototype.show.apply(this, arguments);
} else { } else {
var e = $.Event('show.bs.tooltip'); var showEvent = $.Event(this.constructor.Event.SHOW);
this.$element.trigger(e); $(this.element).trigger(showEvent);
if (e.isDefaultPrevented()) { return; } if (showEvent.isDefaultPrevented()) {
return;
}
var tip = this.getTipElement();
this.setContent(); this.setContent();
var placement = this.config.placement;
if (this.options.animation) $tip.addClass('fade'); var container = this._getContainer();
$(tip).data(this.constructor.DATA_KEY, this);
$tip.detach() if (!$.contains(this.element.ownerDocument.documentElement, this.tip)) {
.css({top: 0, left: 0, display: 'block'}); $(tip).appendTo(container);
this.options.container ?
$tip.appendTo(this.options.container) : $tip.insertAfter(this.$element);
if (typeof this.options.placement === 'function') {
this.options.placement.call(this, $tip[0], this.$element[0]);
} else if (typeof at == 'object') {
var tp = {top: at[1] + 15, left: at[0] + 18},
innerWidth = Common.Utils.innerWidth(),
innerHeight = Common.Utils.innerHeight();
if (tp.left + $tip.width() > innerWidth) {
tp.left = innerWidth - $tip.width() - 30;
} }
if (tp.top + $tip.height() > innerHeight) { $(this.element).trigger(this.constructor.Event.INSERTED);
tp.top = innerHeight - $tip.height() - 30; if (placement === 'cursor') {
if (at) {
this.mouse = {clientX: at[0], clientY: at[1]};
} else if (!this.mouse) {
this.mouse = {clientX: 0, clientY: 0};
}
var ref = {
getBoundingClientRect: function getBoundingClientRect() {
return {
top: _this.mouse.clientY,
right: _this.mouse.clientX,
bottom: _this.mouse.clientY,
left: _this.mouse.clientX,
width: 0,
height: 0
};
}
};
this._popper = new Popper(ref, tip, {
onCreate: function onCreate(_ref) {
var instance = _ref.instance;
document.onmousemove = function (e) {
var x = e.clientX * Common.Utils.zoom();
var y = e.clientY * Common.Utils.zoom();
_this.mouse = {clientX: x, clientY: y};
instance.scheduleUpdate();
};
}
});
} }
$tip.offset(tp).addClass('in'); $(tip).addClass('show');
} else {
var pos = this.getPosition();
var actualWidth = $tip[0].offsetWidth, if ('ontouchstart' in document.documentElement) {
actualHeight = $tip[0].offsetHeight; $(document.body).children().on('mouseover', null, $.noop);
switch (placementEx[1]) {
case 'bottom': tp = {top: pos.top + pos.height + 10}; break;
case 'top': tp = {top: pos.top - actualHeight - 10}; break;
} }
switch (placementEx[2]) { var prevHoverState = _this._hoverState;
case 'left': _this._hoverState = null;
tp.left = pos.left; $(_this.element).trigger(_this.constructor.Event.SHOWN);
if (this.$element.outerWidth() <= 18) {tp.left -= 4;} // if button is small move tooltip left
break; if (prevHoverState === 'out') {
case 'right': _this._leave(null, _this);
tp.left = pos.left + pos.width - actualWidth;
if (this.$element.outerWidth() <= 18) { tp.left += 4;}
break;
} }
this.applyPlacement(tp, placementEx[1]); }
this.moveArrow();
$tip/*.removeClass(orgPlacement)*/
.addClass(placementEx[1])
.addClass(placementEx[0]);
} }
this.$element.trigger('shown.bs.tooltip');
}
var self = this; clearTimeout(_this.timeout);
clearTimeout(self.timeout); _this.timeout = setTimeout(function () {
self.timeout = setTimeout(function () { if (_this.hoverState == 'in') _this.hide();
if (self.hoverState == 'in') self.hide(); _this.dontShow = false;
self.dontShow = false;
}, 5000); }, 5000);
}
}, },
moveArrow: function () { /*moveArrow: function () {
var $arrow = this.tip().find(".tooltip-arrow, .arrow"); var $arrow = this.tip().find(".tooltip-arrow, .arrow");
var new_arrow_position = 10; var new_arrow_position = 10;
switch (this.options.placement) { switch (this.options.placement) {
@ -220,36 +234,46 @@
$arrow.css("right", new_arrow_position); $arrow.css("right", new_arrow_position);
break; break;
} }
}, },*/
enter: function(obj) { _enter: function(event, context) {
if (obj.type !== 'mouseenter') return; if (event.type !== 'mouseenter') return;
var $target = $(obj.target); var $target = $(event.target);
if ($target.is('[role=menu]') || $target.parentsUntil(obj.currentTarget,'[role=menu]').length && obj.target !== obj.currentTarget || this.tip().is(':visible') ) {return;} if ($target.is('[role=menu]') || $target.parentsUntil(event.currentTarget,'[role=menu]').length && event.target !== event.currentTarget || $(this.getTipElement()).is(':visible') ) {return;}
var self = obj instanceof this.constructor ? var dataKey = this.constructor.DATA_KEY;
obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.tooltip'); context = context || $(event.currentTarget).data(dataKey);
clearTimeout(self.timeout); if (!context) {
self.hoverState = 'in'; context = new this.constructor(event.currentTarget, this._getDelegateConfig());
$(event.currentTarget).data(dataKey, context);
if (!self.options.delay || !self.options.delay.show) {
self.show();
} else {
self.timeout = setTimeout(function () {
if (self.hoverState == 'in') {
self.show(self.options.placement == 'cursor' ? self.targetXY : undefined);
} }
}, self.options.delay.show);
if (event) {
context._activeTrigger[event.type === 'focusin' ? 'focus' : 'hover'] = true;
} }
},
replaceArrow: function(delta, dimension, position) { if ($(context.getTipElement()).hasClass('show') || context._hoverState === 'show') {
this.options.arrow === false ? context._hoverState = 'show';
this.arrow().hide() : _superclass.prototype.replaceArrow.apply(this, arguments); return;
}, }
getCalculatedOffset: function (placement, pos, actualWidth, actualHeight) { clearTimeout(context._timeout);
context._hoverState = 'show';
if (!context.config.delay || !context.config.delay.show) {
context.show();
return;
}
context._timeout = setTimeout(function () {
if (context._hoverState === 'show') {
context.show(context.config.placement == 'cursor' && context.mouse ? [context.mouse.clientX, context.mouse.clientY] : undefined);
}
}, context.config.delay.show);
}
/*_getOffset: function (placement, pos, actualWidth, actualHeight) {
var out = _superclass.prototype.getCalculatedOffset.apply(this, arguments); var out = _superclass.prototype.getCalculatedOffset.apply(this, arguments);
if (this.options.offset > 0 || this.options.offset < 0) { if (this.options.offset > 0 || this.options.offset < 0) {
@ -260,7 +284,7 @@
} }
return out; return out;
} }*/
}); });
@ -291,4 +315,4 @@
return this; return this;
}; };
})(window.jQuery); });

3
apps/documenteditor/main/app_dev.js
View file

@ -127,7 +127,8 @@ require([
'jszip', 'jszip',
'jsziputils', 'jsziputils',
'sockjs', 'sockjs',
'underscore' 'underscore',
'popper'
], function (Backbone, Bootstrap, Core) { ], function (Backbone, Bootstrap, Core) {
Backbone.history.start(); Backbone.history.start();

4
apps/documenteditor/main/resources/less/filemenu.less
View file

@ -38,8 +38,8 @@
} }
&.devider { &.dropdown-divider {
//.dropdown-menu .divider; bootstrap error //.dropdown-menu .divider;
margin-top: 10px; margin-top: 10px;
margin-bottom: 10px; margin-bottom: 10px;
} }