glib-web 0.6.6 → 0.6.7

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5f6803ad260efc33294f643a2a623e418a260b24b18729142aeb41f6a6d891c9
-  data.tar.gz: e3c581588cff960a60857cd63aa904dae41a81da4a86596b2bf17275353acca9
+  metadata.gz: a570033b2f2290d45f8678518c0f5cdfcbd5edc3ad58f640e0927c44ebd4e52e
+  data.tar.gz: 48c8031d6b01a819dbc7f2496a4e95861f45df9f29386bf7b96b19adb8dc1c2c
 SHA512:
-  metadata.gz: 1de3a468c5f82b9d4ee70afc5763e1ab9f31e4ff54cbb14ed891ff546b867db084a6c5d091cc4cb70d6f75fc24b0fe052c169beb6edc4e3c3e96beefe3208574
-  data.tar.gz: c7cd87a3e9399c9b03730eee4a16f679af1d55eada9b0a4468129a122306a5ef54d42e4c3a9ef39617a320d38cadc00e08ca60255443abaeae6b7944034172ce
+  metadata.gz: 8dee6863475ddb393169c8a22cdc09945c656c879e9780782bcd04efdf6a193bdc2153e9371a3fb3c24b67d4fd2bcb479d5fba31d171092b726e31e3dd82e784
+  data.tar.gz: b77f966accd930a4a932d17af6e4d35cec5507b31ac1ec7a7f7153ef075b355d8dea36f512d2fe40c913832c0c241e24e67a91ba65ea0eff2d851408f90be302

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

@@ -113,6 +113,20 @@ module Glib
           end
         end
 
+        def self.url(propName)
+          define_method(propName) do |value|
+            if (value = value&.to_s)
+              if !Rails.env.production?
+                if !UrlValidator.validate(value)
+                  raise "Invalid URL: #{value}"
+                end
+              end
+
+              json.set! propName, value
+            end
+          end
+        end
+
         def self.color(propName)
           define_method(propName) do |value|
             if (value = value&.to_s)

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

@@ -0,0 +1,7 @@
+class Glib::JsonUi::ActionBuilder
+  module Commands
+    class Copy < Action
+      string :text
+    end
+  end
+end

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

@@ -0,0 +1,7 @@
+class Glib::JsonUi::ViewBuilder
+  module Multimedia
+    class Video < View
+      url :url
+    end
+  end
+end

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

@@ -34,7 +34,7 @@ module Glib
         hash :valueIf
         hash :analytics
         hash :tooltip
-        hash :dataset
+        hash :tour
 
         # def initialize(json, page)
         #   super(json, page)

data/app/validators/url_validator.rb

@@ -1,5 +1,11 @@
 class UrlValidator < ActiveModel::EachValidator
   def validate_each(record, attribute, value)
+    if !self.class.validate(value)
+      record.errors.add(attribute, :invalid)
+    end
+  end
+
+  def self.validate(value)
     schemes = ['https', 'http']
 
     begin
@@ -8,13 +14,13 @@ class UrlValidator < ActiveModel::EachValidator
       scheme = uri && uri.scheme
 
       valid_scheme = host && scheme && schemes.include?(scheme)
-      valid_raw_url = scheme && value.match?(URI::regexp([scheme]))
+      valid_raw_url = scheme && value.match?(URI.regexp([scheme]))
 
-      unless valid_raw_url && valid_scheme
-        record.errors.add(attribute, :invalid)
-      end
+      return false unless valid_raw_url && valid_scheme
     rescue URI::InvalidURIError
-      record.errors.add(attribute, :invalid)
+      return false
     end
+
+    true
   end
 end

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

@@ -0,0 +1,9 @@
+section.header padding: glib_json_padding_list, childViews: ->(header) do
+  header.h3 text: 'Commands'
+end
+
+section.rows builder: ->(template) do
+  template.thumbnail title: 'commands/copy', onClick: ->(action) do
+    action.commands_copy text: 'Paste this somewhere else'
+  end
+end

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

@@ -20,5 +20,7 @@ page.list sections: [
     render "#{@path_prefix}/actions/timeouts", section: section
   end, ->(section) do
     render "#{@path_prefix}/actions/http", section: section
+  end, ->(section) do
+    render "#{@path_prefix}/actions/commands", section: section
   end
 ]

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

