npm - @green-code-studio/objects-list - Versions diffs - 1.14.0 → 1.14.2 - Mend

@green-code-studio/objects-list 1.14.0 → 1.14.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4) hide show

package/demoDist/demo.js CHANGED Viewed

@@ -306,7 +306,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \****************************/
 /***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ObjectsList: () => (/* binding */ ObjectsList)\n/* harmony export */ });\n/* harmony import */ var _tableView_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./tableView.js */ \"./src/tableView.js\");\n/* harmony import */ var _listView_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./listView.js */ \"./src/listView.js\");\n/* harmony import */ var _i18n_xml__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./i18n.xml */ \"./src/i18n.xml\");\n/* harmony import */ var _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./paginationButtons.js */ \"./src/paginationButtons.js\");\n/* harmony import */ var _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @green-code-studio/context-menu/dist/index.mjs */ \"./node_modules/@green-code-studio/context-menu/dist/index.mjs\");\n/* harmony import */ var _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./utils/concurencyLimiter.js */ \"./src/utils/concurencyLimiter.js\");\n/* harmony import */ var _idsSet_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./idsSet.js */ \"./src/idsSet.js\");\n/* harmony import */ var _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ConfigPopup.js */ \"./src/ConfigPopup.js\");\n/* harmony import */ var fast_creator__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! fast-creator */ \"./node_modules/fast-creator/dist/entry.js\");\n/* harmony import */ var _calendarView_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./calendarView.js */ \"./src/calendarView.js\");\n/* harmony import */ var _graphView_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./graphView.js */ \"./src/graphView.js\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nclass ObjectsList extends HTMLElement {\r\n    constructor(datasource, defaultView = 'tableView') {\r\n        super();\r\n        this.columns = [];\r\n        this.columnsReordered = [];\r\n        this.columnsReorderedChanged = false;\r\n        this.hiddenColumns = new Set()\r\n        this.columnFilters = new Map();\r\n        this.generateActions = () => [];\r\n        this.insideViewClass = defaultView === 'calendarView' ? _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView : _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n        this.icon = 'icon-document';\r\n        this.loadConcurencyLimiter = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.loadConcurencyLimiterTotal = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.datasource = datasource;\r\n        this.datasource.onchange = () => this.refresh();\r\n        this.start = 0;\r\n        this.limit = 10\r\n        this.total = 0;\r\n        this.selected = new _idsSet_js__WEBPACK_IMPORTED_MODULE_6__.IdsSet();\r\n        this.selectedMain = null;\r\n        this.dataById = new Map();\r\n        this.initFoot();\r\n        this.addEventListener('contextmenu', e => this.showGlobalContextMenu(e));\r\n        this.resizeBinded = this.resize.bind(this);\r\n        this.popstateBinded = this.readUrl.bind(this);\r\n        this.readUrl()\r\n        this.addEventListener('keydown', e => this.onkeydown(e));\r\n        this.infiniteScrollEnabled = false;\r\n    }\r\n\r\n    connectedCallback() {\r\n        addEventListener('resize', this.resizeBinded);\r\n        addEventListener(\"popstate\", this.popstateBinded)\r\n        if (this.paramsInLocalStorage) {\r\n            this.applyParams(JSON.parse(localStorage['objectList_params_' + this.paramsInLocalStorage] ?? 'null'));\r\n        }\r\n    }\r\n\r\n    disconnectedCallback() {\r\n        removeEventListener('resize', this.resizeBinded);\r\n        removeEventListener(\"popstate\", this.popstateBinded)\r\n    }\r\n\r\n    get columns() {\r\n        return this._columns;\r\n    }\r\n\r\n    set columns(value) {\r\n        this._columns = value;\r\n        this.columnsReordered = value;\r\n        this.columnsReorderedChanged = false;\r\n    }\r\n\r\n    get visibleColumns() {\r\n        return this.columnsReordered.filter(x => !this.hiddenColumns.has(x.dataName ?? x.sortName))\r\n    }\r\n\r\n    refreshLimit() {\r\n        this.limit = this.insideView.calcMaxVisibleItems(this.clientHeight - this.foot.clientHeight - 2);\r\n        if (this.limit < 1) this.limit = 1;\r\n        if (this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView) {\r\n            this.start = 0;\r\n            this.limit = 1000000;\r\n        } else if (this.infiniteScrollEnabled) {\r\n            this.limit = Math.ceil(this.limit / 20) * 20 + 40;\r\n        } else {\r\n            this.start = Math.floor(Math.min(this.total, this.start) / this.limit) * this.limit;\r\n        }\r\n    }\r\n\r\n    async refresh() {\r\n        console.log('refresh')\r\n        this.classList.toggle('infiniteScrollEnabled', this.infiniteScrollEnabled);\r\n\r\n        if (!this.insideView || !(this.insideView instanceof this.insideViewClass))\r\n            this.initInsideView();\r\n        else if (this.insideView.refreshHeader) {\r\n            this.insideView.params = this.insideViewParams\r\n            this.insideView.refreshHeader()\r\n        }\r\n\r\n        this.refreshLimit();\r\n        const refreshSymbol = Symbol();\r\n        this.lastRefreshSymbol = refreshSymbol;\r\n        this.lastRefreshSymbolTotal = refreshSymbol;\r\n        this.pagination.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? 'none' : '';\r\n        this.dateInput.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? '' : 'none';\r\n        if (this.insideView instanceof _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView) {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.getSummary(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentSummary = data.summary;\r\n                this.insideView.loadData(data);\r\n            });\r\n        } else if (this.asyncTotal) {\r\n            const promise1 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                const data = await this.datasource.getRows(this);\r\n\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            const promise2 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                let dataTotal = this.datasource.getTotal(this);\r\n                const x = await dataTotal\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                this.total = x.total;\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            await promise1;\r\n            await promise2;\r\n        } else {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.get(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.total = data.total;\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n        }\r\n\r\n\r\n        while (this.filterShortContainer.firstChild) {\r\n            this.filterShortContainer.firstChild.remove()\r\n        }\r\n        if (this.columnFilters.size) {\r\n            this.filterShortContainer.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.filtersCount') + ': ' + this.columnFilters.size}));\r\n            const clearButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.clearFilters')});\r\n            clearButton.onclick = () => {\r\n                this.columnFilters.clear();\r\n                this.refresh();\r\n            }\r\n            this.filterShortContainer.append(clearButton);\r\n        }\r\n        if (this.paramsInUrl) {\r\n            this.setUrl();\r\n        }\r\n        if (this.paramsInLocalStorage) {\r\n            this.setLocalStorage();\r\n        }\r\n    }\r\n\r\n    setUrl() {\r\n        const query = new URLSearchParams(document.location.search)\r\n        const prev = Object.fromEntries([...query]);\r\n        const next = new URLSearchParams(this.serializeParams(prev))\r\n        console.log('dddddcccc')\r\n        console.log(query)\r\n        if (prev.toString() !== next.toString()) {\r\n            const url = new URL(document.location);\r\n            url.search = next.toString();\r\n            history.pushState(null, '', url.toString());\r\n        }\r\n    }\r\n\r\n    setLocalStorage() {\r\n        const prev = JSON.parse(localStorage.getItem('objectList_params_' + this.paramsInLocalStorage));\r\n        const next = this.serializeParams(prev);\r\n        if (JSON.stringify(prev) !== JSON.stringify(next)) {\r\n            localStorage.setItem('objectList_params_' + this.paramsInLocalStorage, JSON.stringify(next));\r\n        }\r\n    }\r\n\r\n    serializeParams(old = {}) {\r\n        old = old || {};\r\n        let ret = {};\r\n        let changed = false;\r\n        var visibleColumns = this.visibleColumns.map(x => x.dataName ?? x.sortName).join();\r\n        if (old.visibleColumns || this.hiddenColumns.size || this.columnsReorderedChanged) {\r\n            ret.visibleColumns = visibleColumns;\r\n            changed = true;\r\n\r\n        }\r\n        if (old.sort || this.sort?.col) {\r\n            ret.sort = this.sort?.col;\r\n\r\n        }\r\n        if (old.sortDesc == 'true' || this.sort?.desc) {\r\n            ret.sortDesc = this.sort?.desc ? 'true' : 'false';\r\n\r\n\r\n        }\r\n        if (old.columnFilters || this.columnFilters) {\r\n            ret.columnFilters = JSON.stringify(Array.from(this.columnFilters.entries()));\r\n\r\n        }\r\n\r\n        if (old.insideView || this.insideViewName) {\r\n            ret.insideView = this.insideViewName;\r\n        }\r\n        const currentDate = new Date().toISOString().substring(0, 7);\r\n        if (old.date || this.date != currentDate) {\r\n            ret.date = this.date;\r\n        }\r\n        return ret;\r\n    }\r\n\r\n    get insideViewName() {\r\n        if (this.insideViewClass == _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView) {\r\n            if (this.insideViewParams?.wide)\r\n                return 'tableWideView';\r\n            else\r\n                return 'tableView'\r\n        } else {\r\n            return 'listView'\r\n        }\r\n    }\r\n\r\n    set insideViewName(value) {\r\n        if (this.insideViewName == value) return;\r\n        if (value == 'tableView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: false}\r\n        } else if (value == 'tableWideView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: true}\r\n        } else if (value == 'listView') {\r\n            this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'calendarView') {\r\n            this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'graphView') {\r\n            this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView\r\n            this.insideViewParams = {}\r\n        }\r\n    }\r\n\r\n    readUrl() {\r\n\r\n        const query = new URLSearchParams(document.location.search)\r\n        const params = Object.fromEntries([...query]);\r\n        this.applyParams(params)\r\n    }\r\n\r\n    applyParams(params) {\r\n        if (params?.visibleColumns) {\r\n            const splitted = params.visibleColumns.split(',');\r\n            this.hiddenColumns = new Set(this.columns.map(x => x.dataName ?? x.sortName));\r\n            for (const name of splitted) {\r\n                this.hiddenColumns.delete(name);\r\n            }\r\n            for (let i = splitted.length - 1; i > 0; i--) {\r\n                const column = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i - 1]);\r\n                const next = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i]);\r\n                if (column) {\r\n                    this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n                    if (next)\r\n                        this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n                    else\r\n                        this.columnsReordered.push(column)\r\n                    this.columnsReorderedChanged = true;\r\n                }\r\n            }\r\n        }\r\n        if (params?.sort) {\r\n            this.sort = {\r\n                col: params.sort,\r\n                desc: params.sortDesc === 'true'\r\n            };\r\n        }\r\n        if (params?.columnFilters) {\r\n            this.columnFilters = new Map(JSON.parse(params.columnFilters));\r\n        }\r\n        if (params?.insideView) {\r\n            this.insideViewName = params.insideView;\r\n        }\r\n        if (params?.date) {\r\n            this.date = params.date;\r\n        }\r\n    }\r\n\r\n    initInsideView() {\r\n        if (this.insideView) {\r\n            this.insideView.remove();\r\n        }\r\n        this.insideView = new this.insideViewClass(this, this.insideViewParams);\r\n        this.insertBefore(this.insideView, this.foot);\r\n        this.insideView.refresh = () => this.refresh();\r\n        this.insideView.onPaginationChanged = (start, limit) => {\r\n            if (this.start != start) {\r\n                this.start = start;\r\n                //this.limit=limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n    fillDataById(rows) {\r\n        for (let row of rows) {\r\n            this.dataById.set(parseInt(row.id), row);\r\n        }\r\n    }\r\n\r\n    getSelectedData() {\r\n        let data = Array.from(this.dataById).filter(([id, row]) => this.selected.has(id)).map(([id, row]) => row);\r\n        if (data.length > 0) return data;\r\n        else if (this.dataById[this.selectedMain])\r\n            return [this.dataById[this.selectedMain]]\r\n        else return [];\r\n    }\r\n\r\n    initFoot() {\r\n        this.foot = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.foot');\r\n        this.append(this.foot);\r\n        let menuButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button.menuButton span.icon-settings');\r\n        this.foot.append(menuButton)\r\n        menuButton.onclick = e => this.showConfigPopup();\r\n        this.pagination = new _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__.PaginationButtons();\r\n        this.pagination.onpageclick = (page) => {\r\n            this.start = page * this.limit;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.pagination);\r\n        this.dateInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {type: 'month', value: new Date().toISOString().substring(0, 7)});\r\n        this.dateInput.onchange = date => {\r\n            this.start = 0;\r\n            this.date = this.dateInput.value;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.dateInput);\r\n        this.filterShortContainer = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.filterShortContainer');\r\n        this.foot.append(this.filterShortContainer);\r\n        this.searchForm = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('form', {className: 'search'});\r\n        this.foot.append(this.searchForm);\r\n        this.searchForm.onsubmit = e => e.preventDefault();\r\n        const searchInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {\r\n            name: 'search',\r\n            type: 'search',\r\n            placeholder: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.search')\r\n        });\r\n        this.searchForm.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)(searchInput));\r\n        searchInput.oninput = e => {\r\n            this.start = 0;\r\n            this.refresh();\r\n        }\r\n\r\n    }\r\n\r\n    get search() {\r\n        if (!this.foot) return '';\r\n        const searchForm = this.foot.querySelector('.search');\r\n        if (!searchForm) return '';\r\n        return searchForm.search.value;\r\n    }\r\n\r\n    showGlobalContextMenu(e) {\r\n        let elements = [{\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.paginationMode'),\r\n            icon: 'icon-pagination',\r\n            onclick: () => {\r\n                this.infiniteScrollEnabled = false;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.scrollMode'),\r\n            icon: 'icon-scroll',\r\n            onclick: () => {\r\n                this.infiniteScrollEnabled = true;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.tableView'),\r\n            icon: 'icon-table',\r\n            onclick: () => {\r\n                this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.listView'),\r\n            icon: 'icon-list',\r\n            onclick: () => {\r\n                this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView;\r\n                this.refresh();\r\n            }\r\n        }];\r\n        if (this.dateRowCallback != null) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.calendarView'),\r\n                 icon: 'icon-calendar',\r\n                onclick: () => {\r\n                    this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.datasource.canGetSummary) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.graphView'),\r\n                 icon: 'icon-graph',\r\n                onclick: () => {\r\n                    this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.allowTableEdit) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.startMultiEdit'),\r\n                icon: 'icon-edit',\r\n                onclick: async () => {\r\n                    this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                    const getSelects=datasource.getSelects?await datasource.getSelects(this):null;\r\n                    this.refresh();\r\n                    this.insideView.startMultiEdit(getSelects);\r\n                }\r\n            });\r\n        }\r\n        _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__.ContextMenu.openContextMenu(e, elements);\r\n    }\r\n\r\n    resize() {\r\n        let limit = this.limit;\r\n        this.refreshLimit();\r\n        if (limit != this.limit) {\r\n            this.refresh();\r\n        }\r\n    }\r\n\r\n    multiEditChanged(id, data, save = false) {\r\n        this.datasource.multiEditChanged(id, data, save);\r\n    }\r\n\r\n    showConfigPopup() {\r\n        if (this.querySelector('config-popup')) {\r\n            this.querySelector('config-popup').remove()\r\n        } else {\r\n            const popup = new _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__.ConfigPopup(this)\r\n            this.append(popup)\r\n        }\r\n    }\r\n\r\n    gotoUrl(url) {\r\n        window.location.href = url;\r\n    }\r\n\r\n    onkeydown(e) {\r\n        if (e.ctrlKey) {\r\n            if (e.key == 'ArrowLeft' || e.key == 'ArrowRight') {\r\n                let page = Math.floor(this.start / this.limit);\r\n                page += (e.key == 'ArrowLeft' ? -1 : 1);\r\n                if (page < 0) page = 0;\r\n                else if (page > 0 && page > Math.ceil(this.total / this.limit) - 1) page = Math.ceil(this.total / this.limit) - 1;\r\n                this.start = page * this.limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n\r\n    reorderColumns(column, next) {\r\n        console.log('reorderColumns')\r\n        if (column) {\r\n            this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n            if (next)\r\n                this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n            else\r\n                this.columnsReordered.push(column)\r\n\r\n            this.columnsReorderedChanged = true;\r\n            if (this.insideView.setColumnsWidths) {\r\n                this.insideView.setColumnsWidths()\r\n            }\r\n        }\r\n    }\r\n}\r\n\r\ncustomElements\r\n    .define(\r\n        'data-view'\r\n        ,\r\n        ObjectsList\r\n    )\r\n;\r\n\n\n//# sourceURL=webpack://@green-code-studio/objects-list/./src/objectsList.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ObjectsList: () => (/* binding */ ObjectsList)\n/* harmony export */ });\n/* harmony import */ var _tableView_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./tableView.js */ \"./src/tableView.js\");\n/* harmony import */ var _listView_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./listView.js */ \"./src/listView.js\");\n/* harmony import */ var _i18n_xml__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./i18n.xml */ \"./src/i18n.xml\");\n/* harmony import */ var _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./paginationButtons.js */ \"./src/paginationButtons.js\");\n/* harmony import */ var _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @green-code-studio/context-menu/dist/index.mjs */ \"./node_modules/@green-code-studio/context-menu/dist/index.mjs\");\n/* harmony import */ var _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./utils/concurencyLimiter.js */ \"./src/utils/concurencyLimiter.js\");\n/* harmony import */ var _idsSet_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./idsSet.js */ \"./src/idsSet.js\");\n/* harmony import */ var _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ConfigPopup.js */ \"./src/ConfigPopup.js\");\n/* harmony import */ var fast_creator__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! fast-creator */ \"./node_modules/fast-creator/dist/entry.js\");\n/* harmony import */ var _calendarView_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./calendarView.js */ \"./src/calendarView.js\");\n/* harmony import */ var _graphView_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./graphView.js */ \"./src/graphView.js\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nclass ObjectsList extends HTMLElement {\r\n    constructor(datasource, defaultView = 'tableView') {\r\n        super();\r\n        this.columns = [];\r\n        this.columnsReordered = [];\r\n        this.columnsReorderedChanged = false;\r\n        this.hiddenColumns = new Set()\r\n        this.columnFilters = new Map();\r\n        this.generateActions = () => [];\r\n        this.insideViewClass = defaultView === 'calendarView' ? _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView : _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n        this.icon = 'icon-document';\r\n        this.loadConcurencyLimiter = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.loadConcurencyLimiterTotal = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.datasource = datasource;\r\n        this.datasource.onchange = () => this.refresh();\r\n        this.start = 0;\r\n        this.limit = 10\r\n        this.total = 0;\r\n        this.selected = new _idsSet_js__WEBPACK_IMPORTED_MODULE_6__.IdsSet();\r\n        this.selectedMain = null;\r\n        this.dataById = new Map();\r\n        this.initFoot();\r\n        this.addEventListener('contextmenu', e => this.showGlobalContextMenu(e));\r\n        this.resizeBinded = this.resize.bind(this);\r\n        this.popstateBinded = this.readUrl.bind(this);\r\n        this.readUrl()\r\n        this.addEventListener('keydown', e => this.onkeydown(e));\r\n        this.infiniteScrollEnabled = false;\r\n    }\r\n\r\n    connectedCallback() {\r\n        addEventListener('resize', this.resizeBinded);\r\n        addEventListener(\"popstate\", this.popstateBinded)\r\n        if (this.paramsInLocalStorage) {\r\n            this.applyParams(JSON.parse(localStorage['objectList_params_' + this.paramsInLocalStorage] ?? 'null'));\r\n        }\r\n    }\r\n\r\n    disconnectedCallback() {\r\n        removeEventListener('resize', this.resizeBinded);\r\n        removeEventListener(\"popstate\", this.popstateBinded)\r\n    }\r\n\r\n    get columns() {\r\n        return this._columns;\r\n    }\r\n\r\n    set columns(value) {\r\n        this._columns = value;\r\n        this.columnsReordered = value;\r\n        this.columnsReorderedChanged = false;\r\n    }\r\n\r\n    get visibleColumns() {\r\n        return this.columnsReordered.filter(x => !this.hiddenColumns.has(x.dataName ?? x.sortName))\r\n    }\r\n\r\n    refreshLimit() {\r\n        this.limit = this.insideView.calcMaxVisibleItems(this.clientHeight - this.foot.clientHeight - 2);\r\n        if (this.limit < 1) this.limit = 1;\r\n        if (this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView) {\r\n            this.start = 0;\r\n            this.limit = 1000000;\r\n        } else if (this.infiniteScrollEnabled) {\r\n            this.limit = Math.ceil(this.limit / 20) * 20 + 40;\r\n        } else {\r\n            this.start = Math.floor(Math.min(this.total, this.start) / this.limit) * this.limit;\r\n        }\r\n    }\r\n\r\n    async refresh() {\r\n        console.log('refresh')\r\n        this.classList.toggle('infiniteScrollEnabled', this.infiniteScrollEnabled);\r\n\r\n        if (!this.insideView || !(this.insideView instanceof this.insideViewClass))\r\n            this.initInsideView();\r\n        else if (this.insideView.refreshHeader) {\r\n            this.insideView.params = this.insideViewParams\r\n            this.insideView.refreshHeader()\r\n        }\r\n\r\n        this.refreshLimit();\r\n        const refreshSymbol = Symbol();\r\n        this.lastRefreshSymbol = refreshSymbol;\r\n        this.lastRefreshSymbolTotal = refreshSymbol;\r\n        this.pagination.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? 'none' : '';\r\n        this.dateInput.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? '' : 'none';\r\n        if (this.insideView instanceof _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView) {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.getSummary(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentSummary = data.summary;\r\n                this.insideView.loadData(data);\r\n            });\r\n        } else if (this.asyncTotal) {\r\n            const promise1 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                const data = await this.datasource.getRows(this);\r\n\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            const promise2 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                let dataTotal = this.datasource.getTotal(this);\r\n                const x = await dataTotal\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                this.total = x.total;\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            await promise1;\r\n            await promise2;\r\n        } else {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.get(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.total = data.total;\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n        }\r\n\r\n\r\n        while (this.filterShortContainer.firstChild) {\r\n            this.filterShortContainer.firstChild.remove()\r\n        }\r\n        if (this.columnFilters.size) {\r\n            this.filterShortContainer.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.filtersCount') + ': ' + this.columnFilters.size}));\r\n            const clearButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.clearFilters')});\r\n            clearButton.onclick = () => {\r\n                this.columnFilters.clear();\r\n                this.refresh();\r\n            }\r\n            this.filterShortContainer.append(clearButton);\r\n        }\r\n        if (this.paramsInUrl) {\r\n            this.setUrl();\r\n        }\r\n        if (this.paramsInLocalStorage) {\r\n            this.setLocalStorage();\r\n        }\r\n    }\r\n\r\n    setUrl() {\r\n        const query = new URLSearchParams(document.location.search)\r\n        const prev = Object.fromEntries([...query]);\r\n        const next = new URLSearchParams(this.serializeParams(prev))\r\n        console.log('dddddcccc')\r\n        console.log(query)\r\n        if (prev.toString() !== next.toString()) {\r\n            const url = new URL(document.location);\r\n            url.search = next.toString();\r\n            history.pushState(null, '', url.toString());\r\n        }\r\n    }\r\n\r\n    setLocalStorage() {\r\n        const prev = JSON.parse(localStorage.getItem('objectList_params_' + this.paramsInLocalStorage));\r\n        const next = this.serializeParams(prev);\r\n        if (JSON.stringify(prev) !== JSON.stringify(next)) {\r\n            localStorage.setItem('objectList_params_' + this.paramsInLocalStorage, JSON.stringify(next));\r\n        }\r\n    }\r\n\r\n    serializeParams(old = {}) {\r\n        old = old || {};\r\n        let ret = {};\r\n        let changed = false;\r\n        var visibleColumns = this.visibleColumns.map(x => x.dataName ?? x.sortName).join();\r\n        if (old.visibleColumns || this.hiddenColumns.size || this.columnsReorderedChanged) {\r\n            ret.visibleColumns = visibleColumns;\r\n            changed = true;\r\n\r\n        }\r\n        if (old.sort || this.sort?.col) {\r\n            ret.sort = this.sort?.col;\r\n\r\n        }\r\n        if (old.sortDesc == 'true' || this.sort?.desc) {\r\n            ret.sortDesc = this.sort?.desc ? 'true' : 'false';\r\n\r\n\r\n        }\r\n        if (old.columnFilters || this.columnFilters) {\r\n            ret.columnFilters = JSON.stringify(Array.from(this.columnFilters.entries()));\r\n\r\n        }\r\n\r\n        if (old.insideView || this.insideViewName) {\r\n            ret.insideView = this.insideViewName;\r\n        }\r\n        const currentDate = new Date().toISOString().substring(0, 7);\r\n        if (old.date || this.date != currentDate) {\r\n            ret.date = this.date;\r\n        }\r\n        return ret;\r\n    }\r\n\r\n    get insideViewName() {\r\n        if (this.insideViewClass == _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView) {\r\n            if (this.insideViewParams?.wide)\r\n                return 'tableWideView';\r\n            else\r\n                return 'tableView'\r\n        } else {\r\n            return 'listView'\r\n        }\r\n    }\r\n\r\n    set insideViewName(value) {\r\n        if (this.insideViewName == value) return;\r\n        if (value == 'tableView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: false}\r\n        } else if (value == 'tableWideView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: true}\r\n        } else if (value == 'listView') {\r\n            this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'calendarView') {\r\n            this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'graphView') {\r\n            this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView\r\n            this.insideViewParams = {}\r\n        }\r\n    }\r\n\r\n    readUrl() {\r\n\r\n        const query = new URLSearchParams(document.location.search)\r\n        const params = Object.fromEntries([...query]);\r\n        this.applyParams(params)\r\n    }\r\n\r\n    applyParams(params) {\r\n        if (params?.visibleColumns) {\r\n            const splitted = params.visibleColumns.split(',');\r\n            this.hiddenColumns = new Set(this.columns.map(x => x.dataName ?? x.sortName));\r\n            for (const name of splitted) {\r\n                this.hiddenColumns.delete(name);\r\n            }\r\n            for (let i = splitted.length - 1; i > 0; i--) {\r\n                const column = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i - 1]);\r\n                const next = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i]);\r\n                if (column) {\r\n                    this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n                    if (next)\r\n                        this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n                    else\r\n                        this.columnsReordered.push(column)\r\n                    this.columnsReorderedChanged = true;\r\n                }\r\n            }\r\n        }\r\n        if (params?.sort) {\r\n            this.sort = {\r\n                col: params.sort,\r\n                desc: params.sortDesc === 'true'\r\n            };\r\n        }\r\n        if (params?.columnFilters) {\r\n            this.columnFilters = new Map(JSON.parse(params.columnFilters));\r\n        }\r\n        if (params?.insideView) {\r\n            this.insideViewName = params.insideView;\r\n        }\r\n        if (params?.date) {\r\n            this.date = params.date;\r\n        }\r\n    }\r\n\r\n    initInsideView() {\r\n        if (this.insideView) {\r\n            this.insideView.remove();\r\n        }\r\n        this.insideView = new this.insideViewClass(this, this.insideViewParams);\r\n        this.insertBefore(this.insideView, this.foot);\r\n        this.insideView.refresh = () => this.refresh();\r\n        this.insideView.onPaginationChanged = (start, limit) => {\r\n            if (this.start != start) {\r\n                this.start = start;\r\n                //this.limit=limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n    fillDataById(rows) {\r\n        for (let row of rows) {\r\n            this.dataById.set(parseInt(row.id), row);\r\n        }\r\n    }\r\n\r\n    getSelectedData() {\r\n        let data = Array.from(this.dataById).filter(([id, row]) => this.selected.has(id)).map(([id, row]) => row);\r\n        if (data.length > 0) return data;\r\n        else if (this.dataById[this.selectedMain])\r\n            return [this.dataById[this.selectedMain]]\r\n        else return [];\r\n    }\r\n\r\n    changeInfiniteScrollEnabled(isEnabled) {\r\n        this.infiniteScrollEnabled = isEnabled;\r\n        this.querySelector('button.paginationModeButton span').className = isEnabled ? 'icon-pagination' : 'icon-scroll';\r\n        this.refresh();\r\n    }\r\n\r\n    initFoot() {\r\n        this.foot = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.foot');\r\n        this.append(this.foot);\r\n        const buttonWrapper = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.buttonWrapper');\r\n        this.foot.append(buttonWrapper);\r\n        let menuButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button.menuButton span.icon-settings');\r\n        menuButton.onclick = e => this.showConfigPopup();\r\n        buttonWrapper.append(menuButton);\r\n\r\n        let paginationModeButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button.paginationModeButton', {\r\n            title: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.paginationMode'), onclick: e => {\r\n                this.changeInfiniteScrollEnabled(!this.infiniteScrollEnabled);\r\n            }\r\n        }, (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)(this.infiniteScrollEnabled ? 'span.icon-pagination' : 'span.icon-scroll'));\r\n        buttonWrapper.append(paginationModeButton);\r\n\r\n\r\n        buttonWrapper.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {\r\n            title: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.tableView'),\r\n            onclick: () => {\r\n                this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                this.refresh();\r\n            }\r\n        }, (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span.icon-table')));\r\n\r\n        buttonWrapper.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {\r\n            title: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.listView'),\r\n            onclick: () => {\r\n                this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView;\r\n                this.refresh();\r\n            }\r\n        }, (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span.icon-list')));\r\n        if (this.dateRowCallback != null) {\r\n            buttonWrapper.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {\r\n                title: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.calendarView'),\r\n                onclick: () => {\r\n                    this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView;\r\n                    this.refresh();\r\n                }\r\n            }, (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span.icon-calendar')));\r\n        }\r\n        if (this.datasource.canGetSummary) {\r\n            buttonWrapper.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {\r\n                title: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.graphView'),\r\n                onclick: () => {\r\n                    this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView;\r\n                    this.refresh();\r\n                }\r\n            }, (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span.icon-graph')));\r\n        }\r\n        this.pagination = new _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__.PaginationButtons();\r\n        this.pagination.onpageclick = (page) => {\r\n            this.start = page * this.limit;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.pagination);\r\n        this.dateInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {type: 'month', value: new Date().toISOString().substring(0, 7)});\r\n        this.dateInput.onchange = date => {\r\n            this.start = 0;\r\n            this.date = this.dateInput.value;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.dateInput);\r\n        this.filterShortContainer = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.filterShortContainer');\r\n        this.foot.append(this.filterShortContainer);\r\n        this.searchForm = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('form', {className: 'search'});\r\n        this.foot.append(this.searchForm);\r\n        this.searchForm.onsubmit = e => e.preventDefault();\r\n        const searchInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {\r\n            name: 'search',\r\n            type: 'search',\r\n            placeholder: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.search')\r\n        });\r\n        this.searchForm.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)(searchInput));\r\n        searchInput.oninput = e => {\r\n            this.start = 0;\r\n            this.refresh();\r\n        }\r\n\r\n    }\r\n\r\n    get search() {\r\n        if (!this.foot) return '';\r\n        const searchForm = this.foot.querySelector('.search');\r\n        if (!searchForm) return '';\r\n        return searchForm.search.value;\r\n    }\r\n\r\n    showGlobalContextMenu(e) {\r\n        let elements = [{\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.paginationMode'),\r\n            icon: 'icon-pagination',\r\n            onclick: () => {\r\n                this.changeInfiniteScrollEnabled(false);\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.scrollMode'),\r\n            icon: 'icon-scroll',\r\n            onclick: () => {\r\n                this.changeInfiniteScrollEnabled(true);\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.tableView'),\r\n            icon: 'icon-table',\r\n            onclick: () => {\r\n                this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.listView'),\r\n            icon: 'icon-list',\r\n            onclick: () => {\r\n                this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView;\r\n                this.refresh();\r\n            }\r\n        }];\r\n        if (this.dateRowCallback != null) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.calendarView'),\r\n                icon: 'icon-calendar',\r\n                onclick: () => {\r\n                    this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.datasource.canGetSummary) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.graphView'),\r\n                icon: 'icon-graph',\r\n                onclick: () => {\r\n                    this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.allowTableEdit) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.startMultiEdit'),\r\n                icon: 'icon-edit',\r\n                onclick: async () => {\r\n                    this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                    const getSelects = this.datasource.getSelects ? await this.datasource.getSelects(this) : null;\r\n                    this.refresh();\r\n                    this.insideView.startMultiEdit(getSelects);\r\n                }\r\n            });\r\n        }\r\n        _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__.ContextMenu.openContextMenu(e, elements);\r\n    }\r\n\r\n    resize() {\r\n        let limit = this.limit;\r\n        this.refreshLimit();\r\n        if (limit != this.limit) {\r\n            this.refresh();\r\n        }\r\n    }\r\n\r\n    multiEditChanged(id, data, save = false) {\r\n        this.datasource.multiEditChanged(id, data, save);\r\n    }\r\n\r\n    showConfigPopup() {\r\n        if (this.querySelector('config-popup')) {\r\n            this.querySelector('config-popup').remove()\r\n        } else {\r\n            const popup = new _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__.ConfigPopup(this)\r\n            this.append(popup)\r\n        }\r\n    }\r\n\r\n    gotoUrl(url) {\r\n        window.location.href = url;\r\n    }\r\n\r\n    onkeydown(e) {\r\n        if (e.ctrlKey) {\r\n            if (e.key == 'ArrowLeft' || e.key == 'ArrowRight') {\r\n                let page = Math.floor(this.start / this.limit);\r\n                page += (e.key == 'ArrowLeft' ? -1 : 1);\r\n                if (page < 0) page = 0;\r\n                else if (page > 0 && page > Math.ceil(this.total / this.limit) - 1) page = Math.ceil(this.total / this.limit) - 1;\r\n                this.start = page * this.limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n\r\n    reorderColumns(column, next) {\r\n        console.log('reorderColumns')\r\n        if (column) {\r\n            this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n            if (next)\r\n                this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n            else\r\n                this.columnsReordered.push(column)\r\n\r\n            this.columnsReorderedChanged = true;\r\n            if (this.insideView.setColumnsWidths) {\r\n                this.insideView.setColumnsWidths()\r\n            }\r\n        }\r\n    }\r\n}\r\n\r\ncustomElements\r\n    .define(\r\n        'data-view'\r\n        ,\r\n        ObjectsList\r\n    )\r\n;\r\n\n\n//# sourceURL=webpack://@green-code-studio/objects-list/./src/objectsList.js?");
 /***/ }),

