Fix #6023 srw watchpoint panels

sirepo/package_data/static/css/sirepo.css

@@ -352,6 +352,14 @@
     .sr-panel-running .sr-panel-wait {
       font-weight: bold;
     }
+    .sr-panel-waiting {
+      background-color: #777;
+    }
+    .sr-panel-waiting .sr-panel-wait {
+      color: white;
+      display: block;
+      z-index: 1000;
+    }
     .sr-hide-report {
       opacity: 0;
       height: 0;

sirepo/package_data/static/js/sirepo-beamline.js

@@ -843,7 +843,7 @@ SIREPO.app.directive('watchPointList', function(appState, beamlineService) {
     };
 });
 
-SIREPO.app.directive('beamlineAnimation', function(appState, frameCache, persistentSimulation) {
+SIREPO.app.directive('beamlineAnimation', function(appState, frameCache, panelState, persistentSimulation) {
     return {
         restrict: 'A',
         scope: {},
@@ -865,7 +865,7 @@ SIREPO.app.directive('beamlineAnimation', function(appState, frameCache, persist
           </div>
           <div style="margin-bottom: 1em" class="clearfix"></div>
           <div data-ng-repeat="report in reports" data-ng-if="simState.hasFrames()">
-            <div data-watchpoint-report="" data-item-id="report.id"></div>
+            <div data-watchpoint-report="" data-item-id="report.id" data-ng-if="showReport(report)"></div>
             <div class="clearfix hidden-xl" data-ng-hide="($index + 1) % 2"></div>
             <div class="clearfix visible-xl" data-ng-hide="($index + 1) % 3"></div>
           </div>
@@ -878,6 +878,13 @@ SIREPO.app.directive('beamlineAnimation', function(appState, frameCache, persist
                 $scope.reports = [];
             });
 
+            $scope.showReport = report => {
+                if ($scope.simState.isStateRunning()) {
+                    return true;
+                }
+                return frameCache.getFrameCount(report.modelAccess.modelKey) !== SIREPO.nonDataFileFrame;
+            };
+
             $scope.start = function() {
                 $rootScope.$broadcast('saveLattice', appState.models);
                 appState.models.simulation.framesCleared = false;
@@ -887,24 +894,39 @@ SIREPO.app.directive('beamlineAnimation', function(appState, frameCache, persist
             };
 
             $scope.simHandleStatus = (data) => {
+                function getReport(id) {
+                    for(const r of $scope.reports) {
+                        if (id === r.id) {
+                            return r;
+                        }
+                    }
+                    return null;
+                }
+
                 if (appState.models.simulation.framesCleared) {
                     return;
                 }
                 if (! data.outputInfo) {
                     return;
                 }
-                for (let i = 0; i < data.frameCount; i++) {
-                    if ($scope.reports.length != i) {
-                        continue;
-                    }
+
+                for (let i = 0; i < data.outputInfo.length; i++) {
                     let info = data.outputInfo[i];
-                    $scope.reports.push({
-                        id: info.id,
-                        modelAccess: {
-                            modelKey: info.modelKey,
-                        },
-                    });
-                    frameCache.setFrameCount(info.frameCount || 1, info.modelKey);
+                    if (! getReport(info.id)) {
+                        $scope.reports.push(
+                            {
+                                id: info.id,
+                                modelAccess: {
+                                    modelKey: info.modelKey,
+                                },
+                            }
+                        );
+                    }
+                    frameCache.setFrameCount(
+                        info.waitForData ? SIREPO.nonDataFileFrame : (info.frameCount || 1),
+                        info.modelKey
+                    );
+                    panelState.setWaiting(info.modelKey, ! ! info.waitForData);
                 }
                 frameCache.setFrameCount(data.frameCount || 0);
             };

sirepo/package_data/static/js/sirepo-components.js

@@ -1746,7 +1746,8 @@ SIREPO.app.directive('showLoadingAndError', function(panelState) {
             modelKey: '@',
         },
         template: `
-            <div data-ng-class="{\'sr-panel-loading\': panelState.isLoading(modelKey), \'sr-panel-error\': panelState.getError(modelKey), \'sr-panel-running\': panelState.isRunning(modelKey), \'has-transclude\': hasTransclude()}" class="panel-body" data-ng-hide="panelState.isHidden(modelKey)">
+            <div data-ng-class="{'sr-panel-loading': panelState.isLoading(modelKey), 'sr-panel-error': panelState.getError(modelKey), 'sr-panel-running': panelState.isRunning(modelKey), 'sr-panel-waiting': panelState.isWaiting(modelKey), 'has-transclude': hasTransclude()}" class="panel-body" data-ng-hide="panelState.isHidden(modelKey)">
+              <div data-ng-show="panelState.isWaiting(modelKey)" class="lead sr-panel-wait"><span class="glyphicon glyphicon-hourglass"></span> Waiting for Data</div>
               <div data-ng-show="panelState.isLoading(modelKey)" class="lead sr-panel-wait"><span class="glyphicon glyphicon-hourglass"></span> {{ panelState.getStatusText(modelKey) }}</div>
               <div data-ng-show="panelState.getError(modelKey)" class="lead sr-panel-wait"><span class="glyphicon glyphicon-exclamation-sign"></span> {{ panelState.getError(modelKey) }}</div>
               <div data-ng-transclude=""></div>

sirepo/package_data/static/js/sirepo.js

@@ -1777,6 +1777,10 @@ SIREPO.app.factory('panelState', function(appState, requestSender, simulationQue
         return queueItems[name] && queueItems[name].qState == 'processing' ? true : false;
     };
 
+    self.isWaiting = name => {
+        return getPanelValue(name, 'waiting') ? true : false;
+    };
+
     self.maybeSetState = function(model, state) {
         if (!model) {
             return;
@@ -1854,6 +1858,10 @@ SIREPO.app.factory('panelState', function(appState, requestSender, simulationQue
 
     self.setData = (name, data) => setPanelValue(name, 'data', data);
 
+    self.setWaiting = (name, isWaiting) => {
+        setPanelValue(name, 'waiting', isWaiting);
+    };
+
     self.showEnum = function(model, field, value, isShown) {
         var eType = SIREPO.APP_SCHEMA.enum[appState.modelInfo(model)[field][SIREPO.INFO_INDEX_TYPE]];
         var optionIndex = -1;

sirepo/template/srw.py

@@ -1154,6 +1154,7 @@ def _beamline_animation_percent_complete(run_dir, res):
         if item.type == "watch":
             res.outputInfo.append(
                 PKDict(
+                    waitForData=True,
                     modelKey=f"beamlineAnimation{item.id}",
                     filename=_wavefront_pickle_filename(item.id),
                     id=item.id,
@@ -1166,6 +1167,7 @@ def _beamline_animation_percent_complete(run_dir, res):
                 # TODO(pjm): instead look at last byte == pickle.STOP, see template_common.read_last_csv_line()
                 wfr = pickle.load(f)
                 count += 1
+                info.waitForData = False
         except Exception as e:
             break
     res.frameCount = count