@@ -10,14 +10,14 @@ page = json_ui_page json
 render "#{@path_prefix}/nav_menu", json: json, page: page
 
 page.form options.merge(childViews: ->(form) do
-  rules = { fileType: 'image/*', maxFileSize: 5000 }
+  rules = { fileType: 'image', maxFileSize: 5000 }
   form.fields_file name: 'user[photo][]', width: 'matchParent', label: 'Landscape Photo', accepts: rules, directUploadUrl: rails_direct_uploads_url,
     value: 'eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBFQT09IiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--193dc0d939b9558fc4973fafbba91d989cbb04d4',
     fileUrl: 'https://imageserver-demo.herokuapp.com/image/itinerarybuilder-demo/o6CKzNt67PWnkPdUEnWMt7pr?h=100&w=100',
     fileTitle: '1 month ago',
     placeholderView: { type: 'image', width: 100, height: 75, url: 'https://www.atms.com.au/wp-content/uploads/2019/10/placeholder-1-1024x683.png?x93630' }
 
-  rules = { fileType: 'image/*', maxFileSize: 1, fileTypeErrorText: 'Invalid!', maxFileSizeErrorText: 'Too big!' }
+  rules = { fileType: 'image', maxFileSize: 1, 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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' }
 
@@ -28,6 +28,9 @@ page.form options.merge(childViews: ->(form) do
   rules = { fileType: 'pdf', maxFileSize: 5000 }
   form.fields_file name: 'user[pdf2][]', width: 'matchParent', label: 'PDF Document', accepts: rules, directUploadUrl: rails_direct_uploads_url
 
+  rules = { fileType: 'zip', maxFileSize: 5000 }
+  form.fields_file name: 'user[zip][]', width: 'matchParent', label: 'ZIP Document', accepts: rules, directUploadUrl: rails_direct_uploads_url
+
   # TODO
   # rules = { fileType: 'image/*', maxFileSize: 1, fileTypeErrorText: 'Invalid!', maxFileSizeErrorText: 'Too big!' }
   # form.fields_multiImage name: 'user[photos][]', width: 'matchParent', label: 'Avatar', accepts: rules, directUploadUrl: rails_direct_uploads_url,

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

@@ -4,14 +4,63 @@ page = json_ui_page json
 
 render "#{@path_prefix}/nav_menu", json: json, page: page
 
-page.form url: json_ui_garage_url(path: 'forms/submission_flow_post'), method: 'post', padding: { top: 12, left: 20, right: 20, bottom: 12 }, childViews: ->(form) do
-  form.fields_radioGroup name: 'user[flow]', childViews: ->(group) do
-    group.h3 text: 'Flow'
-    group.spacer height: 6
-    group.fields_radio value: 'open', label: 'open - useful for form create'
-    group.fields_radio value: 'close_with_reload', label: 'closeWithReload - useful for form update'
-    group.fields_radio value: 'close_alert', label: 'close+alert - useful for non-model form (e.g. contact us)'
-    group.fields_radio value: 'alert_close', label: 'alert+close - useful for non-model form (e.g. contact us)'
-  end
-  form.button text: 'Submit', onClick: ->(action) { action.forms_submit }
+# page.form url: json_ui_garage_url(path: 'forms/submission_flow_post'), method: 'post', padding: { top: 12, left: 20, right: 20, bottom: 12 }, childViews: ->(form) do
+#   form.fields_radioGroup name: 'user[flow]', childViews: ->(group) do
+#     group.h3 text: 'Flow'
+#     group.spacer height: 6
+#     group.fields_radio value: 'open', label: 'open - useful for form create'
+#     group.fields_radio value: 'close_with_reload', label: 'closeWithReload - useful for form update'
+#     group.fields_radio value: 'close_alert', label: 'close+alert - useful for non-model form (e.g. contact us)'
+#     group.fields_radio value: 'alert_close', label: 'alert+close - useful for non-model form (e.g. contact us)'
+#     group.fields_radio value: 'on_submit', label: 'onSubmit - useful for performing an action prior to submitting'
+#   end
+
+#   form.spacer height: 14
+#   form.button text: 'Submit', onClick: ->(action) { action.forms_submit }
+# end
+
+
+page.scroll childViews: ->(scroll) do
+  scroll.panels_form \
+    url: json_ui_garage_url(path: 'forms/submission_flow_post'),
+    method: 'post',
+    padding: { top: 12, left: 20, right: 20, bottom: 12 },
+    childViews: ->(form) do
+      form.h3 text: 'Submission flow best practices'
+      form.spacer height: 6
+
+      form.fields_radioGroup name: 'user[flow]', childViews: ->(group) do
+        group.fields_radio value: 'open', label: 'open - useful for form create'
+        group.fields_radio value: 'close_with_reload', label: 'closeWithReload - useful for form update'
+        group.fields_radio value: 'close_alert', label: 'close+alert - useful for non-model form (e.g. contact us)'
+        group.fields_radio value: 'alert_close', label: 'alert+close - useful for non-model form (e.g. contact us)'
+      end
+
+      form.spacer height: 14
+      form.button text: 'Submit', onClick: ->(action) { action.forms_submit }
+    end
+
+  scroll.panels_form \
+    url: json_ui_garage_url(path: 'forms/generic_post'),
+    method: 'post',
+    padding: { top: 12, left: 20, right: 20, bottom: 12 },
+    childViews: ->(form) do
+      form.h3 text: 'Perform custom actions on submit'
+
+      form.fields_text width: 'matchParent', styleClass: 'outlined', name: 'user[text]', value: 'Hello'
+
+      form.spacer height: 14
+      # form.button text: 'Submit', onClick: ->(action) { action.forms_submit }
+
+      form.fields_submit text: 'Submit'
+    end,
+    onSubmit: ->(action) do
+      # action.forms_submit
+
+      action.dialogs_alert \
+        message: 'The form will submit after the dialog is closed',
+        onClose: ->(subaction) do
+          subaction.forms_submit
+        end
+    end
 end

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

@@ -9,15 +9,15 @@ page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
 
   scroll.button text: 'Button', onClick: ->(action) do
     action.dialogs_alert message: 'Perform action'
-  end
+  end, tour: { index: 0, key: 'quiz1', title: 'Tutorial Step 1', message: 'This is step 1 of the tutorial' }
   scroll.spacer height: 20
 
   scroll.button text: 'Buton with build-in classes', styleClasses: ['rounded', 'outlined', 'tile', 'depressed'], onClick: ->(action) do
     action.dialogs_alert message: 'Perform action'
-  end
+  end, tour: { index: 1, key: 'quiz1', title: 'Tutorial Step 2', message: 'This is step 2 of the tutorial' }
   scroll.spacer height: 20
 
-  scroll.button icon: 'info', text: 'Button with Icon and Tooltip', tooltip: { text: 'Tooltip text'}, onClick: ->(action) do
+  scroll.button icon: 'info', text: 'Button with Icon and Tooltip', tooltip: { text: 'Tooltip text' }, onClick: ->(action) do
     action.dialogs_alert message: 'Perform action'
   end
   scroll.spacer height: 20

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

@@ -10,35 +10,11 @@ json_ui_page json do |page|
       end
 
       section.rows builder: ->(template) do
-        ['texts', 'controls', 'images', 'charts', 'banners', 'maps', 'misc', 'icons', 'progress'].each do |component|
+        ['texts', 'controls', 'images', 'multimedia', 'charts', 'banners', 'maps', 'misc', 'icons', 'progress'].each do |component|
           template.thumbnail title: component.humanize, onClick: ->(action) do
             action.windows_open url: json_ui_garage_url(path: "views/#{component}")
           end
         end
-        # template.thumbnail title: 'Texts', onClick: ->(action) do
-        #   action.windows_open url: json_ui_garage_url(path: 'views/texts')
-        # end
-        # template.thumbnail title: 'Controls', onClick: ->(action) do
-        #   action.windows_open url: json_ui_garage_url(path: 'views/controls')
-        # end
-        # template.thumbnail title: 'Images', onClick: ->(action) do
-        #   action.windows_open url: json_ui_garage_url(path: 'views/images')
-        # end
-        # template.thumbnail title: 'Charts', onClick: ->(action) do
-        #   action.windows_open url: json_ui_garage_url(path: 'views/charts')
-        # end
-        # template.thumbnail title: 'Banners', onClick: ->(action) do
-        #   action.windows_open url: json_ui_garage_url(path: 'views/banners')
-        # end
-        # template.thumbnail title: 'Maps', onClick: ->(action) do
-        #   action.windows_open url: json_ui_garage_url(path: 'views/maps')
-        # end
-        # template.thumbnail title: 'Misc', onClick: ->(action) do
-        #   action.windows_open url: json_ui_garage_url(path: 'views/misc')
-        # end
-        # template.thumbnail title: 'Icons', onClick: ->(action) do
-        #   action.windows_open url: json_ui_garage_url(path: 'views/icons')
-        # end
       end
     end,
     ->(section) do

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

@@ -0,0 +1,26 @@
+json.title 'Views'
+
+page = json_ui_page json
+render "#{@path_prefix}/nav_menu", json: json, page: page
+
+page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
+  scroll.h2 text: 'Youtube (long URL)'
+  scroll.spacer height: 6
+  scroll.multimedia_video width: 560, height: 315, url: 'https://www.youtube.com/watch?v=947op8yKJRY'
+
+  scroll.spacer height: 24
+  scroll.h2 text: 'Youtube (shorten URL)'
+  scroll.spacer height: 6
+  scroll.multimedia_video width: 560, height: 315, url: 'https://youtu.be/ATnpEOo3GJA'
+
+  scroll.spacer height: 24
+  scroll.h2 text: 'Youtube (specific width)'
+  scroll.label text: 'If height is not specified, it will be auto-calculated using 16:9 ratio.'
+  scroll.spacer height: 6
+  scroll.multimedia_video width: 640, url: 'https://youtu.be/ATnpEOo3GJA'
+
+  scroll.spacer height: 24
+  scroll.h2 text: 'Youtube (full width)'
+  scroll.spacer height: 6
+  scroll.multimedia_video width: 'matchParent', url: 'https://youtu.be/ATnpEOo3GJA'
+end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: glib-web
 version: !ruby/object:Gem::Version
-  version: 0.6.6
+  version: 0.6.7
 platform: ruby
 authors:
 - ''
@@ -91,6 +91,7 @@ files:
 - app/helpers/glib/forms_helper.rb
 - app/helpers/glib/json_ui/abstract_builder.rb
 - app/helpers/glib/json_ui/action_builder.rb
+- app/helpers/glib/json_ui/action_builder/commands.rb
 - app/helpers/glib/json_ui/action_builder/dialogs.rb
 - app/helpers/glib/json_ui/action_builder/http.rb
 - app/helpers/glib/json_ui/action_builder/iap.rb
@@ -112,6 +113,7 @@ files:
 - app/helpers/glib/json_ui/view_builder/charts.rb
 - app/helpers/glib/json_ui/view_builder/fields.rb
 - app/helpers/glib/json_ui/view_builder/iap.rb
+- app/helpers/glib/json_ui/view_builder/multimedia.rb
 - app/helpers/glib/json_ui/view_builder/panels.rb
 - app/helpers/glib/urls_helper.rb
 - app/models/concerns/glib/soft_deletable.rb
@@ -125,6 +127,7 @@ files:
 - app/validators/email_validator.rb
 - app/validators/url_validator.rb
 - app/views/json_ui/garage/_nav_menu.json.jbuilder
+- app/views/json_ui/garage/actions/_commands.json.jbuilder
 - app/views/json_ui/garage/actions/_dialogs.json.jbuilder
 - app/views/json_ui/garage/actions/_http.json.jbuilder
 - app/views/json_ui/garage/actions/_panels.json.jbuilder
@@ -231,6 +234,7 @@ files:
 - app/views/json_ui/garage/views/maps.json.jbuilder
 - app/views/json_ui/garage/views/markdowns.json.jbuilder
 - app/views/json_ui/garage/views/misc.json.jbuilder
+- app/views/json_ui/garage/views/multimedia.json.jbuilder
 - app/views/json_ui/garage/views/progress.json.jbuilder
 - app/views/json_ui/garage/views/texts.json.jbuilder
 - app/views/layouts/json_ui/renderer.html.erb