@@ -345,6 +345,13 @@ function colorTheme() {
345345 buttonHover ( bookmark , themeData . button ) ;
346346 buttonHover ( close , themeData . button ) ;
347347 }
348+ let squares = document . getElementsByClassName ( 'squaresNew' )
349+ for ( let i = 0 ; i < squares . length ; i ++ ) {
350+ squares [ i ] . style . color = '#ffffff' ;
351+ squares [ i ] . style . background = themeData . button ;
352+ squares [ i ] . style . cursor = 'pointer' ;
353+ buttonHover ( squares [ i ] , themeData . button ) ;
354+ }
348355}
349356
350357//automatically puts the theme options in the settings page based on content of colorThemes variable
@@ -585,9 +592,7 @@ function buildGamePage() {
585592 }
586593 let isBigFile = getCookie ( 'data_isBigFile' ) ;
587594 var waitForRuffleLoad = setInterval ( function ( ) {
588- console . log ( 0 ) ;
589595 if ( window . RufflePlayer != undefined ) {
590- console . log ( 1 ) ;
591596 clearInterval ( waitForRuffleLoad ) ;
592597 if ( isFlash == '1' ) {
593598 const ruffle = window . RufflePlayer . newest ( ) ;
@@ -642,13 +647,78 @@ function buildGamePage() {
642647}
643648
644649//if the game is flash, set the download swf link to the swf file location
645- function setDownloadLink ( ) {
646- var downloadLink = document . getElementById ( 'downloadswf' ) ;
650+ function prepareGameOptions ( ) {
647651 if ( getCookie ( 'data_isFlash' ) == 1 ) {
648- downloadLink . innerHTML = 'Download SWF File' ;
652+ var downloadLink = document . getElementById ( 'downloadswf' ) ;
649653 downloadLink . href = document . getElementById ( 'frame' ) . src ;
654+ document . getElementById ( 'pause' ) . onclick = ( ) => {
655+ document . getElementById ( 'frame' ) . pause ( ) ;
656+ }
657+ document . getElementById ( 'resume' ) . onclick = ( ) => {
658+ document . getElementById ( 'frame' ) . play ( ) ;
659+ }
660+ document . getElementById ( 'rufflefullscreen' ) . onclick = ( ) => {
661+ document . getElementById ( 'frame' ) . enterFullscreen ( ) ;
662+ }
663+ document . getElementById ( 'advanced' ) . onclick = ( ) => {
664+ if ( document . getElementById ( 'advanced' ) . innerText === 'Show advanced options' ) {
665+ document . getElementById ( 'advanced' ) . innerText = 'Hide advanced options' ;
666+ showAdvancedOptions ( ) ;
667+ colorTheme ( ) ;
668+ }
669+ else {
670+ document . getElementById ( 'advancedoptionscontainer' ) . innerHTML = '' ;
671+ document . getElementById ( 'advanced' ) . innerText = 'Show advanced options' ;
672+ }
673+ }
674+ document . getElementById ( 'html5gameoptions' ) . remove ( )
650675 }
676+ else {
677+ document . getElementById ( 'flashgameoptions' ) . remove ( )
678+ document . getElementById ( 'fullscreen' ) . href = document . getElementById ( 'frame' ) . src ;
679+ document . getElementById ( 'fullscreen' ) . target = '_blank' ;
680+ }
681+ document . getElementById ( 'optionscontainer' ) . style . display = 'inline' ;
651682}
683+
684+ function showAdvancedOptions ( ) {
685+ var div = document . getElementById ( 'advancedoptionscontainer' ) ;
686+ div . innerHTML =
687+ `<h3>Advanced Ruffle Config Options</h3>
688+ <p>For help, see the <a target="_blank" href="https://github.com/ruffle-rs/ruffle/wiki/Using-Ruffle#javascript-api">Ruffle wiki</a></p>
689+ <span>
690+ <p style="display:inline">CSS editor for Ruffle Object (<code>#frame</code>): </p>
691+ <input placeholder="width: 100px;" style="display:inline" id="rufflecss">
692+ <button style="display:inline" id="rufflecsssubmit">set</button>
693+ </span>
694+ <br>
695+ <span>
696+ <p style="display:inline">Set <code>ruffle-player.config</code> properties: </p>
697+ <input placeholder="name (ex. quality)" style="display:inline" id="rufflepropertyname">
698+ <input placeholder="value (ex. high)" style="display:inline" id="rufflepropertyvalue">
699+ <button style="display:inline" id="rufflepropertysubmit">set</button>
700+ </span>
701+ <br>
702+ <span>
703+ <p style="display:inline">Run a function for the ruffle player: </p>
704+ <input placeholder="enterFullscreen()" style="display:inline" id="rufflefunc">
705+ <button style="display:inline" id="rufflefuncsubmit">run</button>
706+ `
707+ document . getElementById ( 'rufflecsssubmit' ) . onclick = ( ) => {
708+ cssToJs ( document . getElementById ( 'rufflecss' ) . value , document . getElementById ( 'frame' ) ) ;
709+ document . getElementById ( 'rufflecss' ) . value = '' ;
710+ }
711+ document . getElementById ( 'rufflepropertysubmit' ) . onclick = ( ) => {
712+ document . getElementById ( 'frame' ) . config [ document . getElementById ( 'rufflepropertyname' ) . value ] = document . getElementById ( 'rufflepropertyvalue' ) . value ;
713+ document . getElementById ( 'rufflepropertyname' ) . value = '' ;
714+ document . getElementById ( 'rufflepropertyvalue' ) . value = '' ;
715+ }
716+ document . getElementById ( 'rufflefuncsubmit' ) . onclick = ( ) => {
717+ window . eval ( 'document.getElementById("frame").' + document . getElementById ( 'rufflefunc' ) . value ) ;
718+ document . getElementById ( 'rufflefunc' ) . value = '' ;
719+ }
720+ }
721+
652722//sets the inside of the saved games frame to what it is supposed to be, aka the games that the user has saved
653723function savedGamesList ( ) {
654724 var loadedlist = getCookie ( 'savedGames' ) ;
@@ -781,22 +851,23 @@ function resizeGameFrame() {
781851//waits until the SWF file has finished loading
782852function waitForSwfLoad ( ) {
783853 if ( getCookie ( 'data_isFlash' ) == 1 ) {
784- var done = false ;
785854 var interval = setInterval ( function ( ) {
786855 if ( document . getElementById ( 'frame' ) . _readyState == 2 ) {
787- done = true ;
788856 console . log ( "Finished!" ) ;
789857 var width = document . getElementById ( 'frame' ) . metadata . width ;
790858 document . getElementById ( 'frame' ) . width = width ;
791859 resizeGameFrame ( ) ;
860+ prepareGameOptions ( ) ;
792861 document . getElementById ( 'warn' ) . remove ( ) ;
793- setDownloadLink ( ) ;
794862 clearInterval ( interval ) ;
795863 }
796864 } , 100 ) ;
797865 }
798866 else {
799- document . getElementById ( 'frame' ) . onload = document . getElementById ( 'warn' ) . remove ( ) ;
867+ document . getElementById ( 'frame' ) . onload = ( ) => {
868+ document . getElementById ( 'warn' ) . remove ( ) ;
869+ prepareGameOptions ( ) ;
870+ }
800871 }
801872}
802873
@@ -860,7 +931,9 @@ function splashText() {
860931 'Now with more than 2 lines of code!' ,
861932 '' ,
862933 '01101110 01100101 01110110 01100101 01110010 00100000 01100111 01101111 01101110 01101110 01100001 00100000 01100111 01101001 01110110 01100101 00100000 01111001 01101111 01110101 00100000 01110101 01110000' ,
863- 'They should add subtitles to audio books so deaf people can read them.'
934+ 'They should add subtitles to audio books so deaf people can read them.' ,
935+ 'The most common word in the english language is the' ,
936+ 'Fun fact: In <i>Avengers: Endgame</i> (2019), Thanos says "I am inevitable". This is a mistake from the filmmakers because he is actually Thanos.'
864937 ] ;
865938 var numGames = document . getElementById ( 'sidebar' ) . contentWindow . document . getElementById ( 'games' ) . getElementsByTagName ( 'a' ) . length ;
866939 document . getElementById ( 'splash' ) . innerHTML = splashes [ Math . floor ( Math . random ( ) * splashes . length ) ] ;
0 commit comments