glib-web 4.10.0 → 4.10.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: bfd1804082f7f14167a579c42e2d1bde31ad7dbd928bc764ca3de0ba0259ad99
-  data.tar.gz: 1cde932d484baa31d4074ce52bdf5d955c51fc70008016b8bbcb6ead85746107
+  metadata.gz: 40fb8120f293f1162be2b6027432444a35b7b321f0db95a6efbcd8d7a52b964c
+  data.tar.gz: 839a67107c2a77d66fd0ad27dcc8cfb5e77f0754609f609447ec030f2357f07d
 SHA512:
-  metadata.gz: 73d15de9c4abe80f6148b67b328ac4c4ece94231900a62c3fcddabd06db453efb462ef296659dfdd8f36674e353815c58dd4a4d337ab15f07385eaa96e2a09e0
-  data.tar.gz: aea3aba2adb595aa2eaaef5275b2bf6b8e1b04731b910678c651d1f170ae1e2127035735955c30bf4d8e7238491fabdb236f9f9b6531239a77f639c799460599
+  metadata.gz: 0e2d195b6f33253b5d2ab3ec2df96cf00d62d2fd56bf08d80f25577ad09526561006391b3c2ce370e80ce2ab18510b468dfa5b0ae46c72483feee395eace6a40
+  data.tar.gz: 1bc81f15016ee532f0c9395d35318a487807fa5854a546796772dedeaee6edae0183881b997c9495e1a0a044bcb773103794c01b06642c202f3fe72a036a722b

data/app/helpers/glib/json_ui/view_builder/panels.rb

@@ -494,6 +494,14 @@ class Glib::JsonUi::ViewBuilder
 
     class Flow < View
       hash :innerPadding, optional: [:top, :right, :bottom, :left, :x, :y]
+
+      hash :xxl, optional: [:gap, :padding]
+      hash :xl, optional: [:gap, :padding]
+      hash :lg, optional: [:gap, :padding]
+      hash :md, optional: [:gap, :padding]
+      hash :sm, optional: [:gap, :padding]
+      hash :xs, optional: [:gap, :padding]
+
       views :childViews
 
       required :innerPadding
@@ -564,6 +572,13 @@ class Glib::JsonUi::ViewBuilder
       # end
     end
 
+    class Pagination < View
+      int :length
+      int :value
+      action :onChange
+      string :paramNameForFieldName
+    end
+
     module ModelPanel
       attr_reader :model_name # See Panels::Form.field_name
       attr_reader :assoc_order_index

data/app/views/json_ui/garage/forms/dynamic_group.json.jbuilder

@@ -28,7 +28,7 @@ page.form url: json_ui_garage_url(path: 'forms/generic_post'), method: 'post', p
       template.fields_text width: 'matchParent', name: 'question', label: 'Question', placeholder: 'Question'
 
       form.panels_responsive id: 'responsive_{{entry_index}}', childViews: ->(column) do
-        options = [:rating, :yes_no]
+        options = [:rating, :yes_no, :choices]
         template.fields_select \
           width: 'matchParent',
           name: 'type',
@@ -36,56 +36,61 @@ page.form url: json_ui_garage_url(path: 'forms/generic_post'), method: 'post', p
           placeholder: 'Answer Type',
           options: options.map { |o| { text: o.to_s.humanize, value: o } },
           onChangeAndLoad: ->(action) do
-            action.logics_set targetId: 'responsive_{{entry_index}}', dataBuilder: ->(set) do
-              set.panels_responsive accessory: ->(accessory) do
-                accessory.footer childViews: ->(footer) do
-                  # TODO: Is there a way to only show this if the selected option is "rating".
-                  # I.e. `showIf: { "==": [{ "var": 'user[evaluation][{{index}}][type]' }, 'rating'] }`
-                  footer.fields_check \
-                    width: 'matchParent',
-                    id: 'check_{{entry_index}}',
-                    name: 'enabled',
-                    label: 'Enable',
-                    checkValue: true
+            action.runMultiple childActions: ->(multiple) do
+              multiple.logics_set \
+                cacheData: true, # This is so that the the new data is retained when the `dynamicGroup` gets re-rendered.
+                debug: true,
+                targetId: 'responsive_{{entry_index}}', dataBuilder: ->(set) do
+                  set.panels_responsive width: 'matchParent', accessory: ->(accessory) do
+                    accessory.footer childViews: ->(footer) do
+                      footer.fields_check \
+                        width: 'matchParent',
+                        id: 'check_{{entry_index}}',
+                        name: 'enabled',
+                        label: 'Enable',
+                        checkValue: true
+
+                      footer.panels_split width: 'matchParent', content: ->(split) do
+                        split.right childViews: ->(right) do
+                          right.label text: 'This should be right-aligned'
+                        end
+                      end
+                    end
+                  end
+                end, onSet: ->(subaction) do
+                  subaction.logics_set \
+                    targetId: 'check_{{entry_index}}',
+                    conditionalData: {
+                      value: {
+                        "==": [{ "var": 'user[evaluation][{{entry_index}}][type]' }, 'rating']
+                      }
+                    }
                 end
