<link rel="import" href="../../bower_components/polymer/polymer.html">

<dom-module id="dtile-three-renderer">
	<template>
		<style>
			:host, #renderer {
				display: block;
				position: absolute;
				top: 0; right: 0; bottom: 0; left: 0;
				width: 100%;
				height: 100%;
				background: transparent;
			}
		</style>
		<canvas id="renderer"></canvas>
	</template>

	<script src="../../node_modules/dtile-three-renderer/out/js/build.js"></script>

	<script>
		/* globals dtileThreeRenderer */
		Polymer({
			is: "dtile-three-renderer",

			properties: {
				map: Object
			},

			attached() {
				if (window.mocha) {
					dtileThreeRenderer.Renderer.enableTesting();
				}

				this.renderer = new dtileThreeRenderer.Renderer(this.$.renderer, true);
			}
		});
	</script>
</dom-module>

<link rel="import" href="../../bower_components/polymer/polymer.html">

<dom-module id="dtile-three-renderer">
	<template>
		<style>
			:host, #renderer {
				display: block;
				position: absolute;
				top: 0; right: 0; bottom: 0; left: 0;
				width: 100%;
				height: 100%;
				background: transparent;
			}
		</style>
		<canvas id="renderer"></canvas>
	</template>

	<script src="../../node_modules/dtile-three-renderer/out/js/build.js"></script>

	<script>
		/* globals dtileThreeRenderer */
		Polymer({
			is: "dtile-three-renderer",

			properties: {
				map: Object
			},

			observers: [
				"changeMap(map)"
			],

			attached() {
				if (window.mocha) {
					dtileThreeRenderer.Renderer.enableTesting();
				}

				this.renderer = new dtileThreeRenderer.Renderer(this.$.renderer, true);
			},

			changeMap(map) {
				this.renderer.changeMap(map);
			}
		});
	</script>
</dom-module>

Implement map changing on load
Implement map changing on load
