diff --git a/CHANGELOG.md b/CHANGELOG.md
index acda59af..09e81463 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,10 @@
# Changelog
+## v2.1.2 (2020-09-16)
+- fixed a bug that caused discard & save buttons to remain active after loading a new script
+- update styling code
+- improve web demo experience
+
## v2.1.1 (2020-09-14)
- fixed an issue that caused extension to crash when text preceded opening userscript tag - #69 #68 #58
- improve sidebar tag filtering
diff --git a/README.md b/README.md
index 7ca24d1c..018d894b 100644
--- a/README.md
+++ b/README.md
@@ -1,6 +1,6 @@
# Userscripts Safari
-An open-source userscript editor for Safari
+An open-source userscript editor for Safari - https://quoid.github.io/userscripts/

diff --git a/extension/Userscripts Extension/index.html b/extension/Userscripts Extension/index.html
index 97c35348..84f3755c 100644
--- a/extension/Userscripts Extension/index.html
+++ b/extension/Userscripts Extension/index.html
@@ -1,4 +1,4 @@
-
Userscripts Safari Please enable Javascript to use this app
+Userscripts Safari Please enable Javascript to use this app
@@ -19,4 +19,4 @@
-->
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/extension/Userscripts.xcodeproj/project.pbxproj b/extension/Userscripts.xcodeproj/project.pbxproj
index 2779e1f3..bb00442f 100644
--- a/extension/Userscripts.xcodeproj/project.pbxproj
+++ b/extension/Userscripts.xcodeproj/project.pbxproj
@@ -409,7 +409,7 @@
CODE_SIGN_ENTITLEMENTS = "Userscripts Extension/Userscripts Extension.entitlements";
CODE_SIGN_IDENTITY = "Apple Development";
CODE_SIGN_STYLE = Automatic;
- CURRENT_PROJECT_VERSION = 18;
+ CURRENT_PROJECT_VERSION = 19;
DEVELOPMENT_TEAM = J74Q8V8V8N;
ENABLE_HARDENED_RUNTIME = YES;
INFOPLIST_FILE = "Userscripts Extension/Info.plist";
@@ -418,7 +418,7 @@
"@executable_path/../Frameworks",
"@executable_path/../../../../Frameworks",
);
- MARKETING_VERSION = 2.1.1;
+ MARKETING_VERSION = 2.1.2;
PRODUCT_BUNDLE_IDENTIFIER = "com.userscripts.macos.Userscripts-Extension";
PRODUCT_NAME = "$(TARGET_NAME)";
SKIP_INSTALL = YES;
@@ -432,7 +432,7 @@
CODE_SIGN_ENTITLEMENTS = "Userscripts Extension/Userscripts Extension.entitlements";
CODE_SIGN_IDENTITY = "Apple Development";
CODE_SIGN_STYLE = Automatic;
- CURRENT_PROJECT_VERSION = 18;
+ CURRENT_PROJECT_VERSION = 19;
DEVELOPMENT_TEAM = J74Q8V8V8N;
ENABLE_HARDENED_RUNTIME = YES;
INFOPLIST_FILE = "Userscripts Extension/Info.plist";
@@ -441,7 +441,7 @@
"@executable_path/../Frameworks",
"@executable_path/../../../../Frameworks",
);
- MARKETING_VERSION = 2.1.1;
+ MARKETING_VERSION = 2.1.2;
PRODUCT_BUNDLE_IDENTIFIER = "com.userscripts.macos.Userscripts-Extension";
PRODUCT_NAME = "$(TARGET_NAME)";
SKIP_INSTALL = YES;
@@ -458,7 +458,7 @@
CODE_SIGN_IDENTITY = "Apple Development";
CODE_SIGN_STYLE = Automatic;
COMBINE_HIDPI_IMAGES = YES;
- CURRENT_PROJECT_VERSION = 18;
+ CURRENT_PROJECT_VERSION = 19;
DEVELOPMENT_TEAM = J74Q8V8V8N;
ENABLE_HARDENED_RUNTIME = YES;
INFOPLIST_FILE = Userscripts/Info.plist;
@@ -466,7 +466,7 @@
"$(inherited)",
"@executable_path/../Frameworks",
);
- MARKETING_VERSION = 2.1.1;
+ MARKETING_VERSION = 2.1.2;
PRODUCT_BUNDLE_IDENTIFIER = com.userscripts.macos;
PRODUCT_NAME = "$(TARGET_NAME)";
SWIFT_VERSION = 5.0;
@@ -482,7 +482,7 @@
CODE_SIGN_IDENTITY = "Apple Development";
CODE_SIGN_STYLE = Automatic;
COMBINE_HIDPI_IMAGES = YES;
- CURRENT_PROJECT_VERSION = 18;
+ CURRENT_PROJECT_VERSION = 19;
DEVELOPMENT_TEAM = J74Q8V8V8N;
ENABLE_HARDENED_RUNTIME = YES;
INFOPLIST_FILE = Userscripts/Info.plist;
@@ -490,7 +490,7 @@
"$(inherited)",
"@executable_path/../Frameworks",
);
- MARKETING_VERSION = 2.1.1;
+ MARKETING_VERSION = 2.1.2;
PRODUCT_BUNDLE_IDENTIFIER = com.userscripts.macos;
PRODUCT_NAME = "$(TARGET_NAME)";
SWIFT_VERSION = 5.0;
diff --git a/index.html b/index.html
index 5f9befb1..d0ae5274 100644
--- a/index.html
+++ b/index.html
@@ -1,4 +1,4 @@
-Userscripts Safari Please enable Javascript to use this app
+Userscripts Safari Please enable Javascript to use this app App optimized for Safari - other browser support limited
@@ -19,4 +19,4 @@
-->
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/src/index.html b/src/index.html
index b921eabf..7dfb3a36 100644
--- a/src/index.html
+++ b/src/index.html
@@ -18,8 +18,10 @@
Please enable Javascript to use this app
+ {% if demo %}
+ App optimized for Safari - other browser support limited
+ {% endif %}
-
{% include "sidebar.html" %}
{% include "editor.html" %}
diff --git a/src/js/dev.js b/src/js/dev.js
index 158ac325..962d82eb 100644
--- a/src/js/dev.js
+++ b/src/js/dev.js
@@ -195,7 +195,7 @@ const ___settings = {
showInvisibles: "true",
tabSize: "4",
verbose: "true",
- version: "2.1.1"
+ version: "2.1.2"
};
const ___parse = {
diff --git a/src/js/main.js b/src/js/main.js
index 3c05f36c..9ef9fc83 100644
--- a/src/js/main.js
+++ b/src/js/main.js
@@ -562,6 +562,8 @@ const ___e = {
// enable the save button for temp scripts
this.buttonSave.removeAttribute("disabled");
} else {
+ // ensure discard and save button are disabled after loading
+ this.toggleButtonState("disable");
status = ___a.getString("lastModified") + " " + lastModified;
}
this.setStatus(status);
@@ -696,6 +698,11 @@ const ___s = {
buttonSettingsHide: document.getElementById("settingsHide"),
filterBar: document.querySelector("#filter input"),
scriptsContainer: document.getElementById("scripts"),
+ scrollOptions: { // options description: https://stackoverflow.com/a/48635751
+ behavior: "auto",
+ block: "nearest",
+ inline: "start"
+ },
settingsOverlay: document.getElementById("settings"),
createNewScript: function(type) {
// check if editor has unsaved changed OR there's an unsaved temp script
@@ -731,7 +738,7 @@ const ___s = {
el.classList.add("temp");
loc.insertAdjacentElement("afterend", el);
this.updateScriptCount();
- el.scrollIntoViewIfNeeded();
+ el.scrollIntoView(this.scrollOptions);
___a.log(`Created temporary script, ${filename}`, "darkorchid");
___e.loadScript(loadData);
},
@@ -907,7 +914,7 @@ const ___s = {
document.querySelector(".active").classList.remove("active");
}
el.classList.add("active");
- el.scrollIntoViewIfNeeded();
+ el.scrollIntoView(this.scrollOptions);
},
scriptToggle: function(e) {
// prevent default checkbox behaviour, checking happens programatically
@@ -948,7 +955,7 @@ const ___s = {
});
// scroll to activ script
if (document.querySelector(".active")) {
- document.querySelector(".active").scrollIntoViewIfNeeded();
+ document.querySelector(".active").scrollIntoView(this.scrollOptions);
}
},
updateScriptCount: function() {
diff --git a/src/macros/toggle.css b/src/macros/toggle.css
index 9603c0c7..c71815c8 100644
--- a/src/macros/toggle.css
+++ b/src/macros/toggle.css
@@ -11,9 +11,8 @@
.toggle input[type=checkbox] {
display: block;
- height: 0;
+ position: absolute;
visibility: hidden;
- width: 0;
}
.toggle span {
diff --git a/src/partials/editor.css b/src/partials/editor.css
index 88c9da22..5eff5511 100644
--- a/src/partials/editor.css
+++ b/src/partials/editor.css
@@ -9,8 +9,10 @@
#code {
display: flex;
- flex: 1;
+ flex-basis: calc(100% - 112px); /* .editor-header @ 56px .editor-footer @ 56px */
+ flex-grow: 1;
flex-direction: column;
+ overflow: hidden;
}
.editor-header {
diff --git a/src/partials/sidebar.css b/src/partials/sidebar.css
index dd5db7ae..4f427348 100644
--- a/src/partials/sidebar.css
+++ b/src/partials/sidebar.css
@@ -106,7 +106,7 @@
#scripts {
border-top: 1px solid var(--border-dark);
- flex: 1;
+ flex-basis: calc(100vh - 162px); /* .sidebar-header @ 106px and .sidebar-footer @ 56px */
overflow-y: auto;
position: relative;
}
@@ -141,7 +141,7 @@
}
.script-header .title {
- flex: 1;
+ flex-grow: 1;
font: var(--fs3);
letter-spacing: var(--ls3);
padding-right: 8px;
@@ -228,13 +228,25 @@ body.saving #sidebar .script {
}
/* show disabled css scripts */
-#scripts.show-css.show-disabled .script:not([data-type="css"].disabled),
+/* #scripts.show-css.show-disabled .script:not([data-type="css"].disabled), */
+#scripts.show-css.show-disabled .script[data-type="css"].enabled,
+#scripts.show-css.show-disabled .script[data-type="js"].enabled,
+#scripts.show-css.show-disabled .script[data-type="js"].disabled,
/* show enabled css scripts */
-#scripts.show-css.show-enabled .script:not([data-type="css"].enabled),
+/* #scripts.show-css.show-enabled .script:not([data-type="css"].enabled), */
+#scripts.show-css.show-enabled .script[data-type="css"].disabled,
+#scripts.show-css.show-enabled .script[data-type="js"].disabled,
+#scripts.show-css.show-enabled .script[data-type="js"].enabled,
/* show disabled js scripts */
-#scripts.show-js.show-disabled .script:not([data-type="js"].disabled),
+/* #scripts.show-js.show-disabled .script:not([data-type="js"].disabled), */
+#scripts.show-js.show-disabled .script[data-type="js"].enabled,
+#scripts.show-js.show-disabled .script[data-type="css"].enabled,
+#scripts.show-js.show-disabled .script[data-type="css"].disabled,
/* show enabled js scripts */
-#scripts.show-js.show-enabled .script:not([data-type="js"].enabled) {
+/* #scripts.show-js.show-enabled .script:not([data-type="js"].enabled), */
+#scripts.show-js.show-enabled .script[data-type="js"].disabled,
+#scripts.show-js.show-enabled .script[data-type="css"].disabled,
+#scripts.show-js.show-enabled .script[data-type="css"].enabled {
display: none;
}
diff --git a/src/partials/sidebar.html b/src/partials/sidebar.html
index d6acfe07..24016495 100644
--- a/src/partials/sidebar.html
+++ b/src/partials/sidebar.html
@@ -16,7 +16,7 @@
-
+
{{ icon("loupe", "filterLoupe") }}
diff --git a/src/stylesheets/_main.css b/src/stylesheets/_main.css
index a210d416..fb1bbcb2 100644
--- a/src/stylesheets/_main.css
+++ b/src/stylesheets/_main.css
@@ -20,7 +20,7 @@
/* z-indexes */
noscript { z-index: 99; }
-#notify { z-index: 99;}
+#notify, .warn { z-index: 99;}
#appLoader { z-index: 98; }
#settings { z-index: 97; }
#progress {z-index: 96; }
diff --git a/src/stylesheets/global.css b/src/stylesheets/global.css
index 81586012..7bd87fe0 100644
--- a/src/stylesheets/global.css
+++ b/src/stylesheets/global.css
@@ -20,7 +20,7 @@ body {
#wrapper {
display: flex;
- flex: 1;
+ overflow: hidden;
}
a {
@@ -58,6 +58,7 @@ body:not(.init) #appLoader {
white-space: nowrap;
}
+.demo,
#notify,
noscript {
background-color: var(--color-red);
@@ -67,38 +68,14 @@ noscript {
width: 100%;
}
-#notify {
- display: none;
+.demo {
+ font-size: 11.5px;
+ line-height: 1;
+ padding: 4px;
}
-#progress {
+#notify {
display: none;
- background-color: var(--border-dark);
- height: 3px;
- left: 0;
- position: absolute;
- top: 0;
- width: 100%;
-}
-
-#progress::before {
- animation: fill 3.5s infinite;
- background-color: var(--link-color);
- content: "";
- height: 3px;
- left: 0;
- margin-left: 0;
- position: absolute;
- top: 0;
- width: 0;
-}
-
-@keyframes fill {
- 0% {width: 0; margin-left: 0;}
- 50% {width: 100%;}
- 55% {margin-left: 100%;}
- 95% {margin-left: 0;}
- 100% {width: 0;}
}
.link {