FOS Release 20.2

foex-open-source · Jan 18, 2021 · 1ec656b · 1ec656b
1 parent 4f7c19d
commit 1ec656b
Show file tree

Hide file tree

Showing 9 changed files with 402 additions and 304 deletions.
diff --git a/LICENSE.txt b/LICENSE.txt
@@ -1,7 +1,5 @@
-
-
 MIT License
-Copyright (c) 2020 FOS - FOEX Open Source
+Copyright (c) 2021 FOS - FOEX Open Source
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -21,5 +19,3 @@ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
 
-
-
diff --git a/README.md b/README.md
@@ -1,8 +1,6 @@
-
-
 ## FOS - Interactive Grid - Add Button
 
-![](https://img.shields.io/badge/Plug--in_Type-Dynamic_Action-orange.svg) ![](https://img.shields.io/badge/APEX-19.2-success.svg) ![](https://img.shields.io/badge/APEX-20.1-success.svg)
+![](https://img.shields.io/badge/Plug--in_Type-Dynamic_Action-orange.svg) ![](https://img.shields.io/badge/APEX-19.2-success.svg) ![](https://img.shields.io/badge/APEX-20.1-success.svg) ![](https://img.shields.io/badge/APEX-20.2-success.svg)
 
 Add buttons to the Interactive Grid's toolbar and popup menus.
 <h4>Free Plug-in under MIT License</h4>
@@ -21,5 +19,3 @@ All FOS plug-ins are released under MIT License, which essentially means it is f
 
 MIT
 
-
-
diff --git a/apex/com_fos_interactive_grid_add_button.sql b/apex/com_fos_interactive_grid_add_button.sql
diff --git a/apexplugin.json b/apexplugin.json
@@ -1,8 +1,6 @@
-
-
 {
     "name":"FOS - Interactive Grid - Add Button"
-   ,"version":"20.1.1"
+   ,"version":"20.2.0"
    ,"description":"Add buttons to the Interactive Grid\u0027s toolbar and popup menus.\r\n\u003Ch4\u003EFree Plug-in under MIT License\u003C\/h4\u003E\r\n\u003Cp\u003E\r\nAll FOS plug-ins are released under MIT License, which essentially means it is free for everyone to use, no matter if commercial or private use. \r\n\u003C\/p\u003E\r\n\u003Ch4\u003EOverview\u003C\/h4\u003E\r\n\u003Cp\u003E\r\n    The \u003Cstrong\u003EFOS - Interactive Grid - Add Button\u003C\/strong\u003E plug-in is a simple way for adding buttons to the Interactive Grid. Whether it\u0027s the toolbar, the actions menu, the row actions menu or the row selection menu, this plug-in allows you to extend all of these components with your own, highly customizable buttons, declaratively.\r\n\u003C\/p\u003E\r\n\u003Cp\u003E\r\n    The plug-ins settings give you fine control over the buttons position (first, last, index), look, icon, and which action should be executed when that button is clicked. You can execute a predefined action (ie. delete row), execute some JavaScript code, trigger an event, put the currently selected row(s) pk value into a page item, or even provide your own actions.\r\n\u003C\/p\u003E"
    ,"keywords":[
         "interactive grid"
@@ -38,6 +36,7 @@
             "versions":[
                 "19.2.0"
                ,"20.1.0"
+               ,"20.2.0"
             ]
            ,"plugin":{
                 "internalName":"COM.FOS.INTERACTIVE_GRID_ADD_BUTTON"
@@ -50,5 +49,3 @@
 }
 
 
-
-
diff --git a/db/com_fos_interactive_grid_add_button.pkb b/db/com_fos_interactive_grid_add_button.pkb
@@ -1,5 +1,3 @@
-
-
 create or replace package body com_fos_interactive_grid_add_button
 as
 
@@ -49,6 +47,9 @@ as
 
     l_disable_on_no_selection boolean                            := 'disable-if-no-rows' member of l_extras;
     l_disable_on_no_data      boolean                            := 'disable-if-no-data' member of l_extras;
+    l_hide_on_no_selection    boolean                            := 'hide-if-no-rows'    member of l_extras;
+    l_hide_on_no_data         boolean                            := 'hide-if-no-data'    member of l_extras;
+
     l_icon_only               boolean                            := 'icon-only'          member of l_extras;
     l_is_hot                  boolean                            := 'is-hot'             member of l_extras;
     l_right_aligned_icon      boolean                            := 'right-aligned-icon' member of l_extras;
@@ -78,6 +79,8 @@ begin
     --    "eventName": "lemon-clicked",
     --    "disableOnNoSelection": true
     --    "disableOnNoData": true
+    --    "hideOnNoSelection": true
+    --    "hideOnNoData": true
     --    "iconOnly": false
     -- });
 
@@ -105,6 +108,8 @@ begin
     apex_json.write('isHot'               , l_is_hot);
     apex_json.write('disableOnNoSelection', l_disable_on_no_selection);
     apex_json.write('disableOnNoData'     , l_disable_on_no_data);
+    apex_json.write('hideOnNoSelection'   , l_hide_on_no_selection);
+    apex_json.write('hideOnNoData'        , l_hide_on_no_data);
     apex_json.write('iconOnly'            , l_icon_only);
     apex_json.write('iconRightAligned'    , l_right_aligned_icon);
 
@@ -137,5 +142,3 @@ end;
 /
 
 
-
-
diff --git a/db/com_fos_interactive_grid_add_button.pks b/db/com_fos_interactive_grid_add_button.pks
@@ -1,5 +1,3 @@
-
-
 create or replace package com_fos_interactive_grid_add_button
 as
 
@@ -13,5 +11,3 @@ end;
 /
 
 
-
-
diff --git a/files/js/script.js b/files/js/script.js
@@ -1,5 +1,3 @@
-
-
 /* globals apex,$ */
 
 var FOS = window.FOS || {};
@@ -23,7 +21,9 @@ FOS.interactiveGrid = FOS.interactiveGrid || {};
  * @param {boolean}  [config.iconOnly]              Only for toolbar buttons. Even if no icon was provided, you should still set this attribute to yes, just in case an icon was defined in the action
  * @param {boolean}  [config.iconRightAligned]      Only for toolbar buttons. True if the button's icon should be right-aligned.
  * @param {boolean}  [config.disableOnNoSelection]  Disable the button if no rows are selected in the grid
- * @param {boolean}  [config.disableOnData]         Disable the button if the grid contains no data
+ * @param {boolean}  [config.disableOnNoData]       Disable the button if the grid contains no data
+ * @param {boolean}  [config.hideOnNoSelection]     Hide the button if no rows are selected in the grid
+ * @param {boolean}  [config.hideOnNoData]          Hide the button if the grid contains no data
  * @param {string}   [config.conditionColumn]       Only for Row Actions Menu buttons. Provide a column that determines if the button for a specific row is hidden or disabled. Values of that column should be null, "hidden" or "disabled"
  * @oaram {string}   [config.actionName]            Optional. If the button is associated with an already existing action, provide that action name. The label, icon, title, disabled state, are inherited from that action unless overridden.
  *                                                  Provide a custom string, such as "my-fancy-action", if you wish to later control the button. E.g update the label.
@@ -70,11 +70,13 @@ FOS.interactiveGrid.addButton = function (daContext, config, initFn) {
     var callback = config.callback;
     var disableOnNoSelection = config.disableOnNoSelection;
     var disableOnNoData = config.disableOnNoData;
+    var hideOnNoSelection = config.hideOnNoSelection;
+    var hideOnNoData = config.hideOnNoData;
     var iconOnly = config.iconOnly;
     var iconRightAligned = config.iconRightAligned;
 
     // if no action name was provided, we must create a new, unique one
-    var actionName = config.actionName || 'fos-ig-button-' + setTimeout(function(){});
+    var actionName = config.actionName || 'fos-ig-button-' + setTimeout(function () { });
 
     // create an action object, but without an action function for now
     var action = {
@@ -285,6 +287,21 @@ FOS.interactiveGrid.addButton = function (daContext, config, initFn) {
             icon: icon ? ('fa ' + icon) : ''
         });
         toolbar$.toolbar('option', 'data', toolbarData);
+
+        // https://github.com/foex-open-source/fos-interactive-grid-add-button/issues/5
+        // Updating the toolbar is not as simple as resetting the data or refreshing it.
+        // Certain controls which could be hidden in Page Designer like Search Field or Actions Menu
+        //      will not remember their hidden state after refresh.
+        // The following will produce and extra flash, but all controls will remember their state.
+        // It is in essence how the IG handles it as well.
+
+        // first hide all controls which do not have an associated action
+        toolbar$.toolbar('findElement', 'column_filter_button').hide();
+        toolbar$.toolbar('findElement', 'search_field').hide();
+        toolbar$.toolbar('findElement', 'actions_button').hide();
+
+        // then conditionally re-show them
+        region.call('instance')._updateToolbarElements();
     }
 
     // in the case of a conditional Row Actions button, hide or disable before each menu open
@@ -310,47 +327,83 @@ FOS.interactiveGrid.addButton = function (daContext, config, initFn) {
         });
     }
 
