Bläddra i källkod

HUE-2227 [oozie] Added clearable and value update for text filter, added spinner

Enrico Berti 10 år sedan
förälder
incheckning
c101525

+ 10 - 0
apps/oozie/src/oozie/static/oozie/css/coordinator.css

@@ -58,6 +58,16 @@
   opacity: 1;
 }
 
+.spinner-overlay {
+  opacity: 0.95;
+  position: absolute;
+  top: 10px;
+  left: 15px;
+  font-size: 24px;
+  color: #DDD;
+}
+
+
 div.spinedit .fa-chevron-up {
   top: -6px!important;
 }

+ 7 - 1
apps/oozie/src/oozie/templates/dashboard/list_oozie_coordinator.mako

@@ -373,7 +373,7 @@ ${ layout.menubar(section='coordinators', dashboard=True) }
                   ${ _("Number of lines") }
                   <input type="text" class="input-medium" data-bind="spinedit: logFilterLimit" placeholder="${_('ie. 10')}"/>
                 </label>
-                <input type="text" data-bind="value: logFilterText" class="input-xlarge search-query" placeholder="${_('String to search in logs')}">
+                <input type="text" data-bind="clearable: logFilterText, valueUpdate: 'afterkeydown'" class="input-xlarge search-query" placeholder="${_('String to search in logs')}">
 
                 <span class="btn-group" style="float:right;">
                   <a class="btn log-status btn-success" data-value='DEBUG|INFO|TRACE'>${ _('Debug') }</a>
@@ -385,6 +385,9 @@ ${ layout.menubar(section='coordinators', dashboard=True) }
                 <div class="clearfix"></div>
               </div>
               <div style="position:relative">
+                <div class="spinner-overlay" data-bind="visible: isRefreshingLogs()">
+                  <i class="fa fa-spinner fa-spin"></i>
+                </div>
                 <ul class="pointer unstyled settings-overlay" data-bind="click: $root.toggleLogFilterVisible, visible: !isLogFilterVisible()">
                   <li><a class="pointer"><i class="fa fa-filter"></i> ${ _("Filter") }</a></li>
                 </ul>
@@ -543,6 +546,7 @@ ${ layout.menubar(section='coordinators', dashboard=True) }
 
     self.searchFilter = ko.observable("");
 
+    self.isRefreshingLogs = ko.observable(false);
     self.logFilterRecentHours = ko.observable("");
     self.logFilterRecentMinutes = ko.observable("");
     self.logFilterRecent = ko.computed(function () {
@@ -910,6 +914,7 @@ ${ layout.menubar(section='coordinators', dashboard=True) }
     var logsAtEnd = true;
     refreshLogs = function () {
       window.clearTimeout(refreshLogs);
+      viewModel.isRefreshingLogs(true);
       $.getJSON("${ url('oozie:get_oozie_job_log', job_id=oozie_coordinator.id) }" + getLogFilterParams(), function (data) {
         var _logsEl = $("#log pre");
         _logsEl.text(data.log);
@@ -917,6 +922,7 @@ ${ layout.menubar(section='coordinators', dashboard=True) }
         if (logsAtEnd) {
           _logsEl.scrollTop(_logsEl[0].scrollHeight - _logsEl.height());
         }
+        viewModel.isRefreshingLogs(false);
         if (data.status != "RUNNING" && data.status != "PREP"){
           return;
         }

+ 0 - 23
desktop/core/src/desktop/static/desktop/css/common_dashboard.css

@@ -282,29 +282,6 @@ body.modal-open {
   color: #666;
 }
 
-.clearable {
-  background: url(/static/desktop/art/clearField.png) no-repeat right -10px center;
-  border: 1px solid #999;
-  padding: 3px 18px 3px 4px;
-  border-radius: 3px;
-  transition: background 0.4s !important;
-}
-
-@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
-  .clearable {
-    background: url(/static/desktop/art/clearField@2x.png) no-repeat right -10px center;
-    background-size: 10px 10px;
-  }
-}
-
-.clearable.x {
-  background-position: right 5px center;
-}
-
-.clearable.onX {
-  cursor: pointer !important;
-}
-
 .facet-field-cnt {
   margin-bottom: 6px;
 }

+ 23 - 0
desktop/core/src/desktop/static/desktop/css/hue3.css

@@ -2044,3 +2044,26 @@ pre {
 .leaflet-search-command input, .leaflet-search-command label {
   margin-bottom: 0;
 }
+
+.clearable {
+  background: url(/static/desktop/art/clearField.png) no-repeat right -10px center;
+  border: 1px solid #999;
+  padding: 3px 18px 3px 4px;
+  border-radius: 3px;
+  transition: background 0.4s !important;
+}
+
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
+  .clearable {
+    background: url(/static/desktop/art/clearField@2x.png) no-repeat right -10px center;
+    background-size: 10px 10px;
+  }
+}
+
+.clearable.x {
+  background-position: right 5px center;
+}
+
+.clearable.onX {
+  cursor: pointer !important;
+}