From 2837cdb2cd36bd50cae14d2c40fd5fdb7544785f Mon Sep 17 00:00:00 2001
From: Tim McGee <github@mmconsult.com>
Date: Sun, 4 Dec 2016 14:02:38 +0800
Subject: [PATCH] Add a simple loading indicator for titlePane and contentPane
 widgets.

---
 viewer/css/main.css               | 10 ++++++++++
 viewer/js/viewer/_WidgetsMixin.js | 16 ++++++++++++++++
 2 files changed, 26 insertions(+)

diff --git a/viewer/css/main.css b/viewer/css/main.css
index ce00bb911..abf36af1f 100644
--- a/viewer/css/main.css
+++ b/viewer/css/main.css
@@ -210,6 +210,16 @@ body, html {
 #help_parent_underlay {
     display: block;
 }
+.widgetLoader {
+    color: #333;
+    display: block;
+    font-size: 18px;
+    left: 0;
+    margin: 4px;
+    text-align: center;
+    top: 0;
+    width:  100%;
+}
 
 /*
     media queries bootstrap style
diff --git a/viewer/js/viewer/_WidgetsMixin.js b/viewer/js/viewer/_WidgetsMixin.js
index aca984f74..079016a2d 100644
--- a/viewer/js/viewer/_WidgetsMixin.js
+++ b/viewer/js/viewer/_WidgetsMixin.js
@@ -112,6 +112,7 @@ define([
                     pnl = this._createFloatingWidget(parentId, widgetConfig);
                 }
                 widgetConfig.parentWidget = pnl;
+                this._showWidgetLoader(pnl);
             }
 
             // 2 ways to use require to accommodate widgets that may have an optional separate configuration file
@@ -145,6 +146,7 @@ define([
             if (widgets[key] && widgets[key].startup && !widgets[key]._started) {
                 widgets[key].startup();
             }
+            this._hideWidgetLoader(pnl);
         },
 
         _setWidgetOptions: function (widgetConfig, options) {
@@ -186,6 +188,20 @@ define([
             return options;
         },
 
+        _showWidgetLoader: function (pnl) {
+            if (pnl && pnl.containerNode) {
+                pnl.loadingNode = put(pnl.containerNode, 'div.widgetLoader i.fa.fa-spinner.fa-pulse.fa-fw').parentNode;
+            }
+        },
+
+        _hideWidgetLoader: function (pnl) {
+            if (pnl && pnl.loadingNode) {
+                require(['dojo/domReady!'], function () {
+                    put(pnl.loadingNode, '!');
+                });
+            }
+        },
+
         _createTitlePaneWidget: function (parentId, widgetConfig) {
             var tp,
                 options = lang.mixin({