flushpot1125/BaseSource_Babylonjs.html

## BaseSource_Babylonjs.html
/*referred from http://www.babylonjs-playground.com/#WG9OY#1 */
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <title>Babylon.js sample code</title>

        <!-- Babylon.js -->
        <script src="https://code.jquery.com/pep/0.4.2/pep.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.6.2/dat.gui.min.js"></script>
        <script src="https://preview.babylonjs.com/cannon.js"></script>
        <script src="https://preview.babylonjs.com/Oimo.js"></script>
        <script src="https://preview.babylonjs.com/earcut.min.js"></script>
        <script src="https://preview.babylonjs.com/babylon.js"></script>
        <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>
        <script src="https://preview.babylonjs.com/materialsLibrary/babylonjs.materials.min.js"></script>
        <script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js"></script>
        <script src="https://preview.babylonjs.com/postProcessesLibrary/babylonjs.postProcess.min.js"></script>
        <script src="https://preview.babylonjs.com/loaders/babylonjs.loaders.js"></script>
        <script src="https://preview.babylonjs.com/serializers/babylonjs.serializers.min.js"></script>
        <script src="https://preview.babylonjs.com/gui/babylon.gui.min.js"></script>

        <style>
            html, body {
                overflow: hidden;
                width: 100%;
                height: 100%;
                margin: 0;
                padding: 0;
            }

            #renderCanvas {
                width: 100%;
                height: 100%;
                touch-action: none;
            }
        </style>
    </head>
<body>
    <canvas id="renderCanvas"></canvas>
    <script>
        var canvas = document.getElementById("renderCanvas");

        var createScene = function () {

            // Create the scene space
            var scene = new BABYLON.Scene(engine);

            // Add a camera to the scene and attach it to the canvas
            var camera = new BABYLON.ArcRotateCamera("Camera", Math.PI / 2, Math.PI / 2, 2, BABYLON.Vector3.Zero(), scene);
            camera.attachControl(canvas, true);

            // Add lights to the scene
            var light1 = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(1, 1, 0), scene);
            var light2 = new BABYLON.PointLight("light2", new BABYLON.Vector3(0, 1, -1), scene);

            // Add and manipulate meshes in the scene
            var sphere = BABYLON.MeshBuilder.CreateSphere("sphere", {}, scene);

            return scene;

        };

        var engine = new BABYLON.Engine(canvas, true, { preserveDrawingBuffer: true, stencil: true });
        var scene = createScene();

        engine.runRenderLoop(function () {
            if (scene) {
                scene.render();
            }
        });

        // Resize
        window.addEventListener("resize", function () {
            engine.resize();
        });
    </script>
</body>
</html>
	/referred from http://www.babylonjs-playground.com/#WG9OY#1 /
	<!DOCTYPE html>
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

	<title>Babylon.js sample code</title>

	<!-- Babylon.js -->
	<script src="https://code.jquery.com/pep/0.4.2/pep.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.6.2/dat.gui.min.js"></script>
	<script src="https://preview.babylonjs.com/cannon.js"></script>
	<script src="https://preview.babylonjs.com/Oimo.js"></script>
	<script src="https://preview.babylonjs.com/earcut.min.js"></script>
	<script src="https://preview.babylonjs.com/babylon.js"></script>
	<script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>
	<script src="https://preview.babylonjs.com/materialsLibrary/babylonjs.materials.min.js"></script>
	<script src="https://preview.babylonjs.com/proceduralTexturesLibrary/babylonjs.proceduralTextures.min.js"></script>
	<script src="https://preview.babylonjs.com/postProcessesLibrary/babylonjs.postProcess.min.js"></script>
	<script src="https://preview.babylonjs.com/loaders/babylonjs.loaders.js"></script>
	<script src="https://preview.babylonjs.com/serializers/babylonjs.serializers.min.js"></script>
	<script src="https://preview.babylonjs.com/gui/babylon.gui.min.js"></script>

	<style>
	html, body {
	overflow: hidden;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	}

	#renderCanvas {
	width: 100%;
	height: 100%;
	touch-action: none;
	}
	</style>
	</head>
	<body>
	<canvas id="renderCanvas"></canvas>
	<script>
	var canvas = document.getElementById("renderCanvas");

	var createScene = function () {

	// Create the scene space
	var scene = new BABYLON.Scene(engine);

	// Add a camera to the scene and attach it to the canvas
	var camera = new BABYLON.ArcRotateCamera("Camera", Math.PI / 2, Math.PI / 2, 2, BABYLON.Vector3.Zero(), scene);
	camera.attachControl(canvas, true);

	// Add lights to the scene
	var light1 = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(1, 1, 0), scene);
	var light2 = new BABYLON.PointLight("light2", new BABYLON.Vector3(0, 1, -1), scene);

	// Add and manipulate meshes in the scene
	var sphere = BABYLON.MeshBuilder.CreateSphere("sphere", {}, scene);

	return scene;

	};

	var engine = new BABYLON.Engine(canvas, true, { preserveDrawingBuffer: true, stencil: true });
	var scene = createScene();

	engine.runRenderLoop(function () {
	if (scene) {
	scene.render();
	}
	});

	// Resize
	window.addEventListener("resize", function () {
	engine.resize();
	});
	</script>
	</body>
	</html>