From 0b3c49eae49dcbd7ec8f915cff43157393de1b5b Mon Sep 17 00:00:00 2001
From: Juha Luoma <33253757+LuomaJuha@users.noreply.github.com>
Date: Wed, 11 Sep 2024 15:25:52 +0300
Subject: [PATCH] Added spinner to pre-load phase

---
 themes/finna2/js/finna-model-viewer.js | 4 ++--
 themes/finna2/less/finna/record.less   | 3 +++
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/themes/finna2/js/finna-model-viewer.js b/themes/finna2/js/finna-model-viewer.js
index 36849474709..afe357de247 100644
--- a/themes/finna2/js/finna-model-viewer.js
+++ b/themes/finna2/js/finna-model-viewer.js
@@ -1,4 +1,4 @@
-/* global THREE, ObjectEditor */
+/* global THREE, ObjectEditor, VuFind */
 
 /**
  * Get tangent
@@ -425,7 +425,7 @@ class ModelViewerClass extends HTMLElement {
       /**
        * Start to load the model from the provider to cache
        */
-      this.loadInfo.textContent = this.translations['loading file'] || 'Model loading.';
+      this.loadInfo.innerHTML = `<span>${this.translations['loading file'] || 'Model loading.'} ${VuFind.spinner()}</span>`;
       fetch(this.src)
         .then(response => response.json())
         .then(responseJSON => {
diff --git a/themes/finna2/less/finna/record.less b/themes/finna2/less/finna/record.less
index c294f8c6bdc..f7fc22a35d4 100644
--- a/themes/finna2/less/finna/record.less
+++ b/themes/finna2/less/finna/record.less
@@ -817,6 +817,9 @@ finna-model-viewer {
     font-weight: 500;
     line-height: 1.5;
     border-radius: 4px;
+    span.fa-spinner::before {
+      color: white;
+    }
   }
   &.fullscreen {
     position: absolute;