From 7f34ed9d696743b426e89ffd52925fe1d6fe9b3a Mon Sep 17 00:00:00 2001 From: Daan Vanden Bosch Date: Wed, 24 Jul 2019 20:47:20 +0200 Subject: [PATCH] Changing an entity's position via the entity info component now results in an action on the undo stack. --- src/rendering/QuestEntityControls.ts | 19 +--- src/stores/QuestEditorStore.ts | 17 ++- src/ui/quest_editor/EntityInfoComponent.css | 20 ---- src/ui/quest_editor/EntityInfoComponent.less | 29 +++++ src/ui/quest_editor/EntityInfoComponent.tsx | 113 +++++++------------ 5 files changed, 88 insertions(+), 110 deletions(-) delete mode 100644 src/ui/quest_editor/EntityInfoComponent.css create mode 100644 src/ui/quest_editor/EntityInfoComponent.less diff --git a/src/rendering/QuestEntityControls.ts b/src/rendering/QuestEntityControls.ts index 12e28386..e58db58a 100644 --- a/src/rendering/QuestEntityControls.ts +++ b/src/rendering/QuestEntityControls.ts @@ -271,21 +271,10 @@ export class QuestEntityControls { private stop_transforming = () => { if (this.moved_since_last_mouse_down && this.selected && this.pick) { const entity = this.selected.entity; - const initial_position = this.pick.initial_position; - const new_position = entity.position; - const entity_type = - entity instanceof QuestNpc ? entity.type.name : (entity as QuestObject).type.name; - - quest_editor_store.undo.push_action( - `Move ${entity_type}`, - () => { - entity.position = initial_position; - quest_editor_store.set_selected_entity(entity); - }, - () => { - entity.position = new_position; - quest_editor_store.set_selected_entity(entity); - } + quest_editor_store.push_entity_move_action( + entity, + this.pick.initial_position, + entity.position ); } diff --git a/src/stores/QuestEditorStore.ts b/src/stores/QuestEditorStore.ts index 266c44ac..e5e04c6d 100644 --- a/src/stores/QuestEditorStore.ts +++ b/src/stores/QuestEditorStore.ts @@ -6,7 +6,7 @@ import { parse_quest, write_quest_qst } from "../data_formats/parsing/quest"; import { Vec3 } from "../data_formats/vector"; import { Area, Episode, Quest, QuestEntity, Section } from "../domain"; import { read_file } from "../read_file"; -import { UndoStack, SimpleUndo } from "../undo"; +import { SimpleUndo, UndoStack } from "../undo"; import { application_store } from "./ApplicationStore"; import { area_store } from "./AreaStore"; import { create_new_quest } from "./quest_creation"; @@ -118,6 +118,21 @@ class QuestEditorStore { this.save_dialog_open = false; }; + @action + push_entity_move_action = (entity: QuestEntity, initial_position: Vec3, new_position: Vec3) => { + this.undo.push_action( + `Move ${entity.type.name}`, + () => { + entity.position = initial_position; + quest_editor_store.set_selected_entity(entity); + }, + () => { + entity.position = new_position; + quest_editor_store.set_selected_entity(entity); + } + ); + }; + @action private set_quest = flow(function* set_quest(this: QuestEditorStore, quest?: Quest) { if (quest !== this.current_quest) { diff --git a/src/ui/quest_editor/EntityInfoComponent.css b/src/ui/quest_editor/EntityInfoComponent.css deleted file mode 100644 index 5d548ec2..00000000 --- a/src/ui/quest_editor/EntityInfoComponent.css +++ /dev/null @@ -1,20 +0,0 @@ -.EntityInfoComponent-container { - width: 100%; - height: 100%; - padding: 2px 10px 10px 10px; - display: flex; - flex-direction: column; -} - -.EntityInfoComponent-table { - border-collapse: collapse; -} - -.EntityInfoComponent-coord { - width: 100px !important; -} - -.EntityInfoComponent-coord input { - text-align: right; - padding-right: 24px !important; -} \ No newline at end of file diff --git a/src/ui/quest_editor/EntityInfoComponent.less b/src/ui/quest_editor/EntityInfoComponent.less new file mode 100644 index 00000000..7aed540d --- /dev/null +++ b/src/ui/quest_editor/EntityInfoComponent.less @@ -0,0 +1,29 @@ +.qe-EntityInfoComponent-container { + width: 100%; + height: 100%; + padding: 2px 10px 10px 10px; + display: flex; + flex-direction: column; + overflow: auto; +} + +.qe-EntityInfoComponent-table { + border-collapse: collapse; + + & th:not([colspan]) { + width: 65px; + } +} + +.qe-EntityInfoComponent-coord-label { + padding: 0px 5px 0px 10px; +} + +.qe-EntityInfoComponent-coord { + width: 100px !important; + + & input { + text-align: right; + padding-right: 24px !important; + } +} diff --git a/src/ui/quest_editor/EntityInfoComponent.tsx b/src/ui/quest_editor/EntityInfoComponent.tsx index df643e22..ed92e18d 100644 --- a/src/ui/quest_editor/EntityInfoComponent.tsx +++ b/src/ui/quest_editor/EntityInfoComponent.tsx @@ -5,7 +5,8 @@ import React, { Component, PureComponent, ReactNode } from "react"; import { QuestEntity, QuestNpc, QuestObject } from "../../domain"; import { quest_editor_store } from "../../stores/QuestEditorStore"; import { DisabledTextComponent } from "../DisabledTextComponent"; -import "./EntityInfoComponent.css"; +import "./EntityInfoComponent.less"; +import { Vec3 } from "../../data_formats/vector"; @observer export class EntityInfoComponent extends Component { @@ -15,84 +16,30 @@ export class EntityInfoComponent extends Component { if (entity) { const section_id = entity.section ? entity.section.id : entity.section_id; - let name = null; - - if (entity instanceof QuestObject) { - name = ( - - Object: - {entity.type.name} - - ); - } else if (entity instanceof QuestNpc) { - name = ( - - NPC: - {entity.type.name} - - ); - } body = ( - +
- {name} - + + + + + - + + + + - - - - - - - + + + +
Section: {entity instanceof QuestNpc ? "NPC" : "Object"}:{entity.type.name}
Section: {section_id}
World position: World position:
- - - - - - -
-
Section position:
- - - - - - -
- 		Section position:
); @@ -101,7 +48,7 @@ export class EntityInfoComponent extends Component { } return ( -
+
{body}
); @@ -118,7 +65,9 @@ class CoordRow extends PureComponent { render(): ReactNode { return ( - {this.props.coord.toUpperCase()}: + + {this.props.coord.toUpperCase()}: + @@ -127,10 +76,10 @@ class CoordRow extends PureComponent { } } -class CoordInput extends Component { +class CoordInput extends Component { private disposer?: IReactionDisposer; - state = { value: 0 }; + state = { value: 0, initial_position: new Vec3(0, 0, 0) }; componentDidMount(): void { this.start_observing(); @@ -152,7 +101,9 @@ class CoordInput extends Component { value={this.state.value} size="small" precision={3} - className="EntityInfoComponent-coord" + className="qe-EntityInfoComponent-coord" + onFocus={this.focus} + onBlur={this.blur} onChange={this.changed} /> ); @@ -174,6 +125,20 @@ class CoordInput extends Component { ); } + private focus = () => { + this.setState({ initial_position: this.props.entity.position }); + }; + + private blur = () => { + if (!this.state.initial_position.equals(this.props.entity.position)) { + quest_editor_store.push_entity_move_action( + this.props.entity, + this.state.initial_position, + this.props.entity.position + ); + } + }; + private changed = (value?: number) => { if (value != null) { const entity = this.props.entity;