Ensure loading indicator is visible when needed (#93)

When a user runs an AI explanation, English search, or image analysis,
make sure they see the loading dots.
If they're out of view it seems like nothing happened.
As usual, this is code we should improve on.

Author: mreichhoff

public/js/modules/explore.js

@@ -965,6 +965,7 @@ let setupExamples = function (words, type, skipState, allowExplain, aiData) {
             aiResponseContainer.style.display = 'none';
             aiResponseContainer.classList.add('ai-explanation-container');
             examplesList.appendChild(loadingDots);
+            document.getElementById('explore-container').scrollTo({ top: 0 });
             examplesList.appendChild(aiResponseContainer);
             const wordsWithoutIgnored = words.map(x => x.ignore ? x.word : x);
             let joinedText = wordsWithoutIgnored.join('');
@@ -1104,6 +1105,9 @@ let initialize = function () {
         // soon be cleared by a rendering of examples (this is a bad assumption)
         // (but at least there's a hide below, surely no client would ever mix that up)
         examplesList.prepend(loadingDots);
+        // make sure the loading dots show up instead of leaving the user guessing what happened
+        // TODO: get rid of this getElementById here
+        document.getElementById('explore-container').scrollTo({ top: 0 });
     });
     document.addEventListener('hide-loading-dots', function () {
         const existingLoadingDots = examplesList.querySelector('.loading-dots');