editor.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>GLSL Editor</title>
		<link href="/favicon.gif" rel="shortcut icon"/>
		<style>
			body {
				height: 100%;
    			margin: 0;
	  			background: #171e22;
			}

			#glsl_editor {
				height: 100%;
			}
		</style>
	</head>
	<body>
		<div id="glsl_editor"></div>
	</body>

	<link type="text/css" rel="stylesheet" href="assets/css/glslEditor.css">
    <script type="text/javascript" src="assets/js/glslEditor.js"></script>
    <script type="text/javascript">
    	window.glslEditor = new GlslEditor('#glsl_editor', {
    		canvas_size: 500,
            canvas_draggable: true,
            canvas_resizable: true,
    		theme: 'monokai',
            watchHash: true,
            fileDrops: true,
    		menu: true
    	});
        
        const urlParams = new URLSearchParams(window.location.search);
        const file = urlParams.get('file');

		window.glslEditor.open(file,"");
		// window.glslEditor.update();
		console.log("hey");
		
        document.body.style.backgroundColor = window.getComputedStyle(glslEditor.editor.getWrapperElement(),null).getPropertyValue('background-color');
    </script>
    <script>
        (function(i,s,o,g,r,a,m){i["GoogleAnalyticsObject"]=r;i[r]=i[r]||function(){
        (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
        m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
        })(window,document,"script","//www.google-analytics.com/analytics.js","ga");
        ga("create", "UA-18824436-2", "auto");
        ga("send", "pageview");
    </script>
</html>