Character animations can be selected again in the viewer.

web/src/main/kotlin/world/phantasmal/web/viewer/Viewer.kt

@@ -10,6 +10,7 @@ import world.phantasmal.web.core.widgets.RendererWidget
 import world.phantasmal.web.viewer.controllers.CharacterClassOptionsController
 import world.phantasmal.web.viewer.controllers.ViewerController
 import world.phantasmal.web.viewer.controllers.ViewerToolbarController
+import world.phantasmal.web.viewer.loading.AnimationAssetLoader
 import world.phantasmal.web.viewer.loading.CharacterClassAssetLoader
 import world.phantasmal.web.viewer.rendering.MeshRenderer
 import world.phantasmal.web.viewer.rendering.TextureRenderer
@@ -30,9 +31,11 @@ class Viewer(
     override fun initialize(): Widget {
         // Asset Loaders
         val characterClassAssetLoader = addDisposable(CharacterClassAssetLoader(assetLoader))
+        val animationAssetLoader = addDisposable(AnimationAssetLoader(assetLoader))
 
         // Stores
-        val viewerStore = addDisposable(ViewerStore(characterClassAssetLoader, uiStore))
+        val viewerStore =
+            addDisposable(ViewerStore(characterClassAssetLoader, animationAssetLoader, uiStore))
 
         // Controllers
         val viewerController = addDisposable(ViewerController(uiStore, viewerStore))

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

@@ -6,6 +6,7 @@ import world.phantasmal.web.core.controllers.PathAwareTab
 import world.phantasmal.web.core.controllers.PathAwareTabContainerController
 import world.phantasmal.web.core.stores.UiStore
 import world.phantasmal.web.viewer.ViewerUrls
+import world.phantasmal.web.viewer.models.AnimationModel
 import world.phantasmal.web.viewer.models.CharacterClass
 import world.phantasmal.web.viewer.stores.ViewerStore
 
@@ -28,7 +29,14 @@ class ViewerController(
     val characterClasses: List<CharacterClass> = CharacterClass.VALUES_LIST
     val currentCharacterClass: Val<CharacterClass?> = store.currentCharacterClass
 
+    val animations: List<AnimationModel> = store.animations
+    val currentAnimation: Val<AnimationModel?> = store.currentAnimation
+
     suspend fun setCurrentCharacterClass(char: CharacterClass?) {
         store.setCurrentCharacterClass(char)
     }
+
+    suspend fun setCurrentAnimation(animation: AnimationModel) {
+        store.setCurrentAnimation(animation)
+    }
 }

web/src/main/kotlin/world/phantasmal/web/viewer/loading/AnimationAssetLoader.kt

@@ -0,0 +1,20 @@
+package world.phantasmal.web.viewer.loading
+
+import world.phantasmal.lib.Endianness
+import world.phantasmal.lib.cursor.cursor
+import world.phantasmal.lib.fileFormats.ninja.NjMotion
+import world.phantasmal.lib.fileFormats.ninja.parseNjm
+import world.phantasmal.web.core.loading.AssetLoader
+import world.phantasmal.web.questEditor.loading.LoadingCache
+import world.phantasmal.webui.DisposableContainer
+
+class AnimationAssetLoader(private val assetLoader: AssetLoader) : DisposableContainer() {
+    private val ninjaMotionCache: LoadingCache<String, NjMotion> =
+        addDisposable(LoadingCache(::loadNinjaMotion) { /* Nothing to dispose. */ })
+
+    suspend fun loadAnimation(filePath: String): NjMotion =
+        ninjaMotionCache.get(filePath)
+
+    private suspend fun loadNinjaMotion(filePath: String): NjMotion =
+        parseNjm(assetLoader.loadArrayBuffer(filePath).cursor(Endianness.Little))
+}

web/src/main/kotlin/world/phantasmal/web/viewer/loading/CharacterClassAssetLoader.kt

@@ -6,8 +6,8 @@ import world.phantasmal.lib.cursor.cursor
 import world.phantasmal.lib.fileFormats.ninja.*
 import world.phantasmal.lib.fileFormats.parseAfs
 import world.phantasmal.web.core.loading.AssetLoader
-import world.phantasmal.web.shared.dto.SectionId
 import world.phantasmal.web.questEditor.loading.LoadingCache
+import world.phantasmal.web.shared.dto.SectionId
 import world.phantasmal.web.viewer.models.CharacterClass
 import world.phantasmal.web.viewer.models.CharacterClass.*
 import world.phantasmal.webui.DisposableContainer

web/src/main/kotlin/world/phantasmal/web/viewer/models/AnimationModel.kt

@@ -0,0 +1,3 @@
+package world.phantasmal.web.viewer.models
+
+class AnimationModel(val name: String, val filePath: String)

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

@@ -21,6 +21,7 @@ class MeshRenderer(
     private var mesh: Mesh? = null
     private var skeletonHelper: SkeletonHelper? = null
     private var animation: Animation? = null
+    private var charClassActive = false
 
     override val context = addDisposable(RenderContext(
         createCanvas(),
@@ -28,7 +29,7 @@ class MeshRenderer(
             fov = 45.0,
             aspect = 1.0,
             near = 10.0,
-            far = 5_000.0
+            far = 5_000.0,
         )
     ))
 
@@ -38,16 +39,12 @@ class MeshRenderer(
         context.canvas,
         context.camera,
         Vector3(),
-        screenSpacePanning = true
+        screenSpacePanning = true,
     ))
 
     init {
-        observe(viewerStore.currentNinjaObject) {
+        observe(viewerStore.currentNinjaObject) { ninjaObjectOrXvmChanged() }
-            ninjaObjectOrXvmChanged(resetCamera = true)
+        observe(viewerStore.currentTextures) { ninjaObjectOrXvmChanged() }
-        }
-        observe(viewerStore.currentTextures) {
-            ninjaObjectOrXvmChanged(resetCamera = false)
-        }
         observe(viewerStore.currentNinjaMotion, ::ninjaMotionChanged)
         observe(viewerStore.showSkeleton) { skeletonHelper?.visible = it }
     }
@@ -66,7 +63,7 @@ class MeshRenderer(
         }
     }
 
-    private fun ninjaObjectOrXvmChanged(resetCamera: Boolean) {
+    private fun ninjaObjectOrXvmChanged() {
         // Remove the previous mesh.
         mesh?.let { mesh ->
             disposeObject3DResources(mesh)
@@ -79,10 +76,6 @@ class MeshRenderer(
             skeletonHelper = null
         }
 
-        if (resetCamera) {
-            inputManager.resetCamera()
-        }
-
         val ninjaObject = viewerStore.currentNinjaObject.value
         val textures = viewerStore.currentTextures.value
 
@@ -101,6 +94,12 @@ class MeshRenderer(
         if (ninjaObject != null) {
             val mesh = ninjaObjectToSkinnedMesh(ninjaObject, textures, boundingVolumes = true)
 
+            // Determine whether camera needs to be reset. Resets should always happen when the
+            // Ninja object changes except when we're switching between character class models.
+            val charClassActive = viewerStore.currentCharacterClass.value != null
+            val resetCamera = !charClassActive || !this.charClassActive
+            this.charClassActive = charClassActive
+
             if (resetCamera) {
                 // Compute camera position.
                 val bSphere = mesh.geometry.boundingSphere!!

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

@@ -1,8 +1,6 @@
 package world.phantasmal.web.viewer.stores
 
-import kotlinx.coroutines.Dispatchers
 import kotlinx.coroutines.launch
-import kotlinx.coroutines.withContext
 import mu.KotlinLogging
 import world.phantasmal.core.enumValueOfOrNull
 import world.phantasmal.lib.fileFormats.ninja.NinjaObject
@@ -16,35 +14,52 @@ import world.phantasmal.web.core.PwToolType
 import world.phantasmal.web.core.stores.UiStore
 import world.phantasmal.web.shared.dto.SectionId
 import world.phantasmal.web.viewer.ViewerUrls
+import world.phantasmal.web.viewer.loading.AnimationAssetLoader
 import world.phantasmal.web.viewer.loading.CharacterClassAssetLoader
+import world.phantasmal.web.viewer.models.AnimationModel
 import world.phantasmal.web.viewer.models.CharacterClass
 import world.phantasmal.webui.stores.Store
 
 private val logger = KotlinLogging.logger {}
 
 class ViewerStore(
-    private val assetLoader: CharacterClassAssetLoader,
+    private val characterClassAssetLoader: CharacterClassAssetLoader,
+    private val animationAssetLoader: AnimationAssetLoader,
     uiStore: UiStore,
 ) : Store() {
+    // Ninja concepts.
     private val _currentNinjaObject = mutableVal<NinjaObject<*>?>(null)
     private val _currentTextures = mutableListVal<XvrTexture?>()
+    private val _currentNinjaMotion = mutableVal<NjMotion?>(null)
+
+    // High-level concepts.
     private val _currentCharacterClass = mutableVal<CharacterClass?>(CharacterClass.VALUES.random())
     private val _currentSectionId = mutableVal(SectionId.VALUES.random())
     private val _currentBody =
         mutableVal((1.._currentCharacterClass.value!!.bodyStyleCount).random())
-    private val _currentNinjaMotion = mutableVal<NjMotion?>(null)
+    private val _currentAnimation = mutableVal<AnimationModel?>(null)
 
-    // Settings
+    // Settings.
     private val _showSkeleton = mutableVal(false)
 
+    // Ninja concepts.
     val currentNinjaObject: Val<NinjaObject<*>?> = _currentNinjaObject
     val currentTextures: ListVal<XvrTexture?> = _currentTextures
+    val currentNinjaMotion: Val<NjMotion?> = _currentNinjaMotion
+
+    // High-level concepts.
     val currentCharacterClass: Val<CharacterClass?> = _currentCharacterClass
     val currentSectionId: Val<SectionId> = _currentSectionId
     val currentBody: Val<Int> = _currentBody
-    val currentNinjaMotion: Val<NjMotion?> = _currentNinjaMotion
+    val animations: List<AnimationModel> = (0 until 572).map {
+        AnimationModel(
+            "Animation ${it + 1}",
+            "/player/animation/animation_${it.toString().padStart(3, '0')}.njm"
+        )
+    }
+    val currentAnimation: Val<AnimationModel?> = _currentAnimation
 
-    // Settings
+    // Settings.
     val showSkeleton: Val<Boolean> = _showSkeleton
 
     init {
@@ -116,7 +131,7 @@ class ViewerStore(
             )
         }
 
-        scope.launch(Dispatchers.Default) {
+        scope.launch {
             loadCharacterClassNinjaObject(clearAnimation = true)
         }
     }
@@ -127,6 +142,7 @@ class ViewerStore(
             _currentTextures.clear()
         }
 
+        _currentAnimation.value = null
         _currentNinjaMotion.value = null
         _currentNinjaObject.value = ninjaObject
     }
@@ -161,6 +177,11 @@ class ViewerStore(
         _currentNinjaMotion.value = njm
     }
 
+    suspend fun setCurrentAnimation(animation: AnimationModel) {
+        _currentAnimation.value = animation
+        loadAnimation(animation)
+    }
+
     fun setShowSkeleton(show: Boolean) {
         _showSkeleton.value = show
     }
@@ -173,26 +194,36 @@ class ViewerStore(
         val body = currentBody.value
 
         try {
-            val ninjaObject = assetLoader.loadNinjaObject(char)
+            val ninjaObject = characterClassAssetLoader.loadNinjaObject(char)
-            val textures = assetLoader.loadXvrTextures(char, sectionId, body)
+            val textures = characterClassAssetLoader.loadXvrTextures(char, sectionId, body)
 
-            withContext(Dispatchers.Main) {
             if (clearAnimation) {
+                _currentAnimation.value = null
                 _currentNinjaMotion.value = null
             }
 
             _currentNinjaObject.value = ninjaObject
             _currentTextures.replaceAll(textures)
-            }
         } catch (e: Exception) {
             logger.error(e) { "Couldn't load Ninja model for $char." }
 
-            withContext(Dispatchers.Main) {
+            _currentAnimation.value = null
             _currentNinjaMotion.value = null
             _currentNinjaObject.value = null
             _currentTextures.clear()
         }
     }
+
+    private suspend fun loadAnimation(animation: AnimationModel) {
+        try {
+            _currentNinjaMotion.value = animationAssetLoader.loadAnimation(animation.filePath)
+        } catch (e: Exception) {
+            logger.error(e) {
+                "Couldn't load Ninja motion for ${animation.name} (path: ${animation.filePath})."
+            }
+
+            _currentNinjaMotion.value = null
+        }
     }
 
     companion object {

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

@@ -37,6 +37,13 @@ class ViewerWidget(
                         ViewerTab.Texture -> createTextureWidget()
                     }
                 }))
+                addChild(SelectionWidget(
+                    ctrl.animations,
+                    ctrl.currentAnimation,
+                    { animation -> scope.launch { ctrl.setCurrentAnimation(animation) } },
+                    { it.name },
+                    borderLeft = true,
+                ))
             }
         }