From 11eec45515fcf556c2cf31f3ca28a20fec6ec702 Mon Sep 17 00:00:00 2001
From: Lars Martens <lars@martens.red>
Date: Thu, 17 Dec 2020 23:01:00 +0100
Subject: [PATCH] Added armorstand model

---
 src/App.vue                   | 19 ++++----
 src/components/Armorstand.vue | 81 ++++++++++++++++++++++++++++++++++-
 2 files changed, 88 insertions(+), 12 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 63ca8d9..ffe5118 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,15 +1,14 @@
-<template>
+    <template>
     <div class="grid grid-cols-5 min-h-screen bg-gray-700">
         <div ref="rendererwrapper" class="col-span-3">
             <renderer :obj="renderer" :size="{w: 400, h: 400}">
                 <scene>
-                    <camera :obj="camera" :position="{ z: 5 }"></camera>
-                    <light :hex="0xEEEEEE" :position="{x: 10, y: 10, z: 10}"></light>
-                    <light :obj="ambientLight"></light>
-                    <mesh :rotation="rotationInRad">
-                        <geometry type="Box" :args="[1, 1, 1]"></geometry>
-                        <material type="MeshLambert" :obj="testMaterial"></material>
-                    </mesh>
+                    <orbit-controls :position="{z: 3}"
+                        :rotation="{x: 2, y: 0, z: 3}">
+                        <camera :obj="camera"></camera>
+                        <light :hex="0xFFFFFF" :position="{x: 100, y: 200, z: 300}"></light>
+                    </orbit-controls>
+                    <armorstand></armorstand>
                 </scene>
             </renderer>
         </div>
@@ -50,15 +49,15 @@
 
 <script>
 import Card from "./components/Card";
+import Armorstand from "./components/Armorstand";
 import * as THREE from "three";
 
 export default {
-    components: {Card},
+    components: {Card, Armorstand},
     data() {
         return {
             renderer: new THREE.WebGLRenderer({alpha: true, antialias: true}),
             camera: new THREE.PerspectiveCamera(70, 400 / 400, 0.1, 100),
-            testMaterial: new THREE.MeshLambertMaterial({color: 0x826841}),
             ambientLight: new THREE.AmbientLight(0x333333),
             rotation: {x: 30, y: 40, z: 0},
         };
diff --git a/src/components/Armorstand.vue b/src/components/Armorstand.vue
index 5716bb0..f5969a8 100644
--- a/src/components/Armorstand.vue
+++ b/src/components/Armorstand.vue
@@ -1,5 +1,81 @@
 <template>
-    
+    <!-- Armorstand -->
+    <object3d :position="{y: -1}">
+        <!-- BasePlate -->
+        <mesh :position="{x: 0, y: -1/32, z: 0}">
+            <material type="MeshPhong" :color="colorStone"></material>
+            <geometry type="Box" :args="[12/16, 1/16, 12/16]"></geometry>
+        </mesh>
+        <!-- Little direction indicator for the baseplate -->
+        <mesh :position="{x: 0, y: -1/32, z: 10/16}">
+            <material type="MeshPhong" :color="colorStone"></material>
+            <geometry type="Box" :args="[2/16, 1/16, 4/16]"></geometry>
+        </mesh>
+        <!-- Left leg -->
+        <object3d :position="{x: 2/16, y: 11/16, z: 0}">
+            <mesh :position="{x: 0, y: -5.5/16, z: 0}">
+                <material type="MeshPhong" :color="colorWood"></material>
+                <geometry type="Box" :args="[2/16, 11/16, 2/16]"></geometry>
+            </mesh>
+        </object3d>
+        <!-- Right leg -->
+        <object3d :position="{x: -2/16, y: 11/16, z: 0}">
+            <mesh :position="{x: 0, y: -5.5/16, z: 0}">
+                <material type="MeshPhong" :color="colorWood"></material>
+                <geometry type="Box" :args="[2/16, 11/16, 2/16]"></geometry>
+            </mesh>
+        </object3d>
+        <!-- Left arm -->
+        <object3d :position="{x: 6/16, y: 21/16, z: 0}">
+            <mesh :position="{x: 0, y: -4/16, z: 0}">
+                <material type="MeshPhong" :color="colorWood"></material>
+                <geometry type="Box" :args="[2/16, 12/16, 2/16]"></geometry>
+            </mesh>
+        </object3d>
+        <!-- Right arm -->
+        <object3d :position="{x: -6/16, y: 21/16, z: 0}">
+            <mesh :position="{x: 0, y: -4/16, z: 0}">
+                <material type="MeshPhong" :color="colorWood"></material>
+                <geometry type="Box" :args="[2/16, 12/16, 2/16]"></geometry>
+            </mesh>
+        </object3d>
+        <!-- Body -->
+        <object3d :position="{x: 0, y: 23/16, z: 0}">
+            <!-- Hip -->
+            <mesh :position="{x: 0, y: -11/16, z: 0}">
+                <material type="MeshPhong" :color="colorWood"></material>
+                <geometry type="Box" :args="[8/16, 2/16, 2/16]"></geometry>
+            </mesh>
+            <!-- Left side -->
+            <mesh :position="{x: 2/16, y: -6.5/16, z: 0}">
+                <material type="MeshPhong" :color="colorWood"></material>
+                <geometry type="Box" :args="[2/16, 7/16, 2/16]"></geometry>
+            </mesh>
+            <!-- Right side -->
+            <mesh :position="{x: -2/16, y: -6.5/16, z: 0}">
+                <material type="MeshPhong" :color="colorWood"></material>
+                <geometry type="Box" :args="[2/16, 7/16, 2/16]"></geometry>
+            </mesh>
+            <!-- Shoulders -->
+            <mesh :position="{x: 0, y: -1.5/16, z: 0}">
+                <material type="MeshPhong" :color="colorWood"></material>
+                <geometry type="Box" :args="[12/16, 3/16, 3/16]"></geometry>
+            </mesh>
+        </object3d>
+        <!-- Head -->
+        <object3d :position="{x: 0, y: 22/16, z: 0}">
+            <!-- Neck -->
+            <mesh :position="{x: 0, y: 3.5/16, z: 0}">
+                <material type="MeshPhong" :color="colorWood"></material>
+                <geometry type="Box" :args="[2/16, 7/16, 2/16]"></geometry>
+            </mesh>
+            <!-- Skull -->
+            <mesh :position="{x: 0, y: 5/16, z: 0}">
+                <material type="MeshPhong" :color="colorStone"></material>
+                <geometry type="Box" :args="[10/16, 10/16, 10/16]"></geometry>
+            </mesh>
+        </object3d>
+    </object3d>
 </template>
 
 <script>
@@ -7,7 +83,8 @@ export default {
     data() {
         // TODO This should be a prop "pose" to allow external modification
         return {
-
+            colorWood: 0xCC933D,
+            colorStone: 0x888888,
         };
     },
 }