%PDF- %PDF-
Direktori : /home/bitrix/www/bitrix/components/bitrix/main.ui.grid/templates/.default/js/ |
Current File : //home/bitrix/www/bitrix/components/bitrix/main.ui.grid/templates/.default/js/pin-panel.js |
;(function() { 'use strict'; BX.namespace('BX.Grid'); /** * BX.Grid.PinPanel * @param {BX.Main.grid} parent * @constructor */ BX.Grid.PinPanel = function(parent) { this.parent = null; this.panel = null; this.panelRect = null; this.isSelected = null; this.offset = null; this.animationDuration = null; this.lastIsSelected = null; this.init(parent); }; BX.Grid.PinPanel.prototype = { init: function(parent) { this.parent = parent; this.offset = 10; this.animationDuration = 200; this.panel = this.getPanel(); this.bindOnRowsEvents(); }, bindOnRowsEvents: function() { BX.addCustomEvent('Grid::thereSelectedRows', BX.delegate(this._onThereSelectedRows, this)); BX.addCustomEvent('Grid::allRowsSelected', BX.delegate(this._onThereSelectedRows, this)); BX.addCustomEvent('Grid::noSelectedRows', BX.delegate(this._onNoSelectedRows, this)); BX.addCustomEvent('Grid::allRowsUnselected', BX.delegate(this._onNoSelectedRows, this)); BX.addCustomEvent('Grid::updated', BX.delegate(this._onNoSelectedRows, this)); }, bindOnWindowEvents: function() { BX.bind(window, 'resize', BX.proxy(this._onResize, this)); document.addEventListener('scroll', BX.proxy(this._onScroll, this), BX.Grid.Utils.listenerParams({passive: true})); }, unbindOnWindowEvents: function() { BX.unbind(window, 'resize', BX.proxy(this._onResize, this)); document.removeEventListener('scroll', BX.proxy(this._onScroll, this), BX.Grid.Utils.listenerParams({passive: true})); }, getPanel: function() { this.panel = this.panel || this.parent.getActionsPanel().getPanel(); return this.panel; }, getScrollBottom: function() { return (BX.scrollTop(window) + this.getWindowHeight()); }, getPanelRect: function() { if (!BX.type.isPlainObject(this.panelRect)) { this.panelRect = BX.pos(this.getPanel()); } return this.panelRect; }, getPanelPrevBottom: function() { var prev = BX.previousSibling(this.getPanel()); return BX.pos(prev).bottom + parseFloat(BX.style(prev, 'margin-bottom')); }, getWindowHeight: function() { this.windowHeight = this.windowHeight || BX.height(window); return this.windowHeight; }, pinPanel: function() { BX.style(this.getPanel(), 'width', BX.width(this.getPanel().parentNode) + 'px'); BX.style(this.getPanel().parentNode, 'height', BX.height(this.getPanel().parentNode) + 'px'); BX.addClass(this.getPanel(), 'main-grid-fixed-bottom'); BX.style(this.getPanel(), 'bottom', ''); setTimeout(BX.delegate(function() { BX.style(this.getPanel(), 'transition', 'none'); }, this), 200); }, unpinPanel: function() { BX.removeClass(this.getPanel(), 'main-grid-fixed-bottom'); BX.style(this.getPanel(), 'width', ''); BX.style(this.getPanel().parentNode, 'height', ''); BX.style(this.getPanel(), 'bottom', ''); setTimeout(BX.delegate(function() { BX.style(this.getPanel(), 'transition', ''); }, this), 200); }, isSelectedRows: function() { return this.isSelected; }, isNeedPinAbsolute: function() { return ( ((BX.pos(this.parent.getBody()).top + this.getPanelRect().height) >= this.getScrollBottom()) ); }, isNeedPin: function() { return (this.getScrollBottom() - this.getPanelRect().height) <= this.getPanelPrevBottom(); }, adjustPanelPosition: function() { var scrollX = window.pageXOffset; this.lastScrollX = this.lastScrollX !== null ? this.lastScrollX : scrollX; BX.Grid.Utils.requestAnimationFrame(BX.proxy(function() { if (scrollX !== this.lastScrollX) { var panelPos = this.getPanelRect(); BX.style(this.getPanel(), 'left', panelPos.left - scrollX + 'px'); } }, this)); this.lastScrollX = scrollX; }, pinController: function(isNeedAnimation) { if(!this.getPanel()) { return; } var self = this; if (this.isNeedPin() && this.isSelectedRows()) { if (isNeedAnimation) { BX.style(this.getPanel(), 'bottom', -this.getStartDiffPanelPosition() + 'px'); setTimeout(function() { self.pinPanel(); }, 200); } else { this.pinPanel(); } if (this.isNeedPinAbsolute() && !this.absolutePin) { this.absolutePin = true; BX.style(this.getPanel(), 'transition', ''); BX.style(this.getPanel(), 'top', (BX.pos(this.parent.getBody()).top - parseFloat(BX.style(this.getPanel(), 'margin-top'))) + 'px'); BX.style(self.getPanel(), 'position', 'absolute'); } else if (!this.isNeedPinAbsolute() && this.absolutePin) { this.absolutePin = false; BX.style(this.getPanel(), 'position', ''); BX.style(this.getPanel(), 'top', ''); } this.adjustPanelPosition(); } else { if (isNeedAnimation) { BX.style(this.getPanel(), 'bottom', -this.getEndDiffPanelPosition() + 'px'); setTimeout(function() { self.unpinPanel(); }, 200); } else { this.unpinPanel(); } } }, getEndDiffPanelPosition: function() { var panelPos = BX.pos(this.getPanel()); var prevPanelPos = BX.pos(BX.previousSibling(this.getPanel())); var scrollTop = BX.scrollTop(window); var scrollBottom = scrollTop + BX.height(window); var diff = panelPos.height + this.offset; var prevPanelBottom = (prevPanelPos.bottom + parseFloat(BX.style(this.getPanel(), 'margin-top'))); if (prevPanelBottom < scrollBottom && (prevPanelBottom + panelPos.height) > scrollBottom) { diff = Math.abs(scrollBottom - (prevPanelBottom + panelPos.height)); } return diff; }, getStartDiffPanelPosition: function() { var panelPos = BX.pos(this.getPanel()); var scrollTop = BX.scrollTop(window); var scrollBottom = scrollTop + BX.height(window); var diff = panelPos.height + this.offset; if (panelPos.bottom > scrollBottom && panelPos.top < scrollBottom) { diff = panelPos.bottom - scrollBottom; } return diff; }, _onThereSelectedRows: function() { this.bindOnWindowEvents(); this.isSelected = true; if (this.lastIsSelected) { this.pinController(); } else { this.lastIsSelected = true; this.pinController(true); } }, _onNoSelectedRows: function() { this.unbindOnWindowEvents(); this.isSelected = false; this.pinController(true); this.lastIsSelected = false; }, _onScroll: function() { this.pinController(); }, _onResize: function() { this.windowHeight = BX.height(window); this.panel = this.parent.getActionsPanel().getPanel(); this.panelRect = this.getPanel().getBoundingClientRect(); this.pinController(); } }; })();