-  	var conditionallyEnable;
-
-    // if Disable On No Selection is turned on
-    if (disableOnNoSelection) {
+    // Disable/Hide On No Selection
+    if (disableOnNoSelection || hideOnNoSelection) {
         // disabling/enabling the button happens through the action interface
-        conditionallyEnable = function() {
-            if (region.call('getSelectedRecords').length) {
-                actionsContext.enable(actionName);
-            } else {
-                actionsContext.disable(actionName);
+        var onSelectionChange = function () {
+            var action = actionsContext.lookup(actionName);
+            var recordCount = region.call('getSelectedRecords').length;
+            if (disableOnNoSelection) {
+                if (recordCount > 0 && action.disabled) {
+                    actionsContext.enable(actionName);
+                } else if (recordCount == 0 && !action.disabled) {
+                    actionsContext.disable(actionName);
+                }
+            }
+            if (hideOnNoSelection) {
+                if (recordCount > 0 && action.hide) {
+                    actionsContext.show(actionName);
+                } else if (recordCount == 0 && !action.hide) {
+                    actionsContext.hide(actionName);
+                }
             }
         };
         // run once on page load
-        conditionallyEnable();
-        // subsequently run whenever the whenever the selection changes
-        $(regionSelector).on('interactivegridselectionchange', conditionallyEnable);
+        onSelectionChange();
+        // subsequently run whenever the selection changes
+        // selectionchange does not fire on reportchange,
+        // so we include both
+        $(regionSelector).on('interactivegridselectionchange interactivegridreportchange', onSelectionChange);
     }
 
-    // if Disable On No Data is turned on
-    if (disableOnNoData) {
-        model = region.call('getViews', 'grid').model;
+    // Disable/Hide On No Data
+    if (disableOnNoData || hideOnNoData) {
         // disabling/enabling the button happens through the action interface
-        conditionallyEnable = function() {
-            if (model._data.length) {
-                actionsContext.enable(actionName);
-            } else {
-                actionsContext.disable(actionName);
+        var onDataChange = function () {
+            var model = region.call('getViews', 'grid').model;
+            var action = actionsContext.lookup(actionName);
+            var recordCount = model._data.length;
+            if (disableOnNoData) {
+                if (recordCount > 0 && action.disabled) {
+                    actionsContext.enable(actionName);
+                } else if (recordCount == 0 && !action.disabled) {
+                    actionsContext.disable(actionName);
+                }
+            }
+            if (hideOnNoData) {
+                if (recordCount > 0 && action.hide) {
+                    actionsContext.show(actionName);
+                } else if (recordCount == 0 && !action.hide) {
+                    actionsContext.hide(actionName);
+                }
             }
         };
-        // run once on page load
-        conditionallyEnable();
-        // subsequently run whenever the whenever the grid data changes
-        model.subscribe({
-            onChange: function(changeType, change){
-                conditionallyEnable();
+
+        // run whenever the grid data changes
+        var model, viewId;
+
+        function onModelChange(){
+            if(model && viewId){
+                // only keep the most recent observer
+                model.unSubscribe(viewId);
             }
+            model = region.call('getViews', 'grid').model;
+            viewId = model.subscribe({
+                onChange: onDataChange
+            });
+            onDataChange();
+        };
+
+        // the model onChange event is not fired on report change
+        // so we include an extra handler
+        $(regionSelector).on('interactivegridreportchange', function(){
+            onModelChange();
         });
+
+        // run once on page load
+        onModelChange();
     }
 
 };
 
 
-
-