glib-web 3.0.0.pre.beta1 → 3.0.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 36c7ef52875565dc8845937e540ad4bb859c2c1d8c2413a6eb2610e02011cc42
-  data.tar.gz: f7bc7fedc31848d543ba0e79404d293a611cdbbcb20573a37645d28e81fba19a
+  metadata.gz: 1893d7f9752d6b6fa88f44c3cf3992aafff393b4b10638ca989b82859c47c716
+  data.tar.gz: 7c19f36849c4ff6d58f1e53657c7f639b1a6d69fb1d4810c1a3a4d71ad652f8b
 SHA512:
-  metadata.gz: 47910b5b21257d0d2902ff536ff2c1cb13e8154ee1bc2a919f66b1dc1ade9a7aedd967a1abc1d9deef2f7286ac0720db6bda4adb33d44ea0cea2af3de94738a2
-  data.tar.gz: 0fd5393e2bec762bd4b05d46f825ba168a31454ccc7d6100d286f706cebb2a40ef6eba9662651dbb389074375e973b9b15ae58d74d481a72a7b61e39c83df8c1
+  metadata.gz: 45a1be444dc544ac2957134c50cc8035ebd1a114b2eb724fbb3f2bc9d8cb845beca2f370670a6c74f46dcdd9892e4ac1b033c73ba20704a8ee2bd243733c4b94
+  data.tar.gz: 0f31ccbe16452d786d71c0c314753c03cd7d92476b0a392b9231d3b07110a01db1c2788a1937ddf073489656a00f2fb73c92b81e6e3f6b108c97e9c4281c08d1

data/app/controllers/concerns/glib/json/libs.rb

@@ -36,6 +36,24 @@ module Glib::Json::Libs
     json_ui_app_device_os == 'web'
   end
 
+  def json_ui_etag
+    template = "#{controller_name}/#{action_name}"
+
+    # 1) It's necessary to pass in the template explicitly because of the switching between JSON
+    # and HTML rendering.
+    #
+    # 2) When a model is not provided, two pages the use the same template (e.g. `projects#show`)
+    # will produce the exact same ETAG, even though their content might be different. Presumably
+    # this is because the ETAG is calculated based on the static template as opposed to the
+    # generated output.
+    #
+    # However, this is not a problem because the browser will still treat these pages as
+    # separate because they have different URLs (e.g. `projects/1` vs `projects/2`), meaning
+    # that it will not accidentally use the cache from a different URL even though the ETAG
+    # is exactly the same.
+    fresh_when nil, template: template
+  end
+
   def json_ui_render(template, args = {})
     JSON.parse(render_to_string(template, locals: args))
   end

data/app/helpers/glib/json_ui/action_builder/dialogs.rb

@@ -1,6 +1,7 @@
 class Glib::JsonUi::ActionBuilder
   module Dialogs
     class Alert < Action
+      string :title
       string :message
       action :onLoad
       action :onClose
@@ -44,6 +45,7 @@ class Glib::JsonUi::ActionBuilder
       bool :showClose
       string :fullscreen
       length :width
+      length :height
     end
 
     class Reload < Action

data/app/helpers/glib/json_ui/action_builder/popovers.rb

@@ -0,0 +1,14 @@
+class Glib::JsonUi::ActionBuilder
+  module Popovers
+    class Open < Action
+      string :key
+      views :childViews
+      string :location
+      int :offset
+    end
+
+    class Close < Action
+      string :key
+    end
+  end
+end

data/app/helpers/glib/json_ui/action_builder/snackbars.rb

@@ -8,6 +8,7 @@ class Glib::JsonUi::ActionBuilder
 
       string :verticalPosition
       string :horizontalPosition
+      string :location
       singleton_array :styleClass, :styleClasses
     end
 

data/app/helpers/glib/json_ui/action_builder/tours.rb

