Open vegarringdal opened 1 year ago
let pop: HTMLElement | null = null; const gridInterfaceEvents = { handleEvent: (e: any) => { console.log(e); if (pop) { pop.parentElement?.removeChild(pop); pop = null; } if (e.type === 'cell-focus-button-click' && e.data?.attribute === 'date1') { const cell = e.data.cell as HTMLCellElement; const rect = cell.getBoundingClientRect(); const element = document.createElement('simple-html-grid') as GridElement; const height = 300; const width = 500; let top = rect.bottom; let left = rect.left; if (window.innerHeight < rect.bottom + height) { top = rect.top - height - 3; } if (window.innerWidth < rect.right + width) { left = window.innerWidth - width - 3; } element.style.width = width + 'px'; element.style.height = height + 'px'; element.style.display = 'absolute'; element.style.top = top + 'px'; element.style.left = left + 'px'; element.style.boxShadow = '16px 17px 8px 0px rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%)'; const gridConfig: GridConfig = { panelHeight: 0, selectSizeHeight: 1, hideLabels: false, hideFilter: false, footerHeight: 10, columnsCenter: [{ width: width, rows: ['WOW'] }], attributes: [ { attribute: 'WOW', label: 'select cable' } ] }; const datasource = new Datasource(); for (let i = 0; i < 1000; i++) { datasource.setData([{ WOW: 'wow' + i }], true); } const gridInterface = new GridInterface(gridConfig, datasource); element.classList.add('simple-html-grid'); element.connectInterface(gridInterface); document.body.appendChild(element); pop = element; // set focus to first filter (element.getElementsByTagName('INPUT')[0] as HTMLInputElement)?.focus(); element.onclick = (x) => { if ((x.target as HTMLElement)?.classList.contains('simple-html-grid-cell-input')) { console.log(datasource.currentEntity); pop.parentElement?.removeChild(pop); pop = null; e.data.target?.focus(); } }; element.onkeydown = (x) => { if (x.code === 'Enter' && (x.target as HTMLElement)?.classList.contains('simple-html-grid-cell-input')) { console.log(datasource.currentEntity); pop.parentElement?.removeChild(pop); pop = null; e.data.target?.focus(); } }; } return true; // to keep subscribing } };