From a66892c30d8d5a07b1584577e1fea788aed6d929 Mon Sep 17 00:00:00 2001 From: Adrian Irving-Beer Date: Wed, 28 Apr 2021 17:45:33 -0400 Subject: [PATCH 1/4] Add option to reduce night animations to save power. --- src/App.vue | 8 ++++++-- src/components/Menu.vue | 11 +++++++++++ src/store/index.js | 2 ++ 3 files changed, 19 insertions(+), 2 deletions(-) diff --git a/src/App.vue b/src/App.vue index bb5bc65..906212d 100644 --- a/src/App.vue +++ b/src/App.vue @@ -17,7 +17,8 @@ autoplay loop > -
+
+
@@ -339,11 +340,14 @@ video#background { height: 100%; background: url("assets/clouds.png") repeat; background-size: 2000px auto; - animation: move-background 120s linear infinite; opacity: 0.3; } } +#app > .backdrop.animated:after { + animation: move-background 120s linear infinite; +} + @keyframes move-background { from { transform: translate3d(-2000px, 0px, 0px); diff --git a/src/components/Menu.vue b/src/components/Menu.vue index 40abc72..ce4db99 100644 --- a/src/components/Menu.vue +++ b/src/components/Menu.vue @@ -96,6 +96,16 @@ Background image +
  • + Animated night + +
  • Mute Sounds Date: Sat, 1 May 2021 21:24:07 +0200 Subject: [PATCH 2/4] changelog --- CHANGELOG.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index e62792b..88bfb1d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ # Release Notes +### Version 2.13.0 +- added global animation toggle for better performance + +--- + ### Version 2.12.0 - tweak reference sheet to better fit screen in single column layout - add warning icon overlay for setup roles on character assignment modal From a99d9964194b8e402e9360fcee57c4848b85b3d1 Mon Sep 17 00:00:00 2001 From: Steffen Date: Sat, 1 May 2021 22:46:12 +0200 Subject: [PATCH 3/4] disable all animations now --- src/App.vue | 21 ++++++++++++++------- src/components/Menu.vue | 21 +++++++++------------ src/store/index.js | 4 ++-- src/store/persistence.js | 10 ++++++++++ 4 files changed, 35 insertions(+), 21 deletions(-) diff --git a/src/App.vue b/src/App.vue index 906212d..7078023 100644 --- a/src/App.vue +++ b/src/App.vue @@ -3,7 +3,10 @@ id="app" @keyup="keyup" tabindex="-1" - :class="{ night: grimoire.isNight }" + :class="{ + night: grimoire.isNight, + static: grimoire.isStatic + }" :style="{ backgroundImage: grimoire.background ? `url('${grimoire.background}')` @@ -17,8 +20,7 @@ autoplay loop > -
    -
    +
    @@ -203,6 +205,14 @@ ul { align-items: center; align-content: center; justify-content: center; + + // disable all animations + &.static *, + &.static *:after, + &.static *:before { + transition: none !important; + animation: none !important; + } } #version { @@ -340,14 +350,11 @@ video#background { height: 100%; background: url("assets/clouds.png") repeat; background-size: 2000px auto; + animation: move-background 120s linear infinite; opacity: 0.3; } } -#app > .backdrop.animated:after { - animation: move-background 120s linear infinite; -} - @keyframes move-background { from { transform: translate3d(-2000px, 0px, 0px); diff --git a/src/components/Menu.vue b/src/components/Menu.vue index ce4db99..6731d1a 100644 --- a/src/components/Menu.vue +++ b/src/components/Menu.vue @@ -82,28 +82,25 @@ />
  • +
  • + Background image + +
  • Show Custom Images
  • -
  • - Background image - -
  • -
  • - Animated night +
  • + Disable Animations
  • @@ -344,7 +341,7 @@ export default { "toggleMuted", "toggleNight", "toggleNightOrder", - "toggleNightAnimated", + "toggleStatic", "setZoom", "toggleModal" ]) diff --git a/src/store/index.js b/src/store/index.js index 5a411dc..f03a95a 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -79,9 +79,9 @@ export default new Vuex.Store({ grimoire: { isNight: false, isNightOrder: true, - isNightAnimated: true, isPublic: true, isMenuOpen: false, + isStatic: false, isMuted: false, isImageOptIn: false, zoom: 0, @@ -145,7 +145,7 @@ export default new Vuex.Store({ toggleMuted: toggle("isMuted"), toggleMenu: toggle("isMenuOpen"), toggleNightOrder: toggle("isNightOrder"), - toggleNightAnimated: toggle("isNightAnimated"), + toggleStatic: toggle("isStatic"), toggleNight: toggle("isNight"), toggleGrimoire: toggle("isPublic"), toggleImageOptIn: toggle("isImageOptIn"), diff --git a/src/store/persistence.js b/src/store/persistence.js index 55c2b78..0bd6188 100644 --- a/src/store/persistence.js +++ b/src/store/persistence.js @@ -11,6 +11,9 @@ module.exports = store => { if (localStorage.getItem("muted")) { store.commit("toggleMuted", true); } + if (localStorage.getItem("static")) { + store.commit("toggleStatic", true); + } if (localStorage.getItem("imageOptIn")) { store.commit("toggleImageOptIn", true); } @@ -91,6 +94,13 @@ module.exports = store => { localStorage.removeItem("muted"); } break; + case "toggleStatic": + if (state.grimoire.isStatic) { + localStorage.setItem("static", 1); + } else { + localStorage.removeItem("static"); + } + break; case "toggleImageOptIn": if (state.grimoire.isImageOptIn) { localStorage.setItem("imageOptIn", 1); From ef28198679a95e78f0eed1eddc6b93a0550b2f57 Mon Sep 17 00:00:00 2001 From: Steffen Date: Sat, 1 May 2021 22:54:55 +0200 Subject: [PATCH 4/4] linter --- src/components/Menu.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Menu.vue b/src/components/Menu.vue index 6731d1a..f015225 100644 --- a/src/components/Menu.vue +++ b/src/components/Menu.vue @@ -89,7 +89,7 @@
  • Show Custom Images