<commit_before><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% !important;
				height: 100% !important;
				background: transparent;
			}
		</style>
		<canvas id="renderer"></canvas>
	</template>

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

	<script>
		/* globals dtileThreeRenderer */
		const MAX_ZOOM = 1,
			MIN_ZOOM = 0.001;

		Polymer({
			is: "dtile-three-renderer",

			properties: {
				map: Object,

				outline: {
					type: Boolean,
					value: false,
					reflectToAttribute: true
				},

				panX: {
					type: Number,
					value: 0,
					reflectToAttribute: true
				},
				panY: {
					type: Number,
					value: 0,
					reflectToAttribute: true
				},
				zoom: {
					type: Number,
					value: 0.15,
					reflectToAttribute: true
				},

				_toUpdate: Array
			},

			observers: [
				"changeMap(map)",
				"updateCamera(panX, panY, zoom)",
				"setOutline(outline)"
			],

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

				this.renderer = new dtileThreeRenderer.Renderer(this.$.renderer, true);
				this._toUpdate = [];

				this.updateCamera(this.panX, this.panY, this.zoom);
			},

			changeMap(map) {
				this.renderer.changeMap(map);
			},

			getTileAtMouse(position, layerId) {
				return this.renderer.getTileAtMouse(position, layerId);
			},

			updateCamera(panX, panY, zoom) {
				if (!this.renderer) return;

				this.renderer.camera.zoom = Math.pow(zoom, 2) * (MAX_ZOOM - MIN_ZOOM) + MIN_ZOOM;
				this.renderer.camera.position.set(
					panX,
					panY,
					this.renderer.camera.position.z
				);

				this.update(["camera"]);
			},

			setOutline(outline) {
				if (!this.renderer) return;
<commit_msg>Update renderer size on resize to avoid stretching<commit_after><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% !important;
				height: 100% !important;
				background: transparent;
			}
		</style>
		<canvas id="renderer"></canvas>
	</template>

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

	<script>
		/* globals dtileThreeRenderer */
		const MAX_ZOOM = 1,
			MIN_ZOOM = 0.001;

		Polymer({
			is: "dtile-three-renderer",

			properties: {
				map: Object,

				outline: {
					type: Boolean,
					value: false,
					reflectToAttribute: true
				},

				panX: {
					type: Number,
					value: 0,
					reflectToAttribute: true
				},
				panY: {
					type: Number,
					value: 0,
					reflectToAttribute: true
				},
				zoom: {
					type: Number,
					value: 0.15,
					reflectToAttribute: true
				},

				_toUpdate: Array
			},

			observers: [
				"changeMap(map)",
				"updateCamera(panX, panY, zoom)",
				"setOutline(outline)"
			],

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

				this.renderer = new dtileThreeRenderer.Renderer(this.$.renderer, true);
				this._toUpdate = [];

				this.updateCamera(this.panX, this.panY, this.zoom);

				this._sizeListener = this.updateSize.bind(this);
				window.addEventListener("resize", this._sizeListener);
			},

			detached() {
				// TODO: We should probably dispose a lot of stuff here.

				window.removeEventListener("resize", this._sizeListener);
			},

			changeMap(map) {
				this.renderer.changeMap(map);
			},

			getTileAtMouse(position, layerId) {
				return this.renderer.getTileAtMouse(position, layerId);
			},

			updateCamera(panX, panY, zoom) {
				if (!this.renderer) return;

				this.renderer.camera.zoom = Math.pow(zoom, 2) * (MAX_ZOOM - MIN_ZOOM) + MIN_ZOOM;
				this.renderer.camera.position.set(
					panX,
					panY,
					this.renderer.camera.position.z
				);

				this.update(["camera"]);
			},

			updateSize() {
				this.update(["size", "camera"]);
			},

			setOutline(outline) {
				if (!this.renderer) return;

{'fraction_non_alphanumeric': 0.15005917159763313, 'fraction_numerical': 0.009940828402366864, 'mean_word_length': 2.7564444444444445, 'pattern_counts': {'":': 0, '<': 25, '<?xml version=': 0, '>': 25, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6433715', 'n_tokens_mistral': 1936, 'n_tokens_neox': 1447, 'n_words': 277}