https://simuladores.okteleseguros.pt/viagem/Blocks/WebPatterns/Javascript/SilkUI.pt.js?7728

1// Silk UI Class
2function SilkUIObject(){
3
4    // that object
5    var that = this;
6
7    // Current Version
8    var Version = "4.1.5 (2020-03-09)";
9
10    // page Overlay for device emulation
11    var PageOverlay = false;
12
13    // page size
14    var deviceWidth = 0 ;
15
16    // timers controll
17    var timers = {};
18
19    // Debug Mode
20    var DebugMode = false;
21
22
23
24
25
26
27
28
29
30
31    // PATTERNS ************************************************************************************
32
33    // Silk UI Modal
34    var Modal;
35    
36    // Dropdowns
37    var Dropdowns;
38    
39    // Accordion vertical
40    var AccordionVertical;
41    
42    // SectionIndex
43    var SectionIndex;
44    
45    // Range Sliders
46    var RangeSlider;
47
48    // SectionExpandable
49    var SectionExpandable;
50
51
52
53
54
55
56    // PUBLIC FUNCTIONS ***************************************************************************
57    
58
59
60
61    // Function to debug on browser console
62    // Only debug when debug mode is true
63    that.DebugConsole = function(msg, flag){
64        
65        // If debug active or flag true
66        if(DebugMode || flag == true){
67            /*console.debug("Silk UI Debug : "+msg);*/
68            console.log("Silk UI Debug : "+msg);
69        }
70    }
71    
72
73    // Get Device
74    that.GetDevice = function(){
75
76        return SilkDeviceDetect.getDevice();
77    }
78    
79
80    // IE11 and IE10 Metro for tablet
81    that.isMetro = function() {
82        
83        var errorName = null;
84        var supported = null; 
85        
86        try {
87            new ActiveXObject("");
88        }
89        catch (e) {
90            // FF has ReferenceError here
91            errorName = e.name; 
92        }     
93        try {
94            supported = !!new ActiveXObject("htmlfile");
95        } catch (e) {
96            supported = false;
97        }
98        if(errorName != 'ReferenceError' && supported==false){
99            supported = false;
100        }else{
101            supported =true;
102        }
103        
104        if(!supported && (SilkDeviceDetect.getBrowserVersion() == "ie11" || SilkDeviceDetect.getBrowserVersion() == "ie10")){
105            return true;
106        }else{
107            return false;
108        }
109        
110    }
111    
112
113
114    // return browser version
115    that.GetBrowserVersion = function(){
116        var bversion = SilkDeviceDetect.getBrowserVersion();
117        return bversion;
118    }   
119       
120    
121    // Get version
122    that.GetVersion = function(){
123        return Version;
124    }
125
126
127    // Clear browser cookies
128    that.ClearCookies = function(){
129        SilkDeviceDetect.setCookie("DEVICE_SIMULATION", "false");
130        SilkDeviceDetect.clearCookie("DEVICE_TYPE"); 
131        return "Done!";
132    };
133    
134    
135    
136    // Get Transition callback to use
137    // Function from David Walsh: http://davidwalsh.name/css-animation-callback
138    that.whichTransitionEvent = function(){
139      var t,
140          el = document.createElement("fakeelement");
141
142      var transitions = {
143        "transition"      : "transitionend",
144        "OTransition"     : "oTransitionEnd",
145        "MozTransition"   : "transitionend",
146        "WebkitTransition": "webkitTransitionEnd"
147      }
148
149      for (t in transitions){
150        if (el.style[t] !== undefined){
151          return transitions[t];
152        }
153      }
154    }
155
156        
157    
158    
159    
160    
161    
162
163    // PRIVATE FUNCIONS ***********************************************************************************************************************
164
165    // add overlay for device emulation
166    function addOverlay() {
167        
168
169        // if simulation device
170        if(SilkDeviceDetect.isSimulationDevice()){
171            
172            /* set size and device  */    
173            $(".ResponsiveOverlay_Device").html(SilkDeviceDetect.getDevice()+ " " + SilkDeviceDetect.getDeviceWidth()+ "x" + SilkDeviceDetect.getDeviceHeight());
174        }
175        else{
176
177            /* set size and device  */    
178            $(".ResponsiveOverlay_Device").html(SilkDeviceDetect.getDeviceWidth() + "x" + SilkDeviceDetect.getDeviceHeight());            
179        }
180
181        // reset delay event
182        waitForFinalEvent(removeOverlay, 2000, 'removeOverlay');
183
184        // check if overlay
185        if (PageOverlay == false) {
186            
187            // show overlay overlay
188            $('.ResponsiveOverlay').css("display", "block");
189            setTimeout(function(){ $('.ResponsiveOverlay').addClass("show"); }, 1);
190            
191            // disable scroll
192            $(document.body).css("overflow", "hidden");
193
194            // if device simulation
195            if(SilkDeviceDetect.isDeviceSimulation()){
196
197                // show background        
198                $('.ResponsiveOverlay_bg').css("display", "block");
199                setTimeout(function(){ $('.ResponsiveOverlay_bg').addClass("show"); }, 1);
200            }
201
202            // set false
203            PageOverlay = true;
204        }
205
206  
207
208
209    }
210    
211    
212
213    // remove overlay for device emulation
214    function removeOverlay() {
215
216        // check overlay
217        if (PageOverlay == true) {
218
219            // enable scroll
220            $(document.body).css("overflow", "visible");    
221
222            // hide background        
223            $('.ResponsiveOverlay_bg').removeClass("show");
224            setTimeout(function(){ $('.ResponsiveOverlay_bg').css("display", "none"); }, 250);
225 
226            // hide device simulation controll       
227            $('.ResponsiveOverlay').removeClass("show");
228            setTimeout(function(){ $('.ResponsiveOverlay').css("display", "none"); }, 250);
229
230            // se false
231            PageOverlay = false;

232        }
233    }
234
235
236
237    // mmanage timers
238    function waitForFinalEvent(callback, ms, uniqueId) {        
239        if (timers[uniqueId]) {
240            clearTimeout (timers[uniqueId]);
241        }        
242        timers[uniqueId] = setTimeout(callback, ms);
243    };
244
245
246    // refresh page
247    function debugRefreshPage(){
248
249        // set event timer to refresh page
250        if(Math.abs(deviceWidth - SilkDeviceDetect.getDeviceWidth()) >= 30) {
251
252            // if device simulation
253            if(SilkDeviceDetect.isDeviceSimulation()){
254                location.reload();
255            }else{
256                removeOverlay();
257            }
258        }
259
260        // set device size
261        deviceWidth = SilkDeviceDetect.getDeviceWidth();
262    }
263
264
265
266
267
268    // add orientation class on .Page
269    function addOrientation() {
270
271        
272        // remove classes
273        $(".Page").removeClass('landscape').removeClass('portrait');
274        
275        // add class
276        $(".Page").addClass(SilkDeviceDetect.getOrientation());
277        return true;
278    };
279    
280
281    // set orientation event
282    that.orientationChange = function(event)  {
283        setTimeout(function(){ addOrientation(); }, 500);
284
285    };  
286    
287
288
289     // event change width window
290    function onWindowResize(event) {
291        // if not iframe
292        if(!SilkDeviceDetect.isIframe() && !SilkDeviceDetect.isMobile()){
293            
294            if(Math.abs(deviceWidth - SilkDeviceDetect.getDeviceWidth()) >= 30){
295                // add overlay
296                addOverlay();
297                
298                // add delay to refresh page
299                waitForFinalEvent(debugRefreshPage, 1500, 'refreshPage');
300            }
301            else{
302                //check page Orientation
303                addOrientation();
304            }
305        }
306    };
307    
308    // events to simulation device
309    function initSimulationDevice(){
310            
311
312        // add event to show/hide simulation device options
313        $(".ResponsiveOverlay .OpenClose").click(function(){
314
315            // if visible
316            if($(".ResponsiveOverlay .ResponsiveOverlay_Bottom").css('display') == "block"){
317                $(".ResponsiveOverlay .ResponsiveOverlay_Bottom").hide();
318              }else{
319                $(".ResponsiveOverlay .ResponsiveOverlay_Bottom").show();
320            }
321        });
322
323         // add event to active/desable simulation device
324        $(".ResponsiveOverlay_Bottom input.BtnRespOverlay").change(function(){
325
326            // if selected
327            if($(this).is(':checked')){
328                SilkDeviceDetect.setCookie("DEVICE_SIMULATION", "true");
329            }else{
330                that.ClearCookies();
331            }
332
333            // reload page
334            location.reload();
335        });
336
337
338        // cancel remve overlay on mouseOver
339        $(".ResponsiveOverlay").mouseover(function() {
340            clearTimeout (timers['removeOverlay']);
341            clearTimeout (timers['refreshPage']);
342        });
343
344        // add evento to remove overlay
345        $(".ResponsiveOverlay").mouseout(function() {
346            waitForFinalEvent(removeOverlay, 1000, 'removeOverlay');
347            waitForFinalEvent(debugRefreshPage, 1000, 'refreshPage');
348        });
349
350
351        // if addEventListener resize
352        if (window.addEventListener) {
353            window.addEventListener("resize", onWindowResize, false);                
354        } else if (window.attachEvent) { // IE 8 and addEventListener not supported browsers
355            window.attachEvent('onresize', function() {
356                onWindowResize();
357            });
358        }  
359    }
360
361
362
363
364
365    // Change  desktop class on .Page when resizing
366    setDesktopSizeClass = function(){
367        
368        // get window size
369        var windowW = SilkDeviceDetect.getDeviceWidth();
370
371        // set device default
372        var ndevice = "desktop small";
373
374        if (windowW >= 1920) {
375            ndevice = "desktop hd";
376        } else if (windowW >= 1600){
377            ndevice = "desktop big";
378        } else if (windowW >= 1366){
379            ndevice = "desktop";
380        } else { 
381           ndevice = "desktop small";
382        }
383        
384        // remove classes
385        $(".Page").removeClass("desktop small hd big tablet phone");
386        
387        // add new class
388        $(".Page").addClass(ndevice);
389        
390    }
391
392
393
394
395
396    // Execute for debug 
397        
398    // object: function (required)
399    // msg: string (required)
400    // patameters: array      
401    // behavior: string 
402    
403    that.Execute = function(func, msg, parameters, behavior){
404
405        
406        // check parameters
407        if(!parameters){ parameters = []; }
408        if(!behavior){ behavior = "AllDevices"; }
409
410        // Only on page loaded
411        $(document).ready(function(){
412
413            // execute funcion
414            try {
415                func.parameters = parameters;
416                func.call();
417            }
418            catch(exception){ 
419                // Send log to console
420                that.DebugConsole(msg, true);
421            } 
422        });
423
424    }    
425   
426   
427   
428    // Attach FastClick    
429    if(($(".Page").hasClass("phone") || $(".Page").hasClass("tablet")) && typeof(FastClick) != "undefined") {
430        window.addEventListener('load', function() {
431           new FastClick(document.body);
432        }, false);
433    }
434
435    
436    // add SilkUI version class on .Page
437    function addVersion() {
438 
439    var SilkUIVersionString = Version.split(' ')[0];
440       
441        // add/update attribute
442        $(".Page").attr('data-silkversion', SilkUIVersionString );
443        
444        return true;
445    };
446    
447    
448    //add ClientSideResponsive data attribute on .Page
449    function addCientSideResponsive(){
450     
451        //add/update attribute
452        $(".Page").attr('data-client-responsive', SilkDeviceDetect.getUseClientSideResponsive());
453        
454        return true;
455    }
456    
457    // On page loaded
458    $(document).ready(function() { 
459
460
461        if(!SilkDeviceDetect.getUseClientSideResponsive()){
462
463            //if desktop, set desktop size
464            if($(".Page").hasClass("desktop")){
465                setDesktopSizeClass();
466            }
467            
468            // set device size
469            deviceWidth = SilkDeviceDetect.getDeviceWidth();
470            
471            
472            // check if is device simulation or development mode
473            if((SilkDeviceDetect.isDeviceSimulation() || SilkDeviceDetect.isDevelopmentMode())){
474
475                initSimulationDevice();
476
477            }
478            
479            var ratio = window.devicePixelRatio || 1;
480            var width = window.screen.width * ratio;
481            var height = window.screen.height * ratio;
482            var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
483            
484            if(width === 1125 && height === 2436 && SilkDeviceDetect.isMobile() && iOS) {
485                document.querySelector(".Page").classList.add("iphonex");
486            }
487            
488             // orientation
489            // if metro
490            if(that.isMetro()){
491                
492                var matchMediaQuery = window.matchMedia("(min-width: " + ((SilkDeviceDetect.getDeviceWidth() + SilkDeviceDetect.getDeviceHeight()) / 2) + "px)");
493                matchMediaQuery.addListener(that.orientationChange);
494                
495            }else{
496                
497                if (window.addEventListener) {
498                    window.addEventListener("orientationchange", that.orientationChange, false);
499                } else if (window.attachEvent) { // IE 8 and addEventListener not supported browsers
500                    window.attachEvent("orientationchange", that.orientationChange, false);
501                }
502            
503            }
504            
505            
506            // windows resize to change small desktop, desktop, desktop big, desktop hd
507            if(!SilkDeviceDetect.isMobile() && !SilkDeviceDetect.isSimulationDevice())
508            {
509                if (window.addEventListener) {
510                    window.addEventListener("resize", setDesktopSizeClass, false);                
511                } else if (window.attachEvent) { // IE 8 and addEventListener not supported browsers
512                    window.attachEvent('onresize', function() {
513                        setDesktopSizeClass();
514                    });
515                }
516            }
517        }
518        addVersion();
519        addCientSideResponsive();
520    });
521}
522
523
524// console debug - exception for browsers with console closed
525if (!window.console) console = { log: function(){} };
526
527
528// Create Silk UI 
529var SilkUI = new SilkUIObject();