tant42 · January 6, 2025 05:34
diff --git a/index-poki.html b/index-poki.html
 <!DOCTYPE html>
 <html>
 <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title></title>
    <link rel="stylesheet" type="text/css" href="css/gse-style.css" />
    <link rel="stylesheet" type="text/css" href="css/gse-style-loading.css" />
    <style type="text/css">
    body {
        background-color: black;
        margin: 0;
        padding: 0;
    }
    </style>
    <script src="https://game-cdn.poki.com/scripts/v2/poki-sdk.js"></script>
 </head>
 <body>
 <div id="gse-player" class="gse-frame">
 	<!-- The engine will create and insert drawing elements here. -->
 	<div class="gse-overlay">
 		<div id="gse-text" class="gse-dialog">
 			<div>
 				<button id="gse-text-cancel">Cancel</button>
 				<button id="gse-text-done">Done</button>
 				<p id="gse-text-prompt"></p>
 			</div>
 			<div>
 				<textarea id="gse-text-input"></textarea>
 			</div>
 		</div>
 		<div id="gse-browser" class="gse-dialog">			
 			<iframe id="gse-browser-frame"></iframe>
 				<button id="gse-browser-close" href="#">&#10006;</button>
 		</div>
 		<div id="gse-loading" style="visibility: visible;">
 			<img src="images/gse-loading.png" />
 		</div>
 	</div>
 </div>
 <script type="text/javascript">
 (function(global) {

 	// This function is called after the engine script file has loaded.
 	// At that point, the gse.ready function has be defined and we can call it.
 	global.onEngineLoad = async function() {

        await PokiSDK.init();
    
 		// gse.ready() is a global function defined by the engine JavaScript
 		// file. It is the only global function of the API and the only way to
 		// initially interact with the game. The remainder of the API is object-
 		// oriented.
 		// We define a ready callback function and pass it to gse.ready().
 		// Later, that callback will be invoked when the engine is ready.
 		// Via the callback's arguments, the GameSalad code passes us back an
 		// object called "engine" which implements several useful API functions.
 		gse.ready(function(engine) {

 			// These bits of code are optional. This demonstration shows how to
 			// use a delegate to control a loading animation that spins in
 			// between scene loads.
 			// A delegate is a JavaScript object that receives callback from the
 			// engine on particular events.
 			// To customize this animation, you can replace the gse-loading.png
 			// image with another, and you can tailor the CSS styling and
 			// animation to match (say, make it bounce instead of spin).
 			// Or, you can replace this entirely with your own JavaScript code.
 			var loadingElement = document.getElementById('gse-loading');
 			var playerDelegate = {
 				onLoadingBegin: function() {
 					engine.showOverlay();
 					loadingElement.style.visibility = 'visible';
 				},

 				onLoadingEnd: function() {
                    PokiSDK.gameLoadingFinished();
                    loadingElement.style.visibility = 'hidden';
                    engine.hideOverlay();
 				},
        
                onTweetSheet: function (msg, img) {
                    if (msg === "poki:gameplayStart") {
                        PokiSDK.gameplayStart();
                        return;
                    }
                    if (msg === "poki:gameplayStop") {
                        PokiSDK.gameplayStop();
                        return;
                    }
                },
        
                onSceneAboutToChange : function (sceneKey, sceneName, adType) {
                    if (adType === 1) {
                        // Display interstitial
                        let gamePaused = false;
                        PokiSDK.commercialBreak(() => {
                            // if we actually start showing an ad, pause the game ( this function also mutes the game music)
                            gse.pauseGame();
                            gamePaused = true;
                        }).then(() => {
                            // when the ad is completed, or we didn't show an ad run this code
                            if (gamePaused) {
                                gse.playGame();
                              }
                        });
                    } else if (adType === 2) {
                        // Display rewarded ads if available
                        let gamePaused = false;
                        PokiSDK.rewardedBreak(() => {
                            // if the ad loads and will show pause the game and mute the menu music
                            gse.pauseGame();
                            gamePaused = true;
                        }).then((withReward) => {
                            // when the ad is completed, skipped or did not play we run this code
                            if (withReward) {
                                // withReward is a boolean that you receive that indicates wether a user actually finished the video correctly
                                // Adjust this to your actual reward.
                                engine.postEvent('externalWriteGameAttribute', null, 'game.attributes.adReward.name', 'Reward Ad');
                                engine.postEvent('externalWriteGameAttribute', null, 'game.attributes.adReward.value', 10);
                            }
                            if (gamePaused) {
                                gse.playGame(); 
                            }
                        });
                    }
                },

 				onWindowResize: function() {
 					engine.relayout();
 				}
 			};

            engine.appendDelegate(playerDelegate);
 			window.addEventListener('resize', playerDelegate.onWindowResize, false);

 			// Pause and resume on page becoming visible/invisible
 			var MUTE_ON_HIDDEN = false;
 			if (MUTE_ON_HIDDEN) {
 				document.addEventListener("visibilitychange", onVisibilityChanged, false);
 				document.addEventListener("mozvisibilitychange", onVisibilityChanged, false);
 				document.addEventListener("webkitvisibilitychange", onVisibilityChanged, false);
 				document.addEventListener("msvisibilitychange", onVisibilityChanged, false);
 				function onVisibilityChanged() {
 					if (document.hidden || document.mozHidden || document.webkitHidden || document.msHidden)
 						gse.setGameVolume(engine, 0);
 					else
 						gse.setGameVolume(engine, 1);
 				};
 			}

 			// These lines initialize and configure the engine.
 			// The choices for engine.setOptions are:
 			// viewport-reference = game | frame | window
 			// viewport-fit = none | center | fill | letterbox | overscan
 			engine.setRenderFrame('gse-player');
 			engine.setOptions({
 				'viewport-reference': 'window',
 				'viewport-fit': 'letterbox'
 			});
 			engine.loadOptionsFromURL();
 			engine.play();
 		});
 	};

 }(window));
 </script>
 <script type="text/javascript" src="js/gse/gse-export.js" async onload="onEngineLoad()"></script>
 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title></title>
	<link rel="stylesheet" type="text/css" href="css/gse-style.css" />
	<link rel="stylesheet" type="text/css" href="css/gse-style-loading.css" />
	<style type="text/css">
	body {
	background-color: black;
	margin: 0;
	padding: 0;
	}
	</style>
	<script src="https://game-cdn.poki.com/scripts/v2/poki-sdk.js"></script>
	</head>
	<body>
	<div id="gse-player" class="gse-frame">
	<!-- The engine will create and insert drawing elements here. -->
	<div class="gse-overlay">
	<div id="gse-text" class="gse-dialog">
	<div>
	<button id="gse-text-cancel">Cancel</button>
	<button id="gse-text-done">Done</button>
	<p id="gse-text-prompt"></p>
	</div>
	<div>
	<textarea id="gse-text-input"></textarea>
	</div>
	</div>
	<div id="gse-browser" class="gse-dialog">
	<iframe id="gse-browser-frame"></iframe>
	<button id="gse-browser-close" href="#">✖</button>
	</div>
	<div id="gse-loading" style="visibility: visible;">
	<img src="images/gse-loading.png" />
	</div>
	</div>
	</div>
	<script type="text/javascript">
	(function(global) {

	// This function is called after the engine script file has loaded.
	// At that point, the gse.ready function has be defined and we can call it.
	global.onEngineLoad = async function() {

	await PokiSDK.init();

	// gse.ready() is a global function defined by the engine JavaScript
	// file. It is the only global function of the API and the only way to
	// initially interact with the game. The remainder of the API is object-
	// oriented.
	// We define a ready callback function and pass it to gse.ready().
	// Later, that callback will be invoked when the engine is ready.
	// Via the callback's arguments, the GameSalad code passes us back an
	// object called "engine" which implements several useful API functions.
	gse.ready(function(engine) {

	// These bits of code are optional. This demonstration shows how to
	// use a delegate to control a loading animation that spins in
	// between scene loads.
	// A delegate is a JavaScript object that receives callback from the
	// engine on particular events.
	// To customize this animation, you can replace the gse-loading.png
	// image with another, and you can tailor the CSS styling and
	// animation to match (say, make it bounce instead of spin).
	// Or, you can replace this entirely with your own JavaScript code.
	var loadingElement = document.getElementById('gse-loading');
	var playerDelegate = {
	onLoadingBegin: function() {
	engine.showOverlay();
	loadingElement.style.visibility = 'visible';
	},

	onLoadingEnd: function() {
	PokiSDK.gameLoadingFinished();
	loadingElement.style.visibility = 'hidden';
	engine.hideOverlay();
	},

	onTweetSheet: function (msg, img) {
	if (msg === "poki:gameplayStart") {
	PokiSDK.gameplayStart();
	return;
	}
	if (msg === "poki:gameplayStop") {
	PokiSDK.gameplayStop();
	return;
	}
	},

	onSceneAboutToChange : function (sceneKey, sceneName, adType) {
	if (adType === 1) {
	// Display interstitial
	let gamePaused = false;
	PokiSDK.commercialBreak(() => {
	// if we actually start showing an ad, pause the game ( this function also mutes the game music)
	gse.pauseGame();
	gamePaused = true;
	}).then(() => {
	// when the ad is completed, or we didn't show an ad run this code
	if (gamePaused) {
	gse.playGame();
	}
	});
	} else if (adType === 2) {
	// Display rewarded ads if available
	let gamePaused = false;
	PokiSDK.rewardedBreak(() => {
	// if the ad loads and will show pause the game and mute the menu music
	gse.pauseGame();
	gamePaused = true;
	}).then((withReward) => {
	// when the ad is completed, skipped or did not play we run this code
	if (withReward) {
	// withReward is a boolean that you receive that indicates wether a user actually finished the video correctly
	// Adjust this to your actual reward.
	engine.postEvent('externalWriteGameAttribute', null, 'game.attributes.adReward.name', 'Reward Ad');
	engine.postEvent('externalWriteGameAttribute', null, 'game.attributes.adReward.value', 10);
	}
	if (gamePaused) {
	gse.playGame();
	}
	});
	}
	},

	onWindowResize: function() {
	engine.relayout();
	}
	};

	engine.appendDelegate(playerDelegate);
	window.addEventListener('resize', playerDelegate.onWindowResize, false);

	// Pause and resume on page becoming visible/invisible
	var MUTE_ON_HIDDEN = false;
	if (MUTE_ON_HIDDEN) {
	document.addEventListener("visibilitychange", onVisibilityChanged, false);
	document.addEventListener("mozvisibilitychange", onVisibilityChanged, false);
	document.addEventListener("webkitvisibilitychange", onVisibilityChanged, false);
	document.addEventListener("msvisibilitychange", onVisibilityChanged, false);
	function onVisibilityChanged() {
	if (document.hidden \|\| document.mozHidden \|\| document.webkitHidden \|\| document.msHidden)
	gse.setGameVolume(engine, 0);
	else
	gse.setGameVolume(engine, 1);
	};
	}

	// These lines initialize and configure the engine.
	// The choices for engine.setOptions are:
	// viewport-reference = game \| frame \| window
	// viewport-fit = none \| center \| fill \| letterbox \| overscan
	engine.setRenderFrame('gse-player');
	engine.setOptions({
	'viewport-reference': 'window',
	'viewport-fit': 'letterbox'
	});
	engine.loadOptionsFromURL();
	engine.play();
	});
	};

	}(window));
	</script>
	<script type="text/javascript" src="js/gse/gse-export.js" async onload="onEngineLoad()"></script>
	</body>
	</html>