Added animation play/pause toggle to the viewer again.

web/src/main/kotlin/world/phantasmal/web/externals/three/three.kt

@@ -784,7 +784,7 @@ external class AnimationAction(
 ) {
     var time: Double
     var timeScale: Double
-    val paused: Boolean
+    var paused: Boolean
 
     fun play(): AnimationAction
     fun stop(): AnimationAction

web/src/main/kotlin/world/phantasmal/web/viewer/controllers/ViewerToolbarController.kt

@@ -23,6 +23,7 @@ class ViewerToolbarController(private val store: ViewerStore) : Controller() {
     private val _result = mutableVal<PwResult<*>?>(null)
 
     val showSkeleton: Val<Boolean> = store.showSkeleton
+    val playAnimation: Val<Boolean> = store.animationPlaying
     val clearCurrentAnimationButtonEnabled = store.currentNinjaMotion.isNotNull()
     val resultDialogVisible: Val<Boolean> = _resultDialogVisible
     val result: Val<PwResult<*>?> = _result
@@ -37,6 +38,10 @@ class ViewerToolbarController(private val store: ViewerStore) : Controller() {
         store.setShowSkeleton(show)
     }
 
+    fun setPlayAnimation(play: Boolean) {
+        store.setAnimationPlaying(play)
+    }
+
     suspend fun clearCurrentAnimation() {
         store.setCurrentAnimation(null)
     }

web/src/main/kotlin/world/phantasmal/web/viewer/rendering/MeshRenderer.kt

@@ -47,6 +47,7 @@ class MeshRenderer(
         observe(viewerStore.currentTextures) { ninjaObjectOrXvmChanged() }
         observe(viewerStore.currentNinjaMotion, ::ninjaMotionChanged)
         observe(viewerStore.showSkeleton) { skeletonHelper?.visible = it }
+        observe(viewerStore.animationPlaying, ::animationPlayingChanged)
     }
 
     override fun render() {
@@ -168,6 +169,18 @@ class MeshRenderer(
         mixer!!.clipAction(clip).play()
     }
 
+    private fun animationPlayingChanged(playing: Boolean) {
+        animation?.let { animation ->
+            animation.mixer.clipAction(animation.clip).paused = !playing
+
+            if (playing) {
+                clock.start()
+            } else {
+                clock.stop()
+            }
+        }
+    }
+
     private class Animation(val mixer: AnimationMixer, val clip: AnimationClip)
 
     companion object {

web/src/main/kotlin/world/phantasmal/web/viewer/stores/ViewerStore.kt

@@ -41,6 +41,7 @@ class ViewerStore(
 
     // Settings.
     private val _showSkeleton = mutableVal(false)
+    private val _animationPlaying = mutableVal(true)
 
     // Ninja concepts.
     val currentNinjaObject: Val<NinjaObject<*>?> = _currentNinjaObject
@@ -61,6 +62,7 @@ class ViewerStore(
 
     // Settings.
     val showSkeleton: Val<Boolean> = _showSkeleton
+    val animationPlaying: Val<Boolean> = _animationPlaying
 
     init {
         for (path in listOf(ViewerUrls.mesh, ViewerUrls.texture)) {
@@ -175,6 +177,7 @@ class ViewerStore(
 
     fun setCurrentNinjaMotion(njm: NjMotion) {
         _currentNinjaMotion.value = njm
+        _animationPlaying.value = true
     }
 
     suspend fun setCurrentAnimation(animation: AnimationModel?) {
@@ -191,6 +194,10 @@ class ViewerStore(
         _showSkeleton.value = show
     }
 
+    fun setAnimationPlaying(playing: Boolean) {
+        _animationPlaying.value = playing
+    }
+
     private suspend fun loadCharacterClassNinjaObject(clearAnimation: Boolean) {
         val char = currentCharacterClass.value
             ?: return
@@ -222,6 +229,7 @@ class ViewerStore(
     private suspend fun loadAnimation(animation: AnimationModel) {
         try {
             _currentNinjaMotion.value = animationAssetLoader.loadAnimation(animation.filePath)
+            _animationPlaying.value = true
         } catch (e: Exception) {
             logger.error(e) {
                 "Couldn't load Ninja motion for ${animation.name} (path: ${animation.filePath})."

web/src/main/kotlin/world/phantasmal/web/viewer/widgets/ViewerToolbar.kt

@@ -26,6 +26,11 @@ class ViewerToolbar(private val ctrl: ViewerToolbarController) : Widget() {
                         checked = ctrl.showSkeleton,
                         onChange = ctrl::setShowSkeleton,
                     ),
+                    Checkbox(
+                        label = "Play animation",
+                        checked = ctrl.playAnimation,
+                        onChange = ctrl::setPlayAnimation,
+                    ),
                     Button(
                         text = "Clear animation",
                         enabled = ctrl.clearCurrentAnimationButtonEnabled,