From 482ec316f3eb15d1846ee24c9ce59ebd6a148acd Mon Sep 17 00:00:00 2001
From: Max <m.giller.dev@gmail.com>
Date: Tue, 5 Oct 2021 00:13:43 +0200
Subject: [PATCH] Basic setting menu structure
---
editor/css/editor.css | 4 ++++
editor/editor.php | 19 ++++++++++++++-
editor/images/tools/settings.png | Bin 0 -> 3469 bytes
editor/js/state.js | 2 ++
editor/js/tools/menus/settingsmenu.js | 32 ++++++++++++++++++++++++++
editor/js/tools/settingstool.js | 8 +++++++
6 files changed, 64 insertions(+), 1 deletion(-)
create mode 100644 editor/images/tools/settings.png
create mode 100644 editor/js/tools/menus/settingsmenu.js
create mode 100644 editor/js/tools/settingstool.js
diff --git a/editor/css/editor.css b/editor/css/editor.css
index 0a0b43f..722b6ff 100644
--- a/editor/css/editor.css
+++ b/editor/css/editor.css
@@ -29,6 +29,10 @@ div#ks-editor .medium-width {
max-width: 20rem;
}
+div#ks-editor .small-width {
+ max-width: 5rem;
+}
+
div#ks-editor input#node-name {
font-size: large;
font-weight: bolder;
diff --git a/editor/editor.php b/editor/editor.php
index 1a3ca47..7c11c36 100644
--- a/editor/editor.php
+++ b/editor/editor.php
@@ -35,13 +35,30 @@
<label for="node-references">References</label> <small>One URL per line</small>
<textarea id="node-references" name="node-references" class="bottom-space"></textarea>
- <label for="node-videos">Videos</label> <small>One video URL per line</small>
+ <label>Videos</label> <small>One video URL per line</small>
<textarea id="node-videos" name="node-videos"></textarea>
</div>
<div id="link-selected" class="hidden">
<h3 id="link-name"></h3>
</div>
</div>
+ <div id="settings-menu" class="hidden" checked>
+ <input type="checkbox" id="label-toggle" name="label-toggle" class="bottom-space">
+ <label for="label-toggle">Show labels in graph</label>
+ </input>
+
+ </br>
+
+ <label>Simulate physics from beginning</label>
+ </br>
+ <button id="reanimate-button" name="reanimate-button" class="bottom-space">Re-simulate</button>
+
+ </br>
+
+ <label for="stop-physics-delay">Amount of time [in seconds] after which the physics simulation is stopped</label>
+ <input type="number" id="stop-physics-delay" name="stop-physics-delay" class="small-width">
+ </input>
+ </div>
</section>
<button id="save" type="submit" class="primary">Save and publish</button>
</div>
\ No newline at end of file
diff --git a/editor/images/tools/settings.png b/editor/images/tools/settings.png
new file mode 100644
index 0000000000000000000000000000000000000000..eaae7fdec7dc02e78b280b8d66a80490dd08bf30
GIT binary patch
literal 3469
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
literal 0
HcmV?d00001
diff --git a/editor/js/state.js b/editor/js/state.js
index cbf44c4..5135b65 100644
--- a/editor/js/state.js
+++ b/editor/js/state.js
@@ -6,6 +6,7 @@ import CollectTool from "./tools/collecttool";
import DeleteTool from "./tools/deletetool";
import AddNodeTool from "./tools/addnodetool";
import ConnectTool from "./tools/connecttool";
+import SettingsTool from "./tools/settingstool";
import { graph } from "./editor";
import Toolbar from "./toolbar";
import * as Graph from "./graph";
@@ -18,6 +19,7 @@ export const TOOLS = {
delete: new DeleteTool("delete"),
addnode: new AddNodeTool("addnode"),
connect: new ConnectTool("connect"),
+ settings: new SettingsTool("settings"),
};
export const CONTEXT = {
diff --git a/editor/js/tools/menus/settingsmenu.js b/editor/js/tools/menus/settingsmenu.js
new file mode 100644
index 0000000..008efb0
--- /dev/null
+++ b/editor/js/tools/menus/settingsmenu.js
@@ -0,0 +1,32 @@
+import ToolMenu from "./toolmenu";
+
+export const LABEL_TOGGLE_ID = "#label-toggle";
+export const RESIMULATE_BUTTON_ID = "#reanimate-button";
+export const PHYSICS_DELAY_ID = "#stop-physics-delay";
+
+export const PHYSICS_DELAY_KEY = "delay";
+export const RESIMULATE_KEY = "resimulate";
+export const LABELS_KEY = "labels";
+
+export class SettingsMenu extends ToolMenu {
+ constructor() {
+ super();
+ }
+
+ onMenuShow(initial) {
+ if (initial === false) {
+ return;
+ }
+
+ // Initial interface hooks
+ this.find(LABEL_TOGGLE_ID).on("change", (e) => {
+ this.notifyTool(LABELS_KEY, e.target.checked);
+ });
+ this.find(PHYSICS_DELAY_ID).on("change", (e) => {
+ this.notifyTool(PHYSICS_DELAY_KEY, e.target.value);
+ });
+ this.find(RESIMULATE_BUTTON_ID).on("click", () => {
+ this.notifyTool(RESIMULATE_KEY);
+ });
+ }
+}
diff --git a/editor/js/tools/settingstool.js b/editor/js/tools/settingstool.js
new file mode 100644
index 0000000..a717a5b
--- /dev/null
+++ b/editor/js/tools/settingstool.js
@@ -0,0 +1,8 @@
+import { SettingsMenu } from "./menus/settingsmenu";
+import Tool from "./tool";
+
+export default class SettingsTool extends Tool {
+ constructor(key) {
+ super("Settings", "settings", key, new SettingsMenu());
+ }
+}
--
GitLab