glib-web 4.39.2 → 4.41.0

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

@@ -410,7 +410,11 @@ class Glib::JsonUi::ViewBuilder
       singleton_array :styleClass, :styleClasses
       array :events
       views :childViews
-      string :truncateLine
+      # Controls which end(s) of the timeline line to truncate.
+      # @see https://vuetifyjs.com/en/api/v-timeline/#props-truncate-line Vuetify Timeline truncateLine
+      enum :truncateLine, options: [:start, :end, :both]
+      enum :side, options: [:start, :end]
+      enum :direction, options: [:horizontal, :vertical]
     end
 
     # deprecated

data/app/views/json_ui/garage/actions/_dialogs.json.jbuilder

@@ -5,9 +5,14 @@ end
 
 section.rows builder: ->(template) do
   template.thumbnail title: 'dialogs/alert', onClick: ->(action) do
-    action.dialogs_alert message: 'This is an alert dialog', onClose: ->(subaction) do
-      subaction.snackbars_alert message: 'Closed'
-    end
+    action.dialogs_alert \
+      message: 'This is an alert dialog',
+      onOpen: ->(subaction) do
+        subaction.snackbars_alert message: 'Opened'
+      end,
+      onClose: ->(subaction) do
+        subaction.snackbars_alert message: 'Closed'
+      end
   end
 
   # markdown = '# h1 Heading' + "\n" +
@@ -60,60 +65,109 @@ section.rows builder: ->(template) do
           res.skeleton template: 'commentList'
         end
       end,
+      onOpen: ->(saction) do
+        saction.snackbars_alert message: 'Opened'
+      end,
       onClose: ->(saction) do
         saction.snackbars_alert message: 'dialog closed'
       end
   end
 
   template.thumbnail title: 'dialogs/open (fullscreen on mobile)', onClick: ->(action) do
-    action.dialogs_open fullscreen: 'mobile', url: json_ui_garage_url(path: 'forms/basic', mode: 'dialog')
+    action.dialogs_open \
+      fullscreen: 'mobile',
+      url: json_ui_garage_url(path: 'forms/basic', mode: 'dialog'),
+      onOpen: ->(saction) do
+        saction.snackbars_alert message: 'Opened'
+      end
   end
 
   template.thumbnail title: 'dialogs/reload (without url)', onClick: ->(action) do
     action.runMultiple childActions: ->(saction) do
-      saction.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_form')
-      saction.timeouts_set interval: 1000, onTimeout: ->(ssaction) do
-        ssaction.dialogs_reload onReload: ->(xaction) do
-          xaction.snackbars_alert message: 'reload!'
+      saction.dialogs_open \
+        url: json_ui_garage_url(path: 'forms/dialogs_form'),
+        onOpen: ->(ssaction) do
+          ssaction.snackbars_alert message: 'Opened'
         end
+      saction.timeouts_set interval: 1000, onTimeout: ->(ssaction) do
+        ssaction.dialogs_reload \
+          onReload: ->(xaction) do
+            xaction.snackbars_alert message: 'reload!'
+          end
       end
     end
   end
 
   if !Rails.env.test? # Prevent test failure
     template.thumbnail title: 'dialogs/open (page with error)', onClick: ->(action) do
-      action.dialogs_open url: json_ui_garage_url(path: 'forms/non_existent', mode: 'dialog')
+      action.dialogs_open \
+        url: json_ui_garage_url(path: 'forms/non_existent', mode: 'dialog'),
+        onOpen: ->(saction) do
+          saction.snackbars_alert message: 'Opened'
+        end
     end
   end
 
   template.thumbnail title: 'dialogs/open (page with dialogs/close)', onClick: ->(action) do
-    action.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_close', mode: 'dialog')
+    action.dialogs_open \
+      url: json_ui_garage_url(path: 'forms/dialogs_close', mode: 'dialog'),
+      onOpen: ->(saction) do
+        saction.snackbars_alert message: 'Opened'
+      end
   end
 
   template.thumbnail title: 'dialogs/open (page with dialogs/show with updateExisting)', onClick: ->(action) do
-    action.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_update', mode: 'dialog')
+    action.dialogs_open \
+      url: json_ui_garage_url(path: 'forms/dialogs_update', mode: 'dialog'),
+      onOpen: ->(saction) do
+        saction.snackbars_alert message: 'Opened'
+      end
   end
 
   template.thumbnail title: 'dialogs/open (page with dialogs/open with updateExisting)', onClick: ->(action) do
-    action.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_update2')
+    action.dialogs_open \
+      url: json_ui_garage_url(path: 'forms/dialogs_update2'),
+      onOpen: ->(saction) do
+        saction.snackbars_alert message: 'Opened'
+      end
   end
 
   template.thumbnail title: 'dialogs/open (update form inside dialog)', onClick: ->(action) do