-              end
-            end, onSet: ->(subaction) do
-              subaction.logics_set \
-                targetId: 'check_{{entry_index}}',
+
+              multiple.logics_set \
+                targetId: 'choices_panel',
+                debug: true,
                 conditionalData: {
-                  value: {
-                    "==": [{ "var": 'user[evaluation][{{entry_index}}][type]' }, 'rating']
+                  displayed: {
+                    "==": [{ "var": 'user[evaluation][{{entry_index}}][type]' }, 'choices']
                   }
                 }
             end
-
-            # action.components_findClosest view: 'panels/responsive', onFind: ->(find) do
-            #   find.logics_set dataBuilder: ->(set) do
-            #     set.panels_responsive accessory: ->(accessory) do
-            #       accessory.footer childViews: ->(footer) do
-            #         # TODO: Is there a way to only show this if the selected option is "rating".
-            #         # I.e. `showIf: { "==": [{ "var": 'user[evaluation][{{index}}][type]' }, 'rating'] }`
-            #         footer.fields_check \
-            #           width: 'matchParent',
-            #           name: 'enabled',
-            #           label: 'Enable',
-            #           checkValue: '1'
-            #       end
-            #     end
-            #   end
-            # end
           end
         end, accessory: ->(accessory) do
           accessory.footer childViews: ->(footer) do
+
           end
         end
 
-      # template.fields_check \
-      #   width: 'matchParent',
-      #   name: 'enabled',
-      #   label: 'Enable',
-      #   checkValue: '1',
-      #   showIf: { "==": [{ "var": 'user[evaluation][{{index}}][type]' }, 'rating'] }
+      template.panels_vertical id: 'choices_panel', childViews: ->(vertical) do
+        (1..5).each do |i|
+          vertical.fields_text \
+            width: 'matchParent',
+            name: "choices[#{i}]",
+            label: "Choice #{i}"
+        end
+      end
 
       template.spacer height: 14
     end

data/app/views/json_ui/garage/forms/selects.json.jbuilder

@@ -17,13 +17,16 @@ page.form url: json_ui_garage_url(path: 'forms/generic_post'), method: 'post', p
   }
 
   form.panels_responsive childViews: ->(column) do
+    options = languages.map do |k, v|
+      { value: k, text: v }
+    end
     form.fields_select \
       name: 'user[city]',
       width: 'matchParent',
       clearable: true,
       label: 'City1',
       placeholder: 'This is a placeholder',
-      options: languages.map { |k, v| { value: k, text: v } },
+      options: options,
       value: 'canberra',
       onChange: ->(action) do
         action.components_findClosest view: 'panels/responsive', onFind: ->(find) do
@@ -47,11 +50,13 @@ page.form url: json_ui_garage_url(path: 'forms/generic_post'), method: 'post', p
 
   form.spacer height: 6
 
+  options = languages.map { |k, v| { value: k, text: v, deselect: [-1] } }
+  options << { value: -1, text: 'None of the above', deselect: languages.keys }
   form.fields_select \
     name: 'user[cities][]',
     width: 'matchParent',
     label: 'Cities',
-    options: languages.map { |k, v| { value: k, text: v } },
+    options: options,
     value: ['melbourne', 'sydney'],
     multiple: true,
     onChange: ->(action) do

data/app/views/json_ui/garage/forms/show_hide.json.jbuilder

@@ -93,6 +93,72 @@ page.form \
     form.spacer height: 10
     form.label id: 'label22', text: 'Is Checked22'
 