package/dist/index.mjs CHANGED Viewed

@@ -194,7 +194,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \****************************/
 /***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ObjectsList: () => (/* binding */ ObjectsList)\n/* harmony export */ });\n/* harmony import */ var _tableView_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./tableView.js */ \"./src/tableView.js\");\n/* harmony import */ var _listView_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./listView.js */ \"./src/listView.js\");\n/* harmony import */ var _i18n_xml__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./i18n.xml */ \"./src/i18n.xml\");\n/* harmony import */ var _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./paginationButtons.js */ \"./src/paginationButtons.js\");\n/* harmony import */ var _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @green-code-studio/context-menu/dist/index.mjs */ \"./node_modules/@green-code-studio/context-menu/dist/index.mjs\");\n/* harmony import */ var _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./utils/concurencyLimiter.js */ \"./src/utils/concurencyLimiter.js\");\n/* harmony import */ var _idsSet_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./idsSet.js */ \"./src/idsSet.js\");\n/* harmony import */ var _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ConfigPopup.js */ \"./src/ConfigPopup.js\");\n/* harmony import */ var fast_creator__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! fast-creator */ \"./node_modules/fast-creator/dist/entry.js\");\n/* harmony import */ var _calendarView_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./calendarView.js */ \"./src/calendarView.js\");\n/* harmony import */ var _graphView_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./graphView.js */ \"./src/graphView.js\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nclass ObjectsList extends HTMLElement {\r\n    constructor(datasource, defaultView = 'tableView') {\r\n        super();\r\n        this.columns = [];\r\n        this.columnsReordered = [];\r\n        this.columnsReorderedChanged = false;\r\n        this.hiddenColumns = new Set()\r\n        this.columnFilters = new Map();\r\n        this.generateActions = () => [];\r\n        this.insideViewClass = defaultView === 'calendarView' ? _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView : _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n        this.icon = 'icon-document';\r\n        this.loadConcurencyLimiter = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.loadConcurencyLimiterTotal = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.datasource = datasource;\r\n        this.datasource.onchange = () => this.refresh();\r\n        this.start = 0;\r\n        this.limit = 10\r\n        this.total = 0;\r\n        this.selected = new _idsSet_js__WEBPACK_IMPORTED_MODULE_6__.IdsSet();\r\n        this.selectedMain = null;\r\n        this.dataById = new Map();\r\n        this.initFoot();\r\n        this.addEventListener('contextmenu', e => this.showGlobalContextMenu(e));\r\n        this.resizeBinded = this.resize.bind(this);\r\n        this.popstateBinded = this.readUrl.bind(this);\r\n        this.readUrl()\r\n        this.addEventListener('keydown', e => this.onkeydown(e));\r\n        this.infiniteScrollEnabled = false;\r\n    }\r\n\r\n    connectedCallback() {\r\n        addEventListener('resize', this.resizeBinded);\r\n        addEventListener(\"popstate\", this.popstateBinded)\r\n        if (this.paramsInLocalStorage) {\r\n            this.applyParams(JSON.parse(localStorage['objectList_params_' + this.paramsInLocalStorage] ?? 'null'));\r\n        }\r\n    }\r\n\r\n    disconnectedCallback() {\r\n        removeEventListener('resize', this.resizeBinded);\r\n        removeEventListener(\"popstate\", this.popstateBinded)\r\n    }\r\n\r\n    get columns() {\r\n        return this._columns;\r\n    }\r\n\r\n    set columns(value) {\r\n        this._columns = value;\r\n        this.columnsReordered = value;\r\n        this.columnsReorderedChanged = false;\r\n    }\r\n\r\n    get visibleColumns() {\r\n        return this.columnsReordered.filter(x => !this.hiddenColumns.has(x.dataName ?? x.sortName))\r\n    }\r\n\r\n    refreshLimit() {\r\n        this.limit = this.insideView.calcMaxVisibleItems(this.clientHeight - this.foot.clientHeight - 2);\r\n        if (this.limit < 1) this.limit = 1;\r\n        if (this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView) {\r\n            this.start = 0;\r\n            this.limit = 1000000;\r\n        } else if (this.infiniteScrollEnabled) {\r\n            this.limit = Math.ceil(this.limit / 20) * 20 + 40;\r\n        } else {\r\n            this.start = Math.floor(Math.min(this.total, this.start) / this.limit) * this.limit;\r\n        }\r\n    }\r\n\r\n    async refresh() {\r\n        console.log('refresh')\r\n        this.classList.toggle('infiniteScrollEnabled', this.infiniteScrollEnabled);\r\n\r\n        if (!this.insideView || !(this.insideView instanceof this.insideViewClass))\r\n            this.initInsideView();\r\n        else if (this.insideView.refreshHeader) {\r\n            this.insideView.params = this.insideViewParams\r\n            this.insideView.refreshHeader()\r\n        }\r\n\r\n        this.refreshLimit();\r\n        const refreshSymbol = Symbol();\r\n        this.lastRefreshSymbol = refreshSymbol;\r\n        this.lastRefreshSymbolTotal = refreshSymbol;\r\n        this.pagination.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? 'none' : '';\r\n        this.dateInput.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? '' : 'none';\r\n        if (this.insideView instanceof _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView) {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.getSummary(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentSummary = data.summary;\r\n                this.insideView.loadData(data);\r\n            });\r\n        } else if (this.asyncTotal) {\r\n            const promise1 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                const data = await this.datasource.getRows(this);\r\n\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            const promise2 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                let dataTotal = this.datasource.getTotal(this);\r\n                const x = await dataTotal\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                this.total = x.total;\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            await promise1;\r\n            await promise2;\r\n        } else {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.get(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.total = data.total;\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n        }\r\n\r\n\r\n        while (this.filterShortContainer.firstChild) {\r\n            this.filterShortContainer.firstChild.remove()\r\n        }\r\n        if (this.columnFilters.size) {\r\n            this.filterShortContainer.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.filtersCount') + ': ' + this.columnFilters.size}));\r\n            const clearButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.clearFilters')});\r\n            clearButton.onclick = () => {\r\n                this.columnFilters.clear();\r\n                this.refresh();\r\n            }\r\n            this.filterShortContainer.append(clearButton);\r\n        }\r\n        if (this.paramsInUrl) {\r\n            this.setUrl();\r\n        }\r\n        if (this.paramsInLocalStorage) {\r\n            this.setLocalStorage();\r\n        }\r\n    }\r\n\r\n    setUrl() {\r\n        const query = new URLSearchParams(document.location.search)\r\n        const prev = Object.fromEntries([...query]);\r\n        const next = new URLSearchParams(this.serializeParams(prev))\r\n        console.log('dddddcccc')\r\n        console.log(query)\r\n        if (prev.toString() !== next.toString()) {\r\n            const url = new URL(document.location);\r\n            url.search = next.toString();\r\n            history.pushState(null, '', url.toString());\r\n        }\r\n    }\r\n\r\n    setLocalStorage() {\r\n        const prev = JSON.parse(localStorage.getItem('objectList_params_' + this.paramsInLocalStorage));\r\n        const next = this.serializeParams(prev);\r\n        if (JSON.stringify(prev) !== JSON.stringify(next)) {\r\n            localStorage.setItem('objectList_params_' + this.paramsInLocalStorage, JSON.stringify(next));\r\n        }\r\n    }\r\n\r\n    serializeParams(old = {}) {\r\n        old = old || {};\r\n        let ret = {};\r\n        let changed = false;\r\n        var visibleColumns = this.visibleColumns.map(x => x.dataName ?? x.sortName).join();\r\n        if (old.visibleColumns || this.hiddenColumns.size || this.columnsReorderedChanged) {\r\n            ret.visibleColumns = visibleColumns;\r\n            changed = true;\r\n\r\n        }\r\n        if (old.sort || this.sort?.col) {\r\n            ret.sort = this.sort?.col;\r\n\r\n        }\r\n        if (old.sortDesc == 'true' || this.sort?.desc) {\r\n            ret.sortDesc = this.sort?.desc ? 'true' : 'false';\r\n\r\n\r\n        }\r\n        if (old.columnFilters || this.columnFilters) {\r\n            ret.columnFilters = JSON.stringify(Array.from(this.columnFilters.entries()));\r\n\r\n        }\r\n\r\n        if (old.insideView || this.insideViewName) {\r\n            ret.insideView = this.insideViewName;\r\n        }\r\n        const currentDate = new Date().toISOString().substring(0, 7);\r\n        if (old.date || this.date != currentDate) {\r\n            ret.date = this.date;\r\n        }\r\n        return ret;\r\n    }\r\n\r\n    get insideViewName() {\r\n        if (this.insideViewClass == _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView) {\r\n            if (this.insideViewParams?.wide)\r\n                return 'tableWideView';\r\n            else\r\n                return 'tableView'\r\n        } else {\r\n            return 'listView'\r\n        }\r\n    }\r\n\r\n    set insideViewName(value) {\r\n        if (this.insideViewName == value) return;\r\n        if (value == 'tableView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: false}\r\n        } else if (value == 'tableWideView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: true}\r\n        } else if (value == 'listView') {\r\n            this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'calendarView') {\r\n            this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'graphView') {\r\n            this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView\r\n            this.insideViewParams = {}\r\n        }\r\n    }\r\n\r\n    readUrl() {\r\n\r\n        const query = new URLSearchParams(document.location.search)\r\n        const params = Object.fromEntries([...query]);\r\n        this.applyParams(params)\r\n    }\r\n\r\n    applyParams(params) {\r\n        if (params?.visibleColumns) {\r\n            const splitted = params.visibleColumns.split(',');\r\n            this.hiddenColumns = new Set(this.columns.map(x => x.dataName ?? x.sortName));\r\n            for (const name of splitted) {\r\n                this.hiddenColumns.delete(name);\r\n            }\r\n            for (let i = splitted.length - 1; i > 0; i--) {\r\n                const column = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i - 1]);\r\n                const next = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i]);\r\n                if (column) {\r\n                    this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n                    if (next)\r\n                        this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n                    else\r\n                        this.columnsReordered.push(column)\r\n                    this.columnsReorderedChanged = true;\r\n                }\r\n            }\r\n        }\r\n        if (params?.sort) {\r\n            this.sort = {\r\n                col: params.sort,\r\n                desc: params.sortDesc === 'true'\r\n            };\r\n        }\r\n        if (params?.columnFilters) {\r\n            this.columnFilters = new Map(JSON.parse(params.columnFilters));\r\n        }\r\n        if (params?.insideView) {\r\n            this.insideViewName = params.insideView;\r\n        }\r\n        if (params?.date) {\r\n            this.date = params.date;\r\n        }\r\n    }\r\n\r\n    initInsideView() {\r\n        if (this.insideView) {\r\n            this.insideView.remove();\r\n        }\r\n        this.insideView = new this.insideViewClass(this, this.insideViewParams);\r\n        this.insertBefore(this.insideView, this.foot);\r\n        this.insideView.refresh = () => this.refresh();\r\n        this.insideView.onPaginationChanged = (start, limit) => {\r\n            if (this.start != start) {\r\n                this.start = start;\r\n                //this.limit=limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n    fillDataById(rows) {\r\n        for (let row of rows) {\r\n            this.dataById.set(parseInt(row.id), row);\r\n        }\r\n    }\r\n\r\n    getSelectedData() {\r\n        let data = Array.from(this.dataById).filter(([id, row]) => this.selected.has(id)).map(([id, row]) => row);\r\n        if (data.length > 0) return data;\r\n        else if (this.dataById[this.selectedMain])\r\n            return [this.dataById[this.selectedMain]]\r\n        else return [];\r\n    }\r\n\r\n    initFoot() {\r\n        this.foot = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.foot');\r\n        this.append(this.foot);\r\n        let menuButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button.menuButton span.icon-settings');\r\n        this.foot.append(menuButton)\r\n        menuButton.onclick = e => this.showConfigPopup();\r\n        this.pagination = new _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__.PaginationButtons();\r\n        this.pagination.onpageclick = (page) => {\r\n            this.start = page * this.limit;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.pagination);\r\n        this.dateInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {type: 'month', value: new Date().toISOString().substring(0, 7)});\r\n        this.dateInput.onchange = date => {\r\n            this.start = 0;\r\n            this.date = this.dateInput.value;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.dateInput);\r\n        this.filterShortContainer = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.filterShortContainer');\r\n        this.foot.append(this.filterShortContainer);\r\n        this.searchForm = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('form', {className: 'search'});\r\n        this.foot.append(this.searchForm);\r\n        this.searchForm.onsubmit = e => e.preventDefault();\r\n        const searchInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {\r\n            name: 'search',\r\n            type: 'search',\r\n            placeholder: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.search')\r\n        });\r\n        this.searchForm.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)(searchInput));\r\n        searchInput.oninput = e => {\r\n            this.start = 0;\r\n            this.refresh();\r\n        }\r\n\r\n    }\r\n\r\n    get search() {\r\n        if (!this.foot) return '';\r\n        const searchForm = this.foot.querySelector('.search');\r\n        if (!searchForm) return '';\r\n        return searchForm.search.value;\r\n    }\r\n\r\n    showGlobalContextMenu(e) {\r\n        let elements = [{\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.paginationMode'),\r\n            icon: 'icon-pagination',\r\n            onclick: () => {\r\n                this.infiniteScrollEnabled = false;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.scrollMode'),\r\n            icon: 'icon-scroll',\r\n            onclick: () => {\r\n                this.infiniteScrollEnabled = true;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.tableView'),\r\n            icon: 'icon-table',\r\n            onclick: () => {\r\n                this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.listView'),\r\n            icon: 'icon-list',\r\n            onclick: () => {\r\n                this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView;\r\n                this.refresh();\r\n            }\r\n        }];\r\n        if (this.dateRowCallback != null) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.calendarView'),\r\n                 icon: 'icon-calendar',\r\n                onclick: () => {\r\n                    this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.datasource.canGetSummary) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.graphView'),\r\n                 icon: 'icon-graph',\r\n                onclick: () => {\r\n                    this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.allowTableEdit) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.startMultiEdit'),\r\n                icon: 'icon-edit',\r\n                onclick: async () => {\r\n                    this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                    const getSelects=datasource.getSelects?await datasource.getSelects(this):null;\r\n                    this.refresh();\r\n                    this.insideView.startMultiEdit(getSelects);\r\n                }\r\n            });\r\n        }\r\n        _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__.ContextMenu.openContextMenu(e, elements);\r\n    }\r\n\r\n    resize() {\r\n        let limit = this.limit;\r\n        this.refreshLimit();\r\n        if (limit != this.limit) {\r\n            this.refresh();\r\n        }\r\n    }\r\n\r\n    multiEditChanged(id, data, save = false) {\r\n        this.datasource.multiEditChanged(id, data, save);\r\n    }\r\n\r\n    showConfigPopup() {\r\n        if (this.querySelector('config-popup')) {\r\n            this.querySelector('config-popup').remove()\r\n        } else {\r\n            const popup = new _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__.ConfigPopup(this)\r\n            this.append(popup)\r\n        }\r\n    }\r\n\r\n    gotoUrl(url) {\r\n        window.location.href = url;\r\n    }\r\n\r\n    onkeydown(e) {\r\n        if (e.ctrlKey) {\r\n            if (e.key == 'ArrowLeft' || e.key == 'ArrowRight') {\r\n                let page = Math.floor(this.start / this.limit);\r\n                page += (e.key == 'ArrowLeft' ? -1 : 1);\r\n                if (page < 0) page = 0;\r\n                else if (page > 0 && page > Math.ceil(this.total / this.limit) - 1) page = Math.ceil(this.total / this.limit) - 1;\r\n                this.start = page * this.limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n\r\n    reorderColumns(column, next) {\r\n        console.log('reorderColumns')\r\n        if (column) {\r\n            this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n            if (next)\r\n                this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n            else\r\n                this.columnsReordered.push(column)\r\n\r\n            this.columnsReorderedChanged = true;\r\n            if (this.insideView.setColumnsWidths) {\r\n                this.insideView.setColumnsWidths()\r\n            }\r\n        }\r\n    }\r\n}\r\n\r\ncustomElements\r\n    .define(\r\n        'data-view'\r\n        ,\r\n        ObjectsList\r\n    )\r\n;\r\n\n\n//# sourceURL=webpack://@green-code-studio/objects-list/./src/objectsList.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ObjectsList: () => (/* binding */ ObjectsList)\n/* harmony export */ });\n/* harmony import */ var _tableView_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./tableView.js */ \"./src/tableView.js\");\n/* harmony import */ var _listView_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./listView.js */ \"./src/listView.js\");\n/* harmony import */ var _i18n_xml__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./i18n.xml */ \"./src/i18n.xml\");\n/* harmony import */ var _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./paginationButtons.js */ \"./src/paginationButtons.js\");\n/* harmony import */ var _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @green-code-studio/context-menu/dist/index.mjs */ \"./node_modules/@green-code-studio/context-menu/dist/index.mjs\");\n/* harmony import */ var _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./utils/concurencyLimiter.js */ \"./src/utils/concurencyLimiter.js\");\n/* harmony import */ var _idsSet_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./idsSet.js */ \"./src/idsSet.js\");\n/* harmony import */ var _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ConfigPopup.js */ \"./src/ConfigPopup.js\");\n/* harmony import */ var fast_creator__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! fast-creator */ \"./node_modules/fast-creator/dist/entry.js\");\n/* harmony import */ var _calendarView_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./calendarView.js */ \"./src/calendarView.js\");\n/* harmony import */ var _graphView_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./graphView.js */ \"./src/graphView.js\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nclass ObjectsList extends HTMLElement {\r\n    constructor(datasource, defaultView = 'tableView') {\r\n        super();\r\n        this.columns = [];\r\n        this.columnsReordered = [];\r\n        this.columnsReorderedChanged = false;\r\n        this.hiddenColumns = new Set()\r\n        this.columnFilters = new Map();\r\n        this.generateActions = () => [];\r\n        this.insideViewClass = defaultView === 'calendarView' ? _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView : _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n        this.icon = 'icon-document';\r\n        this.loadConcurencyLimiter = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.loadConcurencyLimiterTotal = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.datasource = datasource;\r\n        this.datasource.onchange = () => this.refresh();\r\n        this.start = 0;\r\n        this.limit = 10\r\n        this.total = 0;\r\n        this.selected = new _idsSet_js__WEBPACK_IMPORTED_MODULE_6__.IdsSet();\r\n        this.selectedMain = null;\r\n        this.dataById = new Map();\r\n        this.initFoot();\r\n        this.addEventListener('contextmenu', e => this.showGlobalContextMenu(e));\r\n        this.resizeBinded = this.resize.bind(this);\r\n        this.popstateBinded = this.readUrl.bind(this);\r\n        this.readUrl()\r\n        this.addEventListener('keydown', e => this.onkeydown(e));\r\n        this.infiniteScrollEnabled = false;\r\n    }\r\n\r\n    connectedCallback() {\r\n        addEventListener('resize', this.resizeBinded);\r\n        addEventListener(\"popstate\", this.popstateBinded)\r\n        if (this.paramsInLocalStorage) {\r\n            this.applyParams(JSON.parse(localStorage['objectList_params_' + this.paramsInLocalStorage] ?? 'null'));\r\n        }\r\n    }\r\n\r\n    disconnectedCallback() {\r\n        removeEventListener('resize', this.resizeBinded);\r\n        removeEventListener(\"popstate\", this.popstateBinded)\r\n    }\r\n\r\n    get columns() {\r\n        return this._columns;\r\n    }\r\n\r\n    set columns(value) {\r\n        this._columns = value;\r\n        this.columnsReordered = value;\r\n        this.columnsReorderedChanged = false;\r\n    }\r\n\r\n    get visibleColumns() {\r\n        return this.columnsReordered.filter(x => !this.hiddenColumns.has(x.dataName ?? x.sortName))\r\n    }\r\n\r\n    refreshLimit() {\r\n        this.limit = this.insideView.calcMaxVisibleItems(this.clientHeight - this.foot.clientHeight - 2);\r\n        if (this.limit < 1) this.limit = 1;\r\n        if (this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView) {\r\n            this.start = 0;\r\n            this.limit = 1000000;\r\n        } else if (this.infiniteScrollEnabled) {\r\n            this.limit = Math.ceil(this.limit / 20) * 20 + 40;\r\n        } else {\r\n            this.start = Math.floor(Math.min(this.total, this.start) / this.limit) * this.limit;\r\n        }\r\n    }\r\n\r\n    async refresh() {\r\n        console.log('refresh')\r\n        this.classList.toggle('infiniteScrollEnabled', this.infiniteScrollEnabled);\r\n\r\n        if (!this.insideView || !(this.insideView instanceof this.insideViewClass))\r\n            this.initInsideView();\r\n        else if (this.insideView.refreshHeader) {\r\n            this.insideView.params = this.insideViewParams\r\n            this.insideView.refreshHeader()\r\n        }\r\n\r\n        this.refreshLimit();\r\n        const refreshSymbol = Symbol();\r\n        this.lastRefreshSymbol = refreshSymbol;\r\n        this.lastRefreshSymbolTotal = refreshSymbol;\r\n        this.pagination.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? 'none' : '';\r\n        this.dateInput.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? '' : 'none';\r\n        if (this.insideView instanceof _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView) {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.getSummary(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentSummary = data.summary;\r\n                this.insideView.loadData(data);\r\n            });\r\n        } else if (this.asyncTotal) {\r\n            const promise1 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                const data = await this.datasource.getRows(this);\r\n\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            const promise2 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                let dataTotal = this.datasource.getTotal(this);\r\n                const x = await dataTotal\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                this.total = x.total;\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            await promise1;\r\n            await promise2;\r\n        } else {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.get(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.total = data.total;\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n        }\r\n\r\n\r\n        while (this.filterShortContainer.firstChild) {\r\n            this.filterShortContainer.firstChild.remove()\r\n        }\r\n        if (this.columnFilters.size) {\r\n            this.filterShortContainer.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.filtersCount') + ': ' + this.columnFilters.size}));\r\n            const clearButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.clearFilters')});\r\n            clearButton.onclick = () => {\r\n                this.columnFilters.clear();\r\n                this.refresh();\r\n            }\r\n            this.filterShortContainer.append(clearButton);\r\n        }\r\n        if (this.paramsInUrl) {\r\n            this.setUrl();\r\n        }\r\n        if (this.paramsInLocalStorage) {\r\n            this.setLocalStorage();\r\n        }\r\n    }\r\n\r\n    setUrl() {\r\n        const query = new URLSearchParams(document.location.search)\r\n        const prev = Object.fromEntries([...query]);\r\n        const next = new URLSearchParams(this.serializeParams(prev))\r\n        console.log('dddddcccc')\r\n        console.log(query)\r\n        if (prev.toString() !== next.toString()) {\r\n            const url = new URL(document.location);\r\n            url.search = next.toString();\r\n            history.pushState(null, '', url.toString());\r\n        }\r\n    }\r\n\r\n    setLocalStorage() {\r\n        const prev = JSON.parse(localStorage.getItem('objectList_params_' + this.paramsInLocalStorage));\r\n        const next = this.serializeParams(prev);\r\n        if (JSON.stringify(prev) !== JSON.stringify(next)) {\r\n            localStorage.setItem('objectList_params_' + this.paramsInLocalStorage, JSON.stringify(next));\r\n        }\r\n    }\r\n\r\n    serializeParams(old = {}) {\r\n        old = old || {};\r\n        let ret = {};\r\n        let changed = false;\r\n        var visibleColumns = this.visibleColumns.map(x => x.dataName ?? x.sortName).join();\r\n        if (old.visibleColumns || this.hiddenColumns.size || this.columnsReorderedChanged) {\r\n            ret.visibleColumns = visibleColumns;\r\n            changed = true;\r\n\r\n        }\r\n        if (old.sort || this.sort?.col) {\r\n            ret.sort = this.sort?.col;\r\n\r\n        }\r\n        if (old.sortDesc == 'true' || this.sort?.desc) {\r\n            ret.sortDesc = this.sort?.desc ? 'true' : 'false';\r\n\r\n\r\n        }\r\n        if (old.columnFilters || this.columnFilters) {\r\n            ret.columnFilters = JSON.stringify(Array.from(this.columnFilters.entries()));\r\n\r\n        }\r\n\r\n        if (old.insideView || this.insideViewName) {\r\n            ret.insideView = this.insideViewName;\r\n        }\r\n        const currentDate = new Date().toISOString().substring(0, 7);\r\n        if (old.date || this.date != currentDate) {\r\n            ret.date = this.date;\r\n        }\r\n        return ret;\r\n    }\r\n\r\n    get insideViewName() {\r\n        if (this.insideViewClass == _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView) {\r\n            if (this.insideViewParams?.wide)\r\n                return 'tableWideView';\r\n            else\r\n                return 'tableView'\r\n        } else {\r\n            return 'listView'\r\n        }\r\n    }\r\n\r\n    set insideViewName(value) {\r\n        if (this.insideViewName == value) return;\r\n        if (value == 'tableView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: false}\r\n        } else if (value == 'tableWideView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: true}\r\n        } else if (value == 'listView') {\r\n            this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'calendarView') {\r\n            this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'graphView') {\r\n            this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView\r\n            this.insideViewParams = {}\r\n        }\r\n    }\r\n\r\n    readUrl() {\r\n\r\n        const query = new URLSearchParams(document.location.search)\r\n        const params = Object.fromEntries([...query]);\r\n        this.applyParams(params)\r\n    }\r\n\r\n    applyParams(params) {\r\n        if (params?.visibleColumns) {\r\n            const splitted = params.visibleColumns.split(',');\r\n            this.hiddenColumns = new Set(this.columns.map(x => x.dataName ?? x.sortName));\r\n            for (const name of splitted) {\r\n                this.hiddenColumns.delete(name);\r\n            }\r\n            for (let i = splitted.length - 1; i > 0; i--) {\r\n                const column = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i - 1]);\r\n                const next = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i]);\r\n                if (column) {\r\n                    this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n                    if (next)\r\n                        this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n                    else\r\n                        this.columnsReordered.push(column)\r\n                    this.columnsReorderedChanged = true;\r\n                }\r\n            }\r\n        }\r\n        if (params?.sort) {\r\n            this.sort = {\r\n                col: params.sort,\r\n                desc: params.sortDesc === 'true'\r\n            };\r\n        }\r\n        if (params?.columnFilters) {\r\n            this.columnFilters = new Map(JSON.parse(params.columnFilters));\r\n        }\r\n        if (params?.insideView) {\r\n            this.insideViewName = params.insideView;\r\n        }\r\n        if (params?.date) {\r\n            this.date = params.date;\r\n        }\r\n    }\r\n\r\n    initInsideView() {\r\n        if (this.insideView) {\r\n            this.insideView.remove();\r\n        }\r\n        this.insideView = new this.insideViewClass(this, this.insideViewParams);\r\n        this.insertBefore(this.insideView, this.foot);\r\n        this.insideView.refresh = () => this.refresh();\r\n        this.insideView.onPaginationChanged = (start, limit) => {\r\n            if (this.start != start) {\r\n                this.start = start;\r\n                //this.limit=limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n    fillDataById(rows) {\r\n        for (let row of rows) {\r\n            this.dataById.set(parseInt(row.id), row);\r\n        }\r\n    }\r\n\r\n    getSelectedData() {\r\n        let data = Array.from(this.dataById).filter(([id, row]) => this.selected.has(id)).map(([id, row]) => row);\r\n        if (data.length > 0) return data;\r\n        else if (this.dataById[this.selectedMain])\r\n            return [this.dataById[this.selectedMain]]\r\n        else return [];\r\n    }\r\n\r\n    changeInfiniteScrollEnabled(isEnabled) {\r\n        this.infiniteScrollEnabled = isEnabled;\r\n        this.querySelector('button.paginationModeButton span').className = isEnabled ? 'icon-pagination' : 'icon-scroll';\r\n        this.refresh();\r\n    }\r\n\r\n    initFoot() {\r\n        this.foot = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.foot');\r\n        this.append(this.foot);\r\n        const buttonWrapper = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.buttonWrapper');\r\n        this.foot.append(buttonWrapper);\r\n        let menuButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button.menuButton span.icon-settings');\r\n        menuButton.onclick = e => this.showConfigPopup();\r\n        buttonWrapper.append(menuButton);\r\n\r\n        let paginationModeButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button.paginationModeButton', {\r\n            title: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.paginationMode'), onclick: e => {\r\n                this.changeInfiniteScrollEnabled(!this.infiniteScrollEnabled);\r\n            }\r\n        }, (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)(this.infiniteScrollEnabled ? 'span.icon-pagination' : 'span.icon-scroll'));\r\n        buttonWrapper.append(paginationModeButton);\r\n\r\n\r\n        buttonWrapper.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {\r\n            title: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.tableView'),\r\n            onclick: () => {\r\n                this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                this.refresh();\r\n            }\r\n        }, (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span.icon-table')));\r\n\r\n        buttonWrapper.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {\r\n            title: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.listView'),\r\n            onclick: () => {\r\n                this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView;\r\n                this.refresh();\r\n            }\r\n        }, (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span.icon-list')));\r\n        if (this.dateRowCallback != null) {\r\n            buttonWrapper.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {\r\n                title: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.calendarView'),\r\n                onclick: () => {\r\n                    this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView;\r\n                    this.refresh();\r\n                }\r\n            }, (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span.icon-calendar')));\r\n        }\r\n        if (this.datasource.canGetSummary) {\r\n            buttonWrapper.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {\r\n                title: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.graphView'),\r\n                onclick: () => {\r\n                    this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView;\r\n                    this.refresh();\r\n                }\r\n            }, (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span.icon-graph')));\r\n        }\r\n        this.pagination = new _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__.PaginationButtons();\r\n        this.pagination.onpageclick = (page) => {\r\n            this.start = page * this.limit;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.pagination);\r\n        this.dateInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {type: 'month', value: new Date().toISOString().substring(0, 7)});\r\n        this.dateInput.onchange = date => {\r\n            this.start = 0;\r\n            this.date = this.dateInput.value;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.dateInput);\r\n        this.filterShortContainer = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.filterShortContainer');\r\n        this.foot.append(this.filterShortContainer);\r\n        this.searchForm = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('form', {className: 'search'});\r\n        this.foot.append(this.searchForm);\r\n        this.searchForm.onsubmit = e => e.preventDefault();\r\n        const searchInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {\r\n            name: 'search',\r\n            type: 'search',\r\n            placeholder: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.search')\r\n        });\r\n        this.searchForm.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)(searchInput));\r\n        searchInput.oninput = e => {\r\n            this.start = 0;\r\n            this.refresh();\r\n        }\r\n\r\n    }\r\n\r\n    get search() {\r\n        if (!this.foot) return '';\r\n        const searchForm = this.foot.querySelector('.search');\r\n        if (!searchForm) return '';\r\n        return searchForm.search.value;\r\n    }\r\n\r\n    showGlobalContextMenu(e) {\r\n        let elements = [{\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.paginationMode'),\r\n            icon: 'icon-pagination',\r\n            onclick: () => {\r\n                this.changeInfiniteScrollEnabled(false);\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.scrollMode'),\r\n            icon: 'icon-scroll',\r\n            onclick: () => {\r\n                this.changeInfiniteScrollEnabled(true);\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.tableView'),\r\n            icon: 'icon-table',\r\n            onclick: () => {\r\n                this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.listView'),\r\n            icon: 'icon-list',\r\n            onclick: () => {\r\n                this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView;\r\n                this.refresh();\r\n            }\r\n        }];\r\n        if (this.dateRowCallback != null) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.calendarView'),\r\n                icon: 'icon-calendar',\r\n                onclick: () => {\r\n                    this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.datasource.canGetSummary) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.graphView'),\r\n                icon: 'icon-graph',\r\n                onclick: () => {\r\n                    this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.allowTableEdit) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.startMultiEdit'),\r\n                icon: 'icon-edit',\r\n                onclick: async () => {\r\n                    this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                    const getSelects = this.datasource.getSelects ? await this.datasource.getSelects(this) : null;\r\n                    this.refresh();\r\n                    this.insideView.startMultiEdit(getSelects);\r\n                }\r\n            });\r\n        }\r\n        _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__.ContextMenu.openContextMenu(e, elements);\r\n    }\r\n\r\n    resize() {\r\n        let limit = this.limit;\r\n        this.refreshLimit();\r\n        if (limit != this.limit) {\r\n            this.refresh();\r\n        }\r\n    }\r\n\r\n    multiEditChanged(id, data, save = false) {\r\n        this.datasource.multiEditChanged(id, data, save);\r\n    }\r\n\r\n    showConfigPopup() {\r\n        if (this.querySelector('config-popup')) {\r\n            this.querySelector('config-popup').remove()\r\n        } else {\r\n            const popup = new _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__.ConfigPopup(this)\r\n            this.append(popup)\r\n        }\r\n    }\r\n\r\n    gotoUrl(url) {\r\n        window.location.href = url;\r\n    }\r\n\r\n    onkeydown(e) {\r\n        if (e.ctrlKey) {\r\n            if (e.key == 'ArrowLeft' || e.key == 'ArrowRight') {\r\n                let page = Math.floor(this.start / this.limit);\r\n                page += (e.key == 'ArrowLeft' ? -1 : 1);\r\n                if (page < 0) page = 0;\r\n                else if (page > 0 && page > Math.ceil(this.total / this.limit) - 1) page = Math.ceil(this.total / this.limit) - 1;\r\n                this.start = page * this.limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n\r\n    reorderColumns(column, next) {\r\n        console.log('reorderColumns')\r\n        if (column) {\r\n            this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n            if (next)\r\n                this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n            else\r\n                this.columnsReordered.push(column)\r\n\r\n            this.columnsReorderedChanged = true;\r\n            if (this.insideView.setColumnsWidths) {\r\n                this.insideView.setColumnsWidths()\r\n            }\r\n        }\r\n    }\r\n}\r\n\r\ncustomElements\r\n    .define(\r\n        'data-view'\r\n        ,\r\n        ObjectsList\r\n    )\r\n;\r\n\n\n//# sourceURL=webpack://@green-code-studio/objects-list/./src/objectsList.js?");
 /***/ }),

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name": "@green-code-studio/objects-list",
-    "version": "1.14.0",
+    "version": "1.14.2",
     "main": "src/index.js",
     "author": "Mateusz Krawczyk",
     "license": "MIT",