-    action.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_form')
+    action.dialogs_open \
+      url: json_ui_garage_url(path: 'forms/dialogs_form'),
+      onOpen: ->(saction) do
+        saction.snackbars_alert message: 'Opened'
+      end
   end
 
   template.thumbnail title: 'dialogs/open (with filePaster)', onClick: ->(action) do
-    action.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_update3')
+    action.dialogs_open \
+      url: json_ui_garage_url(path: 'forms/dialogs_update3'),
+      onOpen: ->(saction) do
+        saction.snackbars_alert message: 'Opened'
+      end
   end
 
   template.thumbnail title: 'dialogs/open (update form inside dialog)', onClick: ->(action) do
-    action.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_form')
+    action.dialogs_open \
+      url: json_ui_garage_url(path: 'forms/dialogs_form'),
+      onOpen: ->(saction) do
+        saction.snackbars_alert message: 'Opened'
+      end
   end
 
   template.thumbnail title: 'dialogs/closeAll', onClick: ->(action) do
     action.runMultiple childActions: ->(saction) do
-      saction.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_form')
-      saction.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_form')
+      saction.dialogs_open \
+        url: json_ui_garage_url(path: 'forms/dialogs_form'),
+        onOpen: ->(ssaction) do
+          ssaction.snackbars_alert message: 'Opened'
+        end
+      saction.dialogs_open \
+        url: json_ui_garage_url(path: 'forms/dialogs_form'),
+        onOpen: ->(ssaction) do
+          ssaction.snackbars_alert message: 'Opened'
+        end
       saction.timeouts_set interval: 1000, onTimeout: ->(ssaction) do
         ssaction.dialogs_closeAll
       end

data/app/views/json_ui/garage/actions/_dialogs_show.json.jbuilder

@@ -32,9 +32,18 @@ if (update_existing = local_assigns[:update_existing])
   options[:updateExisting] = update_existing
 end
 
+dialog_mode_sym = (local_assigns[:dialog_mode] || :show).to_sym
+dialog_callback_message = dialog_mode_sym == :reload ? 'onReload' : 'onShow'
+
+if dialog_mode_sym == :reload
+  options[:onReload] = ->(action) { action.snackbars_alert message: dialog_callback_message }
+else
+  options[:onShow] = ->(action) { action.snackbars_alert message: dialog_callback_message }
+end
+
 include_form = local_assigns[:include_form]
 
-action.send "dialogs_#{dialog_mode}", **options,
+action.send "dialogs_#{dialog_mode_sym}", **options,
 onClose: ->(action) { action.snackbars_alert message: 'dialog closed' },
 content: ->(dialog) do
   dialog.body padding: glib_json_padding_body, childViews: ->(body) do

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

@@ -78,6 +78,19 @@ page.form \
     max: '2021-03-01',
     value: '2021-11'
 
+  form.spacer height: 8
+  form.fields_date \
+    name: 'user[formatted_date]',
+    width: 'matchParent',
+    label: 'Date (formatted)',
+    placeholder: 'Select Date'
+  form.fields_datetime \
+    name: 'user[formatted_date_time]',
+    width: 'matchParent',
+    label: 'Date Time (formatted)',
+    format: 'keyboardDateTime12h',
+    placeholder: 'Select Date'
+
   if record.present?
     form.fields_datetime \
       prop: :created_at,

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

@@ -113,4 +113,8 @@ page.form \
     form.spacer height: 8
     form.fields_submit text: 'Submit'
     form.fields_submit text: 'Submit (disable if form invalid)', disableIfFormInvalid: true
+    form.spacer height: 8
+    form.button styleClass: 'link', text: 'Cancel', onClick: ->(action) do
+      action.http_get url: json_ui_garage_url(path: 'forms/index')
+    end
   end

data/app/views/json_ui/garage/lists/edit_actions.json.jbuilder

@@ -7,73 +7,103 @@ end
 page = json_ui_page json
 render "#{@path_prefix}/nav_menu", json: json, page: page
 