+    form.spacer height: 20
+    form.h1 text: 'Radio inside panels'
+
+    form.fields_radioGroup \
+      name: 'user[radio9]',
+      value: 'no',
+      width: 'matchParent',
+      onChangeAndLoad: ->(action) do
+          action.runMultiple childActions: ->(saction) do
+            saction.logics_set targetId: 'radiolabel1', conditionalData: {
+              displayed: {
+                "==": [
+                  {
+                    "var": 'user[radio9]'
+                  },
+                  'yes'
+                ]
+              }
+            }
+            saction.logics_set targetId: 'radiolabel2', conditionalData: {
+              displayed: {
+                "==": [
+                  {
+                    "var": 'user[radio9]'
+                  },
+                  'no'
+                ]
+              }
+            }
+          end
+        end,
+        childViews: ->(group) do
+          group.panels_responsive width: 'matchParent', childViews: ->(res) do
+
+            res.panels_column width: 'matchParent', lg: { cols: 4 }, childViews: ->(column) do
+              column.fields_radio\
+                width: 350,
+                value: 'yes', label: 'Yes', icon: { template: 'featured', name: 'edit', size: 40, color: '#d1d1d1' },
+                onClick: ->(action) do
+                  action.windows_openWeb url: 'http://www.google.com'
+                end
+            end
+            res.panels_column width: 'matchParent', lg: { cols: 4 }, childViews: ->(column) do
+              column.fields_radio\
+                width: 350,
+                value: 'no', label: 'No',
+                image: { template: 'featured', url: 'https://cdn.pixabay.com/photo/2020/08/05/13/12/eco-5465432_1280.png', width: 80, height: 80 },
+                onClick: ->(action) do
+                  action.windows_openWeb url: 'http://www.google.com'
+                end
+            end
+            res.panels_column width: 'matchParent', lg: { cols: 4 }, childViews: ->(column) do
+              column.fields_radio\
+                value: 'idk', label: 'Not Sure',
+                image: { template: 'thumbnail', url: 'https://cdn.pixabay.com/photo/2020/08/05/13/12/eco-5465432_1280.png', width: 24, height: 24 }
+              column.fields_radio value: '', label: 'Empty'
+            end
+
+          end
+        end
+
+
+    form.spacer height: 10
+    form.label id: 'radiolabel1', text: 'Yes'
+    form.label id: 'radiolabel2', text: 'No'
+
     form.spacer height: 20
     form.h1 text: 'Radio Group'
     form.fields_radioGroup \
@@ -123,15 +189,19 @@ page.form \
         end
       end,
       childViews: ->(group) do
-        group.fields_radio\
-          value: 'show', label: 'Show', icon: { template: 'featured', name: 'edit', size: 40, color: '#d1d1d1' }
-        group.fields_radio\
-          value: 'hide', label: 'Hide',
-          image: { template: 'featured', url: 'https://cdn.pixabay.com/photo/2020/08/05/13/12/eco-5465432_1280.png', width: 80, height: 80 }
-        group.fields_radio\
-          value: 'no', label: 'No',
-           image: { template: 'thumbnail', url: 'https://cdn.pixabay.com/photo/2020/08/05/13/12/eco-5465432_1280.png', width: 24, height: 24 }
-        group.fields_radio value: '', label: 'Empty'
+        # TODO: Fix a bug where if the fields_radio is wrapped in panels_horizontal,
+        #       it cannot be selected.
+        group.panels_horizontal childViews: ->(horizontal) do
+          horizontal.fields_radio\
+            value: 'show', label: 'Show', icon: { template: 'featured', name: 'edit', size: 40, color: '#d1d1d1' }
+          horizontal.fields_radio\
+            value: 'hide', label: 'Hide',
+            image: { template: 'featured', url: 'https://cdn.pixabay.com/photo/2020/08/05/13/12/eco-5465432_1280.png', width: 80, height: 80 }
+          horizontal.fields_radio\
+            value: 'no', label: 'No',
+            image: { template: 'thumbnail', url: 'https://cdn.pixabay.com/photo/2020/08/05/13/12/eco-5465432_1280.png', width: 24, height: 24 }
+          horizontal.fields_radio value: '', label: 'Empty'
+        end
       end
     form.spacer height: 10
     form.label id: 'label6', text: 'Chosen'

