Implemented toast manager, moved job panel to the top, removed footer.

app/YtManagerApp/static/YtManagerApp/css/style.css

@@ -137,6 +137,39 @@
   overflow-y: auto;
   flex: 1; }
 
+#toast-wrapper {
+  position: fixed;
+  right: 2rem;
+  top: 2rem;
+  z-index: 1000; }
+
+.toast {
+  min-width: 15rem;
+  line-height: 1.5rem; }
+  .toast .typcn {
+    font-size: 1.5rem; }
+  .toast.bg-success {
+    background-color: rgba(134, 226, 155, 0.98) !important; }
+    .toast.bg-success .toast-header {
+      background-color: rgba(40, 167, 69, 0.75);
+      color: #f8f9fa; }
+      .toast.bg-success .toast-header > * {
+        color: #f8f9fa; }
+  .toast.bg-warning {
+    background-color: rgba(255, 231, 160, 0.98) !important; }
+    .toast.bg-warning .toast-header {
+      background-color: rgba(211, 158, 0, 0.75);
+      color: #f8f9fa; }
+      .toast.bg-warning .toast-header > * {
+        color: #f8f9fa; }
+  .toast.bg-danger {
+    background-color: rgba(243, 183, 189, 0.98) !important; }
+    .toast.bg-danger .toast-header {
+      background-color: rgba(220, 53, 69, 0.75);
+      color: #f8f9fa; }
+      .toast.bg-danger .toast-header > * {
+        color: #f8f9fa; }
+
 #main_navbar {
   position: fixed;
   top: 0;

app/YtManagerApp/static/YtManagerApp/css/style.css.map

@@ -1,7 +1,7 @@
 {
 "version": 3,
-"mappings": "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",
+"mappings": "AAAA,KAAM;EAEF,MAAM,CAAC,QAAQ;EACf,QAAQ,CAAC,QAAQ;EACjB,QAAQ,CAAC,QAAQ;EACjB,MAAM,CAAC,QAAQ;EACf,KAAK,CAAC,QAAQ;EACd,QAAQ,CAAC,QAAQ;EACjB,QAAQ,CAAC,QAAQ;EACjB,OAAO,CAAC,QAAQ;EAChB,MAAM,CAAC,QAAQ;EACf,MAAM,CAAC,QAAQ;EACf,OAAO,CAAC,KAAK;EACb,MAAM,CAAC,QAAQ;EACf,WAAW,CAAC,QAAQ;EAGpB,SAAS,CAAC,QAAQ;EAClB,WAAW,CAAC,QAAQ;EACpB,SAAS,CAAC,QAAQ;EAClB,MAAM,CAAC,QAAQ;EACf,SAAS,CAAC,QAAQ;EAClB,QAAQ,CAAC,QAAQ;EACjB,OAAO,CAAC,QAAQ;EAChB,MAAM,CAAC,QAAQ;EAGf,eAAe,CAAC,EAAE;EAClB,eAAe,CAAC,MAAM;EACtB,eAAe,CAAC,MAAM;EACtB,eAAe,CAAC,MAAM;EACtB,eAAe,CAAC,OAAO;EACvB,wBAAwB,CAAC,sLAAsL;EAC/M,uBAAuB,CAAC,qFAAqF;;AAGjH,mBAAoB;EAChB,SAAS,CAAC,QAAQ;EAClB,WAAW,CAAC,QAAQ;EACpB,SAAS,CAAC,QAAQ;EAClB,MAAM,CAAC,QAAQ;EACf,SAAS,CAAC,QAAQ;EAClB,QAAQ,CAAC,QAAQ;EACjB,OAAO,CAAC,QAAQ;EAChB,MAAM,CAAC,QAAQ;;ACzBnB,uBAAuB;AACvB,kBAAmB;EAlBf,OAAO,EAAE,YAAY;EACrB,KAAK,EAAE,IAAa;EACpB,MAAM,EAAE,IAAa;EAErB,wBAAQ;IACJ,OAAO,EAAE,GAAG;IACZ,OAAO,EAAE,KAAK;IACd,KAAK,EAAE,IAAa;IACpB,MAAM,EAAE,IAAa;IACrB,MAAM,EAAE,GAAG;IACX,aAAa,EAAE,GAAG;IAClB,MAAM,EAAE,wBAAmC;IAC3C,YAAY,EAAE,qDAAqD;IACnE,SAAS,EAAE,sCAAsC;;AASzD,wBAAyB;EAtBrB,OAAO,EAAE,YAAY;EACrB,KAAK,EAAE,IAAa;EACpB,MAAM,EAAE,IAAa;EAErB,8BAAQ;IACJ,OAAO,EAAE,GAAG;IACZ,OAAO,EAAE,KAAK;IACd,KAAK,EAAE,IAAa;IACpB,MAAM,EAAE,IAAa;IACrB,MAAM,EAAE,GAAG;IACX,aAAa,EAAE,GAAG;IAClB,MAAM,EAAE,0BAAmC;IAC3C,YAAY,EAAE,qDAAqD;IACnE,SAAS,EAAE,sCAAsC;;AAazD,4BAOC;EANG,EAAG;IACC,SAAS,EAAE,YAAY;EAE3B,IAAK;IACD,SAAS,EAAE,cAAc;AAIjC,gCAAiC;EAC7B,QAAQ,EAAE,KAAK;EACf,GAAG,EAAE,GAAG;EACR,IAAI,EAAE,GAAG;EACT,UAAU,EAAE,KAAK;EACjB,WAAW,EAAE,KAAK;;ACxCtB,iBAAkB;EACd,YAAY,EAAE,MAAM;EAEpB,sBAAK;IACD,QAAQ,EAAE,QAAQ;IAElB,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,OAAO;IACf,aAAa,EAAE,OAAO;IAEtB,OAAO,EAAE,KAAK;IACd,UAAU,EAAE,OAAO;IACnB,aAAa,EAAE,OAAO;IAEtB,gBAAgB,EAAE,OAAO;IAEzB,UAAU,EAAE,qHAEkB;IAE9B,mCAAe;MACX,UAAU,EAAE,OAAO;IAEvB,mCAAe;MACX,gBAAgB,EAAE,OAAO;EAK7B,qCAAK;IACD,OAAO,EAAE,CAAC;IACV,UAAU,EAAE,OAAO;IAEnB,kDAAe;MACX,SAAS,EAAE,+DAA8D;IAE7E,kDAAe;MACX,OAAO,EAAE,CAAC;MACV,SAAS,EAAE,wBAAwB;IAEvC,kDAAe;MACX,SAAS,EAAE,+DAA+D;;AAM1F,UAAW;EACP,QAAQ,EAAE,KAAK;EACf,GAAG,EAAE,CAAC;EACN,IAAI,EAAE,KAAK;EACX,OAAO,EAAE,EAAE;EACX,WAAW,EAAE,IAAI;EAEjB,KAAK,EAAE,KAAK;EACZ,MAAM,EAAE,IAAI;EAEZ,OAAO,EAAE,IAAI;EACb,UAAU,EAAE,KAAK;EACjB,cAAc,EAAE,MAAM;EAEtB,UAAU,EAAE,cAAc;EAE1B,yBAAiB;IACb,IAAI,EAAE,CAAC;EAGX,yBAAmC;IApBvC,UAAW;MAqBH,KAAK,EAAE,IAAI;;AAInB,iBAAkB;EACd,KAAK,EAAE,IAAI;EACX,IAAI,EAAE,CAAC;EAEP,mBAAE;IACE,WAAW,EAAE,MAAM;IACnB,YAAY,EAAE,MAAM;;AAI5B,kBAAmB;EACf,UAAU,EAAE,IAAI;EAChB,IAAI,EAAE,CAAC;;ACpFX,cAAe;EACX,QAAQ,EAAE,KAAK;EACf,KAAK,EAAE,IAAI;EACX,GAAG,EAAE,IAAI;EACT,OAAO,EAAE,IAAI;;AAGjB,MAAO;EACH,SAAS,EAAE,KAAK;EAChB,WAAW,EAAE,MAAM;EACnB,aAAO;IACH,SAAS,EAAE,MAAM;EAGrB,iBAAa;IACT,gBAAgB,EAAE,oCAAiD;IACnE,+BAAc;MACV,gBAAgB,EAAE,uBAAyB;MACvC,KAAK,ECPP,OAAO;MDQL,mCAAI;QACA,KAAK,ECTX,OAAO;EDajB,iBAAa;IACT,gBAAgB,EAAE,oCAAiD;IACnE,+BAAc;MACV,gBAAgB,EAAE,uBAAqC;MACnD,KAAK,ECjBP,OAAO;MDkBL,mCAAI;QACA,KAAK,ECnBX,OAAO;EDuBjB,gBAAY;IACR,gBAAgB,EAAE,oCAAgD;IAClE,8BAAc;MACV,gBAAgB,EAAE,uBAAwB;MACtC,KAAK,EC3BP,OAAO;MD4BL,kCAAI;QACA,KAAK,EC7BX,OAAO;;ACPrB,YAAa;EACT,QAAQ,EAAE,KAAK;EACf,GAAG,EAAE,CAAC;EACN,KAAK,EAAE,IAAI;EACX,OAAO,EAAE,GAAG;;AAGhB,UAAW;EACP,aAAa,EAAE,IAAI;EACnB,UAAU,EAAE,IAAI;;AAGpB,YAAa;EACT,QAAQ,EAAE,KAAK;EACf,IAAI,EAAE,CAAC;EACP,KAAK,EAAE,CAAC;EACR,MAAM,EAAE,CAAC;EACT,MAAM,EAAE,IAAI;EACZ,WAAW,EAAE,IAAI;EACjB,OAAO,EAAE,MAAM;EACf,OAAO,EAAE,IAAI;EACb,aAAa,EAAE,MAAM;EACrB,SAAS,EAAE,IAAI;;AAGnB,cAAe;EACX,QAAQ,EAAE,KAAK;EAAE,oCAAoC;EACrD,OAAO,EAAE,IAAI;EAAE,uBAAuB;EACtC,KAAK,EAAE,IAAI;EAAE,uCAAuC;EACpD,MAAM,EAAE,IAAI;EAAE,wCAAwC;EACtD,GAAG,EAAE,CAAC;EACN,IAAI,EAAE,CAAC;EACP,KAAK,EAAE,CAAC;EACR,MAAM,EAAE,CAAC;EACT,gBAAgB,EAAE,kBAAe;EAAE,mCAAmC;EACtE,OAAO,EAAE,CAAC;EAAE,qFAAqF;EACjG,MAAM,EAAE,OAAO;EAAE,4BAA4B;;AAI7C,4BAAc;EACV,OAAO,EAAE,IAAI;EACb,aAAa,EAAE,KAAK;EAEpB,kCAAQ;IACJ,gBAAgB,EAAE,OAAO;AAGjC,oBAAM;EACF,MAAM,EAAE,IAAI;EACZ,UAAU,EAAE,IAAI;EAEhB,+BAAW;IACP,UAAU,EAAE,IAAI;IAChB,OAAO,EAAE,CAAC;EAEd,+BAAW;IACP,SAAS,EAAE,IAAI;IACf,aAAa,EAAE,KAAK;EAExB,gCAAY;IACR,SAAS,EAAE,IAAI;IACf,aAAa,EAAE,KAAK;IACpB,WAAW,EAAE,MAAM;IAEnB,uCAAO;MACH,SAAS,EAAE,GAAG;EAGtB,iCAAa;IACT,OAAO,EAAE,YAAY;EAGzB,+BAAW;IACP,YAAY,EAAE,QAAQ;IACtB,UAAU,EAAE,QAAQ;IACpB,qCAAQ;MACJ,eAAe,EAAE,IAAI;EAO7B,8BAAU;IACN,KAAK,EAAE,KAAK;;AAMxB,aAAc;EACV,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,IAAI;EACT,IAAI,EAAE,CAAC;EACP,KAAK,EAAE,KAAK;EAEZ,0BAAa;IACT,KAAK,EAAE,IAAI;IACX,MAAM,EAAE,UAAU;IAClB,OAAO,EAAE,UAAU;IACnB,WAAW,EAAE,MAAM;IAEnB,gBAAgB,EAAE,IAAI;IACtB,UAAU,EAAE,kCAA6B;IACzC,aAAa,EAAE,WAAW;IAE1B,KAAK,EAAE,KAAK;IACZ,UAAU,EAAE,MAAM;IAClB,WAAW,EAAE,uCAAuC;IACpD,WAAW,EAAE,GAAG;IAChB,SAAS,EAAE,GAAG;IACd,cAAc,EAAE,SAAS;IAEzB,0CAAkB;MACd,gBAAgB,EDnHb,OAAO;ICqHd,iDAAyB;MACrB,gBAAgB,EAAE,OAAO;IAE7B,8CAAsB;MAClB,gBAAgB,EAAE,IAAI;;AAMlC,WAAY;EACR,SAAS,EAAE,KAAK;EAChB,MAAM,EAAE,MAAM;;AAId,2BAAe;EACX,OAAO,EAAE,IAAI;;AAIrB,kBAAmB;EACf,MAAM,EAAE,QAAQ;EAChB,OAAO,EAAE,QAAQ;EAEjB,qBAAG;IACC,MAAM,EAAE,CAAC;;AAIjB,YAAa;EACT,OAAO,EAAE,YAAY;EACrB,aAAa,EAAE,MAAM;;AAGzB,YAAa;EACT,MAAM,EAAE,OAAO;EACf,iBAAK;IACDLine truncated
-"sources": ["lib/_theme.scss","lib/_loading.scss","lib/_hamburger.scss","style.scss"],
+"sources": ["lib/_theme.scss","lib/_loading.scss","lib/_hamburger.scss","lib/_toast.scss","lib/_variables.scss","style.scss"],
 "names": [],
 "file": "style.css"
 }

app/YtManagerApp/static/YtManagerApp/css/style.scss

@@ -1,9 +1,8 @@
 @import "lib/theme";
 @import "lib/loading";
 @import "lib/hamburger";
-
+@import "lib/toast";
-$accent-color: #007bff;
+@import "lib/variables";
-$success-color: #28a745;
 
 #main_navbar {
     position: fixed;

app/YtManagerApp/static/YtManagerApp/js/common.js

@@ -1,5 +1,6 @@
 import {JobPanel} from "./components/JobPanel.js";
 import {AjaxModal} from "./components/AjaxModal.js";
+import {ToastManager} from "./components/ToastManager.js";
 
 // Document loaded
 jQuery(function() {
@@ -24,5 +25,8 @@ jQuery(function() {
         }
         modal.loadAndShow();
     });
+
+    // Initialize toasts
+    window.ytsm_ToastManager = new ToastManager($('#toast-wrapper'));
 });
 

app/YtManagerApp/static/YtManagerApp/js/components/JobPanel.js

@@ -101,7 +101,6 @@ export class JobPanel
     _updateInternal(data)
     {
         this._updateJobs(data);
-        this._updateStatusBar();
         this._updateProgressBar();
         this._updateTitle();
 
@@ -164,19 +163,6 @@ export class JobPanel
         }
     }
 
-    _updateStatusBar()
-    {
-        let text = "";
-
-        if (this.jobs.length === 1) {
-            text = `${this.jobs[0].description} | ${this.jobs[0].message}`;
-        }
-        else if (this.jobs.length > 1) {
-            text = `Running ${this.jobs.length} jobs...`;
-        }
-        $('#status-message').text(text);
-    }
-
     _updateProgressBar()
     {
         if (this.jobs.length > 0) {

app/YtManagerApp/static/YtManagerApp/js/components/ToastManager.js

@@ -0,0 +1,93 @@
+export class ToastManager {
+    toastWrapper = null;
+
+    constructor(toastWrapper) {
+        this.toastWrapper = toastWrapper;
+    }
+
+    /**
+     * Displays a toast message
+     * @param caption Title of the toast
+     * @param options An object containing the following attributes. Title and message are mandatory:
+     *     - body: the main content
+     *     - icon: a typcn class which will be used as an icon
+     *     - cssClass: additional css classes to apply to the toast (i.e. toast-success, toast-fail)
+     *     - duration: duration in milliseconds, defaults to 4000
+     */
+    toast(caption, options) {
+        let body = '';
+        if (options.hasOwnProperty('body')) {
+            body = `<div class="toast-body">${options.body}</div>`;
+        }
+
+        let icon = '';
+        if (options.hasOwnProperty('icon')) {
+            icon = `<span class="typcn ${options.icon} mr-2"></span>`;
+        }
+
+        let cssClass = '';
+        if (options.hasOwnProperty('cssClass')) {
+            cssClass = options.cssClass;
+        }
+
+        let duration = 4000;
+        if (options.hasOwnProperty('duration')) {
+            duration = options.duration;
+        }
+
+        // Generate DOM
+        let elem = $(`
+            <div class="toast ${cssClass}" role="alert"
+                 aria-live="assertive" aria-atomic="true">
+                <div class="toast-header">
+                    ${icon}
+                    <strong class="mr-auto">${caption}</strong>
+                    <button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
+                        <span aria-hidden="true">&times;</span>
+                    </button>
+                </div>
+                ${body}
+             </div>`);
+
+        elem.appendTo(this.toastWrapper);
+        elem.toast({
+            animation: true,
+            autoHide: true,
+            delay: duration
+        });
+        elem.on('hidden.bs.toast', function () {
+            elem.remove();
+        });
+        elem.toast('show');
+    }
+
+    success(caption, options = {}) {
+        if (!options.hasOwnProperty('icon')) {
+            options.icon = 'typcn-tick';
+        }
+        if (!options.hasOwnProperty('cssClass')) {
+            options.cssClass = 'bg-success'
+        }
+        this.toast(caption, options);
+    }
+
+    warning(caption, options = {}) {
+        if (!options.hasOwnProperty('icon')) {
+            options.icon = 'typcn-warning';
+        }
+        if (!options.hasOwnProperty('cssClass')) {
+            options.cssClass = 'bg-warning'
+        }
+        this.toast(caption, options);
+    }
+
+    error(caption, options = {}) {
+        if (!options.hasOwnProperty('icon')) {
+            options.icon = 'typcn-cancel';
+        }
+        if (!options.hasOwnProperty('cssClass')) {
+            options.cssClass = 'bg-danger'
+        }
+        this.toast(caption, options);
+    }
+}

app/YtManagerApp/templates/YtManagerApp/index.html

@@ -15,15 +15,6 @@
 
 {% block body %}
 
-    <div id="modal-wrapper">
-        <div id="modal-loading" class="black-overlay">
-            <div class="loading-dual-ring loading-dual-ring-center-screen"></div>
-        </div>
-
-        <div id="modal-wrapper">
-        </div>
-    </div>
-
     {% include 'YtManagerApp/controls/setup_errors_banner.html' %}
 
     <div class="row">

app/YtManagerApp/templates/YtManagerApp/js/common.js

@@ -1,11 +1,3 @@
-function zeroFill(number, width) {
-    width -= number.toString().length;
-    if ( width > 0 ) {
-        return new Array( width + (/\./.test( number ) ? 2 : 1) ).join( '0' ) + number;
-    }
-    return number + ""; // always return a string
-}
-
 function syncNow() {
     $.post("{% url 'ajax_action_sync_now' %}", {
         csrfmiddlewaretoken: '{{ csrf_token }}'

app/YtManagerApp/templates/YtManagerApp/master_default.html

@@ -44,6 +44,41 @@
                             <a class="nav-link" href="{% url 'register' %}">Register</a>
                         </li>
                     {% endif %}
+                {% else %}
+                    {# The job panel #}
+                    <li class="nav-item">
+                        <div class="btn-group">
+                            <button id="btn_toggle_job_panel"
+                                    class="btn btn-sm btn-light dropdown-toggle"
+                                    title="Show/hide job details"
+                                    data-toggle="dropdown"
+                                    aria-haspopup="true" aria-expanded="false">
+                                <span class="typcn typcn-th-list" aria-hidden="true"></span>
+                            </button>
+                            <div id="job_panel" class="dropdown-menu dropdown-menu-right dropdown-jobs" aria-labelledby="btn_toggle_job_panel">
+
+                                <h6 id="job_panel_title" class="dropdown-header collapse">Running jobs</h6>
+                                <h6 id="job_panel_no_jobs_title" class="dropdown-header">No jobs are currently running</h6>
+
+                                <div id="job_panel_item_template" class="dropdown-item collapse">
+                                    <div class="row">
+                                        <div class="col-8">
+                                            <p id="job_panel_item_title">Title</p>
+                                            <p><small id="job_panel_item_subtitle" class="text-muted">Subtitle</small></p>
+                                        </div>
+                                        <div class="col-4">
+                                            <div class="progress">
+                                                <div id="job_panel_item_progress"
+                                                     class="progress-bar progress-bar-striped progress-bar-animated"
+                                                     role="progressbar" style="width: 25%" aria-valuenow="25"
+                                                     aria-valuemin="0" aria-valuemax="100"></div>
+                                                </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </li>
                 {% endif %}
             </ul>
 
@@ -72,53 +107,22 @@
             </div>
         {% endif %}
 
+        <div id="toast-wrapper" aria-live="polite" aria-atomic="true"></div>
+
+        <div id="modal-wrapper">
+            <div id="modal-loading" class="black-overlay">
+                <div class="loading-dual-ring loading-dual-ring-center-screen"></div>
+            </div>
+
+            <div id="modal-wrapper">
+            </div>
+        </div>
+
         <div id="main_body" class="container-fluid">
             {% block body %}
             {% endblock %}
         </div>
 
-        <footer id="main_footer" class="footer bg-light row">
-            <button id="btn_sync_now" class="btn btn-sm btn-light" title="Synchronize now!">
-                <span class="typcn typcn-arrow-sync" aria-hidden="true"></span>
-            </button>
-            <span id="status-message" class="text-muted"></span>
-            <div id="status-progress" class="progress my-2 ml-auto invisible" style="width: 15rem">
-                <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
-            </div>
-
-            <div class="btn-group">
-                <button id="btn_toggle_job_panel"
-                        class="btn btn-sm btn-light dropdown-toggle"
-                        title="Show/hide job details"
-                        data-toggle="dropdown"
-                        aria-haspopup="true" aria-expanded="false">
-                    <span class="typcn typcn-th-list" aria-hidden="true"></span>
-                </button>
-                <div id="job_panel" class="dropdown-menu dropdown-jobs" aria-labelledby="btn_toggle_job_panel">
-
-                    <h6 id="job_panel_title" class="dropdown-header collapse">Running jobs</h6>
-                    <h6 id="job_panel_no_jobs_title" class="dropdown-header">No jobs are currently running</h6>
-
-                    <div id="job_panel_item_template" class="dropdown-item collapse">
-                        <div class="row">
-                            <div class="col-8">
-                                <p id="job_panel_item_title">Title</p>
-                                <p><small id="job_panel_item_subtitle" class="text-muted">Subtitle</small></p>
-                            </div>
-                            <div class="col-4">
-                                <div class="progress">
-                                    <div id="job_panel_item_progress"
-                                         class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar"
-                                         style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
-                                    </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-
-        </footer>
-
         <script src="{% static 'YtManagerApp/import/jquery/jquery-3.3.1.min.js' %}"></script>
         <script src="{% static 'YtManagerApp/import/popper/popper.min.js' %}"></script>
         <script src="{% static 'YtManagerApp/import/bootstrap/js/bootstrap.min.js' %}"></script>