@@ -9,5 +9,8 @@ class Glib::JsonUi::ActionBuilder
       array :steps
       int :startFrom
     end
+
+    class Stop < Action
+    end
   end
 end

data/app/helpers/glib/json_ui/list_builders.rb

@@ -37,7 +37,7 @@ module Glib
           action :onLongPress
           icon :icon
           bool :avatar
-          action :onReorder
+          # action :onReorder
           string :paramNameForFormData
           string :paramNameForNewAbsoluteIndex
           string :paramNameForNewSectionIndex
@@ -46,9 +46,7 @@ module Glib
           string :id # Deprecated
           string :paramNameForNewIndex # Deprecated
 
-          # # NOTE: Experimental. Still deciding whether this needs to be a full blown panel or
-          # # an array of badges (with relevant properties, e.g. text, color, etc)
-          # views :accessoryViews
+          panels_builder :accessory, :header, :body, :footer
         end
 
         class Featured < Standard

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

@@ -76,6 +76,7 @@ class Glib::JsonUi::ViewBuilder
     class Text < AbstractField
       int :maxLength
       icon :leftIcon
+      icon :rightIcon
       string :leftText
       string :rightText
       action :onTypeStart
@@ -114,6 +115,7 @@ class Glib::JsonUi::ViewBuilder
     class Submit < AbstractField
       string :text
       color :color
+      icon :icon
     end
 
     class CheckGroup < AbstractField
@@ -301,7 +303,8 @@ class Glib::JsonUi::ViewBuilder
     end
 
     class Otp < AbstractField
-      int     :lengths
+      int     :length
+      string :type
     end
 
     class Rating < AbstractField

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

@@ -140,6 +140,7 @@ class Glib::JsonUi::ViewBuilder
       action :onScrollToBottom
 
       int :responsiveCols
+      hash :dragSupport
 
       def firstSection(block)
         json.sections [1] do
@@ -242,6 +243,7 @@ class Glib::JsonUi::ViewBuilder
       string :distribution
       string :align
       action :onClick
+      hash :dragSupport
     end
 
     class Flow < View

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

@@ -44,6 +44,9 @@ module Glib
         hash :tooltip
         array :extensions
 
+        action :onMouseEnter
+        action :onMouseLeave
+
 
         # def initialize(json, page)
         #   super(json, page)

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

@@ -27,7 +27,7 @@ section.rows builder: ->(template) do
   end
 
   template.thumbnail title: 'snackbars with styling', onClick: ->(action) do
-    action.snackbars_alert message: 'This is a styled snackbar', verticalPosition: 'top', styleClass: 'success'
+    action.snackbars_alert message: 'This is a styled snackbar', location: 'top', styleClass: 'success'
   end
 
 end

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

@@ -14,21 +14,24 @@ page.form \
   form.spacer height: 6
   form.fields_otp \
     name: 'user[otp_summary1]',
-    lengths: 7
+    length: 7,
+    type: 'text'
 
   form.spacer height: 20
-  form.h2 text: 'OTP Custom Length'
+  form.h2 text: 'OTP Custom Length and input type number'
   form.spacer height: 6
   form.fields_otp \
     name: 'user[otp_summary2]',
-    lengths: 3
+    length: 3,
+    type: 'number'
 
   form.spacer height: 20
   form.h2 text: 'OTP with Long Field'
   form.spacer height: 6
   form.fields_otp \
     name: 'user[otp_summary3]',
-    lengths: 20
+    length: 20,
+    type: 'text'
 
   form.spacer height: 20
   form.fields_submit text: 'Submit'

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

@@ -15,7 +15,13 @@ page.form url: json_ui_garage_url(path: 'forms/generic_post'), method: 'post', p
     'melbourne' => 'Melbourne',
     'sydney' => 'Sydney',
   }
