[O] Set editor color
This commit is contained in:
@@ -1,4 +1,4 @@
|
|||||||
import {Mesh, Object3D} from "three";
|
import {Color, Material, Mesh, MeshBasicMaterial, Object3D} from "three";
|
||||||
import IUpdatable from "@/animation/components/IUpdatable";
|
import IUpdatable from "@/animation/components/IUpdatable";
|
||||||
import {circle} from "@/animation/Helpers";
|
import {circle} from "@/animation/Helpers";
|
||||||
import {camera, scene} from "@/animation/Home";
|
import {camera, scene} from "@/animation/Home";
|
||||||
@@ -9,14 +9,13 @@ import {minMax} from "@/utils";
|
|||||||
export default class Editor implements IUpdatable
|
export default class Editor implements IUpdatable
|
||||||
{
|
{
|
||||||
hand: Mesh
|
hand: Mesh
|
||||||
color = '#664400'
|
|
||||||
radius = 3
|
radius = 3
|
||||||
scale = 1
|
scale = 1
|
||||||
z = config.editor.zMax
|
z = config.editor.zMax
|
||||||
|
|
||||||
constructor()
|
constructor()
|
||||||
{
|
{
|
||||||
this.hand = circle(this.color, 0, this.radius)
|
this.hand = circle('#ffffff', 0, this.radius)
|
||||||
scene.add(this.hand)
|
scene.add(this.hand)
|
||||||
|
|
||||||
window.addEventListener('wheel', (e) =>
|
window.addEventListener('wheel', (e) =>
|
||||||
@@ -50,4 +49,16 @@ export default class Editor implements IUpdatable
|
|||||||
this.hand.position.copy(pos)
|
this.hand.position.copy(pos)
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get color(): string
|
||||||
|
{
|
||||||
|
return this.handMaterial.color.getHexString()
|
||||||
|
}
|
||||||
|
|
||||||
|
set color(value: string)
|
||||||
|
{
|
||||||
|
this.handMaterial.color.setStyle(value.substr(0, 7))
|
||||||
|
}
|
||||||
|
|
||||||
|
get handMaterial(): MeshBasicMaterial { return (this.hand.material as MeshBasicMaterial) }
|
||||||
}
|
}
|
||||||
|
|||||||
+1
-2
@@ -46,7 +46,7 @@ export type Keybinds = {[id: string]: (e: KeyboardEvent) => unknown}
|
|||||||
*/
|
*/
|
||||||
export class KeyHandler extends Vue
|
export class KeyHandler extends Vue
|
||||||
{
|
{
|
||||||
keybinds?: Keybinds
|
keybinds: Keybinds = {}
|
||||||
|
|
||||||
mounted(): void
|
mounted(): void
|
||||||
{
|
{
|
||||||
@@ -60,7 +60,6 @@ export class KeyHandler extends Vue
|
|||||||
|
|
||||||
keyListener(e: KeyboardEvent): void
|
keyListener(e: KeyboardEvent): void
|
||||||
{
|
{
|
||||||
if (!this.keybinds) return
|
|
||||||
if (e.key in this.keybinds)
|
if (e.key in this.keybinds)
|
||||||
{
|
{
|
||||||
if (this.keybinds[e.key](e) !== false)
|
if (this.keybinds[e.key](e) !== false)
|
||||||
|
|||||||
@@ -29,7 +29,7 @@
|
|||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import {Options, Vue} from 'vue-class-component';
|
import {Options, Vue} from 'vue-class-component';
|
||||||
import {start} from "@/animation/Home";
|
import {editor, start} from "@/animation/Home";
|
||||||
import {config} from "@/animation/Config";
|
import {config} from "@/animation/Config";
|
||||||
import {KeyHandler, range} from "@/utils";
|
import {KeyHandler, range} from "@/utils";
|
||||||
import MyColorPicker from "@/views/color/ColorPicker.vue";
|
import MyColorPicker from "@/views/color/ColorPicker.vue";
|
||||||
@@ -48,7 +48,8 @@ export default class NewHome extends KeyHandler
|
|||||||
|
|
||||||
created(): void
|
created(): void
|
||||||
{
|
{
|
||||||
this.keybinds = {Escape: _ => this.pickerColor = ''}
|
this.keybinds.Escape = _ => this.pickerColor = ''
|
||||||
|
range(10).forEach(i => this.keybinds[i.toString()] = _ => editor.color = this.colors[i])
|
||||||
}
|
}
|
||||||
|
|
||||||
mounted(): void
|
mounted(): void
|
||||||
|
|||||||
Reference in New Issue
Block a user