Tree View Toggle Move

Moved the new demo toggle to the header, and out of the Format Settings dialog.
Offroaders123 · Aug 18, 2023 · d48fac9 · d48fac9
1 parent 33ef63f
commit d48fac9
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 9 deletions.
diff --git a/index.html b/index.html
@@ -25,6 +25,10 @@
  <input id="fileOpener" type="file" accept="application/octet-stream, .nbt, .dat, .dat_old">
  <button id="saver" disabled>Save</button>
  <button id="formatOpener" disabled>Format Options...</button>
+ <label style="margin-inline-start: auto;">
+ <input id="treeViewToggle" type="checkbox">
+ Tree View
+ </label>
 </header>
 
 <main>
@@ -97,11 +101,6 @@ <h3>Format Options</h3>
  <code>(Uint32)</code>
  </label>
  </fieldset>
-
- <label>
- <input type="checkbox" name="treeView">
- Tree View (Experimental)
- </label>
  </form>
 </dialog>
 

diff --git a/public/service-worker.js b/public/service-worker.js
@@ -4,7 +4,7 @@
 var self = /** @type { ServiceWorkerGlobalScope } */ (/** @type { unknown } */ (globalThis));
 
 const NAME = "Dovetail";
-const VERSION = "v1.8.0";
+const VERSION = "v1.8.2";
 const CACHE_NAME = /** @type { const } */ (`${NAME} ${VERSION}`);
 
 self.addEventListener("activate",event => {

diff --git a/src/app.ts b/src/app.ts
@@ -19,7 +19,7 @@ if (window.isSecureContext){
  await navigator.serviceWorker.register("./service-worker.js");
 }
 
-formatForm.elements.treeView.checked = showTreeView;
+treeViewToggle.checked = showTreeView;
 updateTreeView();
 
 window.launchQueue?.setConsumer?.(async launchParams => {
@@ -76,7 +76,7 @@ formatOpener.addEventListener("click",() => {
  formatDialog.showModal();
 });
 
-formatForm.elements.treeView.addEventListener("change",() => {
+treeViewToggle.addEventListener("change",() => {
  showTreeView = !showTreeView;
  updateTreeView();
 });

diff --git a/src/global.d.ts b/src/global.d.ts
@@ -17,6 +17,7 @@ declare global {
  var saver: HTMLButtonElement;
  var fileOpener: HTMLInputElement;
  var formatOpener: HTMLButtonElement;
+ var treeViewToggle: HTMLInputElement;
  var editor: HTMLTextAreaElement;
  var treeView: NBTTree;
  var formatDialog: HTMLDialogElement;
@@ -31,7 +32,6 @@ interface FormatOptionsCollection extends HTMLFormControlsCollection {
  endian: RadioNodeList;
  compression: RadioNodeList;
  bedrockLevel: HTMLInputElement;
- treeView: HTMLInputElement;
 }
 
 export {};
diff --git a/styles.css b/styles.css
@@ -31,6 +31,16 @@ header {
  border: 0 solid transparent;
  border-left-width: env(safe-area-inset-left);
  border-right-width: env(safe-area-inset-right);
+ overflow: auto;
+ scrollbar-width: none;
+}
+
+header::-webkit-scrollbar {
+ display: none;
+}
+
+header > * {
+ flex-shrink: 0;
 }
 
 header > img {