data/app/views/json_ui/garage/panels/flow.json.jbuilder

@@ -5,11 +5,17 @@ render "#{@path_prefix}/nav_menu", json: json, page: page
 
 page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
   scroll.h1 text: 'Show/hide'
-  scroll.panels_flow id: 'flow1', width: 300, innerPadding: { top: 0 }, backgroundColor: '#b3bac2', childViews: ->(panel) do
-    panel.button text: '1'
-    panel.button text: '2'
-    panel.button text: '3'
-  end
+  scroll.panels_flow\
+    sm: { gap: { y: 4, x: 6 }, padding: { all: 16 } },
+    md: { gap: { y: 8, x: 8 }, padding: { x: 30, y: 30 } },
+    xs: { gap: { y: 2, x: 2 }, padding: { left: 10, bottom: 8 } },
+    lg: { gap: { all: 32 } },
+    id: 'flow1', width: 300,
+    innerPadding: { top: 0 }, backgroundColor: '#b3bac2', childViews: ->(panel) do
+      panel.button text: '1'
+      panel.button text: '2'
+      panel.button text: '3'
+    end
   scroll.button text: 'show', onClick: ->(action) do
     action.components_set targetId: 'flow1', data: { displayed: true }
   end
@@ -18,15 +24,17 @@ page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
   end
 
   scroll.h1 text: 'Basic'
-  scroll.panels_flow width: 300, innerPadding: { top: 0 }, backgroundColor: '#b3bac2', childViews: ->(panel) do
-    panel.button text: '1'
-    panel.button text: '2'
-    panel.button text: '3'
-    panel.button text: '4'
-    panel.button text: '5'
-    panel.button text: '6'
-    panel.button text: '7'
-  end
+  scroll.panels_flow\
+    md: { padding: { all: 8 } },
+    width: 300, innerPadding: { top: 0 }, backgroundColor: '#b3bac2', childViews: ->(panel) do
+      panel.button text: '1'
+      panel.button text: '2'
+      panel.button text: '3'
+      panel.button text: '4'
+      panel.button text: '5'
+      panel.button text: '6'
+      panel.button text: '7'
+    end
 
   scroll.label text: "\n"
   scroll.h1 text: 'Spacers'

data/app/views/json_ui/garage/tables/panel_content.json.jbuilder

@@ -3,34 +3,74 @@ json.title 'Tables'
 page = json_ui_page json
 render "#{@path_prefix}/nav_menu", json: json, page: page
 