-page.list firstSection: ->(section) do
-  section.rows builder: ->(template) do
-    template.thumbnail \
-      title: 'Click menu (web) or swipe left (Android/iOS)',
-      subtitle: "Page index: #{page_index}",
-      leftButtons: ->(menu) do
-        menu.button \
-          styleClasses: ['icon', 'text', 'x-small'],
-          icon: 'check_box',
-          onClick: ->(subaction) do
-            subaction.dialogs_alert message: 'Tick/untick'
+page.list(
+  firstSection: ->(section) do
+    section.rows(
+      builder: ->(template) do
+        template.thumbnail(
+          title: 'Click menu (web) or swipe left (Android/iOS)',
+          subtitle: "Page index: #{page_index}",
+          leftButtons: ->(menu) do
+            menu.button(
+              styleClasses: ['icon', 'text', 'x-small'],
+              icon: 'check_box',
+              onClick: ->(subaction) do
+                subaction.dialogs_alert message: 'Tick/untick'
+              end
+            )
+          end,
+          rightButtons: ->(menu) do
+            menu.button(
+              styleClasses: ['icon', 'text', 'x-small'],
+              icon: 'share',
+              tooltip: { text: 'Share', placement: 'left' },
+              onClick: ->(subaction) do
+                subaction.dialogs_alert message: 'Share'
+              end
+            )
+            # TODO: Use popoever
+            # childButtons: ->(submenu) do
+            #   submenu.button text: 'Dropdown item 1'
+            #   submenu.button text: 'Dropdown item 2'
+            #   submenu.button text: 'Dropdown item 3'
+            # end
+            menu.button(
+              styleClasses: ['icon', 'text', 'x-small'],
+              icon: 'open_in_new',
+              tooltip: { text: 'Open in new window' },
+              onClick: ->(subaction) do
+                subaction.dialogs_alert message: 'Open'
+              end
+            )
+          end,
+          # editButtons: ->(menu) do
+          #   menu.button(
+          #     text: "Edit (ID: #{page_index})",
+          #     onClick: ->(action) do
+          #       action.dialogs_alert message: 'Perform Edit action'
+          #     end
+          #   )
+          #   menu.button(
+          #     text: 'Delete',
+          #     onClick: ->(action) do
+          #       action.dialogs_alert message: 'Perform Delete action'
+          #     end
+          #   )
+          # end,
+          onClick: ->(action) do
+            action.windows_open url: json_ui_garage_url(path: 'lists/edit_actions', page: page_index + 1)
           end
-      end, rightButtons: ->(menu) do
-        menu.button \
-          styleClasses: ['icon', 'text', 'x-small'],
-          icon: 'share',
-          tooltip: { text: 'Share', placement: 'left' }
-
-          # TODO: Use popoever
-          # childButtons: ->(submenu) do
-          #   submenu.button text: 'Dropdown item 1'
-          #   submenu.button text: 'Dropdown item 2'
-          #   submenu.button text: 'Dropdown item 3'
-          # end
-
-        menu.button \
-          styleClasses: ['icon', 'text', 'x-small'],
-          icon: 'open_in_new',
-          tooltip: { text: 'Open in new window' },
-          onClick: ->(subaction) do
-            subaction.dialogs_alert message: 'Open'
+        )
+        template.thumbnail(
+          title: 'Long press to get an alert',
+          onLongPress: ->(action) do
+            action.dialogs_alert message: 'This is an alert'
           end
-
-      end, editButtons: ->(menu) do
-        menu.button text: "Edit (ID: #{page_index})", onClick: ->(action) do
-          action.dialogs_alert message: 'Perform Edit action'
-        end
-        menu.button text: 'Delete', onClick: ->(action) do
-          action.dialogs_alert message: 'Perform Delete action'
-        end
-      end, onClick: ->(action) do
-        action.windows_open url: json_ui_garage_url(path: 'lists/edit_actions', page: page_index + 1)
-      end
-
-    template.thumbnail title: 'Long press to get an alert', onLongPress: ->(action) do
-      action.dialogs_alert message: 'This is an alert'
-    end
-
-    template.thumbnail title: 'Long press to see menu', onLongPress: ->(action) do
-      action.sheets_select message: 'Context Menu', buttons: ->(menu) do
-        menu.button icon: 'edit', text: 'Edit', onClick: ->(subaction) do
-          subaction.dialogs_alert message: 'Perform action'
-        end
-        menu.button icon: 'delete', text: 'Delete', onClick: ->(subaction) do
-          subaction.dialogs_alert message: 'Perform action'
-        end
+        )
+        template.thumbnail(
+          title: 'Long press to see menu',
+          onLongPress: ->(action) do
+            action.sheets_select(
+              message: 'Context Menu',
+              buttons: ->(menu) do
+                menu.button(
+                  icon: 'edit',
+                  text: 'Edit',
+                  onClick: ->(subaction) do
+                    subaction.dialogs_alert message: 'Perform action'
+                  end
+                )
+                menu.button(
+                  icon: 'delete',
+                  text: 'Delete',
+                  onClick: ->(subaction) do
+                    subaction.dialogs_alert message: 'Perform action'
+                  end
+                )
+              end
+            )
+          end
+        )
+        # template.thumbnail title: 'Long press to see menu', contextButtons: ->(menu) do
+        #   menu.button text: 'Edit', onClick: ->(action) do
+        #     action.dialogs_alert message: 'Perform action'
+        #   end
+        #   menu.button text: 'Delete', onClick: ->(action) do
+        #     action.dialogs_alert message: 'Perform action'
+        #   end
+        # end
       end
-    end
-
-    # template.thumbnail title: 'Long press to see menu', contextButtons: ->(menu) do
-    #   menu.button text: 'Edit', onClick: ->(action) do
-    #     action.dialogs_alert message: 'Perform action'
-    #   end
-    #   menu.button text: 'Delete', onClick: ->(action) do
-    #     action.dialogs_alert message: 'Perform action'
-    #   end
-    # end
+    )
   end
-
-end
+)

