feat(showcase): add ability to disable start animation

src/components/player.js

@@ -30,10 +30,10 @@ export default function spinePlayer(el) {
     fps: 60,
     defaultMix: 0,
     success: function (widget) {
-      if (widget.skeleton.data.animations.map(e => e.name).includes("Start")) {
+      if (widget.skeleton.data.animations.map(e => e.name).includes("Start") && window.settings.useStartAnimation) {
         widget.animationState.setAnimation(0, "Start", false, 0)
-        widget.animationState.addAnimation(0, "Idle", true, 0);
       }
+      widget.animationState.addAnimation(0, "Idle", true, 0);
       widget.animationState.addListener({
         end: (e) => {
           if (e.animation.name == "Interact") {

src/components/settings.js

@@ -40,6 +40,7 @@ export default class Settings {
   #isInsightsInited = false
   #doNotTrack = false
   #lastFunctionInsights = null
+  #useStartAnimation = true
 
   constructor(el, logoEl) {
     this.isWallpaperEngine = false
@@ -283,6 +284,14 @@ export default class Settings {
     document.getElementById("logo_padding_y_input").value = this.#defaultLogoY
   }
 
+  set useStartAnimation(v) {
+    this.#useStartAnimation = v
+  }
+
+  get useStartAnimation() {
+    return this.#useStartAnimation
+  }
+
   open() {
     this.#el.hidden = false;
   }
@@ -459,6 +468,10 @@ export default class Settings {
           <label for="animation_select">Animation:</label>
           <select name="animation_select" id="animation_selection"></select>
         </div>
+        <div>
+          <label for="use_start_animation">Use Start Animation</label>
+          <input type="checkbox" id="use_start_animation" name="use_start_animation" checked/>
+        </div>
         <div>
           <button type="button" id="settings_play" disabled>Play</button>
           <button type="button" id="settings_pause">Pause</button>
@@ -717,6 +730,10 @@ export default class Settings {
           this.spinePlayer.animationState.setAnimation(0, e.currentTarget.value, false, 0)
           this.spinePlayer.animationState.addAnimation(0, "Idle", true, 0);
         }
+      }, {
+        id: "use_start_animation", event: "click", handler: e => {
+          this.#useStartAnimation = e.currentTarget.checked;
+        }
       },
     ]