1
0
Fork 0
mirror of https://github.com/haselkern/Minecraft-ArmorStand.git synced 2025-05-17 00:15:34 +00:00

Add new properties, some style

This commit is contained in:
Lars Martens 2021-08-14 23:31:31 +02:00
parent acbfe92a10
commit b8a514f8f9
4 changed files with 73 additions and 38 deletions

View file

@ -1,13 +1,16 @@
<!DOCTYPE html>
<html lang="en">
<head>
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/png" href="icon.png">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Minecraft Armor Stand</title>
</head>
<body>
</head>
<body class="bg-gray-300">
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</body>
</html>
</body>
</html>

View file

@ -1,27 +1,46 @@
<template>
<div>
<div class="w-3/5 h-screen float-left">
<div class="box-border">
<div class="w-3/5 fixed h-screen">
<Scene :armorstand="armorstand" />
</div>
<div class="w-2/5 float-right">
<label><input v-model="armorstand.showArms" type="checkbox">Show Arms</label>
<label><input v-model="armorstand.small" type="checkbox">Small</label>
<label><input v-model="armorstand.noBasePlate" type="checkbox">No Base Plate</label>
<hr>
<table>
<tr>
<td>Rotation</td>
<td colspan="3">
<input @dblclick="() => armorstand.rotation = 0" class="w-full" type="range" min="-180" max="180" v-model="armorstand.rotation" />
</td>
</tr>
<RotationSliderRow label="Head" :rotation="armorstand.head" />
<RotationSliderRow label="Body" :rotation="armorstand.body" />
<RotationSliderRow label="Left Leg" :rotation="armorstand.legLeft" />
<RotationSliderRow label="Right Leg" :rotation="armorstand.legRight" />
<RotationSliderRow v-if="armorstand.showArms" label="Left Arm" :rotation="armorstand.armLeft" />
<RotationSliderRow v-if="armorstand.showArms" label="Right Arm" :rotation="armorstand.armRight" />
</table>
<div class="w-2/5 right-0 ml-60">
<div class="bg-white m-4 p-4 border border-gray-900">
<select v-model="mcVersion">
<option value="1.16">Minecraft 1.16 and above</option>
<option value="1.14">Minecraft 1.14 &amp; 1.15</option>
<option value="1.13">Minecraft 1.13</option>
<option value="1.11">Minecraft 1.11 &amp; 1.12</option>
<option value="1.9">Minecraft 1.9 &amp; 1.10</option>
<option value="1.8">Minecraft 1.8</option>
</select>
<label><input v-model="armorstand.noBasePlate" type="checkbox">No Base Plate</label>
<label><input v-model="armorstand.noGravity" type="checkbox">No Gravity</label>
<label><input v-model="armorstand.showArms" type="checkbox">Show Arms</label>
<label><input v-model="armorstand.small" type="checkbox">Small</label>
<details>
<summary>Advanced</summary>
<label><input v-model="armorstand.invisible" type="checkbox">Invisible</label>
<label><input v-model="armorstand.invulnerable" type="checkbox">Invulnerable</label>
<label><input v-model="armorstand.persistenceRequired" type="checkbox">Persistence Required</label>
<label><input v-model="armorstand.marker" type="checkbox">Marker</label>
<label><input v-model="armorstand.centerCorrected" type="checkbox">Center Corrected</label>
</details>
<hr>
<table>
<tr>
<td>Rotation</td>
<td colspan="3">
<input @dblclick="() => armorstand.rotation = 0" class="w-full" type="range" min="-180" max="180" v-model="armorstand.rotation" />
</td>
</tr>
<RotationSliderRow label="Head" :rotation="armorstand.head" />
<RotationSliderRow label="Body" :rotation="armorstand.body" />
<RotationSliderRow label="Left Leg" :rotation="armorstand.legLeft" />
<RotationSliderRow label="Right Leg" :rotation="armorstand.legRight" />
<RotationSliderRow v-if="armorstand.showArms" label="Left Arm" :rotation="armorstand.armLeft" />
<RotationSliderRow v-if="armorstand.showArms" label="Right Arm" :rotation="armorstand.armRight" />
</table>
</div>
</div>
</div>
</template>
@ -62,12 +81,17 @@ class Armorstand {
return { x: 1, y: 1, z: 1 }
}
}
// Return the code to generate this armorstand
getCode(mcVersion) {
// TODO Handle different versions
}
}
export default {
data() {
return {
armorstand: new Armorstand(),
mcVersion: "1.16",
}
},
components: { Scene, RotationSliderRow },

View file

@ -1,12 +1,12 @@
<template>
<Renderer ref="renderer" antialias :orbit-ctrl="{ enableDamping: false }" resize="true">
<Renderer ref="renderer" antialias resize alpha :orbit-ctrl="{ enableDamping: false, enablePan: false }">
<Camera :position="{ z: 10 }" />
<Scene>
<AmbientLight :intensity="0.3" />
<DirectionalLight :intensity="1" :position="{ x: 10, y: 9 }" />
<!-- This group contains armorstand + base plate -->
<Group :position="{ y: -8 / 16 }">
<Group :position="{ y: -1 }">
<!--Baseplate-->
<Group :position="{ y: -0.5 / 16 }">
<Box :visible="!armorstand.noBasePlate" :scale="{ x: 12 / 16, y: 1 / 16, z: 12 / 16 }">
@ -17,7 +17,7 @@
</Box>
</Group>
<!--Armorstand-->
<Group :scale="armorstand.getScale()">
<Group :scale="armorstand.getScale()" :rotation="{ y: armorstand.rotation / 180 * Math.PI }">
<!--Left Leg-->
<Group
:rotation="convertRotation(armorstand.legLeft)"

View file

@ -1,11 +1,19 @@
module.exports = {
purge: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
darkMode: false, // or 'media' or 'class'
theme: {
extend: {},
},
variants: {
extend: {},
},
plugins: [],
purge: ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"],
darkMode: false, // or 'media' or 'class'
theme: {
extend: {
flex: {
"2": "2 2 0%",
"3": "3 3 0%",
},
margin: {
"60": "60%",
},
},
},
variants: {
extend: {},
},
plugins: [],
}