module Omni {
    export class PointerLocker {
        hasLock:boolean = false;
        private blocker:HTMLElement = document.getElementById("block");
        private instructions:HTMLElement = document.getElementById("instructions");

        constructor(private onGain:() => void, private onLose:() => void) {
        }

        enable():void {
            let havePointerLock = 'pointerLockElement' in document || 'mozPointerLockElsement' in document || 'webkitPointerLockElement' in document;
            if (!havePointerLock) {
                return;
            }

            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);
        }

        onChange = (event):void => {
            let element = document.body;
            let doc:any = 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();
            }
        };

        onError = (event):void => {

        };

        onClick = (event):void => {
            let element:any = document.body;
            element.requestPointerLock = element.requestPointerLock || element.mozRequestPointerLock || element.webkitRequestPointerLock;
            this.instructions.style.display = "none";

            element.requestPointerLock();
        };

        disable():void {
            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);
        }

        private hide():void {
            this.blocker.style.display = "none";
        }

        private show():void {
            this.blocker.style.display = '-webkit-box';
            this.blocker.style.display = '-moz-box';
            this.blocker.style.display = 'box';

            this.instructions.style.display = "";
        }
    }
}