export class Dom { public static setFocusable ( element ) { element . tabIndex = 0 ; } public static setFocus ( element ) { element . tabIndex = 0 ; element . focus ( ) ; } public static clearFocus ( element ) { element . tabIndex = - 1 ; } public static getTabbableControls ( element ) { return element . querySelectorAll ( 'input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), object:not([disabled]), a:not([disabled]), area:not([disabled]), .link, div.sortable, [tabindex="0"]' ) ; } public static getTabbableControl ( element , excludedClassList ? ) { const controls = this . getTabbableControls ( element ) ; if ( controls . length !== 0 ) { if ( ! excludedClassList || excludedClassList . length === 0 ) { return < HTMLElement > controls [ 0 ] ; } else { for ( let i = 0 ; i < controls . length ; i ++ ) { const controlElement = < HTMLElement > controls [ i ] ; let excluded = false ; for ( let j = 0 ; j < excludedClassList . length ; j ++ ) { if ( controlElement . classList . contains ( excludedClassList [ j ] ) ) { excluded = true ; break ; } } if ( ! excluded ) { return controlElement ; } } } } return element ; } public static getElementCoordinates ( elem ) { const box = elem . getBoundingClientRect ( ) ; const body = document . body ; const docEl = document . documentElement ; const scrollTop = window . pageYOffset || docEl . scrollTop || body . scrollTop ; const scrollLeft = window . pageXOffset || docEl . scrollLeft || body . scrollLeft ; const clientTop = docEl . clientTop || body . clientTop || 0 ; const clientLeft = docEl . clientLeft || body . clientLeft || 0 ; const top = box . top + scrollTop - clientTop ; const left = box . left + scrollLeft - clientLeft ; return { top : Math . round ( top ) , left : Math . round ( left ) } ; } public static scrollIntoView ( elem , container ) { const viewBottom = container . scrollTop + container . clientHeight ; let elemCoordinates ; if ( container . tagName === 'BODY' ) { elemCoordinates = Dom . getElementCoordinates ( elem ) ; } else { elemCoordinates = { top : elem . offsetTop , } ; } if ( elemCoordinates . top + elem . clientHeight + 2 > viewBottom ) { if ( viewBottom + elem . clientHeight < elem . offsetTop ) { container . scrollTop = elem . offsetTop ; } else { container . scrollTop += elem . clientHeight + 1 ; } } else if ( elemCoordinates . top - 1 <= container . scrollTop ) { if ( container . scrollTop - elem . clientHeight > elem . offsetTop ) { container . scrollTop = elemCoordinates . top ; } else { container . scrollTop -= elem . clientHeight ; } } } }