Davide

  • Nov 30, 2021
  • Joined Nov 30, 2021
  • 0 best answers
  • This is one example

    <!DOCTYPE html>
    <html xmlns='http://www.w3.org/1999/xhtml' lang='' xml:lang=''>
    <head>
    	
    </head>
    <body>
    	<canvas id='canvas'>
    		HTML5 canvas appears to be unsupported in the current browser.<br />
    		Please try updating or use a different browser.
    	</canvas>
    	<div id='status'>
    		<div id='status-progress' style='display: none;' oncontextmenu='event.preventDefault();'><div id ='status-progress-inner'></div></div>
    		<div id='status-indeterminate' style='display: none;' oncontextmenu='event.preventDefault();'>
    			<div></div>
    			<div></div>
    			<div></div>
    			<div></div>
    			<div></div>
    			<div></div>
    			<div></div>
    			<div></div>
    		</div>
    		<div id='status-notice' class='godot' style='display: none;'></div>
    	</div>
    
    	<script type='text/javascript' src='PRCuoreLogin.js'></script>
    	<script type='text/javascript'>//<![CDATA[
    
    		const GODOT_CONFIG = {"args":[],"canvasResizePolicy":2,"executable":"PRCuoreLogin","experimentalVK":false,"fileSizes":{"PRCuoreLogin.pck":523424000,"PRCuoreLogin.wasm":23477599},"gdnativeLibs":[]};
    		var engine = new Engine(GODOT_CONFIG);
    
    		(function() {
    			const INDETERMINATE_STATUS_STEP_MS = 100;
    			var statusProgress = document.getElementById('status-progress');
    			var statusProgressInner = document.getElementById('status-progress-inner');
    			var statusIndeterminate = document.getElementById('status-indeterminate');
    			var statusNotice = document.getElementById('status-notice');
    
    			var initializing = true;
    			var statusMode = 'hidden';
    
    			var animationCallbacks = [];
    			function animate(time) {
    				animationCallbacks.forEach(callback => callback(time));
    				requestAnimationFrame(animate);
    			}
    			requestAnimationFrame(animate);
    
    			function setStatusMode(mode) {
    
    				if (statusMode === mode || !initializing)
    					return;
    				[statusProgress, statusIndeterminate, statusNotice].forEach(elem => {
    					elem.style.display = 'none';
    				});
    				animationCallbacks = animationCallbacks.filter(function(value) {
    					return (value != animateStatusIndeterminate);
    				});
    				switch (mode) {
    					case 'progress':
    						statusProgress.style.display = 'block';
    						break;
    					case 'indeterminate':
    						statusIndeterminate.style.display = 'block';
    						animationCallbacks.push(animateStatusIndeterminate);
    						break;
    					case 'notice':
    						statusNotice.style.display = 'block';
    						break;
    					case 'hidden':
    						break;
    					default:
    						throw new Error('Invalid status mode');
    				}
    				statusMode = mode;
    			}
    
    			function animateStatusIndeterminate(ms) {
    				var i = Math.floor(ms / INDETERMINATE_STATUS_STEP_MS % 8);
    				if (statusIndeterminate.children[i].style.borderTopColor == '') {
    					Array.prototype.slice.call(statusIndeterminate.children).forEach(child => {
    						child.style.borderTopColor = '';
    					});
    					statusIndeterminate.children[i].style.borderTopColor = '#dfdfdf';
    				}
    			}
    
    			function setStatusNotice(text) {
    				while (statusNotice.lastChild) {
    					statusNotice.removeChild(statusNotice.lastChild);
    				}
    				var lines = text.split('\n');
    				lines.forEach((line) => {
    					statusNotice.appendChild(document.createTextNode(line));
    					statusNotice.appendChild(document.createElement('br'));
    				});
    			};
    
    			function displayFailureNotice(err) {
    				var msg = err.message || err;
    				console.error(msg);
    				setStatusNotice(msg);
    				setStatusMode('notice');
    				initializing = false;
    			};
    
    			if (!Engine.isWebGLAvailable()) {
    				displayFailureNotice('WebGL not available');
    			} else {
    				setStatusMode('indeterminate');
    				engine.preloadFile('main.pck').then(() => {
     
    				engine.startGame({
    					'onProgress': function (current, total) {
    						if (total > 0) {
    							statusProgressInner.style.width = current/total * 100 + '%';
    							setStatusMode('progress');
    							if (current === total) {
    								// wait for progress bar animation
    								setTimeout(() => {
    									setStatusMode('indeterminate');
    								}, 500);
    							}
    						} else {
    							setStatusMode('indeterminate');
    						}
    					},
    				}).then(() => {
    					setStatusMode('hidden');
    					initializing = false;
    				}, displayFailureNotice);
    				
    				});
    			}
    			
    		})();
    	//]]></script>
    </body>
    </html>