-  form.fields_select name: 'user[city]', width: 'matchParent', label: 'City', options: languages.map { |k, v| { value: k, text: v } }, value: 'canberra'
+  form.fields_select \
+    name: 'user[city]',
+    width: 'matchParent',
+    label: 'City1',
+    placeholder: 'This is a placeholder',
+    options: languages.map { |k, v| { value: k, text: v } },
+    value: 'canberra'
   form.fields_select name: 'user[cities][]', width: 'matchParent', label: 'Cities', options: languages.map { |k, v| { value: k, text: v } }, value: ['melbourne', 'sydney'], multiple: true
 
   form.spacer height: 20

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

@@ -17,8 +17,11 @@ page.scroll childViews: ->(scroll) do
         checkValue: '16+',
         uncheckValue: '0-16',
         label: 'I am over 16 (has default value)',
+        paramNameForFormData: 'message',
         onChange: ->(action) do
-          action.forms_submit
+          action.dialogs_alert title: 'Submit data?', onClose: ->(subaction) do
+            action.forms_submit
+          end
         end
 
       form.fields_check \
@@ -43,7 +46,7 @@ page.scroll childViews: ->(scroll) do
         onChange: ->(action) do
           action.snackbars_select message: 'Submit data?', buttons: ->(menu) do
             menu.button text: 'Yes, submit', onClick: ->(subaction) do
-              action.forms_submit
+              subaction.forms_submit
             end
           end
         end
@@ -57,6 +60,7 @@ page.scroll childViews: ->(scroll) do
           group.fields_radio value: 'senior', label: 'Senior'
           group.fields_radio value: 'junior', label: 'Junior'
         end,
+        paramNameForFormData: 'message',
         onChange: ->(action) do
           action.sheets_select message: 'Submit data?', buttons: ->(menu) do
             menu.button text: 'Yes, submit', onClick: ->(subaction) do
@@ -78,6 +82,20 @@ page.scroll childViews: ->(scroll) do
           end
         end
 
+
+      form.spacer height: 20
+      form.h2 text: 'Textarea'
+      form.fields_textarea \
+        name: 'user[bio]',
+        width: 'matchParent',
+        onChange: ->(action) do
+          action.sheets_select message: 'Submit data?', buttons: ->(menu) do
+            menu.button text: 'Yes, submit', onClick: ->(subaction) do
+              action.forms_submit
+            end
+          end
+        end
+
       form.spacer height: 20
       form.h2 text: 'Text (Asynchronous)'
       form.fields_text \
@@ -86,6 +104,23 @@ page.scroll childViews: ->(scroll) do
         onChange: ->(action) do
           action.http_post url: json_ui_garage_url(path: 'forms/generic_post')
         end
+
+      form.spacer height: 20
+      rules = { fileType: 'image', maxFileSize: 5000, fileTypeErrorText: 'Invalid!', maxFileSizeErrorText: 'Too big!' }
+      form.fields_file \
+        name: 'user[photo][]',
+        width: 'matchParent',
+        label: 'Avatar',
+        accepts: rules,
+        directUploadUrl: rails_direct_uploads_url,
+        placeholderView: { type: 'avatar', width: 100, height: 100, url: 'data:image/jpeg;base64,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' },
+        onChange: ->(action) do
+          action.sheets_select message: 'Submit data?', buttons: ->(menu) do
+            menu.button text: 'Yes, submit', onClick: ->(subaction) do
+              action.forms_submit
+            end
+          end
+        end
     end
 
 end

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

@@ -11,9 +11,7 @@ section.rows builder: ->(row) do
   array.each do |i|
     index = page_index * batch_count + i
     if local_assigns[:reorder]
-      row.thumbnail title: "Item #{index}", onReorder: ->(action) do
-        action.dialogs_notification title: "Item #{index}"
-      end, paramNameForFormData: 'message', paramNameForNewIndex: 'new_index'
+      row.thumbnail title: "Item #{index}"
     else
       row.thumbnail title: "Item #{index}", subtitle: "Sub Item #{index}", subsubtitle: "Sub Sub Item #{index}"
     end

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

