1139 lines
38 KiB
Vue
1139 lines
38 KiB
Vue
<template>
|
|
<SMMastHead title="Minecraft Curve Calculator" />
|
|
<SMContainer>
|
|
<SMRow>
|
|
<SMColumn>
|
|
<div ref="container" class="curve-area">
|
|
<svg
|
|
ref="svg"
|
|
id="svgelem"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 1000 800"
|
|
preserveAspectRatio="xMidYMid meet">
|
|
<g id="grid"></g>
|
|
<g id="ruler_grid"></g>
|
|
<g id="main">
|
|
<circle id="p1" cx="299" cy="500" r="10" />
|
|
<circle id="p2" cx="699" cy="500" r="10" />
|
|
|
|
<circle id="c1" cx="299" cy="250" r="8" />
|
|
<circle id="c2" cx="699" cy="250" r="8" />
|
|
|
|
<circle
|
|
id="r1"
|
|
cx="405"
|
|
cy="405"
|
|
r="5"
|
|
style="display: none"
|
|
class="ruler" />
|
|
<circle
|
|
id="r2"
|
|
cx="605"
|
|
cy="505"
|
|
r="5"
|
|
style="display: none"
|
|
class="ruler" />
|
|
|
|
<line
|
|
id="l1"
|
|
x1="100"
|
|
y1="250"
|
|
x2="100"
|
|
y2="100"
|
|
class="controlline" />
|
|
<line
|
|
id="l2"
|
|
x1="400"
|
|
y1="250"
|
|
x2="400"
|
|
y2="100"
|
|
class="controlline" />
|
|
</g>
|
|
</svg>
|
|
</div>
|
|
</SMColumn>
|
|
<SMColumn class="info">
|
|
<SMInput
|
|
type="range"
|
|
label="Grid size"
|
|
:min="5"
|
|
:max="20"
|
|
v-model="gridsize"
|
|
:step="5"
|
|
@input="handleInputGridSize" />
|
|
<SMInput
|
|
type="range"
|
|
label="Curve width"
|
|
:min="1"
|
|
:max="25"
|
|
v-model="curvewidth"
|
|
@input="handleInputCurveWidth" />
|
|
<SMInput
|
|
type="checkbox"
|
|
:checked="ruler"
|
|
label="Show Ruler"
|
|
@input="handleInputRuler" />
|
|
|
|
<div class="ruler_dimensions" v-if="ruler">
|
|
<div>Width: {{ ruler_info.width }}</div>
|
|
<div>Height: {{ ruler_info.height }}</div>
|
|
<div>Area: {{ ruler_info.area }}</div>
|
|
<div>Filled: {{ ruler_info.filled }}</div>
|
|
</div>
|
|
|
|
<SMButton
|
|
@click="handleClickButton"
|
|
type="primary"
|
|
size="small"
|
|
label="Copy curve" />
|
|
</SMColumn>
|
|
</SMRow>
|
|
<SMRow>
|
|
<SMColumn>
|
|
<p class="credit">
|
|
Based on the work at
|
|
<a href="https://iseenbaas.nl/curve/"
|
|
>https://iseenbaas.nl/curve/</a
|
|
>.
|
|
</p>
|
|
</SMColumn>
|
|
</SMRow>
|
|
</SMContainer>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { onMounted, onUnmounted, ref } from "vue";
|
|
import SMMastHead from "../components/SMMastHead.vue";
|
|
import SMInput from "../components/SMInput.vue";
|
|
import SMButton from "../components/SMButton.vue";
|
|
import { useToastStore } from "../store/ToastStore";
|
|
|
|
const container = ref(null);
|
|
const svg = ref(null);
|
|
|
|
var point = {},
|
|
line = {},
|
|
drag = null,
|
|
dPoint,
|
|
maxX,
|
|
maxY;
|
|
var circles = [
|
|
[[]], // 0
|
|
[[1]], // 1
|
|
[
|
|
[1, 1],
|
|
[1, 1],
|
|
], // 2
|
|
[
|
|
[0, 1, 0],
|
|
[1, 1, 1],
|
|
[0, 1, 0],
|
|
], // 3
|
|
[
|
|
[0, 1, 1, 0],
|
|
[1, 1, 1, 1],
|
|
[1, 1, 1, 1],
|
|
[0, 1, 1, 0],
|
|
], // 4
|
|
[
|
|
[0, 0, 1, 0, 0],
|
|
[0, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 0],
|
|
[0, 0, 1, 0, 0],
|
|
], // 5
|
|
[
|
|
[0, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 0],
|
|
], // 6
|
|
[
|
|
[0, 0, 0, 1, 0, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 0, 1, 0, 0, 0],
|
|
], // 7
|
|
[
|
|
[0, 0, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 0, 0],
|
|
], // 8
|
|
[
|
|
[0, 0, 0, 0, 1, 0, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 0, 1, 0, 0, 0, 0],
|
|
], // 9
|
|
[
|
|
[0, 0, 0, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 0, 0, 0],
|
|
], // 10
|
|
[
|
|
[0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0],
|
|
], // 11
|
|
[
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
], // 12
|
|
[
|
|
[0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0],
|
|
], // 13
|
|
[
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
], // 14
|
|
[
|
|
[0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0],
|
|
], // 15
|
|
[
|
|
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
|
|
], // 16
|
|
[
|
|
[0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0],
|
|
], // 17
|
|
[
|
|
[0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0],
|
|
], // 18
|
|
[
|
|
[0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0],
|
|
], // 19
|
|
[
|
|
[0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0],
|
|
], // 20
|
|
[
|
|
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
|
|
], // 21
|
|
[
|
|
[0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0],
|
|
], // 22
|
|
[
|
|
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0],
|
|
[0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
|
|
[0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0],
|
|
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
|
|
], // 23
|
|
[
|
|
[
|
|
0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0,
|
|
0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0,
|
|
0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0,
|
|
0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0,
|
|
0,
|
|
],
|
|
[
|
|
0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0,
|
|
0,
|
|
],
|
|
[
|
|
0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0,
|
|
0,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
0,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
0,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
0,
|
|
],
|
|
[
|
|
1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1,
|
|
],
|
|
[
|
|
1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1,
|
|
],
|
|
[
|
|
1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1,
|
|
],
|
|
[
|
|
1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1,
|
|
],
|
|
[
|
|
1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1,
|
|
],
|
|
[
|
|
1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
0,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
0,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
0,
|
|
],
|
|
[
|
|
0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0,
|
|
0,
|
|
],
|
|
[
|
|
0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0,
|
|
0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0,
|
|
0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0,
|
|
0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0,
|
|
0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0,
|
|
0,
|
|
],
|
|
], // 24
|
|
[
|
|
[
|
|
0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1, 0,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1, 0,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1, 0,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1, 0,
|
|
],
|
|
[
|
|
1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1, 1,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1, 0,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1, 0,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1, 0,
|
|
],
|
|
[
|
|
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
1, 0,
|
|
],
|
|
[
|
|
0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0,
|
|
0, 0,
|
|
],
|
|
[
|
|
0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
|
|
0, 0,
|
|
],
|
|
], // 25
|
|
];
|
|
|
|
// define initial points
|
|
/**
|
|
*
|
|
*/
|
|
function Init() {
|
|
var c = svg.value.getElementsByTagName("circle");
|
|
for (var i = 0; i < c.length; i++) {
|
|
point[c[i].getAttributeNS(null, "id")] = {
|
|
x: parseInt(c[i].getAttributeNS(null, "cx"), 10),
|
|
y: parseInt(c[i].getAttributeNS(null, "cy"), 10),
|
|
};
|
|
}
|
|
|
|
// lines
|
|
line.l1 = svg.value.getElementById("l1");
|
|
line.l2 = svg.value.getElementById("l2");
|
|
line.curve = svg.value.getElementById("curve");
|
|
|
|
// event handlers
|
|
svg.value.onmousedown = svg.value.onmousemove = svg.value.onmouseup = Drag;
|
|
svg.value.ontouchstart =
|
|
svg.value.ontouchmove =
|
|
svg.value.ontouchend =
|
|
Drag;
|
|
|
|
// setPixels is empty
|
|
//setPixels = [];
|
|
}
|
|
|
|
/**
|
|
*
|
|
*/
|
|
function DrawGrid() {
|
|
const ggrid = document.getElementById("grid");
|
|
|
|
// empty grid
|
|
while (ggrid.firstElementChild) {
|
|
ggrid.firstElementChild.remove();
|
|
}
|
|
|
|
for (let x = 0; x < maxX; x += gridsize.value) {
|
|
var xpos = Math.round(x / gridsize.value);
|
|
for (let y = 0; y < maxY; y += gridsize.value) {
|
|
var ypos = Math.round(y / gridsize.value);
|
|
var id = "grid_" + xpos + "_" + ypos;
|
|
|
|
var rect = document.createElementNS(
|
|
"http://www.w3.org/2000/svg",
|
|
"rect"
|
|
);
|
|
rect.setAttributeNS(null, "x", x);
|
|
rect.setAttributeNS(null, "y", y);
|
|
rect.setAttributeNS(null, "width", gridsize.value);
|
|
rect.setAttributeNS(null, "height", gridsize.value);
|
|
rect.setAttributeNS(null, "fill", "transparent");
|
|
rect.setAttributeNS(null, "stroke", "#eee");
|
|
rect.setAttributeNS(null, "stroke-width", 1);
|
|
rect.setAttributeNS(null, "id", id);
|
|
|
|
ggrid.append(rect);
|
|
}
|
|
}
|
|
}
|
|
|
|
const ruler_info = ref({
|
|
width: 0,
|
|
height: 0,
|
|
area: 0,
|
|
filled: 0,
|
|
});
|
|
|
|
/**
|
|
*
|
|
*/
|
|
function DrawRuler() {
|
|
let ruler_grid = document.getElementById("ruler_grid");
|
|
let r1 = document.getElementById("r1");
|
|
let r2 = document.getElementById("r2");
|
|
|
|
// empty ruler grid
|
|
while (ruler_grid.firstElementChild) {
|
|
ruler_grid.firstElementChild.remove();
|
|
}
|
|
|
|
// handles
|
|
if (r1.style.display == "none") {
|
|
r1.style.display = "block";
|
|
}
|
|
if (r2.style.display == "none") {
|
|
r2.style.display = "block";
|
|
}
|
|
|
|
// ruler
|
|
const rmin = [
|
|
Math.floor(Math.min(point.r1.x, point.r2.x) / gridsize.value),
|
|
Math.floor(Math.min(point.r1.y, point.r2.y) / gridsize.value),
|
|
];
|
|
const rmax = [
|
|
Math.floor(Math.max(point.r1.x, point.r2.x) / gridsize.value),
|
|
Math.floor(Math.max(point.r1.y, point.r2.y) / gridsize.value),
|
|
];
|
|
|
|
ruler_info.value.width = 1 + rmax[0] - rmin[0];
|
|
ruler_info.value.height = 1 + rmax[1] - rmin[1];
|
|
ruler_info.value.area = ruler_info.value.width * ruler_info.value.height;
|
|
ruler_info.value.filled = 0;
|
|
|
|
// ruler
|
|
var rect = document.createElementNS("http://www.w3.org/2000/svg", "rect");
|
|
rect.setAttributeNS(null, "x", rmin[0] * gridsize.value);
|
|
rect.setAttributeNS(null, "y", rmin[1] * gridsize.value);
|
|
rect.setAttributeNS(null, "width", ruler_info.value.width * gridsize.value);
|
|
rect.setAttributeNS(
|
|
null,
|
|
"height",
|
|
ruler_info.value.height * gridsize.value
|
|
);
|
|
rect.setAttributeNS(null, "fill", "#00c");
|
|
rect.setAttributeNS(null, "fill-opacity", "0.2");
|
|
rect.setAttributeNS(null, "stroke", "#eee");
|
|
rect.setAttributeNS(null, "stroke-width", 1);
|
|
rect.setAttributeNS(null, "id", "ruler_rect");
|
|
ruler_grid.append(rect);
|
|
|
|
// filled
|
|
for (let x = rmin[0]; x <= rmax[0]; x += 1) {
|
|
for (let y = rmin[1]; y <= rmax[1]; y += 1) {
|
|
var grid = document.getElementById("grid_" + x + "_" + y);
|
|
if (grid) {
|
|
if (grid.style.fill != "transparent") {
|
|
ruler_info.value.filled += 1;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/**
|
|
*
|
|
*/
|
|
function HideRuler() {
|
|
const ruler_grid = document.getElementById("ruler_grid");
|
|
const r1 = document.getElementById("r1");
|
|
const r2 = document.getElementById("r2");
|
|
|
|
// hide grid
|
|
while (ruler_grid.firstElementChild) {
|
|
ruler_grid.firstElementChild.remove();
|
|
}
|
|
|
|
// hide handles
|
|
r1.style.display = "none";
|
|
r2.style.display = "none";
|
|
}
|
|
|
|
// draw curve
|
|
/**
|
|
*
|
|
*/
|
|
function DrawSVG() {
|
|
// control line 1
|
|
line.l1.setAttributeNS(null, "x1", point.p1.x);
|
|
line.l1.setAttributeNS(null, "y1", point.p1.y);
|
|
line.l1.setAttributeNS(null, "x2", point.c1.x);
|
|
line.l1.setAttributeNS(null, "y2", point.c1.y);
|
|
|
|
// control line 2
|
|
var c2 = point.c2 ? "c2" : "c1";
|
|
line.l2.setAttributeNS(null, "x1", point.p2.x);
|
|
line.l2.setAttributeNS(null, "y1", point.p2.y);
|
|
line.l2.setAttributeNS(null, "x2", point.c2.x);
|
|
line.l2.setAttributeNS(null, "y2", point.c2.y);
|
|
|
|
// curve
|
|
var d =
|
|
"M" +
|
|
point.p1.x +
|
|
"," +
|
|
point.p1.y +
|
|
" C" +
|
|
point.c1.x +
|
|
"," +
|
|
point.c1.y +
|
|
" " +
|
|
(point.c2 ? point.c2.x + "," + point.c2.y + " " : "") +
|
|
point.p2.x +
|
|
"," +
|
|
point.p2.y;
|
|
//line.curve.setAttributeNS(null, "d", d);
|
|
|
|
// clear pixels
|
|
for (let x = 0; x < maxX; x += gridsize.value) {
|
|
var xpos = x / gridsize.value;
|
|
for (let y = 0; y < maxY; y += gridsize.value) {
|
|
var ypos = y / gridsize.value;
|
|
var id = "grid_" + xpos + "_" + ypos;
|
|
var rect = document.getElementById(id);
|
|
if (rect) {
|
|
rect.style.fill = "transparent";
|
|
}
|
|
}
|
|
}
|
|
|
|
// grid dimensions
|
|
var dimx = Math.floor(maxX / gridsize.value);
|
|
var dimy = Math.floor(maxY / gridsize.value);
|
|
var filled = {};
|
|
var done = {};
|
|
|
|
// new pixels
|
|
for (var t = 0; t <= 1; t += 1 / 500) {
|
|
var bx =
|
|
Math.pow(1 - t, 3) * point.p1.x +
|
|
3 * Math.pow(1 - t, 2) * t * point.c1.x +
|
|
3 * Math.pow(t, 2) * (1 - t) * point.c2.x +
|
|
Math.pow(t, 3) * point.p2.x;
|
|
var by =
|
|
Math.pow(1 - t, 3) * point.p1.y +
|
|
3 * Math.pow(1 - t, 2) * t * point.c1.y +
|
|
3 * Math.pow(t, 2) * (1 - t) * point.c2.y +
|
|
Math.pow(t, 3) * point.p2.y;
|
|
|
|
// center
|
|
var gridx = Math.round(bx / gridsize.value);
|
|
var gridy = Math.round(by / gridsize.value);
|
|
var id = "grid_" + gridx + "_" + gridy;
|
|
|
|
if (id in done) {
|
|
continue;
|
|
} else {
|
|
done[id] = 1;
|
|
}
|
|
|
|
// circle around center
|
|
if (curvewidth.value == 1) {
|
|
var rect = document.getElementById(id);
|
|
if (rect) {
|
|
rect.style.fill = "#888";
|
|
}
|
|
} else {
|
|
var circle = circles[curvewidth.value];
|
|
var offset = Math.floor(curvewidth.value / 2);
|
|
|
|
for (let x = 0; x < curvewidth.value; x++) {
|
|
for (let y = 0; y < curvewidth.value; y++) {
|
|
var posx = gridx + x - offset;
|
|
var posy = gridy + y - offset;
|
|
var id = "grid_" + posx + "_" + posy;
|
|
if (id in filled) {
|
|
continue;
|
|
}
|
|
|
|
if (posx >= 0 && posy >= 0 && posx < dimx && posy < dimy) {
|
|
if (circle[y][x] == 1) {
|
|
var rect = document.getElementById(id);
|
|
if (rect) {
|
|
rect.style.fill = "#888";
|
|
}
|
|
filled[id] = 1;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/**
|
|
*
|
|
*/
|
|
function copyArrayToClipboard() {
|
|
var dimx = Math.floor(maxX / gridsize.value);
|
|
var dimy = Math.floor(maxY / gridsize.value);
|
|
var grid_array = [];
|
|
var rangeX = [dimx, -1];
|
|
var rangeY = [dimy, -1];
|
|
|
|
// find bounding box for curve
|
|
for (let y = 0; y < dimy; y++) {
|
|
var row = [];
|
|
for (let x = 0; x < dimx; x++) {
|
|
var grid = document.getElementById("grid_" + x + "_" + y);
|
|
if (grid) {
|
|
row.push(grid.style.fill == "transparent" ? 0 : 1);
|
|
}
|
|
}
|
|
var left = row.indexOf(1);
|
|
var right = row.lastIndexOf(1);
|
|
if (left >= 0 && left < rangeX[0]) {
|
|
rangeX[0] = left;
|
|
}
|
|
if (right >= 0 && right > rangeX[1]) {
|
|
rangeX[1] = right;
|
|
}
|
|
if (left >= 0 && y < rangeY[0]) {
|
|
rangeY[0] = y;
|
|
}
|
|
if (left >= 0 && y > rangeY[1]) {
|
|
rangeY[1] = y;
|
|
}
|
|
|
|
grid_array.push(row);
|
|
}
|
|
|
|
// select curve and format
|
|
var curve = grid_array
|
|
.slice(rangeY[0], rangeY[1] + 1)
|
|
.map(
|
|
(row) => "[" + row.slice(rangeX[0], rangeX[1] + 1).toString() + "]"
|
|
);
|
|
|
|
// write to clipboard
|
|
navigator.clipboard.writeText(
|
|
"var array = [\n" + curve.join(",\n") + "\n];"
|
|
);
|
|
|
|
useToastStore().addToast({
|
|
title: "Copied to Clipboard",
|
|
content: "The curve has been copied to the clipboard.",
|
|
type: "success",
|
|
});
|
|
}
|
|
|
|
/**
|
|
*
|
|
* @param e
|
|
*/
|
|
function Drag(e) {
|
|
e.stopPropagation();
|
|
var t = e.target,
|
|
id = t.id,
|
|
et = e.type,
|
|
m = MousePos(e);
|
|
|
|
// start drag
|
|
if (
|
|
!drag &&
|
|
typeof point[id] != "undefined" &&
|
|
(et == "mousedown" || et == "touchstart")
|
|
) {
|
|
drag = t;
|
|
dPoint = m;
|
|
}
|
|
|
|
// drag
|
|
if (drag && (et == "mousemove" || et == "touchmove")) {
|
|
id = drag.id;
|
|
point[id].x += m.x - dPoint.x;
|
|
point[id].y += m.y - dPoint.y;
|
|
dPoint = m;
|
|
drag.setAttributeNS(null, "cx", point[id].x);
|
|
drag.setAttributeNS(null, "cy", point[id].y);
|
|
DrawSVG();
|
|
|
|
if (ruler.value) {
|
|
DrawRuler();
|
|
}
|
|
}
|
|
|
|
// stop drag
|
|
if (drag && (et == "mouseup" || et == "touchend")) {
|
|
drag = null;
|
|
}
|
|
}
|
|
|
|
// mouse position
|
|
/**
|
|
*
|
|
* @param event
|
|
*/
|
|
function MousePos(event) {
|
|
return {
|
|
x: Math.max(0, Math.min(maxX, event.pageX)),
|
|
y: Math.max(0, Math.min(maxY, event.pageY)),
|
|
};
|
|
}
|
|
|
|
// start
|
|
|
|
const curvewidth = ref(1);
|
|
const handleInputCurveWidth = (event) => {
|
|
curvewidth.value = parseInt(event.target.value);
|
|
DrawSVG();
|
|
if (ruler.value) {
|
|
DrawRuler();
|
|
}
|
|
};
|
|
|
|
const gridsize = ref(10);
|
|
const handleInputGridSize = (event) => {
|
|
gridsize.value = parseInt(event.target.value);
|
|
DrawGrid();
|
|
DrawSVG();
|
|
if (ruler.value) {
|
|
DrawRuler();
|
|
}
|
|
};
|
|
|
|
const ruler = ref(false);
|
|
const handleInputRuler = (event) => {
|
|
ruler.value = event.target.checked;
|
|
DrawGrid();
|
|
DrawSVG();
|
|
if (ruler.value) {
|
|
DrawRuler();
|
|
} else {
|
|
HideRuler();
|
|
}
|
|
};
|
|
|
|
const handleClickButton = () => {
|
|
copyArrayToClipboard();
|
|
};
|
|
|
|
onMounted(() => {
|
|
maxX = 1000;
|
|
maxY = 800;
|
|
Init();
|
|
DrawGrid();
|
|
DrawSVG();
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.page-minecraft-curve {
|
|
.curve-area svg {
|
|
background: var(--base-color-light);
|
|
}
|
|
|
|
.info {
|
|
max-width: 250px;
|
|
|
|
.ruler_dimensions {
|
|
border: 1px solid var(--base-color-dark);
|
|
background-color: var(--base-color-light);
|
|
padding: 8px;
|
|
margin-top: -16px;
|
|
margin-bottom: 16px;
|
|
font-family: "Courier New", Courier, monospace;
|
|
font-size: 75%;
|
|
font-weight: 600;
|
|
}
|
|
}
|
|
|
|
path {
|
|
stroke-width: 4;
|
|
stroke: #000;
|
|
stroke-linecap: round;
|
|
fill: none;
|
|
}
|
|
|
|
circle {
|
|
stroke-width: 2;
|
|
stroke: #c00;
|
|
fill: transparent;
|
|
}
|
|
|
|
circle:hover {
|
|
fill: #c00;
|
|
cursor: move;
|
|
}
|
|
|
|
circle.ruler {
|
|
stroke-width: 2;
|
|
stroke: #00c;
|
|
fill: transparent;
|
|
}
|
|
|
|
circle.ruler:hover {
|
|
fill: #00c;
|
|
cursor: move;
|
|
}
|
|
|
|
line.controlline {
|
|
stroke-width: 1;
|
|
stroke: #999;
|
|
stroke-linecap: round;
|
|
stroke-dasharray: 5, 3;
|
|
}
|
|
|
|
.credit {
|
|
font-size: 75%;
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 768px) {
|
|
.page-minecraft-curve {
|
|
.info {
|
|
margin-top: 32px;
|
|
max-width: none;
|
|
}
|
|
}
|
|
}
|
|
</style>
|