Merge pull request #1080 from maurofmferrao/feature/3.0.0-rc2

Feature/3.0.0 rc2
xibosignage · Mar 10, 2021 · 94a3bfe · 94a3bfe
2 parents 83e15a3 + 2279047
commit 94a3bfe
Show file tree

Hide file tree

Showing 4 changed files with 44 additions and 28 deletions.
diff --git a/views/action-designer-javascript.twig b/views/action-designer-javascript.twig
@@ -54,9 +54,9 @@
             onTriggerChange(dialog);
         })
 
-        onTargetRegionChange(dialog);
-        $(dialog).find("#targetId, #actionType").on('change', function() {
-            onTargetRegionChange(dialog);
+        onTargetWidgetChange(dialog);
+        $(dialog).find("#widgetId, #actionType, #target").on('change', function() {
+            onTargetWidgetChange(dialog);
         })
 
         // On modal close, reload layout designer data
@@ -74,6 +74,9 @@
 
         if (target === 'region') {
             targetId.removeClass("d-none");
+            targetId.find('select').removeAttr('disabled');
+            targetId.find('input[type="hidden"').remove();
+            
         } else {
             $('#targetId').val('');
             targetId.addClass("d-none");
@@ -123,39 +126,51 @@
         }
     }
 
-    function onTargetRegionChange(dialog) {
+    function onTargetWidgetChange(dialog) {
         var actionType = $(dialog).find('#actionType').val();
         var target = $(dialog).find("#target").val();
-        var targetRegion = $(dialog).find("#targetId").val();
+        var widgetId = $(dialog).find("#widgetId").val();
+        var $targetId = $(dialog).find('#targetId');
+        var $targetIdContainer = $(dialog).find('#targetId');
+
+        // Remove warning card
+        $(dialog).find('.nav-control-widget .card.text-danger').remove();
         
-        if (actionType === 'navWidget' && target == 'region' && targetRegion != '') {
-            // Filter widgets based on "targetRegion" region!');
-            $("#widgetId").find('option').each(function() {
-                let widgetId = $(this).val();
+        if (actionType === 'navWidget' && target == 'region' && widgetId != undefined) {
+            // Set target value to empty
+            $targetId.val('');
 
-                // If there is no widget if, skip this element
-                if(widgetId == '') {
-                    return true;
-                }
+            // Disable target region ( since we are setting it programmatically )
+            $targetId.attr('disabled', 'disabled');
+            
+            // Remove previous temporary element if exists
+            $targetIdContainer.find('input[type="hidden"').remove();
 
-                // Get layout designer element
-                let widget = lD.getElementByTypeAndId('widget', 'widget_' + lD.layout.drawer.regionId + '_' + widgetId, 'drawer');
+            if(widgetId == '') {
+                return true;
+            }
 
-                if(widget == undefined) {
-                    return true;
-                }
+            // Get layout designer element
+            var widget = lD.getElementByTypeAndId('widget', 'widget_' + lD.layout.drawer.regionId + '_' + widgetId, 'drawer');
+            var widgetTargetRegion = widget.targetRegionId;
 
-                if(widget.targetRegionId != targetRegion) {
-                    // Hide current widget
-                    $(this).hide();
+            if(widgetTargetRegion == undefined) {
+                // Show warning to select a target region in the drawer
+                $(dialog).find('.nav-control-widget').append($('<div class="card bg-light p-2 text-danger offset-sm-2 col-sm-10 text-center form-error">{{ "Select a target region for this widget in the layout designer drawer!"|trans }}</div>'));
+            } else {
+                if($targetId.find('option[value="' + widgetTargetRegion + '"]').length > 0) {
+                    // Change the target value to the target region for the selected widget
+                    $targetId.val(widgetTargetRegion);
                 } else {
-                    // Show current widget
-                    $(this).show();
+                    console.error('{{ "Something went wrong: target region is not available in the current layout"|trans }}');
                 }
-            });
+            }
+
+            // Create a temporary input to submit the disabled select value
+            $targetIdContainer.append('<input type="hidden" name="' + $targetId.attr('name')  + '" value="' + $targetId.val() + '" />');
         } else {
-            // Do nothing or show all widgets
-            $(dialog).find("#widgetId").find('option').show();
+            // Call onTargetChange again to check if we need to reshow the region target
+            onTargetChange(dialog);
         }
     }
 

diff --git a/views/campaign-form-add.twig b/views/campaign-form-add.twig
@@ -86,7 +86,7 @@
             <h4>{% trans %}Layouts on new campaign{% endtrans %}</h4>
             <div id="LayoutAssign" class="card p-3 mb-3 bg-light" data-url="{{ url_for("campaign.assign.layout", {id: campaign.campaignId}) }}">
                 <div>
-                    <ul id="LayoutAssignSortable"></ul>
+                    <ul id="LayoutAssignSortable" data-layouts="[]"></ul>
                 </div>
             </div>
 

diff --git a/views/common.twig b/views/common.twig
@@ -334,7 +334,7 @@
                 height: "{{ "Height" |trans }}",
                 scale: "{{ "Scale"|trans }}",
                 targetDrawer: "{{ "Target"|trans }}",
-                selectATarget: "{{ "Select a drawer!"|trans }}"
+                selectATarget: "{{ "Select a target region!"|trans }}"
             };
 
             var toolbarTrans = {

diff --git a/web/theme/default/css/xibo.css b/web/theme/default/css/xibo.css
@@ -208,6 +208,7 @@ ul#LayoutAssignSortable {
     font-size: 0;
     margin: 0;
     padding: 0;
+    width: 100%;
 }
 
 ul#LayoutAssignSortable > li {