diff options
Diffstat (limited to 'omni.js')
| -rw-r--r-- | omni.js | 557 |
1 files changed, 347 insertions, 210 deletions
@@ -5,108 +5,172 @@ var __extends = (this && this.__extends) || function (d, b) { }; var Omni; (function (Omni) { - var Cube = (function (_super) { - __extends(Cube, _super); - function Cube() { - _super.call(this); - var block = new Omni.LeverBlock(); - } - Cube.prototype.tick = function (delta) { - this.simulate(delta); - }; - return Cube; - }(Physijs.Scene)); - Omni.Cube = Cube; -})(Omni || (Omni = {})); -var Omni; -(function (Omni) { - var BlockLoader = (function () { + /** + * Base game class, will handle the game loop, rendering, + */ + var Game = (function () { /** - * @param files what files to load() + * */ - function BlockLoader(files) { + function Game() { var _this = this; - this.files = files; - this.manager = new THREE.LoadingManager(); - this.loader = new THREE.JSONLoader(this.manager); - this.geometries = {}; - this.materials = {}; - this.loaded = false; - this.manager.onLoad = function () { - _this.loaded = true; + this.ticks = 0; + this.delta = 0; + this.lastFrame = 0; + this.timestep = 1000 / 60; + this.maxFPS = 60; + /** + * + */ + this.start = function () { + console.debug("Game: start"); + //wait around till block_loader is done loading assets + if (!_this.blockLoader.isLoaded()) { + setTimeout(_this.start, 10); + return; + } + //build the level here + _this.cube.init(0); + _this.unpause(); }; + /** + * When leaving the page. + */ + this.stop = function () { + _this.pause(); + console.debug("Game: stop"); + _this.blockLoader.dispose(); + _this.renderer.dispose(); + }; + this.onWindowResize = function () { + _this.camera.aspect = window.innerWidth / window.innerHeight; + _this.camera.updateProjectionMatrix(); + _this.renderer.setSize(window.innerWidth, window.innerHeight); + }; + this.onVisibilityChange = function () { + console.debug("visibility change"); + }; + this.renderer = new THREE.WebGLRenderer({ + antialias: true + }); + this.renderer.setClearColor(0xbababa); + this.renderer.setSize(window.innerWidth, window.innerHeight); + document.body.appendChild(this.renderer.domElement); + window.addEventListener("resize", this.onWindowResize, false); + window.addEventListener("visibilitychange", this.onVisibilityChange, false); + this.camera = new THREE.PerspectiveCamera(Game.CAMERA_FOV, window.innerWidth / window.innerHeight, Game.CAMERA_NEAR, Game.CAMERA_FAR); + this.blockLoader = new Omni.BlockLoader(Omni.BlockLoader.BLOCKS); } /** - * Load all the geometries and materials from mesh_files + * */ - BlockLoader.prototype.load = function () { - var _this = this; - console.log("BlockLoader: loading..."); - this.files.forEach(function (file) { - _this.loadOne(file); - }); + Game.prototype.init = function () { + console.debug("Game: init"); + this.blockLoader.load(); }; /** - * Load additional geometries and mats - * @param file what file to load. Will be prefixed with URL_PREFIX + * */ - BlockLoader.prototype.loadFile = function (file) { - if (this.files.indexOf(file) == -1) { - this.files.push(file); - this.loadOne(file); - } + Game.prototype.unpause = function () { + console.debug("Game: unpause"); + this.keepRunning = true; + this.run(); }; - BlockLoader.prototype.loadOne = function (file) { - var _this = this; - this.loader.load(BlockLoader.URL_PREFIX + file, function (geometry, materials) { - _this.geometries[file] = geometry; - _this.materials[file] = materials; - }); + /** + * + * @param delta + */ + Game.prototype.tick = function (delta) { + this.ticks++; + this.cube.tick(delta); }; /** - * Dispose of all the geometries and mats + * */ - BlockLoader.prototype.dispose = function () { + Game.prototype.render = function () { + this.renderer.render(this.cube, this.camera); + }; + /** + * + * @param timestamp + */ + Game.prototype.run = function (timestamp) { var _this = this; - console.log("BlockLoader: disposing..."); - if (this.loaded) { - this.files.forEach(function (file) { - _this.geometries[file].dispose(); - _this.materials[file].forEach(function (material) { - material.dispose(); - }); - }); - this.loaded = false; + if (!timestamp) { + timestamp = performance.now(); + } + if (timestamp < this.lastFrame + (1000 / this.maxFPS)) { + if (this.keepRunning) { + requestAnimationFrame(function () { return _this.run(); }); + } + return; + } + this.delta += timestamp - this.lastFrame; + this.lastFrame = timestamp; + var numUpdateSteps = 0; + while (this.delta >= this.timestep) { + this.tick(this.timestep); + this.delta -= this.timestep; + if (++numUpdateSteps >= 240) { + // panic here, reset delta + this.delta = 0; + break; + } + } + this.render(); + if (this.keepRunning) { + requestAnimationFrame(function (time) { return _this.run(time); }); } }; - BlockLoader.prototype.isLoaded = function () { - return this.loaded; - }; - BlockLoader.prototype.meshLoaded = function (file) { - return this.geometries[file] !== undefined; - }; - BlockLoader.prototype.matsLoaded = function (file) { - return this.materials[file] !== undefined; - }; - BlockLoader.prototype.getMesh = function (file) { - return this.geometries[file]; - }; - BlockLoader.prototype.getMaterials = function (file) { - return this.materials[file]; + /** + * When releasing pointer lock/on menu. Menu is HTML based. + */ + Game.prototype.pause = function () { + console.debug("Game: pause"); + this.keepRunning = false; }; - BlockLoader.URL_PREFIX = "json/"; - BlockLoader.FILES = [ - PlainBlock.mesh_file, - LeverBlock.mesh_file, - ButtonBlock.mesh_file, - AzimuthBlock.mesh_file, - PullBlock.mesh_file]; - return BlockLoader; + Game.CAMERA_FOV = 55; + Game.CAMERA_NEAR = 1; + Game.CAMERA_FAR = 1000; + return Game; }()); - Omni.BlockLoader = BlockLoader; + Omni.Game = Game; +})(Omni || (Omni = {})); +var game; +var locker; +window.onload = function () { + game = new Omni.Game(); + locker = new Omni.PointerLocker(game.start, game.stop); + game.init(); + locker.enable(); +}; +window.onunload = function () { + locker.disable(); + game.stop(); +}; +var Omni; +(function (Omni) { + var Keyboard = (function () { + function Keyboard() { + } + return Keyboard; + }()); + Omni.Keyboard = Keyboard; + var Mouse = (function () { + function Mouse() { + } + return Mouse; + }()); + Omni.Mouse = Mouse; +})(Omni || (Omni = {})); +var Omni; +(function (Omni) { var Block = (function () { //will take the correct state as params? - function Block() { + function Block(geometry, materials) { + this.geometry = geometry; + this.materials = materials; + this.mesh = new Physijs.BoxMesh(geometry, materials[0], 0); } Block.prototype.getState = function () { return this.state; @@ -114,6 +178,15 @@ var Omni; Block.prototype.setState = function (state) { this.state = state; }; + Block.prototype.setPosition = function (pos) { + this.mesh.position.copy(pos); + }; + Block.prototype.getPosition = function () { + return this.mesh.position.clone(); + }; + Block.prototype.getObject = function () { + return this.mesh; + }; Block.mesh_file = ""; return Block; }()); @@ -123,8 +196,8 @@ var Omni; */ var PlainBlock = (function (_super) { __extends(PlainBlock, _super); - function PlainBlock() { - _super.call(this); + function PlainBlock(loader) { + _super.call(this, loader.getMesh(PlainBlock.mesh_file), loader.getMaterials(PlainBlock.mesh_file)); } PlainBlock.mesh_file = "plainBlock.json"; PlainBlock.states = []; @@ -136,8 +209,8 @@ var Omni; */ var ButtonBlock = (function (_super) { __extends(ButtonBlock, _super); - function ButtonBlock() { - _super.call(this); + function ButtonBlock(loader) { + _super.call(this, loader.getMesh(ButtonBlock.mesh_file), loader.getMaterials(ButtonBlock.mesh_file)); } //need to make good design choices here, with the handling of states.. ButtonBlock.mesh_file = "buttonBlock.json"; @@ -150,8 +223,8 @@ var Omni; */ var LeverBlock = (function (_super) { __extends(LeverBlock, _super); - function LeverBlock() { - _super.call(this); + function LeverBlock(loader) { + _super.call(this, loader.getMesh(LeverBlock.mesh_file), loader.getMaterials(LeverBlock.mesh_file)); } LeverBlock.mesh_file = "leverBlock.json"; LeverBlock.states = [0, 1, 2, 3]; @@ -184,6 +257,89 @@ var Omni; return PullBlock; }(Block)); Omni.PullBlock = PullBlock; + var BlockLoader = (function () { + /** + * @param files what files to load() + */ + function BlockLoader(files) { + var _this = this; + this.files = files; + this.manager = new THREE.LoadingManager(); + this.loader = new THREE.JSONLoader(this.manager); + this.geometries = {}; + this.materials = {}; + this.loaded = false; + this.manager.onLoad = function () { + _this.loaded = true; + console.debug("BlockLoader: loaded"); + }; + } + /** + * Load all the geometries and materials from mesh_files + */ + BlockLoader.prototype.load = function () { + var _this = this; + console.debug("BlockLoader: loading..."); + this.files.forEach(function (file) { + _this.loadOne(file); + }); + }; + /** + * Load additional geometries and mats + * @param file what file to load. Will be prefixed with URL_PREFIX + */ + BlockLoader.prototype.loadFile = function (file) { + if (this.files.indexOf(file) == -1) { + this.files.push(file); + this.loadOne(file); + } + }; + BlockLoader.prototype.loadOne = function (file) { + var _this = this; + this.loader.load(BlockLoader.URL_PREFIX + file, function (geometry, materials) { + _this.geometries[file] = geometry; + _this.materials[file] = materials; + }); + }; + /** + * Dispose of all the geometries and mats + */ + BlockLoader.prototype.dispose = function () { + var _this = this; + console.debug("BlockLoader: disposing..."); + if (this.loaded) { + this.files.forEach(function (file) { + _this.geometries[file].dispose(); + _this.materials[file].forEach(function (material) { + material.dispose(); + }); + }); + this.loaded = false; + } + }; + BlockLoader.prototype.isLoaded = function () { + return this.loaded; + }; + BlockLoader.prototype.meshLoaded = function (file) { + return this.geometries[file] !== undefined; + }; + BlockLoader.prototype.matsLoaded = function (file) { + return this.materials[file] !== undefined; + }; + BlockLoader.prototype.getMesh = function (file) { + return this.geometries[file]; + }; + BlockLoader.prototype.getMaterials = function (file) { + return this.materials[file]; + }; + BlockLoader.URL_PREFIX = "json/"; + BlockLoader.BLOCKS = [ + PlainBlock.mesh_file, + LeverBlock.mesh_file, + ]; + return BlockLoader; + }()); + Omni.BlockLoader = BlockLoader; })(Omni || (Omni = {})); var Omni; (function (Omni) { @@ -208,141 +364,122 @@ var Omni; })(Omni || (Omni = {})); var Omni; (function (Omni) { - var PointerLocker = (function () { - function PointerLocker() { + var Cube = (function (_super) { + __extends(Cube, _super); + function Cube(loader) { + _super.call(this); + this.loader = loader; } - return PointerLocker; - }()); - Omni.PointerLocker = PointerLocker; + Cube.prototype.init = function (level) { + //cube size, 4*4*4 + //generate corners first + var half = Cube.SIZE / 2; + var corners = [ + new THREE.Vector3(-1, -1, -1), + new THREE.Vector3(1, -1, -1), + new THREE.Vector3(-1, -1, 1), + new THREE.Vector3(1, -1, 1), + new THREE.Vector3(-1, 1, -1), + new THREE.Vector3(1, 1, -1), + new THREE.Vector3(-1, 1, 1), + new THREE.Vector3(1, 1, 1) + ]; + for (var _i = 0, corners_1 = corners; _i < corners_1.length; _i++) { + var corner = corners_1[_i]; + var vertex = corner.clone().multiplyScalar(half); + var block = new Omni.PlainBlock(this.loader); + block.setPosition(vertex.add(corner.clone().multiplyScalar(0.5))); + this.add(block.getObject()); + this.blocks.push(block); + } + //then edges + //then fill in the rest + }; + Cube.prototype.tick = function (delta) { + this.simulate(delta); + }; + Cube.SIZE = 4; + return Cube; + }(Physijs.Scene)); + Omni.Cube = Cube; })(Omni || (Omni = {})); -/// <reference path="../ts/three.d.ts" /> -/// <reference path="../ts/physijs.d.ts" /> -/// <reference path="cube.ts" /> -/// <reference path="block.ts" /> -/// <reference path="puzzle.ts" /> -/// <reference path="pointerlock.ts" /> -/// <reference path="interface.ts" /> var Omni; (function (Omni) { - /** - * Base game class, will handle the game loop, rendering, - */ - var Game = (function () { - /** - * - */ - function Game() { + var PointerLocker = (function () { + function PointerLocker(onGain, onLose) { var _this = this; - this.ticks = 0; - this.delta = 0; - this.lastFrame = 0; - this.timestep = 1000 / 60; - this.maxFPS = 60; - this.onWindowResize = function () { - _this.camera.aspect = window.innerWidth / window.innerHeight; - _this.camera.updateProjectionMatrix(); - _this.renderer.setSize(window.innerWidth, window.innerHeight); + this.onGain = onGain; + this.onLose = onLose; + this.hasLock = false; + this.blocker = document.getElementById("block"); + this.instructions = document.getElementById("instructions"); + this.onChange = function (event) { + var element = document.body; + var doc = document; + if (doc.pointerLockElement === element || doc.mozPointerLockElement === element || doc.webkitPointerLockElement === element) { + //gained + _this.hasLock = true; + _this.hide(); + _this.onGain(); + } + else { + //lost + _this.hasLock = false; + _this.show(); + _this.onLose(); + } + }; + this.onError = function (event) { + }; + this.onClick = function (event) { + var element = document.body; + element.requestPointerLock = element.requestPointerLock || element.mozRequestPointerLock || element.webkitRequestPointerLock; + _this.instructions.style.display = "none"; + element.requestPointerLock(); }; - this.renderer = new THREE.WebGLRenderer({ - antialias: true - }); - this.renderer.setClearColor(0xcacaca); - this.renderer.setSize(window.innerWidth, window.innerHeight); - document.body.appendChild(this.renderer.domElement); - window.addEventListener("resize", this.onWindowResize, false); - this.camera = new THREE.PerspectiveCamera(Game.CAMERA_FOV, window.innerWidth / window.innerHeight, Game.CAMERA_NEAR, Game.CAMERA_FAR); - this.block_loader = new Omni.BlockLoader(Omni.BlockLoader.FILES); } - /** - * - */ - Game.prototype.init = function () { - this.block_loader.load(); - }; - /** - * - */ - Game.prototype.start = function () { - }; - /** - * - */ - Game.prototype.unpause = function () { - }; - /** - * - * @param delta - */ - Game.prototype.tick = function (delta) { - this.ticks++; - this.current_cube.tick(delta); - }; - /** - * - */ - Game.prototype.render = function () { - this.renderer.render(this.current_cube, this.camera); - }; - /** - * - * @param timestamp - */ - Game.prototype.run = function (timestamp) { - var _this = this; - if (!timestamp) { - timestamp = performance.now(); - } - if (timestamp < this.lastFrame + (1000 / this.maxFPS)) { - if (this.keepRunning) { - requestAnimationFrame(function () { return _this.run(); }); - } + PointerLocker.prototype.enable = function () { + var havePointerLock = 'pointerLockElement' in document || 'mozPointerLockElsement' in document || 'webkitPointerLockElement' in document; + if (!havePointerLock) { return; } - this.delta += timestamp - this.lastFrame; - this.lastFrame = timestamp; - var numUpdateSteps = 0; - while (this.delta >= this.timestep) { - this.tick(this.timestep); - this.delta -= this.timestep; - if (++numUpdateSteps >= 240) { - // panic here, reset delta - this.delta = 0; - break; - } - } - this.render(); - if (this.keepRunning) { - requestAnimationFrame(function (time) { return _this.run(time); }); - } + document.addEventListener("pointerlockchange", this.onChange, false); + document.addEventListener("mozpointerlockchange", this.onChange, false); + document.addEventListener("webkitpointerlockchange", this.onChange, false); + document.addEventListener("pointerlockerror", this.onError, false); + document.addEventListener("mozpointerlockerror", this.onError, false); + document.addEventListener("webkitpointerlockerror", this.onError, false); + this.blocker.addEventListener("click", this.onClick, false); }; - /** - * When releasing pointer lock/on menu. Menu is HTML based. - */ - Game.prototype.pause = function () { + PointerLocker.prototype.disable = function () { + document.removeEventListener("pointerlockchange", this.onChange, false); + document.removeEventListener("mozpointerlockchange", this.onChange, false); + document.removeEventListener("webkitpointerlockchange", this.onChange, false); + document.removeEventListener("pointerlockerror", this.onError, false); + document.removeEventListener("mozpointerlockerror", this.onError, false); + document.removeEventListener("webkitpointerlockerror", this.onError, false); + this.blocker.removeEventListener("click", this.onClick, false); }; - /** - * When leaving the page. - */ - Game.prototype.stop = function () { - this.block_loader.dispose(); + PointerLocker.prototype.hide = function () { + this.blocker.style.display = "none"; }; - Game.CAMERA_FOV = 55; - Game.CAMERA_NEAR = 1; - Game.CAMERA_FAR = 1000; - return Game; + PointerLocker.prototype.show = function () { + this.blocker.style.display = '-webkit-box'; + this.blocker.style.display = '-moz-box'; + this.blocker.style.display = 'box'; + this.instructions.style.display = ""; + }; + return PointerLocker; }()); - Omni.Game = Game; + Omni.PointerLocker = PointerLocker; })(Omni || (Omni = {})); -var game; -window.onload = function () { - console.log("onload"); - game = new Omni.Game(); - game.init(); - game.start(); -}; -window.onunload = function () { - console.log("onunload"); - game.pause(); - game.stop(); -}; +/// <reference path="../ts/three.d.ts" /> +/// <reference path="../ts/physijs.d.ts" /> +/// <reference path="game.ts" /> +/// <reference path="interface.ts" /> +/// <reference path="input.ts" /> +/// <reference path="block.ts" /> +/// <reference path="puzzle.ts" /> +/// <reference path="cube.ts" /> +/// <reference path="pointerlock.ts" /> //# sourceMappingURL=omni.js.map
\ No newline at end of file |