Ero sivun ”Widget:Fullscreen” versioiden välillä
Järvi-meriwikistä
| (18 välissä olevaa versiota samalta käyttäjältä ei näytetä) | |||
| Rivi 1: | Rivi 1: | ||
<includeonly> | <includeonly> | ||
| − | + | <script type="text/javascript"> | |
| − | <script type="text/javascript"> | + | |
(function() { | (function() { | ||
| − | + | var id = 'fs_' + Math.random().toString(16).slice(2); | |
| − | + | document.write( '<div id="' + id + '_container" style="float: right;"></div>' ); | |
| − | + | this[ id + '_jQt' ] = function() { | |
if ( typeof window.jQuery == 'undefined' ) { | if ( typeof window.jQuery == 'undefined' ) { | ||
| − | setTimeout( function(){ | + | setTimeout( function() { this[ id + '_jQt' ]() }, 300); |
} else { | } else { | ||
| − | + | if ( jQuery( "#" + id + "_container" ).length > 0 ) { | |
| − | if ( jQuery( "# | + | this[ id + '_func' ](); |
| − | |||
} else { | } else { | ||
| − | setTimeout( function(){ | + | setTimeout( function() { this[ id + '_jQt' ]() }, 300); |
} | } | ||
} | } | ||
} | } | ||
| − | setTimeout( function(){ < | + | setTimeout( function() { this[ id + '_jQt' ]() }, 300); |
| + | |||
| + | this[ id + '_func' ] = function() { | ||
| + | |||
| + | var output = '<div class="fullscreen-button" style="margin-left: 10px; float: right; border-radius: 50%;"><button id="' + id + '_button" title="fullscreen" style="width: 24px; height: 24px; padding: 0; margin: 0; color: #1B599B; background: none; border: none;"><i class="fas fa-expand"></i></button></div>'; | ||
| + | console.log( id ); | ||
| + | console.log( jQuery( "#" + id + "_container" ) ); | ||
| + | jQuery( "#" + id + "_container" ).html( output ); | ||
| + | |||
| + | jQuery( "#" + id + "_button" ).on( 'click', function() { | ||
| + | |||
| + | var cardEl = jQuery( this ).parents( '.JwCard' ); | ||
| + | var elem = cardEl[0]; | ||
| + | |||
| + | if (!!document.fullscreenElement) { | ||
| + | |||
| + | if (document.exitFullscreen) { | ||
| + | document.exitFullscreen(); | ||
| + | } else if (document.mozCancelFullScreen) { /* Firefox */ | ||
| + | document.mozCancelFullScreen(); | ||
| + | } else if (document.webkitExitFullscreen) { /* Chrome, Safari and Opera */ | ||
| + | document.webkitExitFullscreen(); | ||
| + | } else if (document.msExitFullscreen) { /* IE/Edge */ | ||
| + | document.msExitFullscreen(); | ||
| + | } | ||
| + | |||
| + | jQuery( this ).html( '<i class="fas fa-expand"></i>' ); | ||
| + | cardEl.css( 'overflow', 'inherit' ); | ||
| + | |||
| + | } else { | ||
| + | |||
| + | if (elem.requestFullscreen) { | ||
| + | elem.requestFullscreen(); | ||
| + | } else if (elem.mozRequestFullScreen) { /* Firefox */ | ||
| + | elem.mozRequestFullScreen(); | ||
| + | } else if (elem.webkitRequestFullscreen) { /* Chrome, Safari and Opera */ | ||
| + | elem.webkitRequestFullscreen(); | ||
| + | } else if (elem.msRequestFullscreen) { /* IE/Edge */ | ||
| + | elem.msRequestFullscreen(); | ||
| + | } | ||
| − | + | jQuery( this ).html( '<i class="fas fa-compress"></i>' ); | |
| + | cardEl.css( 'overflow', 'auto' ); | ||
| + | |||
| + | |||
| − | + | } | |
| − | + | }); | |
| − | + | } | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | }); | + | })(); // We call our anonymous function immediately |
</script> | </script> | ||
</includeonly> | </includeonly> | ||