package/src/objectsList.js CHANGED Viewed

@@ -331,12 +331,62 @@ export class ObjectsList extends HTMLElement {
         else return [];
     }
+    changeInfiniteScrollEnabled(isEnabled) {
+        this.infiniteScrollEnabled = isEnabled;
+        this.querySelector('button.paginationModeButton span').className = isEnabled ? 'icon-pagination' : 'icon-scroll';
+        this.refresh();
+    }
     initFoot() {
         this.foot = create('.foot');
         this.append(this.foot);
+        const buttonWrapper = create('.buttonWrapper');
+        this.foot.append(buttonWrapper);
         let menuButton = create('button.menuButton span.icon-settings');
-        this.foot.append(menuButton)
         menuButton.onclick = e => this.showConfigPopup();
+        buttonWrapper.append(menuButton);
+        let paginationModeButton = create('button.paginationModeButton', {
+            title: t('objectList.paginationMode'), onclick: e => {
+                this.changeInfiniteScrollEnabled(!this.infiniteScrollEnabled);
+            }
+        }, create(this.infiniteScrollEnabled ? 'span.icon-pagination' : 'span.icon-scroll'));
+        buttonWrapper.append(paginationModeButton);
+        buttonWrapper.append(create('button', {
+            title: t('objectList.tableView'),
+            onclick: () => {
+                this.insideViewClass = TableView;
+                this.refresh();
+            }
+        }, create('span.icon-table')));
+        buttonWrapper.append(create('button', {
+            title: t('objectList.listView'),
+            onclick: () => {
+                this.insideViewClass = ListView;
+                this.refresh();
+            }
+        }, create('span.icon-list')));
+        if (this.dateRowCallback != null) {
+            buttonWrapper.append(create('button', {
+                title: t('objectList.calendarView'),
+                onclick: () => {
+                    this.insideViewClass = CalendarView;
+                    this.refresh();
+                }
+            }, create('span.icon-calendar')));
+        }
+        if (this.datasource.canGetSummary) {
+            buttonWrapper.append(create('button', {
+                title: t('objectList.graphView'),
+                onclick: () => {
+                    this.insideViewClass = GraphView;
+                    this.refresh();
+                }
+            }, create('span.icon-graph')));
+        }
         this.pagination = new PaginationButtons();
         this.pagination.onpageclick = (page) => {
             this.start = page * this.limit;
@@ -380,15 +430,13 @@ export class ObjectsList extends HTMLElement {
             text: t('objectList.paginationMode'),
             icon: 'icon-pagination',
             onclick: () => {
-                this.infiniteScrollEnabled = false;
-                this.refresh();
+                this.changeInfiniteScrollEnabled(false);
             }
         }, {
             text: t('objectList.scrollMode'),
             icon: 'icon-scroll',
             onclick: () => {
-                this.infiniteScrollEnabled = true;
-                this.refresh();
+                this.changeInfiniteScrollEnabled(true);
             }
         }, {
             text: t('objectList.tableView'),
@@ -408,7 +456,7 @@ export class ObjectsList extends HTMLElement {
         if (this.dateRowCallback != null) {
             elements.push({
                 text: t('objectList.calendarView'),
-                 icon: 'icon-calendar',
+                icon: 'icon-calendar',
                 onclick: () => {
                     this.insideViewClass = CalendarView;
                     this.refresh();
@@ -418,7 +466,7 @@ export class ObjectsList extends HTMLElement {
         if (this.datasource.canGetSummary) {
             elements.push({
                 text: t('objectList.graphView'),
-                 icon: 'icon-graph',
+                icon: 'icon-graph',
                 onclick: () => {
                     this.insideViewClass = GraphView;
                     this.refresh();
@@ -431,7 +479,7 @@ export class ObjectsList extends HTMLElement {
                 icon: 'icon-edit',
                 onclick: async () => {
                     this.insideViewClass = TableView;
-                    const getSelects=datasource.getSelects?await datasource.getSelects(this):null;
+                    const getSelects = this.datasource.getSelects ? await this.datasource.getSelects(this) : null;
                     this.refresh();
                     this.insideView.startMultiEdit(getSelects);
                 }