Widgets: Refactor showing of sample data in editor and on preview

relates to xibosignage/xibo#3224
rubenpingol-xibo · Nov 22, 2023 · 3fd58ae · 3fd58ae
1 parent 9872e30
commit 3fd58ae
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 30 deletions.
diff --git a/lib/Widget/Render/WidgetHtmlRenderer.php b/lib/Widget/Render/WidgetHtmlRenderer.php
@@ -494,6 +494,7 @@ private function render(
                 'isRepeatData' => $widget->getOptionValue('isRepeatData', 1) === 1,
                 'duration' => $widget->duration,
                 'calculatedDuration' => $widget->calculatedDuration,
+                'isDataExpected' => $module->isDataProviderExpected(),
             ];
 
             // Should we expect data?

diff --git a/ui/src/helpers/player-helper.js b/ui/src/helpers/player-helper.js
@@ -1,15 +1,6 @@
 const PlayerHelper = function() {
   // Check the query params to see if we're in editor mode
   const _self = this;
-  const urlParams = new URLSearchParams(window.location.search);
-  const isPreview = urlParams.get('preview') === '1';
-  const staticTemplateIds = [
-    'event_custom_html', 'daily_light', 'daily_dark', 'weekly_light',
-    'weekly_dark', 'monthly_light', 'monthly_dark', 'schedule_light',
-    'schedule_dark', 'article_custom_html', 'article_image_only',
-    'article_with_left_hand_text', 'article_with_title',
-    'article_with_desc_and_name_separator', 'article_title_only',
-  ];
   let _elements = {standalone: {}, groups: {}};
   let countWidgetElements = 0;
   let countWidgetStatic = 0;
@@ -31,7 +22,9 @@ const PlayerHelper = function() {
         const widgetHasNoData = values.filter((val) => {
           return val !== null &&
             (val.hasOwnProperty('success') ||
-              val.hasOwnProperty('error'));
+              val.hasOwnProperty('error') ||
+              (val.hasOwnProperty('data') && val?.data?.length === 0)
+            );
         });
 
         if (widgetHasNoData.length > 0) {
@@ -90,6 +83,22 @@ const PlayerHelper = function() {
     }
   });
 
+  /**
+   * Checks if playerjs is used for preview or in editor
+   * @return {boolean}
+   */
+  this.isOnPreview = () => {
+    // This only refers to the iframe window, not the parent window
+    // const urlParams =
+    //     new URLSearchParams(window.location.search);
+    // const onIframePreview = urlParams.get('preview') === '1';
+    const parentWindow = window.parent;
+    const windowPreviewRegex =
+      new RegExp('(layout\\/preview\\/[0-9]+)', 'g');
+
+    return parentWindow.location.href.match(windowPreviewRegex) !== null;
+  };
+
   /**
    * onDataError callback
    * @param {string|number} httpStatus
@@ -195,29 +204,33 @@ const PlayerHelper = function() {
       }, []);
     };
 
-    if (isPreview) {
-      if (finalData.isArray) {
-        if (data?.data?.length > 0) {
+    if (_self.isOnPreview()) {
+      if (widget.isDataExpected) {
+        finalData.dataItems = [];
+        if (finalData.isArray) {
+          if (data?.data?.length > 0) {
+            finalData.dataItems = data?.data;
+          }
+        } else if (data?.success === false || !widget.isValid) {
+          finalData.showError = true;
+        }
+      } else {
+        finalData.showError = false;
+      }
+    } else {
+      if (widget.isDataExpected) {
+        if (finalData.isArray && data?.data?.length > 0) {
           finalData.dataItems = data?.data;
-        } else if (widget.sample && Array.isArray(widget.sample)) {
+        } else if (data?.success === false || !widget.isValid) {
+          finalData.dataItems = composeSampleData();
+          finalData.showError = true;
+        } else if (data?.data?.length === 0) {
           finalData.dataItems = composeSampleData();
         }
-      } else if (data?.success === false || !widget.isValid) {
-        finalData.dataItems = composeSampleData();
+      } else {
+        finalData.dataItems = [];
+        finalData.showError = false;
       }
-    } else {
-      finalData.dataItems = data?.data || [];
-    }
-
-    if (data?.success === false || !widget.isValid) {
-      finalData.showError = true;
-    }
-
-    if (finalData.isSampleData &&
-      staticTemplateIds.includes(widget.templateId) &&
-      widget.properties.hasOwnProperty('url')
-    ) {
-      finalData.dataItems = [];
     }
 
     return finalData;
@@ -241,7 +254,6 @@ const PlayerHelper = function() {
         element.id + '_' + element.templateData.datasetField :
         element.id;
 
-
       // Initialize object values
       if (!isGroup &&
         !collection.standalone.hasOwnProperty(standaloneKey)