https://www.ilcanticodellanatura.it/wp-content/plugins/de-builder-…/templates/assets/js/a11y.js?ver=1.0.2

1window.cssVisibilityFix =
2    'html:not(.queen_hotel) .arrow::after, html:not(.queen_hotel) .arrow::before, ' +
3    '#open_menu .icon:after,' +
4    '.open_menu .icon:before,' +
5    '.close::after, .close::before,' +
6    '.cross::after, .cross::before,' +
7    '.fancybox-close-small::after, .fancybox-close-small::before,' +
8    '.pager ul li.slick-active::before' +
9    '{background: white!important;}' +
10    //dynamic calendar best price
11    '.best-price .day--price, #fb_calendar .fbw-calendar--legend .best-price--legend .legend-txt{' +
12    'color: #2fcf2f!important;}' +
13    //hamburger manu + play icons
14    '.slideshow_container .video_icon, ' +
15    '#open_menu .icon:before,' +
16    '#open_menu .icon,' +
17    '.open_menu .icon' +
18    '{border-color: white!important;}' +
19    //video icons
20    '.slideshow_container .video_icon::before ' +
21    '{border-color: transparent transparent transparent white;}' +
22    //focus ring
23    '*:focus-visible, ul.gfield_checkbox li input[type=checkbox]:focus ~ label:before' +
24    '{outline: 2px solid white!important;' +
25    'outline-offset: 1px!important;' +
26    'box-shadow: 0 0 0 4px black!important;}' +
27    'html:(.hendricks_hotel).pager ul li{' +
28    'background: #fff!important;}'
29
30const hexToRgb = (hex) => {
31    if (!hex.includes('#')) {
32        return;
33    }
34    let result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
35    let r = parseInt(result[1], 16),
36        g = parseInt(result[2], 16),
37        b = parseInt(result[3], 16);
38    return [r, g, b];
39}
40
41const getVarRgb = (name) => {
42    let color = getComputedStyle(document.documentElement).getPropertyValue(name);
43    return hexToRgb(color);
44}
45
46const getLuminance = (values) => {
47    if (typeof values == 'undefined') {
48        return;
49    }
50    const rgb = values.map((v) => {
51        const val = v / 255;
52        return val <= 0.03928 ? val / 12.92 : ((val + 0.055) / 1.055) ** 2.4;
53    });
54    return Number((0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2]).toFixed(3));
55};
56
57const getContrastRatio = (colorA, colorB) => {
58    // const lumA = getLuminance(colorA);
59    // const lumB = getLuminance(colorB);
60    let contrast = (Math.max(colorA, colorB) + 0.05) / (Math.min(colorA, colorB) + 0.05);
61    return Math.round(contrast * 100) / 100;
62};
63
64const fixDarkReader = () => {
65    let highlighted = getLuminance(getVarRgb('--darkreader-bg--highlighted'));
66    let highlightedTxt = getLuminance(getVarRgb('--darkreader-text--highlighted-color-associated'));
67    let hover = getLuminance(getVarRgb('--darkreader-bg--hover'));
68    let hoverTxt = getLuminance(getVarRgb('--darkreader-text--hover-color-associated'));
69    let contrastHighlighted = getContrastRatio(highlighted, highlightedTxt);
70    if (contrastHighlighted < 4.5) {
71        let newContrast = getContrastRatio(highlighted, [255, 255, 255]) >= 4.5 ? '--white' : '--black';
72        document.documentElement.style.setProperty('--darkreader-text--highlighted-color-associated', 'var(' + newContrast + ')');
73    }
74    let contrastHover = getContrastRatio(hover, hoverTxt);
75    if (contrastHover < 4.5) {
76        let newContrast = getContrastRatio(hover, [255, 255, 255]) >= 4.5 ? '--white' : '--black';
77        document.documentElement.style.setProperty('--darkreader-text--hover-color-associated', 'var(' + newContrast + ')');
78    }
79};
80
81(function ($) {
82        window.openA11YPanel = () => {
83            const panel = $('.a11Y_panel');
84            panel.toggleClass('visible');
85            if (panel.hasClass('visible')) {
86                panel.find('button').first().focus();
87                $('body > *:not(.a11Y_panel)').attr('inert', '');
88            } else {
89                $('body > *:not(.a11Y_panel)').removeAttr('inert');
90                $('.open_a11y_panel').focus();
91            }
92            //esc button
93            panel.keyup(function (e) {
94                if (e.which === 27) {
95                    panel.removeClass('visible');
96                    $('.open_a11y_panel').focus();
97                    $('body > *:not(.a11Y_panel)').removeAttr('inert');
98                }
99            });
100        }
101
102        function initializeLocalStorage() {
103
104            if (localStorage.getItem('a11y') === null) {
105                let contrast_mode = window.matchMedia && window.matchMedia('(prefers-contrast: more)').matches;
106                let reduce_transparency = window.matchMedia && window.matchMedia('(prefers-reduced-transparency: reduce)').matches;
107                let reduce_motion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
108                localStorage.setItem('a11y', JSON.stringify({
109                    contrast_mode: contrast_mode,
110                    black_and_white: false,
111                    reduce_transparency: reduce_transparency,
112                    reduce_motion: reduce_motion,
113                    font: 'default',
114                    font_size: '100%',
115                    letter_spacing: 0,
116                    word_spacing: 0,
117                }));
118            }
119        }
120
121        function toggleContrastMode() {
122
123            //enable contrast mode on checkbox click
124            $('input#contrast_mode').on('change', function () {
125                let storage = JSON.parse(localStorage.getItem('a11y'));
126                if ($(this).is(':checked')) {
127                    DarkReader.enable({
128                        mode: 1,
129                        brightness: 120,
130                        contrast: 130,
131                        immediateModify: true,
132                        detectDarkTheme: false,
133                    }, {css: cssVisibilityFix});
134                    fixDarkReader();
135                    storage.contrast_mode = true;
136                    localStorage.setItem('a11y', JSON.stringify(storage));
137                } else {
138                    DarkReader.disable();
139                    storage.contrast_mode = false;
140                    localStorage.setItem('a11y', JSON.stringify(storage));
141                }
142            });
143
144            //click checkbox if contrast mode is enabled
145            if (JSON.parse(localStorage.getItem('a11y')).contrast_mode) {
146
147                DarkReader.enable({
148                    mode: 1,
149                    brightness: 120,
150                    contrast: 130,
151                    immediateModify: true,
152                    detectDarkTheme: false,
153                }, {css: cssVisibilityFix});
154                fixDarkReader();
155
156                 $('input#contrast_mode').prop('checked', true);
157                 $('input#contrast_mode').trigger('change');
158
159
160            }
161        }
162
163        function toggleTransparencies() {
164
165            //enable contrast mode on checkbox click
166            $('input#reduce_transparencies').on('click', function () {
167                let storage = JSON.parse(localStorage.getItem('a11y'));
168                if ($(this).is(':checked')) {
169                    $('html').addClass('reduce_transparencies');
170                    storage.reduce_transparency = true;
171                    localStorage.setItem('a11y', JSON.stringify(storage));
172                } else {
173                    $('html').removeClass('reduce_transparencies');
174                    storage.reduce_transparency = false;
175                    localStorage.setItem('a11y', JSON.stringify(storage));
176                }
177            });
178
179            //click checkbox if contrast mode is enabled
180            if (JSON.parse(localStorage.getItem('a11y')).reduce_transparency) {
181                $('html').addClass('reduce_transparencies');
182                $('input#reduce_transparencies').click();
183            }
184        }
185
186        function toggleMotion() {
187
188            //enable contrast mode on checkbox click
189            $('input#reduce_motion').on('click', function () {
190                let storage = JSON.parse(localStorage.getItem('a11y'));
191                if ($(this).is(':checked')) {
192                    $('html').addClass('reduce_motion');
193                    storage.reduce_motion = true;
194                    localStorage.setItem('a11y', JSON.stringify(storage));
195                } else {
196                    $('html').removeClass('reduce_motion');
197                    storage.reduce_motion = false;
198                    localStorage.setItem('a11y', JSON.stringify(storage));
199                }
200            });
201
202            //click checkbox if contrast mode is enabled
203            if (JSON.parse(localStorage.getItem('a11y')).reduce_motion) {
204                $('html').addClass('reduce_motion');
205                $('input#reduce_motion').click();
206            }
207        }
208
209        function toggleBnW() {
210
211            //enable contrast mode on checkbox click
212            $('input#black_and_white').on('click', function () {
213                let storage = JSON.parse(localStorage.getItem('a11y'));
214                if ($(this).is(':checked')) {
215                    $('html').addClass('black_and_white');
216                    storage.black_and_white = true;
217                    localStorage.setItem('a11y', JSON.stringify(storage));
218                } else {
219                    $('html').removeClass('black_and_white');
220                    storage.black_and_white = false;
221                    localStorage.setItem('a11y', JSON.stringify(storage));
222                }
223            });
224
225            //click checkbox if contrast mode is enabled
226            if (JSON.parse(localStorage.getItem('a11y')).black_and_white) {
227                $('html').addClass('black_and_white');
228                $('input#black_and_white').click();
229            }
230        }
231
232        function toggleFont() {
233            $('select#toggleFont').on('change', function () {
234                let storage = JSON.parse(localStorage.getItem('a11y'));
235                $('html').removeClass('default system cursive mono sans serif opendys andika sylexiad  luciole atkinson eido b612 ');
236                $('html').addClass($(this).val());
237                storage.font = $(this).val();
238                localStorage.setItem('a11y', JSON.stringify(storage));
239            });
240            if (JSON.parse(localStorage.getItem('a11y')).font !== 'default') {
241                $('html').addClass(JSON.parse(localStorage.getItem('a11y')).font);
242                $('select#toggleFont').val(JSON.parse(localStorage.getItem('a11y')).font).change();
243            }
244        }
245
246        function sliderFontSize() {
247
248            $('input#font_size').on('change', function () {
249                let storage = JSON.parse(localStorage.getItem('a11y'));
250                let value = $(this).val();
251                let percent = value + '%';
252                storage.font_size = percent;
253                localStorage.setItem('a11y', JSON.stringify(storage));
254                document.documentElement.style.setProperty("--font-size-a11y", percent);
255                $(this).attr('aria-valuenow', value);
256                $(this).attr('aria-valuetext', percent);
257                if (value !== 100) {
258                    $('html').addClass('font_size_a11y');
259                } else {
260                    $('html').removeClass('font_size_a11y');
261                }
262            });
263
264            if (JSON.parse(localStorage.getItem('a11y')).font_size !== '100%') {
265                let font_size = JSON.parse(localStorage.getItem('a11y')).font_size;
266                document.documentElement.style.setProperty("--font-size-a11y", font_size)
267                $('html').addClass('font_size_a11y');
268                $('input#font_size').val(font_size.replace('%', ''));
269            } else {
270                $('html').removeClass('font_size_a11y');
271            }
272        }
273
274        function sliderLetterSpacing() {
275
276            $('input#letter_spacing').on('change', function () {
277                let storage = JSON.parse(localStorage.getItem('a11y'));
278                let value = $(this).val();
279                let percent = Math.floor(value * 100 / $(this).attr('max')) + '%';
280                storage.letter_spacing = value;
281                localStorage.setItem('a11y', JSON.stringify(storage));
282                document.documentElement.style.setProperty("--letter-spacing-a11y", value + 'em');
283                $(this).attr('aria-valuenow', value);
284                $(this).attr('aria-valuetext', percent);
285                if (value !== 0) {
286                    $('html').addClass('letter_spacing_a11y');
287                } else {
288                    $('html').removeClass('letter_spacing_a11y');
289                }
290            });
291
292            if (JSON.parse(localStorage.getItem('a11y')).letter_spacing !== 0) {
293                let letter_spacing = JSON.parse(localStorage.getItem('a11y')).letter_spacing;
294                document.documentElement.style.setProperty("--letter-spacing-a11y", letter_spacing + 'em');
295                $('html').addClass('letter_spacing_a11y');
296                $('input#letter_spacing').val(letter_spacing);
297            }
298        }
299
300        function sliderWordSpacing() {
301
302            $('input#word_spacing').on('change', function () {
303                let storage = JSON.parse(localStorage.getItem('a11y'));
304                let value = $(this).val();
305                let percent = Math.floor(value * 100 / $(this).attr('max')) + '%';
306                storage.word_spacing = value;
307                localStorage.setItem('a11y', JSON.stringify(storage));
308                document.documentElement.style.setProperty("--word-spacing-a11y", value + 'em');
309                $(this).attr('aria-valuenow', value);
310                $(this).attr('aria-valuetext', percent);
311                if (value !== 0) {
312                    $('html').addClass('word_spacing_a11y');
313                } else {
314                    $('html').removeClass('word_spacing_a11y');
315                }
316            });
317
318            if (JSON.parse(localStorage.getItem('a11y')).word_spacing !== 0) {
319                let word_spacing = JSON.parse(localStorage.getItem('a11y')).word_spacing;
320                document.documentElement.style.setProperty("--word-spacing-a11y", word_spacing + 'em');
321                $('html').addClass('word_spacing_a11y');
322                $('input#word_spacing').val(word_spacing);
323            }
324        }
325
326        function resetAll() {
327            $('button#reset_a11y').on('click', function () {
328                localStorage.setItem('a11y', JSON.stringify({
329                    contrast_mode: false,
330                    reduce_transparency: false,
331                    reduce_motion: false,
332                    black_and_white: false,
333                    font: 'default',
334                    font_size: '100%',
335                    letter_spacing: 0,
336                    word_spacing: 0,
337                }));
338                DarkReader.disable();
339                $('html').removeClass('reduce_transparencies reduce_motion black_and_white font_size_a11y letter_spacing_a11y word_spacing_a11y');
340                $('html').removeClass('default system cursive mono sans serif opendys andika sylexiad  luciole atkinson eido b612 ');
341                const panel = $('.a11Y_panel');
342                panel.find('input[type="checkbox"]').prop('checked', false);
343                panel.find('select').val('default');
344                panel.find('input[type="range"]:not(#font_size)').val(0);
345                panel.find('input[type="range"]#font_size').val(100);
346            });
347        }
348
349        $(document).ready(function () {
350            resetAll();
351            initializeLocalStorage();
352            toggleBnW();
353            toggleTransparencies();
354            toggleMotion();
355            toggleFont();
356            sliderFontSize();
357            sliderLetterSpacing();
358            sliderWordSpacing();
359            toggleContrastMode();
360        })
361
362
363    }
364
365)
366(jQuery);