fraport/fradrive-old
fraport/fradrive-old
Archived
3
1
Fork 0
Code Issues 65 Pull Requests 5 Actions Packages Projects Releases 197 Wiki Activity

chore(tooltips): implemented a library for frontend tooltips

Browse Source
This commit is contained in:
Johannes Eder 2021-09-28 17:29:21 +02:00
parent ce6f09dd85
commit ed752b01c0
2 changed files with 22 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
frontend/src/lib/tooltips/frontend-tooltips.js Normal file
View File

@ -0,0 +1,20 @@
export class FrontendTooltips {
static addToolTip(element, text) {
console.log('adding Tooltip');
let tooltipWrap = document.createElement('span');
tooltipWrap.className = 'tooltip';
let tooltipContent = document.createElement('span');
tooltipContent.className = 'tooltip__content';
tooltipContent.appendChild(document.createTextNode(text));
tooltipWrap.append(tooltipContent);
let tooltipHandle = document.createElement('span');
tooltipHandle.className = 'tooltip__handle';
tooltipWrap.append(tooltipHandle);
let firstChild = element.firstChild;
firstChild.parentNode.insertBefore(tooltipWrap, firstChild);
}
}

21
frontend/src/utils/inputs/checkrange.js
View File

@ -1,5 +1,6 @@
import { Utility } from '../../core/utility';
import { TableIndices } from '../../lib/table/table';
import { FrontendTooltips } from '../../lib/tooltips/frontend-tooltips';
const CHECKRANGE_INITIALIZED_CLASS = 'checkrange--initialized';
@ -38,7 +39,7 @@ export class CheckRange {
_setUpShiftClickOnColumn(columnId) {
let column = this._columns[columnId];
this._addToolTip(column[0]);
FrontendTooltips.addToolTip(column[0], 'Shift Click to mark multiple cells');
column.forEach(el => el.addEventListener('click', (ev) => {
if(ev.shiftKey && this.lastCheckedCell !== null) {
@ -54,24 +55,6 @@ export class CheckRange {
}));
}
_addToolTip(cell){
console.log('adding Tooltip');
let tooltipWrap = document.createElement('span');
tooltipWrap.className = 'tooltip';
let tooltipContent = document.createElement('span');
tooltipContent.className = 'tooltip__content';
tooltipContent.appendChild(document.createTextNode('Shift Click to mark multiple cells.'));
tooltipWrap.append(tooltipContent);
let tooltipHandle = document.createElement('span');
tooltipHandle.className = 'tooltip__handle';
tooltipWrap.append(tooltipHandle);
let firstChild = cell.firstChild;
firstChild.parentNode.insertBefore(tooltipWrap, firstChild);
}
_checkMultipleCells(firstRowIndex, lastRowIndex, columnId) {
for(let i=firstRowIndex; i<=lastRowIndex; i++) {
let cell = this._columns[columnId][i];