Ero sivun ”Widget:Fullscreen” versioiden välillä
Järvi-meriwikistä
(21 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( "# | + | if ( jQuery( "#" + id + "_container" ).length > 0 ) { |
− | + | 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> |