From 606dcfa9c94618136f03e5473622b8ad1e92ca09 Mon Sep 17 00:00:00 2001 From: Kevin Levron Date: Mon, 15 Mar 2021 19:54:33 +0100 Subject: [PATCH] refactor circle --- src/geometries/CircleGeometry.js | 20 +++++++++++++------- src/meshes/Circle.js | 20 ++++---------------- 2 files changed, 17 insertions(+), 23 deletions(-) diff --git a/src/geometries/CircleGeometry.js b/src/geometries/CircleGeometry.js index 784772a..93aa9d2 100644 --- a/src/geometries/CircleGeometry.js +++ b/src/geometries/CircleGeometry.js @@ -1,17 +1,23 @@ import { CircleGeometry } from 'three'; import Geometry from './Geometry.js'; +export const props = { + radius: { type: Number, default: 1 }, + segments: { type: Number, default: 8 }, + thetaStart: { type: Number, default: 0 }, + thetaLength: { type: Number, default: Math.PI * 2 }, +}; + +export function createGeometry(comp) { + return new CircleGeometry(comp.radius, comp.segments, comp.thetaStart, comp.thetaLength); +}; + export default { extends: Geometry, - props: { - radius: { type: Number, default: 1 }, - segments: { type: Number, default: 8 }, - thetaStart: { type: Number, default: 0 }, - thetaLength: { type: Number, default: Math.PI * 2 }, - }, + props, methods: { createGeometry() { - this.geometry = new CircleGeometry(this.radius, this.segments, this.thetaStart, this.thetaLength); + this.geometry = createGeometry(this); }, }, }; diff --git a/src/meshes/Circle.js b/src/meshes/Circle.js index 60367da..67393b0 100644 --- a/src/meshes/Circle.js +++ b/src/meshes/Circle.js @@ -1,28 +1,16 @@ -import { CircleBufferGeometry } from 'three'; -import { watch } from 'vue'; import Mesh from './Mesh.js'; +import { props, createGeometry } from '../geometries/CircleGeometry.js'; export default { extends: Mesh, - props: { - radius: { type: Number, default: 1 }, - segments: { type: Number, default: 8 }, - thetaStart: { type: Number, default: 0 }, - thetaLength: { type: Number, default: Math.PI * 2 }, - }, + props, created() { this.createGeometry(); - - const watchProps = ['radius', 'segments', 'thetaStart', 'thetaLength']; - watchProps.forEach(prop => { - watch(() => this[prop], () => { - this.refreshGeometry(); - }); - }); + this.addGeometryWatchers(props); }, methods: { createGeometry() { - this.geometry = new CircleBufferGeometry(this.radius, this.segments, this.thetaStart, this.thetaLength); + this.geometry = createGeometry(this); }, }, __hmrId: 'Circle',