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

96.15% Statements 125/130
93.26% Branches 83/89
100% Functions 14/14
96.9% Lines 125/129
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   3933× 3933× 3933× 3933× 3933×   889496×   890006× 342869×   890006×   888738× 888738× 184× 184× 184× 184× 184× 184×   184×   888554×     889496×           889496×   889378×   118× 118× 118× 118× 115× 115×     889496× 889496× 889496× 889496× 288×   889496× 889496×   889496× 170844×   889496× 889496× 889496× 169349× 169349×   889496× 889496× 889496× 889496× 888738×   889496× 889027×   469× 79× 79× 79× 29×     50×   79× 79× 79×   889496×     889496× 889496× 151× 151× 151× 151× 151× 151×   889496×     889027× 889027× 889027×   889591× 889591× 889591× 889591× 889591×   889591× 336043×   889591× 30×   889561× 30×     979292× 979292× 979292× 979292×     979292× 57×   979292× 394×   979292× 173× 173× 18×     979292× 978464×   979292× 111633×   979292× 979292×   888738×        
define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "../base/util", "@syncfusion/ej2-buttons", "../base/constant"], function (require, exports, ej2_base_1, ej2_base_2, util_1, ej2_buttons_1, constant_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var CellRenderer = (function () {
        function CellRenderer(parent, locator) {
            this.element = ej2_base_2.createElement('TD', { className: 'e-rowcell', attrs: { role: 'gridcell', tabindex: '-1' } });
            this.rowChkBox = ej2_base_2.createElement('input', { className: 'e-checkselect', attrs: { 'type': 'checkbox' } });
            this.localizer = locator.getService('localization');
            this.formatter = locator.getService('valueFormatter');
            this.parent = parent;
        }
        CellRenderer.prototype.getGui = function () {
            return '';
        };
        CellRenderer.prototype.format = function (column, value, data) {
            if (!ej2_base_1.isNullOrUndefined(column.format)) {
                value = this.formatter.toView(value, column.getFormatter());
            }
            return ej2_base_1.isNullOrUndefined(value) ? '' : value.toString();
        };
        CellRenderer.prototype.evaluate = function (node, cell, data, attributes, fData) {
            var result;
            if (cell.column.template) {
                var literals = ['index'];
                var dummyData = ej2_base_1.extend({}, data, (_a = {}, _a[constant_1.foreignKeyData] = fData, _a));
                result = cell.column.getColumnTemplate()(ej2_base_1.extend({ 'index': attributes[literals[0]] }, dummyData), this.parent, 'template');
                util_1.appendChildren(node, result);
                result = null;
                node.setAttribute('aria-label', node.innerText + ' is template cell' + ' column header ' +
                    cell.column.headerText);
                return false;
            }
            return true;
            var _a;
        };
        CellRenderer.prototype.invokeFormatter = function (column, value, data) {
            if (!ej2_base_1.isNullOrUndefined(column.formatter)) {
                if (util_1.doesImplementInterface(column.formatter, 'getValue')) {
                    var formatter = column.formatter;
                    value = new formatter().getValue(column, data);
                }
                else if (typeof column.formatter === 'function') {
                    value = column.formatter(column, data);
                }
                else {
                    value = column.formatter.getValue(column, data);
                }
            }
            return value;
        };
        CellRenderer.prototype.render = function (cell, data, attributes) {
            return this.refreshCell(cell, data, attributes);
        };
        CellRenderer.prototype.refreshTD = function (td, cell, data, attributes) {
            var node = this.refreshCell(cell, data, attributes);
            td.innerHTML = '';
            var elements = [].slice.call(node.childNodes);
            for (var _i = 0, elements_1 = elements; _i < elements_1.length; _i++) {
                var elem = elements_1[_i];
                td.appendChild(elem);
            }
        };
        CellRenderer.prototype.refreshCell = function (cell, data, attributes) {
            var node = this.element.cloneNode();
            var column = cell.column;
            var fData;
            if (cell.isForeignKey) {
                fData = cell.foreignKeyData[0] || (_a = {}, _a[column.foreignKeyValue] = column.format ? null : '', _a);
            }
            var innerHtml = this.getGui();
            var value = cell.isForeignKey ? this.getValue(column.foreignKeyValue, fData, column) :
                this.getValue(column.field, data, column);
            if ((column.type === 'date' || column.type === 'datetime') && !ej2_base_1.isNullOrUndefined(value)) {
                value = new Date(value);
            }
            value = this.format(column, value, data);
            innerHtml = value.toString();
            if (column.type === 'boolean' && !column.displayAsCheckBox) {
                var localeStr = (value !== 'true' && value !== 'false') ? null : value === 'true' ? 'True' : 'False';
                innerHtml = localeStr ? this.localizer.getConstant(localeStr) : innerHtml;
            }
            var fromFormatter = this.invokeFormatter(column, value, data);
            innerHtml = !ej2_base_1.isNullOrUndefined(column.formatter) ? ej2_base_1.isNullOrUndefined(fromFormatter) ? '' : fromFormatter.toString() : innerHtml;
            node.setAttribute('aria-label', (innerHtml === '' ? 'empty' : innerHtml) + ' column header ' + cell.column.headerText);
            if (!ej2_base_1.isNullOrUndefined(cell.column.headerText)) {
                node.setAttribute('aria-label', innerHtml + ' column header ' + cell.column.headerText);
            }
            if (this.evaluate(node, cell, data, attributes, fData) && column.type !== 'checkbox') {
                this.appendHtml(node, innerHtml, column.getDomSetter ? column.getDomSetter() : 'innerHTML');
            }
            else if (column.type === 'checkbox') {
                node.classList.add('e-gridchkbox');
                node.setAttribute('aria-label', 'checkbox');
                if (this.parent.selectionSettings.persistSelection) {
                    value = value === 'true';
                }
                else {
                    value = false;
                }
                var checkWrap = ej2_buttons_1.createCheckBox(false, { checked: value, label: ' ' });
                checkWrap.insertBefore(this.rowChkBox.cloneNode(), checkWrap.firstChild);
                node.appendChild(checkWrap);
            }
            Iif (this.parent.checkAllRows === 'Check' && this.parent.enableVirtualization) {
                cell.isSelected = true;
            }
            this.setAttributes(node, cell, attributes);
            if (column.type === 'boolean' && column.displayAsCheckBox) {
                var checked = isNaN(parseInt(value.toString(), 10)) ? value === 'true' : parseInt(value.toString(), 10) > 0;
                var checkWrap = ej2_buttons_1.createCheckBox(false, { checked: checked, label: ' ' });
                node.innerHTML = '';
                checkWrap.classList.add('e-checkbox-disabled');
                node.appendChild(checkWrap);
                node.setAttribute('aria-label', checked + ' column header ' + cell.column.headerText);
            }
            return node;
            var _a;
        };
        CellRenderer.prototype.appendHtml = function (node, innerHtml, property) {
            Iif (property === void 0) { property = 'innerHTML'; }
            node[property] = innerHtml;
            return node;
        };
        CellRenderer.prototype.setAttributes = function (node, cell, attributes) {
            var column = cell.column;
            this.buildAttributeFromCell(node, cell, column.type === 'checkbox');
            util_1.setStyleAndAttributes(node, attributes);
            util_1.setStyleAndAttributes(node, cell.attributes);
            if (column.customAttributes) {
                util_1.setStyleAndAttributes(node, column.customAttributes);
            }
            if (column.textAlign) {
                node.style.textAlign = column.textAlign;
            }
            if (column.clipMode === 'Clip') {
                node.classList.add('e-gridclip');
            }
            else if (column.clipMode === 'EllipsisWithTooltip') {
                node.classList.add('e-ellipsistooltip');
            }
        };
        CellRenderer.prototype.buildAttributeFromCell = function (node, cell, isCheckBoxType) {
            var attr = {};
            var prop = { 'colindex': 'aria-colindex' };
            var classes = [];
            Iif (cell.colSpan) {
                attr.colSpan = cell.colSpan;
            }
            if (cell.rowSpan) {
                attr.rowSpan = cell.rowSpan;
            }
            if (cell.isTemplate) {
                classes.push('e-templatecell');
            }
            if (cell.isSelected) {
                classes.push.apply(classes, ['e-selectionbackground', 'e-active']);
                if (isCheckBoxType) {
                    node.querySelector('.e-frame').classList.add('e-check');
                }
            }
            if (!ej2_base_1.isNullOrUndefined(cell.index)) {
                attr[prop.colindex] = cell.index;
            }
            if (!cell.visible) {
                classes.push('e-hide');
            }
            attr.class = classes;
            util_1.setStyleAndAttributes(node, attr);
        };
        CellRenderer.prototype.getValue = function (field, data, column) {
            return column.valueAccessor(field, data, column);
        };
        return CellRenderer;
    }());
    exports.CellRenderer = CellRenderer;
});