@@ -30,5 +30,11 @@ else
       end
       render 'json_ui/garage/lists/autoload_section', page: page, page_index: page_index, reorder: true
     end
-  ]
+  ], dragSupport: {
+    onDrop: {
+      action: 'dialogs/alert'
+    },
+    paramNameForFormData: 'message',
+    paramNameForNewIndex: 'new_index'
+  }
 end

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

@@ -11,6 +11,22 @@ json_ui_page json do |page|
     section.rows builder: ->(template) do
       template.thumbnail title: 'Click me', onClick: ->(action) do
         action.windows_open url: json_ui_garage_url(path: 'home/blank')
+      end,
+      accessory: ->(accessory) do
+        accessory.header \
+          width: 'matchParent',
+          backgroundColor: '#b3bac2',
+          padding: { top: 10, bottom: 10, left: 10, right: 10 },
+          childViews: ->(bottom) do
+            bottom.label text: 'Custom row header'
+          end
+        accessory.footer \
+          width: 'matchParent',
+          backgroundColor: '#b3bac2',
+          padding: { top: 10, bottom: 10, left: 10, right: 10 },
+          childViews: ->(bottom) do
+            bottom.label text: 'Custom row footer'
+          end
       end
       template.thumbnail title: 'Item with icon and subtitle', subtitle: 'Item subtitle', icon: 'facebook'
       template.thumbnail title: 'Item with chips', chips: ->(menu) do

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

@@ -2,7 +2,7 @@ text = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.'
 value = ''
 i.times { value += text }
 
-hover.panels_responsive padding: {top: 24, right: 24, bottom: 24, left: 24 }, childViews: ->(responsive) do
+hover.panels_responsive padding: { top: 24, right: 24, bottom: 24, left: 24 }, childViews: ->(responsive) do
   responsive.avatar url: glib_json_image_avatar_url
 
   responsive.spacer height: 8
@@ -10,9 +10,9 @@ hover.panels_responsive padding: {top: 24, right: 24, bottom: 24, left: 24 }, ch
   responsive.spacer height: 8
 
   responsive.h2 text: 'Hover View'
-  responsive.p text:value
+  responsive.p text: value
   responsive.spacer height: 24
-  responsive.button text: 'Button', onClick:->(action) do
+  responsive.button text: 'Button', onClick: ->(action) do
     action.dialogs_alert message: 'Clicked'
   end
-end
+end

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

@@ -1,7 +1,6 @@
 progress = params[:progress]&.to_i&.between?(0, 5) ? params[:progress].to_i : 0
 
 tview.panels_responsive \
-  width: 400,
   childViews: ->(res) do
     res.panels_column sm: { cols: 11 }, childViews: ->(subcolumn) do
       subcolumn.panels_column sm: { cols: 2, padding: { right: 10 } }, childViews: ->(inner_column) do

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

@@ -127,6 +127,19 @@ json_ui_page json do |page|
       action.windows_open url: json_ui_garage_url(path: 'home/blank')
     end
 
+    scroll.spacer height: 20
+    scroll.h1 text: 'Drag-and-drop support'
+    scroll.panels_horizontal backgroundColor: '#b3bac2', width: 300, distribution: 'spaceEqually', childViews: ->(panel) do
+      panel.button id: 'button1', text: '1'
+      panel.button id: 'button2', text: '2'
+      panel.button id: 'button3', text: '3'
+    end, dragSupport: {
+      onDrop: {
+        action: 'dialogs/alert',
+      },
+      paramNameForFormData: 'message'
+    }
+
     scroll.label text: "\n"
   end
 end

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

@@ -30,9 +30,9 @@ json_ui_page json do |page|
         template.thumbnail title: 'Unordered List', subtitle: 'Bullet points similar to HTML\'s <ul> tag', onClick: ->(action) do
           action.windows_open url: json_ui_garage_url(path: 'panels/ul')
         end
