More work on installation UX updates

9 years ago · 7ee62a188d
parent 55857cdbe9
commit 7ee62a188d
2 changed files with 107 additions and 9 deletions
--- a/install/installModsForHesk.php
+++ b/install/installModsForHesk.php
@ -9,6 +9,39 @@ if (!isset($_GET['v'])) {
    die('Starting version not set!');
 }
 $startingVersion = intval($_GET['v']);
+
+function echoInitialVersionRows($version) {
+    if ($version < 140) {
+        printRow('v1.4.0');
+    }
+    if ($version < 141) {
+        printRow('v1.4.1');
+    }
+    if ($version < 150) {
+        printRow('v1.5.0');
+    }
+    if ($version < 160) {
+        printRow('v1.6.0');
+    }
+    if ($version < 161) {
+        printRow('v1.6.1');
+    }
+    if ($version < 170) {
+        printRow('v1.7.0');
+    }
+    if ($version < 200) {
+        printRow('v2.0.0');
+    }
+}
+
+function printRow($version) {
+    $versionId = str_replace('.','',$version);
+    $versionId = str_replace('v','',$versionId);
+    echo '<tr id="row-'.$versionId.'">';
+    echo '<td>'.$version.'</td>';
+    echo '<td><i id="spinner-'.$versionId.'" class="fa fa-spinner"></i> <span id="span-'.$versionId.'">Waiting...</span></td>';
+    echo '</tr>';
+}
 ?>
 <html>
    <head>
@ -33,7 +66,7 @@ $startingVersion = intval($_GET['v']);
                <div class="col-sm-12">
                    <div class="panel panel-default">
                        <div class="panel-heading">Installation Progress</div>
-                        <table class="table table-striped">
+                        <table class="table table-striped" style="table-layout:fixed;">
                            <thead>
                            <tr>
                                <th>Version</th>
@ -41,19 +74,32 @@ $startingVersion = intval($_GET['v']);
                            </tr>
                            </thead>
                            <tbody>
-                            <tr class="success">
-                                <td>v1.4.0</td>
-                                <td>Success</td>
-                            </tr>
-                            <tr>
-                                <td>v1.4.0</td>
-                                <td>...</td>
-                            </tr>
+                                <?php echoInitialVersionRows($startingVersion); ?>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
+            <div class="row" id="attention-row" style="display:block">
+                <div class="col-sm-12">
+                    <div class="panel panel-warning">
+                        <div class="panel-heading">Your Attention is Needed!</div>
+                        <div class="panel-body">
+                            <p>Panel Body</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="row">
+                <div class="col-sm-12">
+                    <div class="panel panel-default">
+                        <div class="panel-heading">Console</div>
+                        <div class="panel-body" style="min-height: 400px;max-height: 400px; overflow: auto">
+                            <p>CONSOLE</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
        </div>
    </body>
 </html>
--- a/js/modsForHesk-javascript.js
+++ b/js/modsForHesk-javascript.js
@ -76,4 +76,56 @@ function enableAllDisablable() {
    $('#updateText').hide();
 }

+function startVersionUpgrade(version) {
+    $('#spinner-'+version)
+        .removeClass('fa-exclamation-triangle')
+        .addClass('fa-spinner')
+        .addClass('fa-pulse');
+    changeRowTo('row', version, 'info');
+    changeTextTo('span', version, 'In Progress');
+}
+
+function markUpdateAsSuccess(version) {
+    removeSpinner(version);
+    $('#spinner-'+version).addClass('fa-check-circle');
+    changeTextTo('span', version, 'Completed Successfully');
+    changeRowTo('row', version, 'success');
+}
+
+function removeSpinner(version) {
+    $('#spinner-'+version)
+        .removeClass('fa-pulse')
+        .removeClass('fa-spinner');
+}
+
+function markUpdateAsAttention(version) {
+    removeSpinner(version);
+    $('#spinner-'+version).addClass('fa-exclamation-triangle');
+    changeRowTo('row', version, 'warning');
+    changeTextTo('span', version, 'Attention! See below for more information');
+}
+
+function markUpdateAsFailure(version) {
+    removeSpinner(version);
+    $('#spinner-'+version).addClass('fa-times-circle');
+    changeRowTo('row', version, 'danger');
+    changeTextTo('span', version, 'Update failed! Check the console for more information');
+}
+
+function changeTextTo(prefix, version, text) {
+    $('#'+prefix+'-'+version).text(text);
+}
+
+function changeRowTo(prefix, version, clazz) {
+    //-- Remove all classes
+    $('#'+prefix+'-'+version)
+        .removeClass('info')
+        .removeClass('warning')
+        .removeClass('danger')
+        .removeClass('success');
+
+    //-- Re-add the requested class
+    $('#'+prefix+'-'+version).addClass(clazz);
+}
+
 jQuery(document).ready(loadJquery);