Bugfixes and UX improvements

Properly handle streaming response using xhr.onload instead of xhr.onreadystatechanged which was causing the image SHA to not be extracted reliably Format the output to properly display newlines Autoscroll window as the build log grows Show back button in ons-toolbar so that it remains visible as the page scrolls
ubccpsc · Dec 21, 2018 · dd0ce08 · dd0ce08
1 parent 0ccfcef
commit dd0ce08
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 21 deletions.
diff --git a/packages/portal/frontend/html/admin.html b/packages/portal/frontend/html/admin.html
@@ -861,9 +861,12 @@
 
     <template id="createDockerImage.html">
         <ons-page id="create-docker-image-page">
-            <div class="left">
-                <ons-back-button id="create-docker-image-back">Back</ons-back-button>
-            </div>
+            <ons-toolbar>
+                <div class="left">
+                    <ons-back-button id="create-docker-image-back"></ons-back-button>
+                </div>
+                <div class="center">Classy Admin Portal</div>
+            </ons-toolbar>
 
             <ons-modal direction="up">
                 <div style="text-align: center">
@@ -889,7 +892,7 @@
                         <div class="expandable-content">
                             See <a href="https://docs.docker.com/engine/reference/commandline/build/#git-repositories">docker build</a>
                             documentation for details about how to construct the URL. The URL should start with "https://". If the
-                            repository is public, set GH_DOCKER_TOKEN in the .env. Do not include the token in the URL.
+                            repository is private, set GH_DOCKER_TOKEN in the .env. Do not include the token in the URL.
                         </div>
                     </ons-list-item>
 

diff --git a/packages/portal/frontend/src/app/views/AdminDeliverablesTab.ts b/packages/portal/frontend/src/app/views/AdminDeliverablesTab.ts
@@ -563,30 +563,27 @@ export class AdminDeliverablesTab extends AdminPage {
                             .filter((s) => s !== "")
                             .map((s) => JSON.parse(s))
                             .filter((s) => s.hasOwnProperty("stream"))
-                            .map((s) => s.stream.trim());
-                        output.innerText += chunkLines.join("\n");
-                        output.scrollTop = output.scrollHeight;
+                            .map((s) => s.stream);
+                        output.innerText += chunkLines.join("");
+                        output.scrollIntoView(false);
                         lines = lines.concat(chunkLines);
                     } catch (err) {
                         Log.warn("AdminDeliverablesTab::buildDockerImage(..) - ERROR Processing build output log stream. " + err);
                     }
                 };
-                xhr.onreadystatechange = function() {
-                    if (xhr.readyState === XMLHttpRequest.DONE) {
-                        if (xhr.status === 200) {
-                            if (lines.length > 2 && lines[lines.length - 2].startsWith("Successfully built")) {
-                                const sha = lines[lines.length - 2].replace("Successfully built ", "");
-                                // const tag = lines[lines.length - 1].replace("Successfully tagged ", "");
-                                resolve(sha);
-                            } else {
-                                reject(new Error("Failed to read image SHA from build log. " +
-                                    "If the image was built successfully, you can manually select it on the previous screen."));
-                            }
-                        } else {
-                            reject(new Error(xhr.responseText));
-                        }
+                xhr.onload = function() {
+                    if (lines.length > 2 && lines[lines.length - 2].startsWith("Successfully built")) {
+                        const sha = lines[lines.length - 2].replace("Successfully built ", "").trim();
+                        // const tag = lines[lines.length - 1].replace("Successfully tagged ", "");
+                        resolve(sha);
+                    } else {
+                        reject(new Error("Failed to read image SHA from build log. " +
+                            "If the image was built successfully, you can manually select it on the previous screen."));
                     }
                 };
+                xhr.onerror = function() {
+                    reject(new Error(xhr.responseText));
+                };
 
                 try {
                     xhr.open('POST', remote + '/portal/at/docker/image');