-        template.thumbnail title: 'Timeline', subtitle: 'Timeline component with responsive panel as the childviews', onClick: ->(action) do
-          action.windows_open url: json_ui_garage_url(path: 'panels/timeline')
-        end
+        # template.thumbnail title: 'Timeline', subtitle: 'Timeline component with responsive panel as the childviews', onClick: ->(action) do
+        #   action.windows_open url: json_ui_garage_url(path: 'panels/timeline')
+        # end
       end
     end, ->(section) do
       section.header padding: glib_json_padding_list, childViews: ->(header) do
@@ -87,9 +87,9 @@ json_ui_page json do |page|
         template.thumbnail title: 'Column', subtitle: 'Adds control over layout inside a responsive panel', onClick: ->(action) do
           action.windows_open url: json_ui_garage_url(path: 'panels/responsive')
         end
-        template.thumbnail title: 'Hover', subtitle: 'Popover triggered by hover', onClick: ->(action) do
-          action.windows_open url: json_ui_garage_url(path: 'panels/hover')
-        end
+        # template.thumbnail title: 'Hover', subtitle: 'Popover triggered by hover', onClick: ->(action) do
+        #   action.windows_open url: json_ui_garage_url(path: 'panels/hover')
+        # end
       end
     end, ->(section) do
       section.header padding: glib_json_padding_list, childViews: ->(header) do

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

@@ -72,7 +72,7 @@ json_ui_page json do |page|
         left.button text: '1'
       end
       content.center childViews: ->(center) do
-        center.label text: 'a very very very very very very very very very very very very very very very very very very very very very very very very very very very very long text'
+        center.label text: 'a very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very very long text'
       end
       content.right childViews: ->(right) do
         right.button text: '2'

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

@@ -26,7 +26,7 @@ page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
   end
 
   scroll.spacer height: 14
-  scroll.h2 text: 'Breadcrumbs'
+  scroll.h2 text: 'Breadcrumbs (experimental)'
   scroll.spacer height: 6
   scroll.panels_ul \
     width: 'matchParent',
@@ -37,8 +37,11 @@ page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
       ul.button text: 'Level 1', styleClass: 'link', onClick: ->(action) do
         action.windows_open url: json_ui_garage_url(path: 'home/blank')
       end
-      ul.button text: 'Level 2', styleClass: 'link', onClick: ->(action) do
-        action.windows_open url: json_ui_garage_url(path: 'home/blank')
+
+      ul.button icon: 'keyboard_arrow_down', text: 'Level 2', styleClass: 'link', childButtons: ->(menu) do
+        menu.button text: 'Dropdown item 1'
+        menu.button text: 'Dropdown item 2'
+        menu.button text: 'Dropdown item 3'
       end
       ul.label text: 'Level 3'
     end

data/app/views/json_ui/garage/views/controls.json.jbuilder

@@ -27,23 +27,58 @@ page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
     end
 
   scroll.spacer height: 10
-  scroll.button text: 'Button with dropdown', childButtons: ->(menu) do
-    menu.button text: 'Dropdown item 1'
-    menu.button text: 'Dropdown item 2'
-    menu.button text: 'Dropdown item 3'
+  scroll.button text: 'Button with dropdown', onClick: ->(action) do
+    action.popovers_open \
+      key: 'menu',
+      location: 'bottom',
+      childViews: ->(view) do
+        view.panels_responsive styleClass: 'popover-menu', width: 200, childViews: ->(res) do
+          res.label text: 'Item 1', styleClass: 'popover-menu-item', onClick: ->(saction) do
+            saction.popovers_close key: 'menu'
+          end
+          res.label text: 'Item 2', styleClass: 'popover-menu-item', onClick: ->(saction) do
+            saction.popovers_close key: 'menu'
+          end
+          res.label text: 'Item 3', styleClass: 'popover-menu-item', onClick: ->(saction) do
+            saction.popovers_close key: 'menu'
+          end
+        end
+      end
   end
 
   scroll.spacer height: 10
