simplify geometries

src/geometries/BoxGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { BoxGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   size: Number,
@@ -20,12 +19,4 @@ export function createGeometry(comp) {
   }
 };
 
-export default defineComponent({
+export default geometryComponent('BoxGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/CircleGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { CircleGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   radius: { type: Number, default: 1 },
@@ -13,12 +12,4 @@ export function createGeometry(comp) {
   return new CircleGeometry(comp.radius, comp.segments, comp.thetaStart, comp.thetaLength);
 };
 
-export default defineComponent({
+export default geometryComponent('CircleGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/ConeGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { ConeGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   radius: { type: Number, default: 1 },
@@ -16,12 +15,4 @@ export function createGeometry(comp) {
   return new ConeGeometry(comp.radius, comp.height, comp.radialSegments, comp.heightSegments, comp.openEnded, comp.thetaStart, comp.thetaLength);
 };
 
-export default defineComponent({
+export default geometryComponent('ConeGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/CylinderGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { CylinderGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   radiusTop: { type: Number, default: 1 },
@@ -17,12 +16,4 @@ export function createGeometry(comp) {
   return new CylinderGeometry(comp.radiusTop, comp.radiusBottom, comp.height, comp.radialSegments, comp.heightSegments, comp.openEnded, comp.thetaStart, comp.thetaLength);
 };
 
-export default defineComponent({
+export default geometryComponent('CylinderGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/DodecahedronGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { DodecahedronGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   radius: { type: Number, default: 1 },
@@ -11,12 +10,4 @@ export function createGeometry(comp) {
   return new DodecahedronGeometry(comp.radius, comp.detail);
 };
 
-export default defineComponent({
+export default geometryComponent('DodecahedronGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/Geometry.js

@@ -1,6 +1,6 @@
 import { defineComponent, watch } from 'vue';
 
-export default defineComponent({
+const Geometry = defineComponent({
   inject: ['mesh'],
   props: {
     rotateX: Number,
@@ -47,3 +47,18 @@ export default defineComponent({
   },
   render() { return []; },
 });
+
+export default Geometry;
+
+export function geometryComponent(name, props, createGeometry) {
+  return defineComponent({
+    name,
+    extends: Geometry,
+    props,
+    methods: {
+      createGeometry() {
+        this.geometry = createGeometry(this);
+      },
+    },
+  });
+};

src/geometries/IcosahedronGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { IcosahedronGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   radius: { type: Number, default: 1 },
@@ -11,12 +10,4 @@ export function createGeometry(comp) {
   return new IcosahedronGeometry(comp.radius, comp.detail);
 };
 
-export default defineComponent({
+export default geometryComponent('IcosahedronGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/LatheGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { LatheGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   points: Array,
@@ -13,12 +12,4 @@ export function createGeometry(comp) {
   return new LatheGeometry(comp.points, comp.segments, comp.phiStart, comp.phiLength);
 };
 
-export default defineComponent({
+export default geometryComponent('LatheGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/OctahedronGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { OctahedronGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   radius: { type: Number, default: 1 },
@@ -11,12 +10,4 @@ export function createGeometry(comp) {
   return new OctahedronGeometry(comp.radius, comp.detail);
 };
 
-export default defineComponent({
+export default geometryComponent('OctahedronGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/PlaneGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { PlaneGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   width: { type: Number, default: 1 },
@@ -13,12 +12,4 @@ export function createGeometry(comp) {
   return new PlaneGeometry(comp.width, comp.height, comp.widthSegments, comp.heightSegments);
 };
 
-export default defineComponent({
+export default geometryComponent('PlaneGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/PolyhedronGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { PolyhedronGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   vertices: Array,
@@ -13,12 +12,4 @@ export function createGeometry(comp) {
   return new PolyhedronGeometry(comp.vertices, comp.indices, comp.radius, comp.detail);
 };
 
-export default defineComponent({
+export default geometryComponent('PolyhedronGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/RingGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { RingGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   innerRadius: { type: Number, default: 0.5 },
@@ -15,12 +14,4 @@ export function createGeometry(comp) {
   return new RingGeometry(comp.innerRadius, comp.outerRadius, comp.thetaSegments, comp.phiSegments, comp.thetaStart, comp.thetaLength);
 };
 
-export default defineComponent({
+export default geometryComponent('RingGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/SphereGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { SphereGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   radius: { type: Number, default: 1 },
@@ -12,12 +11,4 @@ export function createGeometry(comp) {
   return new SphereGeometry(comp.radius, comp.widthSegments, comp.heightSegments);
 };
 
-export default defineComponent({
+export default geometryComponent('SphereGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/TetrahedronGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { TetrahedronGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   radius: { type: Number, default: 1 },
@@ -11,12 +10,4 @@ export function createGeometry(comp) {
   return new TetrahedronGeometry(comp.radius, comp.detail);
 };
 
-export default defineComponent({
+export default geometryComponent('TetrahedronGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/TorusGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { TorusGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   radius: { type: Number, default: 1 },
@@ -14,12 +13,4 @@ export function createGeometry(comp) {
   return new TorusGeometry(comp.radius, comp.tube, comp.radialSegments, comp.tubularSegments, comp.arc);
 };
 
-export default defineComponent({
+export default geometryComponent('TorusGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});

src/geometries/TorusKnotGeometry.js

@@ -1,6 +1,5 @@
-import { defineComponent } from 'vue';
+import { geometryComponent } from './Geometry.js';
 import { TorusKnotGeometry } from 'three';
-import Geometry from './Geometry.js';
 
 export const props = {
   radius: { type: Number, default: 1 },
@@ -15,12 +14,4 @@ export function createGeometry(comp) {
   return new TorusKnotGeometry(comp.radius, comp.tube, comp.tubularSegments, comp.radialSegments, comp.p, comp.q);
 };
 
-export default defineComponent({
+export default geometryComponent('TorusKnotGeometry', props, createGeometry);
-  extends: Geometry,
-  props,
-  methods: {
-    createGeometry() {
-      this.geometry = createGeometry(this);
-    },
-  },
-});