2022-09-09 17:11:23 +00:00
/*EFY UI 2022.09.08*/ let e$ = document . querySelector . bind ( document ) , e$all = document . querySelectorAll . bind ( document ) , e$create = document . createElement . bind ( document ) , e$body , e$root ; window . onload = async ( ) => { e$root = e$ ( ":root" ) , e$body = e$ ( "body" ) ;
2022-09-05 18:05:42 +00:00
/*Check LocalStorage*/ try { let x = 'LS' ; localStorage . setItem ( x , x ) ; let y = localStorage . getItem ( x ) ; localStorage . removeItem ( x ) ; if ( x !== y ) { throw new Error ( ) ; } } catch ( exception ) { e$ ( 'body' ) . innerHTML = ` <div efy_alert style="background: #eee"><div><h6><a>EFY</a> - Your browser blocks LocalStorage</h6><p>You can block 3rd party cookies, no worries, Privacy matters! But please allow 1st party cookies in your browser's settings. EFY<b>doesn't</b> use cookies or track you, but the settings related to LocalStorage are grouped as "cookies", although different. Have fun! 🥳</p></div></div> ` }
/*Add Sidebar*/ e$ ( 'body' ) . insertAdjacentHTML ( 'beforeend' , `
< div class = "efy_sidebar" id = "efy_sidebar" efy _search = "details:not(.efy_quick_shortcuts, [efy_logo]), #efy_sidebar [efy_tabs] > *" > < details efy _logo efy _help > < summary > < a href = "https://efy.ooo" > EFY < / a > U I < / s u m m a r y > T h i s p a g e u s e s < a h r e f = " h t t p s : / / e f y . o o o / u i " > E F Y U I < / a > , a c u s t o m i s a b l e , c o n v e r g e n t , t r a n s p a r e n t , m o d u l a r , f u t u r i s t i c c s s / j s f r a m e w o r k t h a t c a n b e a d d e d t o y o u r o w n w e b / l o c a l a p p s & w e b s i t e s . < b r / > < b r / > I f y o u ' d l i k e t o l e a r n h o w i t w o r k s o r s u p p o r t t h e p r o j e c t , c h e c k i t o u t h e r e : < a h r e f = " h t t p s : / / e f y . o o o / u i " > h t t p s : / / e f y . o o o / u i < / a > < / d e t a i l s > < d i v e f y _ s i d e b a r _ b t n _ c l o s e > < / d i v >
< details class = "efy_quick_shortcuts" > < summary > < i efy _icon = "star" > < / i > Q u i c k S h o r t c u t s < / s u m m a r y >
< div class = "efy_quick_buttons" >
< button class = "efy_quick_search" > < i efy _icon = "search" > < / i > < / b u t t o n >
< button class = "efy_quick_reload" > < i efy _icon = "reload" > < / i > < / b u t t o n >
< button class = "efy_quick_fullscreen" > < i efy _icon = "fullscreen" > < / i > < / b u t t o n >
< button class = "efy_quick_back" > < i efy _icon = "chevron" > < / i > < / b u t t o n >
< button class = "efy_quick_forward" > < i efy _icon = "chevron" > < / i > < / b u t t o n >
< input type = "text" efy _search _input efy _display _none placeholder = "Search through menu..." / > < / d i v >
< div efy _clock > < / d i v >
< div efy _timer = "efy_ui0" > < / d i v >
< / d e t a i l s >
< details open > < summary > < i efy _icon = "star" > < / i > T h e m e < / s u m m a r y >
< div efy _tabs = "efyui_0" >
< button efy _tab = "mode" efy _active > Mode < / b u t t o n >
< button efy _tab = "colors" > Colors < / b u t t o n >
< button efy _tab = "images" > Images < / b u t t o n >
< button efy _tab = "border" > Border < / b u t t o n >
< div efy _content = "mode" efy _active efy _select id = "efy_theme" >
< input type = "radio" name = "efy_theme" id = "default_mode" > < label for = "default_mode" > Default < / l a b e l >
< input type = "radio" name = "efy_theme" id = "light_light" > < label for = "light_light" > Light < / l a b e l >
< input type = "radio" name = "efy_theme" id = "light_sepia" > < label for = "light_sepia" > Sepia < / l a b e l >
< input type = "radio" name = "efy_theme" id = "dark_dark" > < label for = "dark_dark" > Dark < / l a b e l >
< input type = "radio" name = "efy_theme" id = "dark_nord" > < label for = "dark_nord" > Nord < / l a b e l >
< input type = "radio" name = "efy_theme" id = "dark_black" > < label for = "dark_black" > Black < / l a b e l >
< details efy _help > < summary > Transparency < / s u m m a r y > I f y o u r o p e r a t i n g s y s t e m o r w i n d o w m a n a g e r s u p p o r t s t r a n s p a r e n c y , t h e b a c k g r o u n d b e c o m e s t r a n s p a r e n t . O t h e r w i s e j u s t i m p o r t y o u r o w n i m a g e s a n d t u r n t h i s o n . < / d e t a i l s >
< input type = "radio" name = "efy_theme" id = "light_trans" > < label for = "light_trans" > Light < / l a b e l >
< input type = "radio" name = "efy_theme" id = "dark_trans" > < label for = "dark_trans" > Dark < / l a b e l >
< / d i v >
< div efy _content = "colors" efy _select >
< label for = "efy_color1" > Color 1 < input id = "efy_color1" type = "color" value = "#77aa00" > < / l a b e l >
< label for = "efy_color2" > Color 2 < input id = "efy_color2" type = "color" value = "#ffcc00" > < / l a b e l >
< details efy _help > < summary > Custom Colors < / s u m m a r y > T h e s e c o l o r s o v e r r i d e t h e d e f a u l t o n e s < / d e t a i l s >
< label for = "efy_color_text" > Text < input id = "efy_color_text" type = "color" value = "#555555" > < / l a b e l >
< input name = "efy_text_color_status" id = "efy_text_status" type = "checkbox" > < label for = "efy_text_status" > On / Off < /label><br / >
< label for = "efy_color_bgcol" > Background < input id = "efy_color_bgcol" type = "color" value = "#555555" > < / l a b e l >
< input name = "efy_bgcol_color_status" id = "efy_bgcol_status" type = "checkbox" > < label for = "efy_bgcol_status" > On / Off < / l a b e l >
< / d i v >
< div efy _content = "images" class = "efy_custom_bgimage" >
< input type = "file" id = "pictureTest" accept = "image/*" >
< div class = "efy_img_previews" > < / d i v >
< details efy _help > < summary > Warning ! Bigger = Slower < /summary>Keep them bellow 1MB per image, unless your device has a powerful CPU / GPU . You can also convert png , jpg etc to webp to reduce the size < / d e t a i l s >
< button class = "efy_idb_reset" type = "reset" > < i efy _icon = "reload" > < / i > R e s e t < / b u t t o n >
< / d i v >
< div efy _content = "border" efy _select >
< p > Radius < / p > < d i v c l a s s = " e f y _ s i d e b a r _ r a n g e " > < / d i v >
< input class = "efy_sidebar_selectRadius" type = "range" min = "0" max = "25" value = "12" step = "1" >
< / d i v >
< / d i v >
< / d e t a i l s >
< details efy _select > < summary > < i efy _icon = "dots" > < / i > V i s u a l F i l t e r s < / s u m m a r y >
< div efy _tabs = "efyui_filters" >
< button efy _tab = "bg" efy _active > Background < / b u t t o n >
< button efy _tab = "content" > Content < / b u t t o n >
< button efy _tab = "trans" > Trans Elements < / b u t t o n >
< div efy _content = "bg" efy _active efy _select id = "efy_theme" > < / d i v >
< div efy _content = "content" efy _select id = "efy_theme" > < / d i v >
< div efy _content = "trans" efy _select id = "efy_theme" > < / d i v >
< / d e t a i l s >
< details > < summary > < i efy _icon = "arrow_down" > < / i > S a v e & R e s t o r e < / s u m m a r y >
< p > EFY Settings < / p >
< a href = "#" class = "efy_localStorage_export" download = "efy_preferences.json" > < button > < i efy _icon = "arrow_down" > < / i > S a v e < / b u t t o n > < / a >
< button class = "efy_localstorage_reset" type = "reset" > < i efy _icon = "reload" > < / i > R e s e t < / b u t t o n >
< input type = "file" class = "efy_localstorage_import" accept = ".json" / >
< p > EFY Images < / p >
< a href = "#" class = "efy_idb_export" download = "efy_images.json" > < button > < i efy _icon = "arrow_down" > < / i > S a v e < / b u t t o n > < / a >
< button class = "efy_idb_reset" type = "reset" > < i efy _icon = "reload" > < / i > R e s e t < / b u t t o n >
< input type = "file" class = "efy_idb_import" accept = ".json" / >
< / d e t a i l s >
< details efy _select id = "efy_accessibility" > < summary > < i efy _icon = "accessibility" > < / i > A c c e s s i b i l i t y ( B e t a ) < / s u m m a r y >
< details efy _select id = "efy_btn_align" > < summary > Menu Button Position < / s u m m a r y > < d i v > < / d i v > < / d e t a i l s >
< details efy _select > < summary > Text Size < / s u m m a r y >
< form class = "efy_text_accessibility" > < button type = "reset" > < i efy _icon = "reload" > < / i > R e s e t < / b u t t o n >
< p > Zoom < / p > < i n p u t c l a s s = " e f y _ u i _ z o o m " t y p e = " r a n g e " m i n = " 1 " m a x = " 2 " v a l u e = " 1 " s t e p = " 0 . 0 1 " >
< p > Text Spacing < / p > < i n p u t c l a s s = " e f y _ t e x t _ s p a c i n g " t y p e = " r a n g e " m i n = " 0 " m a x = " 1 5 " v a l u e = " 0 " s t e p = " 1 " >
< / f o r m >
< / d e t a i l s >
< input type = "checkbox" name = "efy_accessibility" id = "efy_outline" > < label for = "efy_outline" > Focus Outline < / l a b e l >
< input type = "checkbox" name = "efy_accessibility" id = "efy_cursor" > < label for = "efy_cursor" > Custom Cursor ( hidden on touchscreen ) < / l a b e l >
< / d e t a i l s >
< details efy _select id = "efy_audio" > < summary > < i efy _icon = "audio" > < / i > A u d i o E f f e c t s ( B e t a ) < / s u m m a r y >
< input type = "checkbox" name = "efy_audio" id = "efy_audio_status" > < label for = "efy_audio_status" > On / Off < / l a b e l >
< input type = "checkbox" name = "efy_audio" id = "efy_audio_click" > < label for = "efy_audio_click" > Click & Tap < / l a b e l >
< input type = "checkbox" name = "efy_audio" id = "efy_audio_hover" > < label for = "efy_audio_hover" > Mouse Hover < / l a b e l >
< p > You might have to click / tap on the ssl / lock icon on your browser & allow sounds , to hear them automatically . < / p >
< / d e t a i l s >
< / d i v > < d i v e f y _ s i d e b a r _ b t n _ o p e n > < / d i v >
< div efy _cursor > < / d i v >
` );
/*Filters*/ e$all ( '[efy_tabs=efyui_filters] [efy_content]' ) . forEach ( y => { let x = y . getAttribute ( 'efy_content' ) ; y . insertAdjacentHTML ( 'beforeend' ,
` <form class="efy_ ${ x } _filter"><button type="reset"><i efy_icon="reload"></i>Reset</button>
< p > Brightness < / p > < i n p u t c l a s s = " e f y _ $ { x } _ b r i g h t n e s s " t y p e = " r a n g e " m i n = " 0 " m a x = " 3 " v a l u e = " 1 " s t e p = " 0 . 1 " >
< p > Blur < / p > < i n p u t c l a s s = " e f y _ $ { x } _ b l u r " t y p e = " r a n g e " m i n = " 0 " m a x = " 1 0 0 " v a l u e = " 0 " s t e p = " 1 " >
< p > Saturation < / p > < i n p u t c l a s s = " e f y _ $ { x } _ s a t u r a t e " t y p e = " r a n g e " m i n = " 0 " m a x = " 3 " v a l u e = " 1 " s t e p = " 0 . 1 " >
< p > Contrast < / p > < i n p u t c l a s s = " e f y _ $ { x } _ c o n t r a s t " t y p e = " r a n g e " m i n = " 0 . 1 " m a x = " 3 " v a l u e = " 1 " s t e p = " 0 . 1 " >
< p > Hue < / p > < i n p u t c l a s s = " e f y _ $ { x } _ h u e - r o t a t e " t y p e = " r a n g e " m i n = " 0 " m a x = " 3 6 0 " v a l u e = " 0 " s t e p = " 1 " >
< p > Sepia < / p > < i n p u t c l a s s = " e f y _ $ { x } _ s e p i a " t y p e = " r a n g e " m i n = " 0 " m a x = " 1 " v a l u e = " 0 " s t e p = " 0 . 1 " >
< / f o r m > ` ) } ) ;
/*Sidebar Button Position*/ let efy _btn _pos = e$ ( '#efy_btn_align div' ) ; [ 'left_top' , 'middle_top' , 'right_top' , 'left_middle' , 'middle_middle' , 'right_middle' , 'left_bottom' , 'middle_bottom' , 'right_bottom' ] . forEach ( x => { efy _btn _pos . insertAdjacentHTML ( 'beforeend' , ` <input type="radio" name="efy_btn_align" id=" ${ x } "> ` ) } ) ; e$ ( '#middle_middle[name=efy_btn_align]' ) . setAttribute ( 'disabled' , '1' ) ;
/*Theme*/ if ( localStorage . efy _theme ) { e$root . setAttribute ( "efy_theme" , localStorage . efy _theme ) ; e$ ( "#" + localStorage . efy _theme ) . setAttribute ( "checked" , "1" ) }
else { e$root . setAttribute ( 'efy_theme' , 'default_mode' ) ; e$ ( "#default_mode" ) . setAttribute ( "checked" , "1" ) }
e$all ( "[name=efy_theme]" ) . forEach ( x => { x . onclick = ( ) => { e$root . setAttribute ( "efy_theme" , x . id ) ; localStorage . efy _theme = x . id ; } ; } ) ;
/*Colors*/ let efy _color = { 'color1' : 'efy_color' , 'color2' : 'efy_color2' , 'color_text' : 'efy_text' , 'color_bgcol' : 'efy_bgcol' } , rgb2hex = c => "#" + c . match ( /\d+/g ) . map ( x => ( + x ) . toString ( 16 ) . padStart ( 2 , 0 ) ) . join ` ` ;
Object . keys ( efy _color ) . forEach ( z => { e$ ( ` #efy_ ${ z } ` ) . oninput = ev => {
let x = ev . target . value , r = parseInt ( x . substr ( 1 , 2 ) , 16 ) , g = parseInt ( x . substr ( 3 , 2 ) , 16 ) , b = parseInt ( x . substr ( 5 , 2 ) , 16 ) ; x = ` ${ r } , ${ g } , ${ b } ` ; localStorage . setItem ( efy _color [ z ] , x ) ; e$root . style . setProperty ( ` --efy_ ${ z } _var ` , x ) ; }
let y = getComputedStyle ( e$root ) . getPropertyValue ( ` --efy_ ${ z } _var ` ) ;
if ( localStorage . getItem ( efy _color [ z ] ) ) { y = localStorage . getItem ( efy _color [ z ] ) ; e$root . style . setProperty ( ` --efy_ ${ z } _var ` , y ) }
e$ ( ` #efy_ ${ z } ` ) . value = rgb2hex ( "rgb(" + y + ")" ) ; } ) ;
/*Radius*/ let efy _radius _input = e$ ( ".efy_sidebar_selectRadius" ) , efy _sidebar _range = e$ ( ".efy_sidebar_range" ) ;
// efy_radius_steps = (efy_radius_input.max - efy_radius_input.min) , - use this instead of width // efy_radius = localStorage.efy_radius;
async function efy _radius _fn ( ) { let x , radius = localStorage . efy _radius ; if ( radius ) { x = radius . replace ( 'rem' , '' ) ; efy _radius _input . value = x ; e$root . style . setProperty ( "--efy_radius" , radius ) ; } else { x = 12 ; }
/*Radius: Input*/ e$ ( '[efy_tabs=efyui_0] [efy_tab="border"]' ) . addEventListener ( 'pointerup' , ( ) => { setTimeout ( ( ) => { let za = e$ ( '.efy_sidebar_selectRadius' ) , z = getComputedStyle ( za ) . getPropertyValue ( 'width' ) . replace ( 'px' , '' ) ; efy _sidebar _range . innerText = x ; efy _sidebar _range . style . left = ( x * ( z - 32 ) / efy _radius _input . max ) + 'rem' ; } , 100 ) ; } , { once : true } ) ; } efy _radius _fn ( ) ;
efy _radius _input . oninput = ( ) => { let za = e$ ( '.efy_sidebar_selectRadius' ) , z = getComputedStyle ( za ) . getPropertyValue ( 'width' ) . replace ( 'px' , '' ) , x = efy _radius _input . value ; e$root . style . setProperty ( "--efy_radius" , x + "rem" ) ; localStorage . efy _radius = x + "rem" ; efy _sidebar _range . style . left = ( x * ( z - 32 ) / efy _radius _input . max ) + 'rem' ; efy _sidebar _range . innerText = x ; } ;
/*Radius: Window Resize*/ window . addEventListener ( 'resize' , ( ) => { let za = e$ ( '.efy_sidebar_selectRadius' ) , z = getComputedStyle ( za ) . getPropertyValue ( 'width' ) . replace ( 'px' , '' ) , x = efy _radius _input . value ; efy _sidebar _range . style . left = ( x * ( z - 32 ) / efy _radius _input . max ) + 'rem' ; } ) ;
/*EFY Button Position*/ if ( localStorage . efy _btn _align ) { e$ ( "#" + localStorage . efy _btn _align ) . setAttribute ( "checked" , "1" ) ; e$ ( "[efy_sidebar_btn_open]" ) . setAttribute ( "efy_btn_align" , localStorage . efy _btn _align ) ; } else { let y = getComputedStyle ( e$root ) . getPropertyValue ( '--efy_sidebar_button' ) . replace ( ' ' , '' ) ;
e$ ( '#' + y ) . setAttribute ( "checked" , "1" ) ; e$ ( '[efy_sidebar_btn_open]' ) . setAttribute ( 'efy_btn_align' , y ) ; }
e$all ( "[name=efy_btn_align]" ) . forEach ( x => { x . onclick = ( ) => { e$ ( "[efy_sidebar_btn_open]" ) . setAttribute ( "efy_btn_align" , x . id ) ; localStorage . efy _btn _align = x . id ; } ; } ) ;
/*BgImg Filter*/ let efy _bg _filter = { } , efy _css _bg _filter = e$create ( "style" ) ; efy _css _bg _filter . classList . add ( "efy_css_bg_filter" ) ; document . head . appendChild ( efy _css _bg _filter ) ; async function efy _bg _filter _fn ( ) {
[ 'blur' , 'brightness' , 'saturate' , 'contrast' , 'hue-rotate' , 'sepia' ] . forEach ( x => { efy _bg _filter [ x ] = e$ ( ` .efy_bg_ ${ x } ` ) . value ; if ( x == 'blur' ) { efy _bg _filter [ x ] = efy _bg _filter [ x ] + 'px' } else if ( x == 'hue-rotate' ) { efy _bg _filter [ x ] = efy _bg _filter [ x ] + 'deg' } } ) ;
let string = '' ; Object . keys ( efy _bg _filter ) . forEach ( x => { string = string + ` ${ x } ( ${ efy _bg _filter [ x ] } ) ` } ) ;
let y = ` html:before, html:after {filter: ${ string } !important} ` ;
efy _css _bg _filter . innerHTML = y ; localStorage . efy _bg _filter = JSON . stringify ( efy _bg _filter ) ; localStorage . efy _bg _filter _css = y }
if ( localStorage . efy _bg _filter ) { efy _css _bg _filter . innerHTML = localStorage . efy _bg _filter _css ; let efy _bg _filter = JSON . parse ( localStorage . efy _bg _filter ) ; Object . keys ( efy _bg _filter ) . forEach ( x => e$ ( ` .efy_bg_ ${ x } ` ) . value = efy _bg _filter [ x ] . replace ( 'px' , '' ) . replace ( 'deg' , '' ) ) }
e$all ( '.efy_bg_filter input' ) . forEach ( x => { x . addEventListener ( "input" , ( ) => { efy _bg _filter _fn ( ) } ) } ) ;
e$all ( '.efy_bg_filter [type=reset]' ) . forEach ( x => { x . addEventListener ( "pointerup" , ( ) => { efy _bg _filter _fn ( ) ; localStorage . removeItem ( 'efy_bg_filter' ) ; localStorage . removeItem ( 'efy_bg_filter_css' ) ; efy _css _bg _filter . innerHTML = '' } ) } ) ;
/*Content Filter*/ let efy _content _filter = { } , efy _css _content _filter = e$create ( "style" ) ; efy _css _content _filter . classList . add ( "efy_css_content_filter" ) ; document . head . appendChild ( efy _css _content _filter ) ; async function efy _content _filter _fn ( ) {
[ 'blur' , 'brightness' , 'saturate' , 'contrast' , 'hue-rotate' , 'sepia' ] . forEach ( x => { efy _content _filter [ x ] = e$ ( ` .efy_content_ ${ x } ` ) . value ; if ( x == 'blur' ) { efy _content _filter [ x ] = efy _content _filter [ x ] + 'px' } else if ( x == 'hue-rotate' ) { efy _content _filter [ x ] = efy _content _filter [ x ] + 'deg' } } ) ;
let string = '' ; Object . keys ( efy _content _filter ) . forEach ( x => { string = string + ` ${ x } ( ${ efy _content _filter [ x ] } ) ` } ) ;
let y = ` img, video {filter: ${ string } !important} ` ;
efy _css _content _filter . innerHTML = y ; localStorage . efy _content _filter = JSON . stringify ( efy _content _filter ) ; localStorage . efy _content _filter _css = y }
if ( localStorage . efy _content _filter ) { efy _css _content _filter . innerHTML = localStorage . efy _content _filter _css ; let efy _content _filter = JSON . parse ( localStorage . efy _content _filter ) ; Object . keys ( efy _content _filter ) . forEach ( x => e$ ( ` .efy_content_ ${ x } ` ) . value = efy _content _filter [ x ] . replace ( 'px' , '' ) . replace ( 'deg' , '' ) ) }
e$all ( '.efy_content_filter input' ) . forEach ( x => { x . addEventListener ( "input" , ( ) => { efy _content _filter _fn ( ) } ) } ) ;
e$all ( '.efy_content_filter [type=reset]' ) . forEach ( x => { x . addEventListener ( "pointerup" , ( ) => { efy _content _filter _fn ( ) ; localStorage . removeItem ( 'efy_content_filter' ) ; localStorage . removeItem ( 'efy_content_filter_css' ) ; efy _css _content _filter . innerHTML = '' } ) } ) ;
/*Trans Filter*/ let efy _trans _filter = { } , efy _css _trans _filter = e$create ( "style" ) ; efy _css _trans _filter . classList . add ( "efy_css_trans_filter" ) ; document . head . appendChild ( efy _css _trans _filter ) ; async function efy _trans _filter _fn ( ) {
[ 'blur' , 'brightness' , 'saturate' , 'contrast' , 'hue-rotate' , 'sepia' ] . forEach ( x => { efy _trans _filter [ x ] = e$ ( ` .efy_trans_ ${ x } ` ) . value ; if ( x == 'blur' ) { efy _trans _filter [ x ] = efy _trans _filter [ x ] + 'px' } else if ( x == 'hue-rotate' ) { efy _trans _filter [ x ] = efy _trans _filter [ x ] + 'deg' } } ) ;
let string = '' ; Object . keys ( efy _trans _filter ) . forEach ( x => { string = string + ` ${ x } ( ${ efy _trans _filter [ x ] } ) ` } ) ;
let y = ` details:not([efy_help]), select, input, textarea, blockquote, pre, article, table, [efy_tabs] [efy_content], [efy_timer], [efy_clock] {backdrop-filter: ${ string } !important} ` ;
efy _css _trans _filter . innerHTML = y ; localStorage . efy _trans _filter = JSON . stringify ( efy _trans _filter ) ; localStorage . efy _trans _filter _css = y }
if ( localStorage . efy _trans _filter ) { efy _css _trans _filter . innerHTML = localStorage . efy _trans _filter _css ; let efy _trans _filter = JSON . parse ( localStorage . efy _trans _filter ) ; Object . keys ( efy _trans _filter ) . forEach ( x => e$ ( ` .efy_trans_ ${ x } ` ) . value = efy _trans _filter [ x ] . replace ( 'px' , '' ) . replace ( 'deg' , '' ) ) }
e$all ( '.efy_trans_filter input' ) . forEach ( x => { x . addEventListener ( "input" , ( ) => { efy _trans _filter _fn ( ) } ) } ) ;
e$all ( '.efy_trans_filter [type=reset]' ) . forEach ( x => { x . addEventListener ( "pointerup" , ( ) => { efy _trans _filter _fn ( ) ; localStorage . removeItem ( 'efy_trans_filter' ) ; localStorage . removeItem ( 'efy_trans_filter_css' ) ; efy _css _trans _filter . innerHTML = '' } ) } ) ;
/* Text Size*/ let efy _text _accessibility = e$create ( "style" ) ; efy _text _accessibility . classList . add ( "efy_text_accessibility" ) ; document . head . appendChild ( efy _text _accessibility ) ; e$all ( '.efy_text_accessibility input' ) . forEach ( x => x . oninput = ( ) => { efy _text _accessibility . innerHTML = ` :root {--efy_font_size: ${ e$ ( '.efy_ui_zoom' ) . value } px!important;} html {letter-spacing: ${ e$ ( '.efy_text_spacing' ) . value } px!important;} ` ; } ) ;
/*Checkbox Toggles*/ [ "efy_audio_status" , "efy_audio_click" , "efy_audio_hover" , "efy_outline" , 'efy_cursor' , 'efy_text_status' , 'efy_bgcol_status' ] . forEach ( x => { if ( localStorage . getItem ( x ) == "on" ) { e$ ( "#" + x ) . setAttribute ( "checked" , "1" ) ; } e$ ( "#" + x ) . onclick = ( ) => { if ( localStorage . getItem ( x ) == "on" ) { localStorage . setItem ( x , "off" ) ; } else { localStorage . setItem ( x , "on" ) ; } } ; } ) ;
/*Focus Outline*/ if ( localStorage . efy _outline == 'on' ) { e$root . setAttribute ( 'efy_outline' , '1' ) ; } e$ ( '#efy_outline' ) . onchange = ( ) => { e$root . toggleAttribute ( 'efy_outline' ) }
/*Cursor*/ if ( localStorage . efy _cursor == 'on' ) { e$root . setAttribute ( 'efy_cursor_on' , '1' ) ; } e$ ( '#efy_cursor' ) . onchange = ( ) => { e$root . toggleAttribute ( 'efy_cursor_on' ) }
/*Custom Text Color*/ if ( localStorage . efy _text _status == 'on' ) { e$root . setAttribute ( 'efy_color_text' , '1' ) } e$ ( '#efy_text_status' ) . onchange = ( ) => { e$root . toggleAttribute ( 'efy_color_text' ) }
/*Custom BG Color*/ if ( localStorage . efy _bgcol _status == 'on' ) { e$root . setAttribute ( 'efy_color_bgcol' , '1' ) } e$ ( '#efy_bgcol_status' ) . onchange = ( ) => { e$root . toggleAttribute ( 'efy_color_bgcol' ) }
/*EFY Menu Toggles*/ e$body . addEventListener ( "click" , ( ) => { if ( event . target . matches ( '[efy_sidebar_btn_open]' ) ) {
e$ ( "[efy_sidebar_btn_open]:not([efy_sidebar_btn_open=relative])" ) . style . display = "none" ;
e$ ( "[efy_sidebar_btn_close]" ) . style . display = "block" ;
e$ ( ".efy_sidebar" ) . classList . toggle ( "efy_toggle_efy_sidebar_panel" ) ;
e$ ( "body" ) . classList . toggle ( "efy_toggle_efy_sidebar" ) ;
} } ) ;
/*Close*/ e$ ( "[efy_sidebar_btn_close]" ) . onclick = ( ) => { e$ ( ".efy_sidebar" ) . classList . toggle ( "efy_toggle_efy_sidebar_panel" ) ; e$ ( "body" ) . classList . toggle ( "efy_toggle_efy_sidebar" ) ; e$ ( "[efy_sidebar_btn_open]:not([efy_sidebar_btn_open=relative])" ) . style . display = "block" ; e$ ( "[efy_sidebar_btn_close]" ) . style . display = "none" ; } ;
/*Change bg image*/ let efy _css _bgimg = e$create ( "style" ) ; efy _css _bgimg . classList . add ( "efy_css_bgimg" ) ; document . head . appendChild ( efy _css _bgimg ) ;
/*Background image*/ let db ; e$ ( "#pictureTest" ) . addEventListener ( "change" , efy _add _bgimg ) ;
let request = indexedDB . open ( 'efy' ) ;
request . onerror = ( ) => console . error ( "efy: Can't open db" ) ;
request . onsuccess = e => ( db = e . target . result ) ;
request . onupgradeneeded = e => { let db = e . target . result ; db . createObjectStore ( "images" , { keyPath : "id" , autoIncrement : true } ) ; db . createObjectStore ( "settings" , { keyPath : "id" , autoIncrement : true } ) ; } ;
async function efy _add _bgimg ( e ) { let reader = new FileReader ( ) ; reader . readAsDataURL ( e . target . files [ 0 ] ) ; reader . onload = e => { let ob = { data : e . target . result } ;
db . transaction ( [ "images" ] , "readwrite" ) . objectStore ( "images" ) . add ( ob ) . onerror = e => { console . error ( e ) ; } ;
async function efy _bg _update _fn2 ( ) { let request2 = indexedDB . open ( 'efy' ) ;
request2 . onsuccess = ( ) => { let efy _count _img2 = 0 , transaction2 = request2 . result . transaction ( [ "images" ] , "readonly" ) , invoiceStore2 = transaction2 . objectStore ( "images" ) , getCursorRequest2 = invoiceStore2 . openCursor ( ) ;
getCursorRequest2 . onerror = ( ) => console . error ( "efy: no db entries" ) ;
getCursorRequest2 . onsuccess = e => { let cursor2 = e . target . result ;
if ( cursor2 ) { efy _count _img2 ++ ; cursor2 . continue ( ) ; }
else { /*Set bgimg nr*/ localStorage . efy _bg _nr = efy _count _img2 ;
/*Add Preview*/ let efy _bg _item2 = e$create ( "div" ) ; efy _bg _item2 . style . background = 'url(' + reader . result + ')' ; efy _bg _item2 . setAttribute ( "efy_bg_nr" , efy _count _img2 ) ; e$ ( ".efy_img_previews" ) . appendChild ( efy _bg _item2 ) ; e$all ( '.efy_img_previews [efy_bg_nr]' ) . forEach ( z => z . removeAttribute ( 'efy_active' ) ) ;
/*Restore Background*/ efy _css _bgimg . innerHTML = ` html:before, html:after {background: url( ${ reader . result } )!important; background-size: cover!important} html {background: var(--efy_text2)!important} ` ; e$ ( '.efy_img_previews [efy_bg_nr="' + efy _count _img2 + '"]' ) . setAttribute ( 'efy_active' , 1 ) ;
/*Preview Click*/ let y = e$ ( '.efy_img_previews [efy_bg_nr="' + efy _count _img2 + '"]' ) ; y . onclick = ( ) => { efy _css _bgimg . innerHTML = ` html:before, html:after {background: url( ${ reader . result } )!important; background-size: cover!important} html {background: var(--efy_text2)!important} ` ; localStorage . efy _bg _nr = efy _count _img2 ; e$all ( '.efy_img_previews [efy_bg_nr]' ) . forEach ( z => z . removeAttribute ( 'efy_active' ) ) ; y . setAttribute ( 'efy_active' , 1 ) ; } ;
}
} ; } ;
} efy _bg _update _fn2 ( ) ;
} ; }
/*Count images*/ async function efy _bg _update _fn ( ) { request = indexedDB . open ( 'efy' ) ;
request . onsuccess = ( ) => { let efy _count _img = 0 , transaction = request . result . transaction ( [ "images" ] , "readonly" ) , invoiceStore = transaction . objectStore ( "images" ) , getCursorRequest = invoiceStore . openCursor ( ) ;
getCursorRequest . onerror = ( ) => console . error ( "efy: no db entries" ) ;
getCursorRequest . onsuccess = e => { let cursor = e . target . result ;
if ( cursor ) { efy _count _img ++ ; let req = invoiceStore . get ( efy _count _img ) ;
req . onsuccess = e => { let x = e . target . result . data ;
/*Preview Click*/ let efy _bg _item = e$create ( "div" ) ; efy _bg _item . style . background = 'url(' + x + ')' ; efy _bg _item . setAttribute ( "efy_bg_nr" , efy _count _img ) ; e$ ( ".efy_img_previews" ) . appendChild ( efy _bg _item ) ; let y = e$ ( '.efy_img_previews [efy_bg_nr="' + efy _count _img + '"]' ) ; y . onclick = ( ) => { efy _css _bgimg . innerHTML = ` html:before, html:after {background: url( ${ x } )!important; background-size: cover!important} html {background: var(--efy_text2)!important; background-size: cover!important} ` ; localStorage . efy _bg _nr = e . target . result . id ; e$all ( '.efy_img_previews [efy_bg_nr]' ) . forEach ( z => z . removeAttribute ( 'efy_active' ) ) ; y . setAttribute ( 'efy_active' , 1 ) ; } ;
} ; cursor . continue ( ) ;
} else { /*Check bgimg number*/ let bgnr ; if ( localStorage . efy _bg _nr ) { bgnr = JSON . parse ( localStorage . efy _bg _nr ) ; } else { bgnr = 1 ; }
/*Restore Background*/ if ( efy _count _img > 0 ) { invoiceStore . get ( bgnr ) . onsuccess = e => { let x = e . target . result . data , y = e . target . result . id ; efy _css _bgimg . innerHTML = ` html:before, html:after {background: url( ${ x } )!important; background-size: cover!important} ` ; e$ ( '.efy_img_previews [efy_bg_nr="' + y + '"]' ) . setAttribute ( 'efy_active' , 1 ) ; } ; }
/*Remove BG - Button*/ e$all ( ".efy_idb_reset" ) . forEach ( z => { z . onclick = ( ) => { indexedDB . deleteDatabase ( "efy" ) ; location . reload ( ) } } ) ;
}
} ; } ;
} efy _bg _update _fn ( ) ;
/*Export IndexedDB*/ ( async ( ) => { try {
let dbExists = await new Promise ( resolve => { let request = window . indexedDB . open ( 'efy' ) ;
request . onupgradeneeded = e => { e . target . transaction . abort ( ) ; resolve ( false ) ; } ;
request . onerror = ( ) => resolve ( true ) ; request . onsuccess = ( ) => resolve ( true ) ; } ) ;
if ( ! dbExists ) { throw new Error ( "efy: db doesn't exist" ) ; }
let idbDatabase = await new Promise ( ( resolve , reject ) => { let request = window . indexedDB . open ( 'efy' ) ;
request . onerror = ( ) => reject ( "efy: Can't open db" ) ;
request . onsuccess = ( ) => resolve ( request . result ) ; } ) ;
let json = await new Promise ( ( resolve , reject ) => { let exportObject = { } ;
if ( idbDatabase . objectStoreNames . length === 0 ) { resolve ( JSON . stringify ( exportObject ) ) ; }
else { let transaction = idbDatabase . transaction ( idbDatabase . objectStoreNames , "readonly" ) ;
transaction . addEventListener ( "error" , reject ) ;
for ( let storeName of idbDatabase . objectStoreNames ) { let allObjects = [ ] ;
transaction . objectStore ( storeName ) . openCursor ( ) . addEventListener ( "success" , event => { let cursor = event . target . result ;
if ( cursor ) { /*Store data*/ allObjects . push ( cursor . value ) ; cursor . continue ( ) ; }
else { /*Store completed*/ exportObject [ storeName ] = allObjects ;
if ( idbDatabase . objectStoreNames . length === Object . keys ( exportObject ) . length ) { resolve ( JSON . stringify ( exportObject ) ) ; } } } ) ; } } } ) ;
e$ ( ".efy_idb_export" ) . onclick = ( ) => { efyaudio . ok4 . cloneNode ( ) . play ( ) ; e$ ( ".efy_idb_export" ) . href = "data:application/json," + json ; } ;
} catch ( error ) { console . error ( error ) ; } } ) ( ) ;
/*Import indexedDB*/ let efy _idb _import = e$ ( ".efy_idb_import" ) ;
efy _idb _import . addEventListener ( "change" , ( ) => { let file = efy _idb _import . files [ 0 ] , reader = new FileReader ( ) ;
reader . onload = async ( ) => { let data = JSON . parse ( reader . result ) ;
function importIDB ( storename = "images" , storename2 = "settings" , arr = data [ "images" ] , arr2 = data [ "settings" ] ) {
return new Promise ( resolve => { let r = window . indexedDB . open ( "efy" ) ;
r . onupgradeneeded = ( ) => { let idb = r . result ; idb . createObjectStore ( storename , { keyPath : "id" , autoIncrement : true } ) ; idb . createObjectStore ( storename2 , { keyPath : "id" , autoIncrement : true } ) ; } ;
r . onsuccess = ( ) => { let idb = r . result , store = idb . transaction ( storename , "readwrite" ) . objectStore ( storename ) , store2 = idb . transaction ( storename2 , "readwrite" ) . objectStore ( storename2 ) ;
for ( let obj of arr ) { store . put ( obj ) ; }
for ( let obj of arr2 ) { store2 . put ( obj ) ; }
resolve ( idb ) ;
} ; r . onerror = e => console . log ( e . target . errorCode ) ; } ) ; }
await importIDB ( ) ; } ; reader . readAsText ( file ) ; } ) ;
/*Save & Restore Preferences*/ e$ ( '.efy_localStorage_export' ) . onclick = ( ) => { let x = '' ; Object . entries ( localStorage ) . forEach ( ( [ k , v ] ) => { if ( k . includes ( 'efy' ) ) { x = x + JSON . stringify ( k , null , 2 ) + ' :' + JSON . stringify ( v , null , 2 ) + ',\n' ; } } ) ; e$ ( '.efy_localStorage_export' ) . href = "data:application/json," + '{\n' + x . slice ( 0 , - 2 ) + '\n}' ; console . log ( x ) } ;
/*Import Settings*/ let efy _localstorage _import = e$ ( '.efy_localstorage_import' ) ; efy _localstorage _import . addEventListener ( 'change' , function ( ) {
let file = efy _localstorage _import . files [ 0 ] , reader = new FileReader ( ) ;
reader . onload = function ( ) { Object . entries ( JSON . parse ( reader . result ) ) . forEach ( ( [ k , v ] ) => localStorage . setItem ( k , v ) ) ; location . reload ( ) }
reader . readAsText ( file ) ; } ) ;
/*Reset Settings*/ e$all ( ".efy_localstorage_reset" ) . forEach ( x => { x . onclick = ( ) => { Object . entries ( localStorage ) . forEach ( ( [ k ] ) => { if ( k . includes ( 'efy' ) ) { localStorage . removeItem ( k ) } } ) ; location . reload ( ) } } ) ;
2022-09-09 17:11:23 +00:00
/*Determine Audio Path*/ let audioPath ; await fetch ( './audio/ok.mp3' ) . then ( ( response ) => { audioPath = response . ok ? './audio' : '/audio' ; } ) ;
/*Audio*/ let efyaudio = { } ; [ 'pop' , 'ok' , 'ok2' , 'ok3' , 'ok4' , 'hover' , 'slide' , 'squish' , 'step' , 'error' , 'disabled' ] . forEach ( x => { efyaudio [ x ] = new Audio ( ` ${ audioPath } / ${ x } .mp3 ` ) } ) ; e$body . addEventListener ( "pointerdown" , efyaudio _fn , { once : true } ) ;
2022-09-05 18:05:42 +00:00
async function efyaudio _fn ( ) { if ( localStorage . efy _audio _status == 'on' ) { if ( localStorage . efy _audio _click == 'on' ) {
/*Ok*/ e$body . addEventListener ( "pointerup" , ( ) => { if ( event . target . matches ( 'button:not([disabled], [type=submit], [type=reset], [efy_tab], .shaka-overflow-menu button, .shaka-overflow-menu-button, .shaka-back-to-overflow-button), .video-grid>div' ) ) { efyaudio . ok . cloneNode ( ) . play ( ) } } ) ;
/*Ok: Online*/ window . addEventListener ( "online" , ( ) => { efyaudio . ok . cloneNode ( ) . play ( ) } ) ;
/*Ok2*/ e$body . addEventListener ( "pointerup" , ( ) => { if ( event . target . matches ( '.efy_img_previews [efy_bg_nr]' ) ) { efyaudio . ok2 . cloneNode ( ) . play ( ) } } ) ;
/*Ok4*/ e$body . addEventListener ( "pointerup" , ( ) => { if ( event . target . matches ( '[type=submit]' ) ) { efyaudio . ok4 . cloneNode ( ) . play ( ) } } ) ;
/*Ok: on Change*/ e$body . addEventListener ( "change" , ( ) => { if ( event . target . matches ( 'input, textarea' ) ) { efyaudio . ok . cloneNode ( ) . play ( ) } } ) ;
/*Pop*/ e$body . addEventListener ( "pointerup" , ( ) => { if ( event . target . matches ( 'summary, select:not([multiple], [disabled]), [efy_tabs] [efy_tab], [efy_alert], [efy_alert] *, .shaka-overflow-menu button, .shaka-overflow-menu-button, .shaka-back-to-overflow-button' ) ) { efyaudio . pop . cloneNode ( ) . play ( ) } } ) ;
/*Slide*/ e$body . addEventListener ( "pointerup" , ( ) => { if ( event . target . matches ( '[efy_sidebar_btn_open], [efy_sidebar_btn_close]' ) ) { efyaudio . slide . cloneNode ( ) . play ( ) } } ) ;
/*Error*/ e$body . addEventListener ( "pointerup" , ( ) => { if ( event . target . matches ( '[type=reset]' ) ) { efyaudio . error . cloneNode ( ) . play ( ) } } ) ;
/*Error: Offline*/ window . addEventListener ( "offline" , ( ) => { efyaudio . error . cloneNode ( ) . play ( ) } ) ;
/*Disabled*/ e$body . addEventListener ( "pointerup" , ( ) => { if ( event . target . matches ( '[disabled]' ) ) { efyaudio . disabled . cloneNode ( ) . play ( ) } } ) ;
/*Step*/ e$body . addEventListener ( "pointerdown" , ( ) => { if ( event . target . matches ( 'input:not([type=radio], [type=checkbox], [type=reset], [disabled]), textarea:not([disabled])' ) ) { efyaudio . step . cloneNode ( ) . play ( ) } } ) ;
} /*Hover*/ if ( localStorage . efy _audio _hover == "on" ) { e$all ( "summary, select:not([multiple], [disabled]), [type=submit], [type=reset], [efy_sidebar_btn_open], [efy_sidebar_btn_close], .video-grid>div" ) . forEach ( x => x . addEventListener ( "mouseenter" , ( ) => efyaudio . hover . cloneNode ( ) . play ( ) ) ) ; } } }
/*Quick Shortcuts*/
e$ ( ".efy_quick_search" ) . onclick = ( ) => e$ ( '.efy_quick_shortcuts [efy_search_input]' ) . toggleAttribute ( 'efy_display_none' ) ;
e$ ( ".efy_quick_reload" ) . onclick = ( ) => location . reload ( ) ;
e$ ( ".efy_quick_fullscreen" ) . onclick = ( ) => { document . exitFullscreen ( ) ; document . documentElement . requestFullscreen ( ) ; } ;
e$ ( ".efy_quick_back" ) . onclick = ( ) => window . history . go ( - 1 ) ;
e$ ( ".efy_quick_forward" ) . addEventListener ( 'pointerup' , async ( ) => window . history . go ( 1 ) ) ;
/*Tabs*/ e$all ( '[efy_tabs]' ) . forEach ( z => { let x = '[efy_tabs=' + z . getAttribute ( 'efy_tabs' ) + '] > ' ;
e$all ( x + '[efy_tab]' ) . forEach ( y => { y . onclick = e => { let efy _tab = e . target . getAttribute ( 'efy_tab' ) ;
e$all ( x + '[efy_tab]' ) . forEach ( y => y . removeAttribute ( 'efy_active' ) ) ; e . target . setAttribute ( 'efy_active' , '1' ) ;
e$all ( x + '[efy_content]' ) . forEach ( y => y . removeAttribute ( 'efy_active' ) ) ; e$ ( x + ' [efy_content="' + efy _tab + '"]' ) . setAttribute ( 'efy_active' , '1' ) ;
} } ) ; } ) ;
/*Clock & Timer*/ function efy _time _0 ( i ) { if ( i < 10 ) { i = '0' + i } return i ; }
/*Clock*/ function efy _clock ( ) { let t = new Date ( ) , h = t . getHours ( ) , m = t . getMinutes ( ) ; m = efy _time _0 ( m ) ;
e$all ( '[efy_clock]' ) . forEach ( x => { x . innerHTML = h + ':' + m ; } ) ; setTimeout ( efy _clock , 10000 ) ; } efy _clock ( ) ;
/*Timer*/ e$all ( '[efy_timer]' ) . forEach ( y => { y . insertAdjacentHTML ( 'beforeend' , ` <div efy_text>00:00:00</div><button efy_start></button><button efy_reset></button> ` ) ; let x = '[efy_timer=' + y . getAttribute ( 'efy_timer' ) + '] ' , play = e$ ( x + '[efy_start]' ) , reset = e$ ( x + '[efy_reset]' ) , timer _text = e$ ( x + '[efy_text]' ) , interval , [ hour , minute , second , h , m , s ] = [ 0 , 0 , 0 , '00' , '00' , '00' ] ;
play . addEventListener ( "click" , ( ) => { clearInterval ( interval ) ; play . toggleAttribute ( 'efy_active' ) ; if ( play . hasAttribute ( 'efy_active' ) ) { interval = setInterval ( ( ) => { second ++ ;
s = efy _time _0 ( second ) ; if ( second > 59 ) { s = '00' ; second = 0 ; minute ++ ;
m = efy _time _0 ( minute ) ; if ( minute > 59 ) { m = '00' ; minute = 0 ; hour ++ ;
h = efy _time _0 ( hour ) ;
} } timer _text . innerText = h + ':' + m + ':' + s ; } , 1000 ) ; } else { clearInterval ( interval ) ; } } ) ;
reset . addEventListener ( "click" , ( ) => { clearInterval ( interval ) ; [ hour , minute , second , h , m , s ] = [ 0 , 0 , 0 , '00' , '00' , '00' ] ; timer _text . innerText = "00:00:00" ; play . removeAttribute ( 'efy_active' ) ; } ) ; } ) ;
/*Cursor*/ async function efy _cursor _fn ( ) { let x = e$ ( '[efy_cursor]' ) , efy _css _cursor = e$create ( "style" ) ; efy _css _cursor . classList . add ( "efy_css_cursor" ) ; efy _css _cursor . innerHTML = ` [efy_cursor_on], [efy_cursor_on] * {cursor: none!important} [efy_cursor_on] [efy_cursor] { height: 16rem; width: 16rem; position: absolute; background: linear-gradient(165deg, var(--efy_color), var(--efy_color2)); background-clip: padding-box; border-radius: var(--efy_radius0); pointer-events: none; opacity: 0; transition: opacity 0.5s linear; box-shadow: 0 0 5rem #0003; z-index: 999999!important} ` ; document . head . appendChild ( efy _css _cursor ) ; document . addEventListener ( 'pointermove' , ( e ) => { x . style . left = e . pageX - 8 + 'px' ; x . style . top = e . pageY - 8 + 'px' ; x . style . opacity = 1 ; } ) ; document . addEventListener ( 'touchstart' , ( ) => { x . style . opacity = 0 ; } ) ; document . addEventListener ( 'touchmove' , ( ) => { x . style . opacity = 0 ; } ) ; document . addEventListener ( 'touchend' , ( ) => { x . style . opacity = 0 } ) ; } efy _cursor _fn ( ) ;
/*Search Filter */ e$all ( '[efy_search]' ) . forEach ( a => { let search = a . getAttribute ( 'efy_search' ) , container = ` # ${ a . id } [efy_search=" ${ search } "] ` ;
e$all ( container + ' [efy_search_input]' ) . forEach ( z => { z . addEventListener ( 'keyup' , ( ) => { let val = z . value . toLowerCase ( ) ;
e$all ( container + ' ' + search ) . forEach ( x => { if ( x . innerHTML . toLowerCase ( ) . includes ( val ) == 0 ) { x . setAttribute ( 'efy_display_none' , '1' ) } else { x . removeAttribute ( 'efy_display_none' ) } } ) } ) } ) } ) ;
/*Alerts*/ e$body . insertAdjacentHTML ( 'afterbegin' , ` <div efy_alerts></div> ` ) ;
e$body . addEventListener ( "pointerup" , ( ) => { if ( event . target . matches ( '[efy_alert] *' ) || event . target . matches ( '[efy_alert] *' ) ) { e$ ( '[efy_alert]' ) . remove ( ) } } ) ;
/*Online / Offline*/ window . addEventListener ( 'offline' , ( ) => { console . log ( 'offline' ) ; e$ ( '[efy_alerts]' ) . insertAdjacentHTML ( 'afterbegin' , ` <div efy_alert><div><h6>You're OFFLINE</h6><p>Maybe check your internet connection?</p></div><button efy_btn_square><i efy_icon="remove"></i></button></div> ` ) } ) ;
window . addEventListener ( 'online' , ( ) => { console . log ( 'online' ) ; e$ ( '[efy_alerts]' ) . insertAdjacentHTML ( 'afterbegin' , ` <div efy_alert><div><h6>You're back ONLINE</h6></div><button efy_btn_square><i efy_icon="remove"></i></button></div> ` ) } ) ;
2022-09-09 08:12:51 +00:00
/*End*/ } ;