-page.table styleClass: 'table--grid', sections: [
-  ->(section) do
-    section.header cellViews: ->(header) do
-      header.label text: 'Vertical'
-      header.label text: 'Horizontal'
-      header.label text: 'Unordered List'
-    end
-
-    items = [1, 2, 3]
-    section.rows objects: items, builder: ->(row, item, index) do
-      row.default colStyles: [{ width: 200, backgroundColor: '#eeeeee' }], cellViews: ->(cell) do
-        cell.panels_vertical childViews: ->(vertical) do
-          vertical.h3 text: "Title #{item}"
-          vertical.spacer height: 4
-          vertical.label text: "Subtitle #{item}"
+page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
+  scroll.panels_form childViews: ->(form) do
+    form.panels_table styleClass: 'table--grid', sections: [
+      ->(section) do
+        section.header cellViews: ->(header) do
+          header.panels_horizontal childViews: ->(horizontal) do
+            horizontal.fields_check name: 'check_all', checkValue: true, onChange: ->(action) do
+              action.runMultiple childActions: ->(multiple) do
+                check_ids = (0..2).map { |i| "item_#{i}" }
+                # action.logics_set targetIds: check_ids, conditionalData: {
+                #   value: { 'var': 'check_all' }
+                # }
+                check_ids.each_with_index do |check_id, index|
+                  record_id = "id_#{index}"
+                  multiple.logics_set targetId: check_id, conditionalData: {
+                    value: { "if": [ { 'var': 'check_all' }, record_id, nil ]}
+                  }
+                end
+              end
+            end
+          end
+          header.label text: 'Vertical'
+          header.label text: 'Horizontal'
+          header.label text: 'Unordered List'
         end
 
-        cell.panels_horizontal childViews: ->(vertical) do
-          vertical.label text: "Left #{item}"
-          vertical.spacer width: 10
-          vertical.label text: "Right #{item}"
-        end
+        items = [1, 2, 3]
+        section.rows objects: items, builder: ->(row, item, index) do
+          row.default colStyles: [{ width: 200, backgroundColor: '#eeeeee' }], cellViews: ->(cell) do
+            cell.panels_horizontal childViews: ->(horizontal) do
+              horizontal.fields_check \
+                id: "item_#{index}",
+                name: 'user[items][]',
+                checkValue: "id_#{index}", # In the real-world, this is going to be the ID of a DB record.
+                onChangeAndLoad: ->(action) do
+                  # TODO: Fix fields_check so it can support arrays
+                  action.logics_set targetId: 'submit_button', conditionalData: {
+                    text: {
+                      'printf': [
+                        'Submit {0} items',
+                        { 'countNonNull': [{ 'var': 'user[items][]' }] }
+                      ]
+                    }
+                  }
+                end
+            end
+
+            cell.panels_vertical childViews: ->(vertical) do
+              vertical.h3 text: "Title #{item}"
+              vertical.spacer height: 4
+              vertical.label text: "Subtitle #{item}"
+            end
 
-        cell.panels_ul childViews: ->(ul) do
-          ul.label text: "Item A#{item}"
-          ul.label text: "Item B#{item}"
+            cell.panels_horizontal childViews: ->(vertical) do
+              vertical.label text: "Left #{item}"
+              vertical.spacer width: 10
+              vertical.label text: "Right #{item}"
+            end
+
+            cell.panels_ul childViews: ->(ul) do
+              ul.label text: "Item A#{item}"
+              ul.label text: "Item B#{item}"
+            end
+          end
         end
       end
-    end
+    ]
+
+    form.fields_submit id: 'submit_button', text: 'Submit'
   end
-]
+end

data/app/views/json_ui/garage/test_page/form.json.jbuilder

@@ -23,9 +23,9 @@ page.body childViews: ->(body) do
             end
           end
           hori.spacer width: 4
-          hori.button text: 'logics/set', onClick: ->(action) do
-            action.logics_set targetId: 'date', conditionalData: { value: { "+": [{ "var": ['user[date]'] }, 60 * 60 * 24 * 3] } }
-          end
+          # hori.button text: 'logics/set', onClick: ->(action) do
+          #   action.logics_set targetId: 'date', conditionalData: { value: { "+": [{ "var": ['user[date]'] }, 60 * 60 * 24 * 3] } }
+          # end
           hori.spacer width: 4
           hori.button text: 'components/replace', onClick: ->(action) do
             action.runMultiple childActions: ->(saction) do
@@ -73,8 +73,8 @@ page.body childViews: ->(body) do
         validation = { required: { message: 'Required' } }
         options = ['option1', 'option2', 'option3', 'option4'].map { |option| { 'text'=> option.humanize, 'value' => option } }
 
-        form.fields_date width: 'matchParent', name: 'user[date]', id: 'date', value: Date.new(2024, 7, 24), validation: validation
-        form.hr width: 'matchParent'
+        # form.fields_date width: 'matchParent', name: 'user[date]', id: 'date', value: Date.new(2024, 7, 24), validation: validation
+        # form.hr width: 'matchParent'
         form.fields_select clearable: true, multiple: true, width: 'matchParent', name: 'user[select][]', id: 'select', options: options, value: ['option1', 'option2'], validation: validation
         form.hr width: 'matchParent'
         form.panels_flow innerPadding: { bottom: 0 }, width: 'matchParent', id: 'select1', childViews: ->(flow) do

data/lib/glib/json_crawler/router.rb

@@ -21,6 +21,8 @@ module Glib
       end
 
       def assert_target_ids_exist(args)
+        # This saves targetId so that later we can check to make sure that it indeed exists
+        # within the page.
         if (target_ids = args['targetIds'])
           target_ids.each do |target_id|
             @visitor.defer_action(nil, target_id)

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: glib-web
 version: !ruby/object:Gem::Version
-  version: 4.10.0
+  version: 4.10.2
 platform: ruby
 authors:
 - ''
@@ -388,7 +388,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.4.6
+rubyforge_project: 
+rubygems_version: 2.7.6
 signing_key: 
 specification_version: 4
 summary: ''