-  scroll.button text: 'Button with tooltip and dropdown', tooltip: { text: 'Tooltip text' }, childButtons: ->(menu) do
-    menu.button text: 'Dropdown item 1'
-    menu.button text: 'Dropdown item 2'
-    menu.button text: 'Dropdown item 3'
-  end
+  scroll.button \
+    text: 'Button with tooltip and dropdown',
+    onMouseEnter: ->(action) {
+      action.popovers_open \
+        key: 'tooltip',
+        location: 'top',
+        childViews: ->(view) { view.p styleClass: 'tooltip', text: 'Tooltip 1' }
+    },
+    onMouseLeave: ->(action) { action.popovers_close key: 'tooltip' },
+    onClick: ->(action) do
+      action.popovers_open \
+        key: 'menu',
+        location: 'right',
+        childViews: ->(view) do
+          view.panels_responsive styleClass: 'popover-menu', width: 200, childViews: ->(res) do
+            res.label text: 'Item 1', styleClass: 'popover-menu-item', onClick: ->(saction) do
+              saction.popovers_close key: 'menu'
+            end
+            res.label text: 'Item 2', styleClass: 'popover-menu-item', onClick: ->(saction) do
+              saction.popovers_close key: 'menu'
+            end
+            res.label text: 'Item 3', styleClass: 'popover-menu-item', onClick: ->(saction) do
+              saction.popovers_close key: 'menu'
+            end
+          end
+        end
+    end
 
   scroll.spacer height: 20
   scroll.button \
     icon: 'info',
-    styleClass: 'icon',
+    styleClasses: ['icon', 'plain'],
     tooltip: { text: 'Disabled Icon button with tooltip text and custom tooltip position', position: 'right' },
     disabled: true
   scroll.spacer height: 20

data/app/views/layouts/json_ui/renderer.html.erb

@@ -12,10 +12,11 @@
   <%#= javascript_include_tag 'vue_renderer_extras', defer: true %>
 
   <%= vite_stylesheet_tag 'vue_renderer' %>
-
+  <%# TODO: Remove this, for dev only %>
+<%# <script src="https://cdn.tailwindcss.com"></script> %>
   <link href="//fonts.googleapis.com/css?family=Material+Icons" rel="stylesheet" />
 <%# Without this, checkboxes and radio buttons will not display. %>
-<link href="//cdn.materialdesignicons.com/2.1.99/css/materialdesignicons.min.css" rel="stylesheet" />
+<%# <link href="//cdn.materialdesignicons.com/2.1.99/css/materialdesignicons.min.css" rel="stylesheet" /> %>
 <%= yield :head %>
 <% if @__glib_head_code %>
   <%= @__glib_head_code.html_safe %>

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: glib-web
 version: !ruby/object:Gem::Version
-  version: 3.0.0.pre.beta1
+  version: 3.0.0
 platform: ruby
 authors:
 - ''
@@ -98,6 +98,7 @@ files:
 - app/helpers/glib/json_ui/action_builder/http.rb
 - app/helpers/glib/json_ui/action_builder/iap.rb
 - app/helpers/glib/json_ui/action_builder/panels.rb
+- app/helpers/glib/json_ui/action_builder/popovers.rb
 - app/helpers/glib/json_ui/action_builder/sheets.rb
 - app/helpers/glib/json_ui/action_builder/snackbars.rb
 - app/helpers/glib/json_ui/action_builder/tours.rb
@@ -309,9 +310,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: '0'
 required_rubygems_version: !ruby/object:Gem::Requirement
   requirements:
-  - - ">"
+  - - ">="
     - !ruby/object:Gem::Version
-      version: 1.3.1
+      version: '0'
 requirements: []
 rubygems_version: 3.1.4
 signing_key: