From 25a6682abd9c191e42e0168ca1af2d41b4f3ccc2 Mon Sep 17 00:00:00 2001
From: Saif Addin <saif1988@gmail.com>
Date: Sun, 4 Apr 2021 04:19:02 +0200
Subject: [PATCH] Fixed axis minimized windows

---
 CHANGELOG.md  |   5 +
 README.md     |   1 +
 minimalui.css | 562 +++++++++++++++++++++++++-------------------------
 minimalui.js  |  48 ++++-
 module.json   |   2 +-
 5 files changed, 332 insertions(+), 286 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 548ee29..4a485e4 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,8 @@
+### 0.5.2
+* Enhancement: New Experimental feature fixes the Axis of minimized windows to bottom or top
+* Bugfix: Adjusted space between left side controls and its sub menu
+* Bugfix: Adjusted shadow of Macro hotbar when not in auto-hide mode
+
 ### 0.5.1
 * Enhancement: New setting to hide player cameras (Fan service for MarceloCortezz :))
 * Bugfix: Added slightly more space between left bar columns in small size
diff --git a/README.md b/README.md
index f82c5b3..0d97193 100644
--- a/README.md
+++ b/README.md
@@ -33,6 +33,7 @@ This includes hiding Foundry's Logo, Players List, Scene Navigation and Macro Ba
 * Default settings target a balance between gaining space and functionality
 * Colors of borders and shadows and their strength customizable
 * Position of elements in the UI can be modified
+* Allows fixing the minimized window to a certain Axis to find them easily
 
 ## Support with Systems and Modules
 MinimalUI is made as agnostic as possible. Yet, it is impossible to ensure maximum compatibility.
diff --git a/minimalui.css b/minimalui.css
index d605c3c..44e80e1 100644
--- a/minimalui.css
+++ b/minimalui.css
@@ -1,282 +1,282 @@
 :root {
-    --logovis: hidden;
-    --logoh: 50px;
-    --logow: 100px;
-    
-    --navivis: hidden;
-    --navixpos: 125px;
-    --navilh: 20px;
-    --navifs: 14px;
-    --navibuttonsize: 23px;
-    --navithumbmarg: 10px;
-    
-    --leftbarxpos: 0px;
-    --leftbarypos: 20vmin;
-    --leftbarpad: 7px;
-    --leftbarw: 36px;
-    --leftbarh: 36px;
-    --leftbarlh: 36px;
-    --leftbarfs: 24px;
-    --leftbarsubstart: 60px;
-    --leftbarsubhover: 60px;
-    --leftbarsubstyle: contents;
-    
-    --playervis: hidden;
-    --playerfsize: 0px;
-    --playerwidth: 25px;
-    --playerwidthhv: 150px;
-    --playerslh: 20px;
-    --playerbennies: none;
-    
-    --macrobarvis: hidden;
-    --macrobarypos: 10px;
-    --macrobarxpos: 400px;
-    --macrobarlh1: 24px;
-    --macrobarlh2: 8px;
-    --macrobarhv: 10px;
-    --macrobarmg: 0px;
-    --macrobarhh: 100%;
-    --macrobarwf: 502px;
-
-    --bordercolor: #ff4900bd;
-    --shadowcolor: #ff4900bd;
-    --shadowstrength: 10px;
-  }
-
-  #logo {
-    visibility: var(--logovis);
-    height: var(--logoh);
-    width: var(--logow);
-  }
-
-  /** MACRO HOTBAR **/
-
-  #hotbar:hover {
-    bottom: var(--macrobarhv);
-    transition: 0.5s;
-  }
-
-  #hotbar {
-    left: var(--macrobarxpos);
-    bottom: var(--macrobarypos);
-    visibility: var(--macrobarvis);
-    transition: 0.05s ease-out 0.5s;
-  }
-
-  #hotbar .bar-controls {
-    background: #191919;
-    height: var(--macrobarhh);
-    margin: var(--macrobarmg) 2px;
-  }
-
-  #hotbar .bar-controls a.page-control {
-    font-size: 20px;
-  }
-
-  #hotbar #hotbar-directory-controls {
-    font-size: 14px;
-  }
-
-  #hotbar .bar-controls span.page-number {
-    line-height: var(--macrobarlh2);
-  }
-
-  #hotbar #macro-list:hover {
-    border-top: 1px solid var(--bordercolor);
-    box-shadow: 0px 0px var(--shadowstrength) 2px var(--shadowcolor);
-    transition: 0.5s;
-  }
-
-  #hotbar #macro-list {
-    border-top: 1px solid var(--bordercolor);
-    box-shadow: 0px -1px var(--shadowstrength) 2px var(--shadowcolor);
-    flex: 0 0 var(--macrobarwf);
-    transition: 0.05s ease-out 0.5s;
-  }
-  
-  #hotbar .macro:hover {
-    box-shadow: 0 0 10px var(--shadowcolor) inset;
-  }
-  
-  #hotbar #hotbar-directory-controls a {
-    line-height: var(--macrobarlh1);
-  }
-  
-  /** PLAYERS LIST **/
-  
-  #players:hover {
-    width: var(--playerwidthhv);
-    font-size: 12px;
-  }
-  
-  #players {
-    width: var(--playerwidth);
-    left: 5px;
-    bottom: 2px;
-    font-size: var(--playerfsize);
-    visibility: var(--playervis);
-  }
-  
-  #players ol li.player {
-    padding: 1px 6px;
-    line-height: var(--playerslh);
-  }
-  
-  #players:hover ol li.player {
-    line-height: 20px;
-  }
-  
-  #players h3 {
-    margin: 0px -2px;
-    border-bottom: 0px;
-  }
-  
-  .bennies-count {
-    display: var(--playerbennies);
-  }
-  
-  /** SCENE NAVIGATION **/
-  
-  #navigation {
-    left: var(--navixpos);
-    visibility: var(--navivis);
-  }
-  
-  #navigation .nav-item {
-    line-height: var(--navilh);
-    font-size: var(--navifs);
-  }
-  
-  #navigation #nav-toggle {
-    height: var(--navibuttonsize);
-    background: #292929bd;
-  }
-  
-  #navigation #scene-list .scene ul.scene-players {
-    top: 16px;
-  }
-  
-  #navigation #scene-list .scene.view, #navigation #scene-list .scene.context {
-    border: 1px solid var(--bordercolor);
-    border-bottom: 1px solid var(--bordercolor);
-    box-shadow: 0 0 var(--shadowstrength) var(--shadowcolor);
-  }
-  
-  .navi-preview {
-    display: none;
-    position: relative;
-    top: var(--navithumbmarg);
-    opacity: 1;
-    border: 1px solid var(--bordercolor);
-    border-bottom: 1px solid var(--bordercolor);
-    box-shadow: 0 0 var(--shadowstrength) var(--shadowcolor);
-  }
-  
-  /** RIGHT SIDEBAR CONTROLS AND BUTTONS **/
-  
-  #sidebar-tabs {
-    border-bottom: 1px solid var(--bordercolor);
-    box-shadow: 0 0 var(--shadowstrength) var(--shadowcolor);
-  }
-  
-  #sidebar-tabs > .item.active {
-    box-shadow: 0 0 var(--shadowstrength) inset var(--shadowcolor);
-  }
-  
-  .tabs .item.active {
-    text-shadow: 0 0 var(--shadowstrength) var(--shadowcolor);
-  }
-  
-  #sidebar-tabs > a:nth-child(n):hover {
-    text-shadow: 0 0 var(--shadowstrength) var(--bordercolor);
-  }
-  
-  /** LEFT SIDEBAR CONTROLS AND BUTTONS **/
-  
-  #controls {
-    left: var(--leftbarxpos);
-    top: 10px;
-    margin-top: var(--leftbarypos);
-    border-right: 1px solid var(--bordercolor);
-    box-shadow: 3px 0px var(--shadowstrength) 0px var(--shadowcolor);
-    transition: 0.1s;
-    padding-right: var(--leftbarpad);
-    background: #0000003b;
-  }
-  
-  #controls:hover {
-    left: 0px;
-    transition: 0.5s;
-    padding-right: 7px;
-  }
-  
-  #controls .control-tool.toggle {
-    background: var(--shadowcolor);
-    border: 0px solid var(--bordercolor);
-  }
-  
-  #controls .control-tool.toggle:hover {
-    background: var(--bordercolor);
-    box-shadow: 0 0 var(--shadowstrength) var(--shadowcolor);
-  }
-  
-  #controls .control-tool.toggle.active {
-    background: var(--bordercolor);
-    box-shadow: 0 0 var(--shadowstrength) var(--bordercolor);
-  }
-  
-  #controls .scene-control, #controls .control-tool {
-    margin: 0 0 2px; 
-  }
-  
-  #controls .scene-control.active, #controls .scene-control:hover {
-    border: 1px solid transparent;
-    color: orange;
-    border: solid 1px var(--bordercolor);
-    box-shadow: 1px 0px var(--shadowstrength) 0px var(--shadowcolor);
-    padding-right: 2px;
-    padding-left: 1px;
-  }
-  
-  #controls .control-tool.toggle.active, #controls .control-tool.toggle:hover {
-    padding-right: 0px;
-    padding-left: 1px;
-  }
-  
-  #controls .control-tool.active, #controls .control-tool {
-    border: 0px solid transparent;
-    padding-right: 0px;
-    padding-left: 1px;
-  }
-  
-  #controls .control-tool.active, #controls .control-tool:hover {
-    border: 0px solid transparent;
-    color: yellow;
-    box-shadow: 1px 0px var(--shadowstrength) 0px var(--shadowcolor);
-  }
-  
-  #controls > li:nth-child(n), #controls > li.scene-control > ol > li.control-tool {
-    width: var(--leftbarw);
-    height: var(--leftbarh);
-    line-height: var(--leftbarlh);
-    font-size: var(--leftbarfs);
-    padding-right: 0px;
-    padding-left: 1px;
-  }
-  
-  
-  #controls .active .control-tools {
-    display: var(--leftbarsubstyle);
-    left: var(--leftbarsubstart);
-    transition: 0.5s;
-    background: #00000059;
-    border: solid 1px var(--bordercolor);
-    box-shadow: 1px 0px var(--shadowstrength) 0px var(--shadowcolor);
-    border-radius: 3px;
-  }
-  
-  #controls:hover .active .control-tools {
-    display: var(--leftbarsubstyle);
-    left: var(--leftbarsubhover);
-  }
-  
\ No newline at end of file
+  --logovis: hidden;
+  --logoh: 50px;
+  --logow: 100px;
+
+  --navivis: hidden;
+  --navixpos: 125px;
+  --navilh: 20px;
+  --navifs: 14px;
+  --navibuttonsize: 23px;
+  --navithumbmarg: 10px;
+
+  --leftbarxpos: 0px;
+  --leftbarypos: 20vmin;
+  --leftbarpad: 7px;
+  --leftbarw: 36px;
+  --leftbarh: 36px;
+  --leftbarlh: 36px;
+  --leftbarfs: 24px;
+  --leftbarsubstart: 60px;
+  --leftbarsubhover: 60px;
+  --leftbarsubstyle: contents;
+
+  --playervis: hidden;
+  --playerfsize: 0px;
+  --playerwidth: 25px;
+  --playerwidthhv: 150px;
+  --playerslh: 20px;
+  --playerbennies: none;
+
+  --macrobarvis: hidden;
+  --macrobarypos: 10px;
+  --macrobarxpos: 400px;
+  --macrobarlh1: 24px;
+  --macrobarlh2: 8px;
+  --macrobarhv: 10px;
+  --macrobarmg: 0px;
+  --macrobarhh: 100%;
+  --macrobarwf: 502px;
+  --macrobarshp: 0px;
+
+  --bordercolor: #ff4900bd;
+  --shadowcolor: #ff4900bd;
+  --shadowstrength: 10px;
+}
+
+#logo {
+  visibility: var(--logovis);
+  height: var(--logoh);
+  width: var(--logow);
+}
+
+/** MACRO HOTBAR **/
+
+#hotbar:hover {
+  bottom: var(--macrobarhv);
+  transition: 0.5s;
+}
+
+#hotbar {
+  left: var(--macrobarxpos);
+  bottom: var(--macrobarypos);
+  visibility: var(--macrobarvis);
+  transition: 0.05s ease-out 0.5s;
+}
+
+#hotbar .bar-controls {
+  background: #191919;
+  height: var(--macrobarhh);
+  margin: var(--macrobarmg) 2px;
+}
+
+#hotbar .bar-controls a.page-control {
+  font-size: 20px;
+}
+
+#hotbar #hotbar-directory-controls {
+  font-size: 14px;
+}
+
+#hotbar .bar-controls span.page-number {
+  line-height: var(--macrobarlh2);
+}
+
+#hotbar #macro-list:hover {
+  border-top: 1px solid var(--bordercolor);
+  box-shadow: 0px var(--macrobarshp) var(--shadowstrength) 2px var(--shadowcolor);
+  transition: 0.5s;
+}
+
+#hotbar #macro-list {
+  border-top: 1px solid var(--bordercolor);
+  box-shadow: 0px var(--macrobarshp) var(--shadowstrength) 2px var(--shadowcolor);
+  flex: 0 0 var(--macrobarwf);
+  transition: 0.05s ease-out 0.5s;
+}
+
+#hotbar .macro:hover {
+  box-shadow: 0 0 10px var(--shadowcolor) inset;
+}
+
+#hotbar #hotbar-directory-controls a {
+  line-height: var(--macrobarlh1);
+}
+
+/** PLAYERS LIST **/
+
+#players:hover {
+  width: var(--playerwidthhv);
+  font-size: 12px;
+}
+
+#players {
+  width: var(--playerwidth);
+  left: 5px;
+  bottom: 2px;
+  font-size: var(--playerfsize);
+  visibility: var(--playervis);
+}
+
+#players ol li.player {
+  padding: 1px 6px;
+  line-height: var(--playerslh);
+}
+
+#players:hover ol li.player {
+  line-height: 20px;
+}
+
+#players h3 {
+  margin: 0px -2px;
+  border-bottom: 0px;
+}
+
+.bennies-count {
+  display: var(--playerbennies);
+}
+
+/** SCENE NAVIGATION **/
+
+#navigation {
+  left: var(--navixpos);
+  visibility: var(--navivis);
+}
+
+#navigation .nav-item {
+  line-height: var(--navilh);
+  font-size: var(--navifs);
+}
+
+#navigation #nav-toggle {
+  height: var(--navibuttonsize);
+  background: #292929bd;
+}
+
+#navigation #scene-list .scene ul.scene-players {
+  top: 16px;
+}
+
+#navigation #scene-list .scene.view, #navigation #scene-list .scene.context {
+  border: 1px solid var(--bordercolor);
+  border-bottom: 1px solid var(--bordercolor);
+  box-shadow: 0 0 var(--shadowstrength) var(--shadowcolor);
+}
+
+.navi-preview {
+  display: none;
+  position: relative;
+  top: var(--navithumbmarg);
+  opacity: 1;
+  border: 1px solid var(--bordercolor);
+  border-bottom: 1px solid var(--bordercolor);
+  box-shadow: 0 0 var(--shadowstrength) var(--shadowcolor);
+}
+
+/** RIGHT SIDEBAR CONTROLS AND BUTTONS **/
+
+#sidebar-tabs {
+  border-bottom: 1px solid var(--bordercolor);
+  box-shadow: 0 0 var(--shadowstrength) var(--shadowcolor);
+}
+
+#sidebar-tabs > .item.active {
+  box-shadow: 0 0 var(--shadowstrength) inset var(--shadowcolor);
+}
+
+.tabs .item.active {
+  text-shadow: 0 0 var(--shadowstrength) var(--shadowcolor);
+}
+
+#sidebar-tabs > a:nth-child(n):hover {
+  text-shadow: 0 0 var(--shadowstrength) var(--bordercolor);
+}
+
+/** LEFT SIDEBAR CONTROLS AND BUTTONS **/
+
+#controls {
+  left: var(--leftbarxpos);
+  top: 10px;
+  margin-top: var(--leftbarypos);
+  border-right: 1px solid var(--bordercolor);
+  box-shadow: 3px 0px var(--shadowstrength) 0px var(--shadowcolor);
+  transition: 0.1s;
+  padding-right: var(--leftbarpad);
+  background: #0000003b;
+}
+
+#controls:hover {
+  left: 0px;
+  transition: 0.5s;
+  padding-right: 7px;
+}
+
+#controls .control-tool.toggle {
+  background: var(--shadowcolor);
+  border: 0px solid var(--bordercolor);
+}
+
+#controls .control-tool.toggle:hover {
+  background: var(--bordercolor);
+  box-shadow: 0 0 var(--shadowstrength) var(--shadowcolor);
+}
+
+#controls .control-tool.toggle.active {
+  background: var(--bordercolor);
+  box-shadow: 0 0 var(--shadowstrength) var(--bordercolor);
+}
+
+#controls .scene-control, #controls .control-tool {
+  margin: 0 0 2px;
+}
+
+#controls .scene-control.active, #controls .scene-control:hover {
+  border: 1px solid transparent;
+  color: orange;
+  border: solid 1px var(--bordercolor);
+  box-shadow: 1px 0px var(--shadowstrength) 0px var(--shadowcolor);
+  padding-right: 2px;
+  padding-left: 1px;
+}
+
+#controls .control-tool.toggle.active, #controls .control-tool.toggle:hover {
+  padding-right: 0px;
+  padding-left: 1px;
+}
+
+#controls .control-tool.active, #controls .control-tool {
+  border: 0px solid transparent;
+  padding-right: 0px;
+  padding-left: 1px;
+}
+
+#controls .control-tool.active, #controls .control-tool:hover {
+  border: 0px solid transparent;
+  color: yellow;
+  box-shadow: 1px 0px var(--shadowstrength) 0px var(--shadowcolor);
+}
+
+#controls > li:nth-child(n), #controls > li.scene-control > ol > li.control-tool {
+  width: var(--leftbarw);
+  height: var(--leftbarh);
+  line-height: var(--leftbarlh);
+  font-size: var(--leftbarfs);
+  padding-right: 0px;
+  padding-left: 1px;
+}
+
+
+#controls .active .control-tools {
+  display: var(--leftbarsubstyle);
+  left: var(--leftbarsubstart);
+  transition: 0.5s;
+  background: #00000059;
+  border: solid 1px var(--bordercolor);
+  box-shadow: 1px 0px var(--shadowstrength) 0px var(--shadowcolor);
+  border-radius: 3px;
+}
+
+#controls:hover .active .control-tools {
+  display: var(--leftbarsubstyle);
+  left: var(--leftbarsubhover);
+}
diff --git a/minimalui.js b/minimalui.js
index fdc7728..68d94cc 100644
--- a/minimalui.js
+++ b/minimalui.js
@@ -11,8 +11,8 @@ class MinimalUI {
   static cssLeftBarHiddenPositionSmall = '-62px';
   static cssLeftBarHiddenPositionStandard = '-72px';
   
-  static cssLeftBarSubMenuSmall = '58px';
-  static cssLeftBarSubMenuStandard = '60px';
+  static cssLeftBarSubMenuSmall = '55px';
+  static cssLeftBarSubMenuStandard = '65px';
   static cssLeftBarSubMenuDndUi = '65px';
 
   static cssLeftBarPaddingDefault = '7px';
@@ -38,6 +38,7 @@ class MinimalUI {
   static cssHotbarRightControlsLineHeightDnDUi = '10px';
   static cssHotbarControlsAutoHideHeight = '100%';
   static cssHotbarAutoHideHeight = '1px';
+  static cssHotbarAutoHideShadow = '-1px';
   static cssHotbarControlsMargin = '0px';
 
   static cssSceneNavNoLogoStart = '5px';
@@ -65,6 +66,15 @@ class MinimalUI {
     }
   }
 
+  static fixMinimizedRule(rule, measure) {
+      var stylesheet = document.querySelector('link[href*=minimalui]');
+
+      if( stylesheet ){
+          stylesheet = stylesheet.sheet;
+          stylesheet.insertRule('.minimized' + '{ ' + rule + ': ' + measure + ' !important }', stylesheet.cssRules.length);
+      }
+  }
+
   static hideAll(alsoChat) {
     $('#logo').click(_ => {
     if (!MinimalUI.hiddenInterface) {
@@ -153,7 +163,7 @@ class MinimalUI {
 
 }
 
-Hooks.on('init', () => {
+Hooks.once('init', () => {
 
   game.settings.register("minimal-ui", "shadowStrength", {
     name: "Shadow Strength",
@@ -200,6 +210,23 @@ Hooks.on('init', () => {
     }
   });
 
+  game.settings.register('minimal-ui', 'organizedMinimize', {
+    name: "Foundry Organized Minimize",
+    hint: "This option may help you organize those minimized windows (Experimental).",
+    scope: 'world',
+    config: true,
+    type: String,
+    choices: {
+      "bottom": "Bottom",
+      "top": "Top",
+      "disabled": "Disabled"
+    },
+    default: "disabled",
+    onChange: value => {
+      window.location.reload()
+    }
+  });
+
   game.settings.register('minimal-ui', 'sceneNavigation', {
     name: "Scene Navigation Style",
     hint: "Customize scene navigation behaviour. Consider 'DF Scene Enhancement' when hidden.",
@@ -400,7 +427,7 @@ Hooks.on('init', () => {
     default: "default",
     type: String,
     choices: {
-      "default": "Default view",
+      "default": "No changes",
       "hidden": "Hide camera/audio box of players"
     },
     onChange: lang => {
@@ -449,6 +476,18 @@ Hooks.once('ready', async function() {
     rootStyle.setProperty('--logow', '100px');
   }
 
+  switch(game.settings.get('minimal-ui', 'organizedMinimize')) {
+    case 'top': {
+      MinimalUI.fixMinimizedRule('top', '70px');
+      break;
+    }
+    case 'bottom': {
+      MinimalUI.fixMinimizedRule('top', 'unset');
+      MinimalUI.fixMinimizedRule('bottom', '70px');
+      break;
+    }
+  }
+
 });
 
 Hooks.on('renderCameraViews', async function() {
@@ -655,6 +694,7 @@ Hooks.on('renderHotbar', async function() {
         rootStyle.setProperty('--macrobarmg', MinimalUI.cssHotbarControlsMargin);
         rootStyle.setProperty('--macrobarhh', MinimalUI.cssHotbarControlsAutoHideHeight);
         rootStyle.setProperty('--macrobarhv', MinimalUI.cssHotbarAutoHideHeight);
+        rootStyle.setProperty('--macrobarshp', MinimalUI.cssHotbarAutoHideShadow);
         $("#hotbar-directory-controls").append(MinimalUI.htmlHotbarLockButton);
         $("#macro-directory").click(function() {MinimalUI.lockHotbar(false)});
         $("#bar-lock").click(function() {MinimalUI.lockHotbar(true)});
diff --git a/module.json b/module.json
index b88ed0a..0df5a5d 100644
--- a/module.json
+++ b/module.json
@@ -3,7 +3,7 @@
 	"title": "Minimal UI",
 	"author": "JeansenVaars#2857",
 	"description": "Minimal UI reduces size of Foundry interface and allows hiding or collapsing specific parts.",
-	"version": "0.5.1",
+	"version": "0.5.2",
 	"minimumCoreVersion": "0.7.9",
 	"compatibleCoreVersion": "0.7.9",
   	"esmodules": [ "lib/colorsettings/colorSetting.js" ],