class System {
	constructor() {
		this.lastTime = 0;
	}

	attach(game, canvas) {
		game.init(canvas);

		window.addEventListener('resize', (event) => this.handleResize(event));
		this.handleResize(null);

		window.addEventListener("deviceorientation", (event) => this.handleOrientation(event));

		window.requestAnimationFrame(() => this.raf());
	}

	ajaxGet(url, headers) {
		return new Promise((resolve, reject) => {
			var request = new XMLHttpRequest();
			request.open("GET", url, true);
			request.onreadystatechange = (response) => {
				if (request.readyState != 4 || request.status != 200) return;
				resolve(request.responseText);
			};
			for (let key in headers) {
				request.setRequestHeader(key, headers[key]);
			}
			request.send();
		});
	}

	async jsonGet(url, headers) {
		let jsonObject = await this.ajaxGet(url, headers);
		return JSON.parse(jsonObject);
	}

	handleResize(event) {
		let dpi = this.getDpi();

		canvas.width = canvas.clientWidth * dpi;
		canvas.height = canvas.clientHeight * dpi;
		this.context = canvas.getContext('2d');

		this.context.webkitImageSmoothingEnabled = true;
		this.context.imageSmoothingEnabled = true;

		game.handleResize(event);
	};

	getDpi() {
		return Math.min(2, window.devicePixelRatio);
	}

	raf() {
		let currentTime = new Date().getTime();
		let delta = (currentTime - this.lastTime) / 10;
		this.context.clearRect(0, 0, canvas.width, canvas.height);
		this.context.save();
		this.context.translate(0.5, 0.5);
		game.draw(this.context, delta);
		this.context.restore();
		window.requestAnimationFrame(() => this.raf());
		this.lastTime = currentTime;
	};

	handleOrientation(event) {
		//this.game.handleOrientation(event);
	}
}