all files / grid/renderer/ freeze-renderer.js

94.81% Statements 201/212
65.96% Branches 62/94
97.37% Functions 37/38
94.74% Lines 198/209
9 statements, 5 functions, 9 branches Ignored     
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284        28×   28× 28× 28× 28× 28× 28× 28×   31× 31× 31× 31× 31× 26× 26×     28×   28×   90×   87×   28×   28× 28× 28× 28× 28× 28× 28×     28× 28× 28×   28× 28×             28× 28× 28× 28× 28× 28×   28× 28× 28× 28× 28× 28× 28×   16× 16× 16× 16× 16× 16× 16× 16× 16× 16×   44× 44× 44× 44×   44× 44× 44× 44× 46× 46× 46× 46× 46×           12× 10× 10× 10×                                 35×     32× 32×   32×         32× 32× 32×       32×   32×                 46× 46× 46× 46× 46× 50× 50× 50×   48×       46×     100× 100× 100× 100× 245× 98×   245× 245× 245×   100×         28×   28×   136×   318×   44× 44× 44×        
/* istanbul ignore next */ 
var __extends = (this && this.__extends) || (function () {
    var extendStatics = Object.setPrototypeOf ||
        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
define(["require", "exports", "@syncfusion/ej2-base", "./header-renderer", "./content-renderer", "../services/freeze-row-model-generator", "../base/constant", "../base/util"], function (require, exports, ej2_base_1, header_renderer_1, content_renderer_1, freeze_row_model_generator_1, events, util_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var FreezeContentRender = (function (_super) {
        __extends(FreezeContentRender, _super);
        function FreezeContentRender(parent, locator) {
            return _super.call(this, parent, locator) || this;
        }
        FreezeContentRender.prototype.renderPanel = function () {
            _super.prototype.renderPanel.call(this);
            var fDiv = ej2_base_1.createElement('div', { className: 'e-frozencontent' });
            var mDiv = ej2_base_1.createElement('div', { className: 'e-movablecontent' });
            this.getPanel().firstChild.appendChild(fDiv);
            this.getPanel().firstChild.appendChild(mDiv);
            this.setFrozenContent(fDiv);
            this.setMovableContent(mDiv);
        };
        FreezeContentRender.prototype.renderEmpty = function (tbody) {
            _super.prototype.renderEmpty.call(this, tbody);
            this.getMovableContent().querySelector('tbody').innerHTML = '<tr><td></td></tr>';
            this.getFrozenContent().querySelector('.e-emptyrow').querySelector('td').colSpan = this.parent.getFrozenColumns();
            this.getFrozenContent().style.borderRightWidth = '0px';
            if (this.parent.frozenRows) {
                this.parent.getHeaderContent().querySelector('.e-frozenheader').querySelector('tbody').innerHTML = '';
                this.parent.getHeaderContent().querySelector('.e-movableheader').querySelector('tbody').innerHTML = '';
            }
        };
        FreezeContentRender.prototype.setFrozenContent = function (ele) {
            this.frozenContent = ele;
        };
        FreezeContentRender.prototype.setMovableContent = function (ele) {
            this.movableContent = ele;
        };
        FreezeContentRender.prototype.getFrozenContent = function () {
            return this.frozenContent;
        };
        FreezeContentRender.prototype.getMovableContent = function () {
            return this.movableContent;
        };
        FreezeContentRender.prototype.getModelGenerator = function () {
            return new freeze_row_model_generator_1.FreezeRowModelGenerator(this.parent);
        };
        FreezeContentRender.prototype.renderTable = function () {
            _super.prototype.renderTable.call(this);
            this.getFrozenContent().appendChild(this.getTable());
            var mTbl = this.getTable().cloneNode(true);
            this.getMovableContent().appendChild(mTbl);
            ej2_base_1.remove(this.getMovableContent().querySelector('colgroup'));
            var colGroup = ((this.parent.getHeaderContent().querySelector('.e-movableheader').querySelector('colgroup')).cloneNode(true));
            mTbl.insertBefore(colGroup, mTbl.querySelector('tbody'));
        };
        return FreezeContentRender;
    }(content_renderer_1.ContentRender));
    exports.FreezeContentRender = FreezeContentRender;
    var FreezeRender = (function (_super) {
        __extends(FreezeRender, _super);
        function FreezeRender(parent, locator) {
            var _this = _super.call(this, parent, locator) || this;
            _this.addEventListener();
            return _this;
        }
        FreezeRender.prototype.addEventListener = function () {
            this.parent.on(events.freezeRender, this.refreshFreeze, this);
            this.parent.on(events.frozenHeight, this.setFrozenHeight, this);
        };
        FreezeRender.prototype.removeEventListener = function () {
            if (this.parent.isDestroyed) {
                return;
            }
            this.parent.off(events.frozenHeight, this.setFrozenHeight);
        };
        FreezeRender.prototype.renderTable = function () {
            _super.prototype.renderTable.call(this);
            this.rfshMovable();
            this.updateColgroup();
            this.initializeHeaderDrag();
            this.initializeHeaderDrop();
            this.parent.notify(events.headerRefreshed, { rows: this.rows, args: { isFrozen: false } });
        };
        FreezeRender.prototype.renderPanel = function () {
            _super.prototype.renderPanel.call(this);
            var fDiv = ej2_base_1.createElement('div', { className: 'e-frozenheader' });
            var mDiv = ej2_base_1.createElement('div', { className: 'e-movableheader' });
            this.getPanel().firstChild.appendChild(fDiv);
            this.getPanel().firstChild.appendChild(mDiv);
            this.setFrozenHeader(fDiv);
            this.setMovableHeader(mDiv);
        };
        FreezeRender.prototype.refreshUI = function () {
            var tbody = this.getMovableHeader().querySelector('tbody');
            ej2_base_1.remove(this.getMovableHeader().querySelector('table'));
            _super.prototype.refreshUI.call(this);
            this.rfshMovable();
            this.getMovableHeader().querySelector('tbody').innerHTML = tbody.innerHTML;
            this.updateColgroup();
            this.parent.updateDefaultCursor();
            util_1.renderMovable(this.parent.getContentTable().querySelector('colgroup'), this.parent.getFrozenColumns());
            this.initializeHeaderDrag();
            this.parent.notify(events.headerRefreshed, { rows: this.rows, args: { isFrozen: false } });
        };
        FreezeRender.prototype.rfshMovable = function () {
            this.getFrozenHeader().appendChild(this.getTable());
            this.getMovableHeader().appendChild(this.createTable());
            this.refreshStackedHdrHgt();
            this.addMovableFirstCls();
        };
        FreezeRender.prototype.addMovableFirstCls = function () {
            Eif (this.parent.getVisibleFrozenColumns()) {
                var movablefirstcell = this.parent.element.querySelector('.e-movableheader').querySelector('thead').querySelectorAll('.e-columnheader');
                var len = this.parent.element.querySelector('.e-movableheader').querySelector('thead').querySelectorAll('.e-columnheader').length;
                for (var i = 0; i < len; i++) {
                    var cells = 'cells';
                    var element = movablefirstcell[i][cells][0];
                    Eif (element) {
                        ej2_base_1.addClass([element], ['e-movablefirst']);
                        if (movablefirstcell[i][cells][0].rowSpan > 1) {
                            i = i + (movablefirstcell[i][cells][0].rowSpan - 1);
                        }
                    }
                }
            }
        };
        FreezeRender.prototype.refreshFreeze = function (obj) {
            if (obj.case === 'filter') {
                var filterRow = this.getTable().querySelector('.e-filterbar');
                Eif (this.parent.allowFiltering && filterRow && this.getMovableHeader().querySelector('thead')) {
                    this.getMovableHeader().querySelector('thead')
                        .appendChild(util_1.renderMovable(filterRow, this.parent.getFrozenColumns()));
                }
            }
            else Eif (obj.case === 'textwrap') {
                var fRows = void 0;
                var mRows = void 0;
                var fHdr = this.getFrozenHeader();
                var mHdr = this.getMovableHeader();
                var cont = this.parent.getContent();
                var wrapMode = this.parent.textWrapSettings.wrapMode;
                var hdrClassList = this.parent.getHeaderContent().firstChild.classList;
                Eif (wrapMode !== 'Header' || obj.isModeChg) {
                    fRows = cont.querySelector('.e-frozencontent').querySelectorAll('tr');
                    mRows = cont.querySelector('.e-movablecontent').querySelectorAll('tr');
                    this.setWrapHeight(fRows, mRows, obj.isModeChg, true);
                }
                Iif (wrapMode === 'Content' && this.parent.allowTextWrap) {
                    hdrClassList.add('e-wrap');
                }
                else {
                    hdrClassList.remove('e-wrap');
                }
                Eif (wrapMode === 'Both' || obj.isModeChg) {
                    fRows = fHdr.querySelectorAll('tr');
                    mRows = mHdr.querySelectorAll('tr');
                }
                else {
                    fRows = fHdr.querySelector(wrapMode === 'Content' ? 'tbody' : 'thead').querySelectorAll('tr');
                    mRows = mHdr.querySelector(wrapMode === 'Content' ? 'tbody' : 'thead').querySelectorAll('tr');
                }
                Eif (!this.parent.getHeaderContent().querySelectorAll('.e-stackedheadercell').length) {
                    this.setWrapHeight(fRows, mRows, obj.isModeChg, false, this.colDepth > 1);
                }
                this.refreshStackedHdrHgt();
            }
        };
        FreezeRender.prototype.updateResizeHandler = function () {
            [].slice.call(this.parent.getHeaderContent().querySelectorAll('.e-rhandler')).forEach(function (ele) {
                ele.style.height = ele.parentElement.offsetHeight + 'px';
            });
        };
        FreezeRender.prototype.setWrapHeight = function (fRows, mRows, isModeChg, isContReset, isStackedHdr) {
            var fRowHgt;
            var mRowHgt;
            var isWrap = this.parent.allowTextWrap;
            var wrapMode = this.parent.textWrapSettings.wrapMode;
            var tHead = this.parent.getHeaderContent().querySelector('thead');
            var tBody = this.parent.getHeaderContent().querySelector('tbody');
            var height = [];
            var width = [];
            for (var i = 0, len = fRows.length; i < len; i++) {
                height[i] = fRows[i].offsetHeight;
                width[i] = mRows[i].offsetHeight;
            }
            for (var i = 0, len = fRows.length; i < len; i++) {
                Iif (isModeChg && ((wrapMode === 'Header' && isContReset) || ((wrapMode === 'Content' && tHead.contains(fRows[i]))
                    || (wrapMode === 'Header' && tBody.contains(fRows[i])))) || isStackedHdr) {
                    fRows[i].style.height = null;
                    mRows[i].style.height = null;
                }
                fRowHgt = height[i];
                mRowHgt = width[i];
                Iif (fRows[i].childElementCount && ((isWrap && fRowHgt < mRowHgt) || (!isWrap && fRowHgt > mRowHgt) ||
                    (this.parent.allowResizing && !this.parent.resizeModule.isFrozenColResized))) {
                    fRows[i].style.height = mRowHgt + 'px';
                }
                Eif (mRows[i].childElementCount && ((isWrap && fRowHgt > mRowHgt) || (!isWrap && fRowHgt < mRowHgt) ||
                    (this.parent.allowResizing && this.parent.resizeModule.isFrozenColResized))) {
                    mRows[i].style.height = fRowHgt + 'px';
                }
            }
            Iif (isWrap) {
                this.setFrozenHeight();
            }
        };
        FreezeRender.prototype.setFrozenHeight = function () {
            var movableContentHeight = this.parent.element.querySelector('.e-movablecontent').getBoundingClientRect().height;
            var frozenContentHeight = this.parent.element.querySelector('.e-frozencontent').getBoundingClientRect().height;
            Eif (movableContentHeight > frozenContentHeight) {
                this.parent.element.querySelector('.e-frozencontent').style.height = movableContentHeight -
                    util_1.getScrollBarWidth() + 'px';
            }
        };
        FreezeRender.prototype.refreshStackedHdrHgt = function () {
            var fRowSpan;
            var mRowSpan;
            var fTr = this.getFrozenHeader().querySelectorAll('.e-columnheader');
            var mTr = this.getMovableHeader().querySelectorAll('.e-columnheader');
            for (var i = 0, len = fTr.length; i < len; i++) {
                fRowSpan = this.getRowSpan(fTr[i]);
                mRowSpan = this.getRowSpan(mTr[i]);
                if (fRowSpan.min > 1) {
                    this.updateStackedHdrRowHgt(i, fRowSpan.max, fTr[i], mTr);
                }
                else Iif (mRowSpan.min > 1) {
                    this.updateStackedHdrRowHgt(i, mRowSpan.max, mTr[i], fTr);
                }
            }
            if (this.parent.allowResizing) {
                this.updateResizeHandler();
            }
        };
        FreezeRender.prototype.getRowSpan = function (row) {
            var rSpan;
            var minRowSpan;
            var maxRowSpan;
            for (var i = 0, len = row.childElementCount; i < len; i++) {
                if (i === 0) {
                    minRowSpan = row.children[0].rowSpan;
                }
                rSpan = row.children[i].rowSpan;
                minRowSpan = Math.min(rSpan, minRowSpan);
                maxRowSpan = Math.max(rSpan, minRowSpan);
            }
            return { min: minRowSpan, max: maxRowSpan };
        };
        FreezeRender.prototype.updateStackedHdrRowHgt = function (idx, maxRowSpan, row, rows) {
            var height = 0;
            for (var i = 0; i < maxRowSpan; i++) {
                height += rows[idx + i].style.height ?
                    parseInt(rows[idx + i].style.height, 10) : rows[idx + i].offsetHeight;
            }
            row.style.height = height + 'px';
        };
        FreezeRender.prototype.setFrozenHeader = function (ele) {
            this.frozenHeader = ele;
        };
        FreezeRender.prototype.setMovableHeader = function (ele) {
            this.movableHeader = ele;
        };
        FreezeRender.prototype.getFrozenHeader = function () {
            return this.frozenHeader;
        };
        FreezeRender.prototype.getMovableHeader = function () {
            return this.movableHeader;
        };
        FreezeRender.prototype.updateColgroup = function () {
            var mTable = this.getMovableHeader().querySelector('table');
            ej2_base_1.remove(this.getMovableHeader().querySelector('colgroup'));
            mTable.insertBefore(util_1.renderMovable(this.getFrozenHeader().querySelector('colgroup'), this.parent.getFrozenColumns()), mTable.querySelector('thead'));
        };
        return FreezeRender;
    }(header_renderer_1.HeaderRender));
    exports.FreezeRender = FreezeRender;
});