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

Add full armor stand control

Browse source
This commit is contained in:
Lars Martens 2021-08-12 19:16:47 +02:00
parent dab3e20310
commit 477e1152e5
2 changed files with 122 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/App.vue
View file

@ -4,6 +4,10 @@
<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>
@ -12,6 +16,11 @@
</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>
@ -46,6 +55,13 @@ class Armorstand {
// TODO Lots more to come
}
getScale() {
if (this.small) {
return { x: 0.6, y: 0.6, z: 0.6 }
} else {
return { x: 1, y: 1, z: 1 }
}
}
}
export default {

116
src/Scene.vue
View file

@ -4,16 +4,111 @@
<Scene>
<AmbientLight :intensity="0.3" />
<DirectionalLight :intensity="1" :position="{ x: 10, y: 9 }" />
<Box ref="box" :rotation="scaledRotation">
<LambertMaterial />
</Box>
<!-- This group contains armorstand + base plate -->
<Group :position="{ y: -8 / 16 }">
<!--Baseplate-->
<Group :position="{ y: -0.5 / 16 }">
<Box :visible="!armorstand.noBasePlate" :scale="{ x: 12 / 16, y: 1 / 16, z: 12 / 16 }">
<LambertMaterial />
</Box>
<Box :position="{ z: 10 / 16}" :scale="{ x: 2 / 16, y: 1 / 16, z: 4 / 16 }">
<LambertMaterial />
</Box>
</Group>
<!--Armorstand-->
<Group :scale="armorstand.getScale()">
<!--Left Leg-->
<Group
:rotation="convertRotation(armorstand.legLeft)"
:position="{ x: 2 / 16, y: 11 / 16, z: 0 }">
<Box
:position="{ x: 0, y: -5.5 / 16, z: 0 }"
:scale="{ x: 2 / 16, y: 11 / 16, z: 2 / 16 }">
<LambertMaterial />
</Box>
</Group>
<!--Right Leg-->
<Group
:rotation="convertRotation(armorstand.legRight)"
:position="{ x: -2 / 16, y: 11 / 16, z: 0 }">
<Box
:position="{ x: 0, y: -5.5 / 16, z: 0 }"
:scale="{ x: 2 / 16, y: 11 / 16, z: 2 / 16 }">
<LambertMaterial />
</Box>
</Group>
<!--Left Arm-->
<Group
:visible="armorstand.showArms"
:rotation="convertRotation(armorstand.armLeft)"
:position="{ x: 6 / 16, y: 21 / 16, z: 0 }">
<Box
:position="{ x: 0, y: -4 / 16, z: 0 }"
:scale="{ x: 2 / 16, y: 12 / 16, z: 2 / 16 }">
<LambertMaterial />
</Box>
</Group>
<!--Right Arm-->
<Group
:visible="armorstand.showArms"
:rotation="convertRotation(armorstand.armRight)"
:position="{ x: -6 / 16, y: 21 / 16, z: 0 }">
<Box
:position="{ x: 0, y: -4 / 16, z: 0 }"
:scale="{ x: 2 / 16, y: 12 / 16, z: 2 / 16 }">
<LambertMaterial />
</Box>
</Group>
<!--Body-->
<Group
:rotation="convertRotation(armorstand.body)"
:position="{ x: 0 / 16, y: 23 / 16, z: 0 }">
<Box
:position="{ x: 0, y: -11 / 16, z: 0 }"
:scale="{ x: 8 / 16, y: 2 / 16, z: 2 / 16 }">
<LambertMaterial />
</Box>
<Box
:position="{ x: 2 / 16, y: -6.5 / 16, z: 0 }"
:scale="{ x: 2 / 16, y: 7 / 16, z: 2 / 16 }">
<LambertMaterial />
</Box>
<Box
:position="{ x: -2 / 16, y: -6.5 / 16, z: 0 }"
:scale="{ x: 2 / 16, y: 7 / 16, z: 2 / 16 }">
<LambertMaterial />
</Box>
<Box
:position="{ x: 0 / 16, y: -1.5 / 16, z: 0 }"
:scale="{ x: 12 / 16, y: 3 / 16, z: 3 / 16 }">
<LambertMaterial />
</Box>
</Group>
<!--Head-->
<Group
:rotation="convertRotation(armorstand.head)"
:position="{ x: 0 / 16, y: 22 / 16, z: 0 }">
<Box
:position="{ x: 0, y: 3.5 / 16, z: 0 }"
:scale="{ x: 2 / 16, y: 7 / 16, z: 2 / 16 }">
<LambertMaterial />
</Box>
<Box
:position="{ x: 0, y: 5 / 16, z: 0 }"
:scale="{ x: 10 / 16, y: 10 / 16, z: 10 / 16 }">
<LambertMaterial />
</Box>
</Group>
</Group>
</Group>
</Scene>
</Renderer>
</template>
<script>
import { Box, Camera, LambertMaterial, AmbientLight, Renderer, Scene } from "troisjs";
import { Box, Camera, LambertMaterial, AmbientLight, Renderer, Scene, Object3D } from "troisjs";
export default {
props: ["armorstand"],
@ -24,16 +119,17 @@ export default {
// box.rotation.x += 0.01
// })
},
computed: {
scaledRotation: function() {
methods: {
convertRotation: function (rot) {
// TODO Convert Minecraft to ThreeJS rotation here
return {
x: this.armorstand.head.x / 180 * Math.PI,
y: this.armorstand.head.y / 180 * Math.PI,
z: this.armorstand.head.z / 180 * Math.PI,
x: rot.x / 180 * Math.PI,
y: rot.y / 180 * Math.PI,
z: rot.z / 180 * Math.PI,
}
}
},
components: { Box, Camera, LambertMaterial, Renderer, Scene },
components: { Box, Camera, LambertMaterial, Renderer, Scene, Object3D },
}
</script>