Add a link to try download from another mirror (#15754)

Replace the link "I already downloaded Tails 3.8", which becomes
meaningless once people clicked on "Download Tails".

The new sentence starts in black, which should make it visually
different and noticeable.

wiki/src/install/inc/js/download.js

@@ -186,6 +186,11 @@ document.addEventListener("DOMContentLoaded", function() {
     } catch (e) { } // Ignore if we fail to hit the download counter
   }
 
+  function showAnotherMirror() {
+    hide(document.getElementById("already-downloaded"));
+    show(document.getElementById("try-another-mirror"));
+  }
+
   function resetVerificationResult(result) {
     hide(document.getElementById("verifying-download"));
     hide(document.getElementById("verification-successful"));
@@ -283,6 +288,7 @@ document.addEventListener("DOMContentLoaded", function() {
       e.preventDefault();
       hitCounter("download-image");
       toggleDirectBitTorrent("direct");
+      showAnotherMirror();
       resetVerificationResult();
     } finally {
       // Setting window.location.href will abort AJAX requests resulting

wiki/src/install/inc/steps/download.inline.html

@@ -32,7 +32,13 @@ were solved, and known issues that have already been identified.</p>
           <a href="[[!inline pages="inc/stable_amd64_iso_url" raw="yes" sort="age"]]" id="download-iso" class="use-mirror-pool btn btn-primary inline-block indent">Download Tails [[!inline pages="inc/stable_amd64_version" raw="yes" sort="age"]] ISO image (<span class="remove-extra-space">[[!inline pages="inc/stable_amd64_iso_size" raw="yes" sort="age"]]</span>)</a>
           <a href="[[!inline pages="inc/stable_amd64_iso_url" raw="yes" sort="age"]]" id="download-iso" class="use-mirror-pool-on-retry btn btn-primary inline-block indent">Download Tails [[!inline pages="inc/stable_amd64_version" raw="yes" sort="age"]] ISO image (<span class="remove-extra-space">[[!inline pages="inc/stable_amd64_iso_size" raw="yes" sort="age"]]</span>)</a>
         </div>
+        <div id="direct-download-minor">
           <p id="already-downloaded" class="indent"><a>I already downloaded Tails&nbsp;<span class="remove-extra-space">[[!inline pages="inc/stable_amd64_version" raw="yes" sort="age"]]</span>.</a></p>
+          <p id="try-another-mirror" class="indent">If the download fails, try to
+            <a href="[[!inline pages="inc/stable_amd64_img_url" raw="yes" sort="age"]]" class="usb upgrade download-only-img">download from another mirror.</a>
+            <a href="[[!inline pages="inc/stable_amd64_iso_url" raw="yes" sort="age"]]" class="dvd vm download-only-iso">download from another mirror.</a>
+          </p>
+        </div>
       </div>
 
       <div id="step-verify-direct">

wiki/src/install/inc/stylesheets/download.css

@@ -142,11 +142,18 @@ span.step-number {
 }
 html[dir="rtl"] .what-is-bittorrent-link { left: 1em; }
 
-#already-downloaded {
+#direct-download-minor {
   margin-top: 0.5em;
+}
+
+#already-downloaded {
   cursor: pointer;
 }
 
+#try-another-mirror {
+  display: none;
+}
+
 /* Skip verification */
 
 #skip-verification-direct div {