data/app/views/json_ui/garage/lists/edit_mode.json.jbuilder

@@ -6,61 +6,78 @@ render "#{@path_prefix}/nav_menu", json: json, page: page
 
 tab_index = params[:tab].to_i
 
-page.header childViews: ->(header) do
-  # Allow navigating to another "edit mode" page to test reuse issues.
-  header.tabBar buttons: ->(menu) do
-    ['FIRST', 'SECOND'].each_with_index do |text, index|
-      menu.button \
-        text: text,
-        disabled: tab_index == index,
-        onClick: ->(action) do
-          action.windows_reload url: json_ui_garage_url(path: 'lists/edit_mode', tab: index)
+page.header(
+  childViews: ->(header) do
+    # Allow navigating to another "edit mode" page to test reuse issues.
+    header.tabBar(
+      buttons: ->(menu) do
+        ['FIRST', 'SECOND'].each_with_index do |text, index|
+          menu.button(
+            text: text,
+            disabled: tab_index == index,
+            onClick: ->(action) do
+              action.windows_reload url: json_ui_garage_url(path: 'lists/edit_mode', tab: index)
+            end
+          )
         end
-    end
+      end
+    )
   end
-end
+)
 
-page.form \
+page.form(
   width: 'matchParent',
   url: json_ui_garage_url(path: 'forms/generic_post'),
   method: 'post',
   padding: glib_json_padding_body,
   childViews: ->(form) do
-    form.panels_list fieldPrefix: 'user[items]', fieldTitleName: 'name', width: 'matchParent', sections: [
-      ->(section) do
-        section.header padding: glib_json_padding_list, childViews: ->(header) do
-
-          header.panels_horizontal childViews: ->(horizontal) do
-            horizontal.fields_check name: 'user[check_all]', label: 'All', checkValue: true
-
-            horizontal.spacer width: 20
-            # header.fields_text width: 'matchParent', styleClass: 'outlined', name: 'user[new_name]', label: 'Item name'
-            statuses = [:pending, :active]
-            horizontal.fields_select \
-              styleClass: 'outlined',
-              name: 'user[status]',
-              width: 'matchParent',
-              label: 'Status',
-              options: statuses.map { |status| { value: status, text: status.to_s.humanize } }
-
-            horizontal.spacer width: 20
-            horizontal.fields_submit text: 'Update'
-          end
+    form.panels_list(
+      fieldPrefix: 'user[items]',
+      fieldTitleName: 'name',
+      width: 'matchParent',
+      sections: [
+    ->(section) do
+      section.header(
+        padding: glib_json_padding_list,
+        childViews: ->(header) do
+          header.panels_horizontal(
+            childViews: ->(horizontal) do
+              horizontal.fields_check name: 'user[check_all]', label: 'All', checkValue: true
+              horizontal.spacer width: 20
+              # header.fields_text width: 'matchParent', styleClass: 'outlined', name: 'user[new_name]', label: 'Item name'
+              statuses = [:pending, :active]
+              horizontal.fields_select(
+                styleClass: 'outlined',
+                name: 'user[status]',
+                width: 'matchParent',
+                label: 'Status',
+                options: statuses.map { |status| { value: status, text: status.to_s.humanize } }
+              )
+              horizontal.spacer width: 20
+              horizontal.fields_submit text: 'Update'
+            end
+          )
         end
-        section.rows builder: ->(row) do
+      )
+      section.rows(
+        builder: ->(row) do
           batch_count = 20
           batch_count.times do |index|
             id = (batch_count * tab_index) + index
             row.editable title: "Item #{id}", recordId: "PK_#{id}"
           end
         end
-      end
-    ], fieldCheckValueIf: {
-      "==": [
-        {
-          "var": 'user[check_all]'
-        },
-        true
-      ]
+      )
+    end
+    ],
+      fieldCheckValueIf: {
+    "==": [
+    {
+    "var": 'user[check_all]'
+    },
+    true
+    ]
     }
+    )
   end
+)