glib-web 0.0.13 → 0.0.14

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: fa54978babb0309d7e60e95a3ac0a8de38d6e7114986154e07ce37af78014f49
-  data.tar.gz: 9f74445f4674fbbe6985565db1e621ba4dd04bc9c029b8dbcff8276d7066cafa
+  metadata.gz: fc06c04993bc790fd9234381201fd24ce3ed1b8520aefee43633bed714b51ec5
+  data.tar.gz: 45a7e73f8a23d33da64bc9ab5936db68be9f1bd1b507205d54e97d1bf5abb1e1
 SHA512:
-  metadata.gz: 5b8022ad0f2c590e36832fdee3b985c2470421bce4d13047883cce252979bf5ff7d7000598e139d709d09eb1f1bdd9febf9c19a6b406699bb4955cb9bbd2366d
-  data.tar.gz: 1a760bc4370f659e4d819af3b966462301818f36ea85e88d5201a06a47132efa56f580fe39a81431ee7ffc9b49c8c6ab8befe592c243f93df3b89bea221232e8
+  metadata.gz: cf337b7c9aa21d9a4e6b4a4dd2f7380ff5b88cfa3666d5fdf5d402d70c9d72d75211ed4725f31f61a064b2cae4aa158a75b7dd799c8f189c683c12a42cff3fb1
+  data.tar.gz: 7929fd151cce9c6a68666be64307ea9f5fd7936280134be466b54a306248cde897a8643807f655eaf8ad8dce014d9ea2ed44e66cae5f4887bb594225bcbca918

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

@@ -2,93 +2,93 @@ module Glib
   module JsonUi
     # TODO: Remove (deprecated)
     module JsonUiHelper
-      class Builder
-        def initialize(json)
-          @json = json
-        end
+      # class Builder
+      #   def initialize(json)
+      #     @json = json
+      #   end
 
-        def optional(options, *props)
-          props.each do |prop|
-            @json.set! prop, options[prop]
-          end
-        end
-      end
+      #   def optional(options, *props)
+      #     props.each do |prop|
+      #       @json.set! prop, options[prop]
+      #     end
+      #   end
+      # end
 
-      def json_body_with_list(json, header = nil, footer = nil, options = {})
-        json.header header
-        json.content do
-          json.childViews [1] do
-            json.view 'panels/list-v1'
-            json.width 'matchParent'
-            json.nextPage options[:nextPage]
-            json.sections [1] do
-              yield
-            end
-          end
-        end
-        json.footer footer
-      end
+      # def json_body_with_list(json, header = nil, footer = nil, options = {})
+      #   json.header header
+      #   json.content do
+      #     json.childViews [1] do
+      #       json.view 'panels/list-v1'
+      #       json.width 'matchParent'
+      #       json.nextPage options[:nextPage]
+      #       json.sections [1] do
+      #         yield
+      #       end
+      #     end
+      #   end
+      #   json.footer footer
+      # end
 
-      def json_body_with_scroll(json, header = nil, footer = nil, options = {})
-        builder = Builder.new(json)
+      # def json_body_with_scroll(json, header = nil, footer = nil, options = {})
+      #   builder = Builder.new(json)
         
-        json.header header
-        json.content do
-          json.childViews [1] do
-            json.view 'panels/scroll-v1'
-            json.width 'matchParent'
+      #   json.header header
+      #   json.content do
+      #     json.childViews [1] do
+      #       json.view 'panels/scroll-v1'
+      #       json.width 'matchParent'
 
-            builder.optional(options, :padding, :backgroundColor)
+      #       builder.optional(options, :padding, :backgroundColor)
 
-            json.childViews do
-              yield
-            end
-          end
-        end
-        json.footer footer
-      end
+      #       json.childViews do
+      #         yield
+      #       end
+      #     end
+      #   end
+      #   json.footer footer
+      # end
 
-      def json_body_with_form(json, header = nil, footer = nil, options = {})
-        json.header header
-        json_body_with_scroll json do
-          method = options[:method].to_sym
+      # def json_body_with_form(json, header = nil, footer = nil, options = {})
+      #   json.header header
+      #   json_body_with_scroll json do
+      #     method = options[:method].to_sym
 
-          json.child! do
-            json.view 'panels/form-v1'
-            json.width 'matchParent'
-            json.(options, :url)
+      #     json.child! do
+      #       json.view 'panels/form-v1'
+      #       json.width 'matchParent'
+      #       json.(options, :url)
             
-            case method
-            when :patch, :put, :delete
-              json.method :post
-            else
-              json.method method
-            end
+      #       case method
+      #       when :patch, :put, :delete
+      #         json.method :post
+      #       else
+      #         json.method method
+      #       end
 
-            json.padding options[:padding]
-            json.local options[:local]
-            json.childViews do
-              json.child! do
-                json.view 'fields/hidden-v1'
-                json.name 'authenticity_token'
-                json.value form_authenticity_token
-              end
+      #       json.padding options[:padding]
+      #       json.local options[:local]
+      #       json.childViews do
+      #         json.child! do
+      #           json.view 'fields/hidden-v1'
+      #           json.name 'authenticity_token'
+      #           json.value form_authenticity_token
+      #         end
 
-              case method
-              when :patch, :put, :delete
-                json.child! do
-                  json.view 'fields/hidden-v1'
-                  json.name '_method'
-                  json.value method
-                end
-              end
+      #         case method
+      #         when :patch, :put, :delete
+      #           json.child! do
+      #             json.view 'fields/hidden-v1'
+      #             json.name '_method'
+      #             json.value method
+      #           end
+      #         end
 
-              yield
-            end
-          end
-        end
-        json.footer footer
-      end
+      #         yield
+      #       end
+      #     end
+      #   end
+      #   json.footer footer
+      # end
     end
   end
 end

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

@@ -18,8 +18,13 @@ module Glib
         class Thumbnail < AbstractTemplate
           string :title
           string :subtitle
+          string :subsubtitle
+          string :imageUrl
           action :onClick
         end
+
+        class Featured < Thumbnail
+        end
       end
 
       class Section < AbstractBuilder

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

@@ -62,5 +62,13 @@ class Glib::JsonUi::ViewBuilder
       string :label
       string :value
     end
+
+    class File < Text
+      string :accepts
+      string :s3_direct_upload_url
+      string :file_size_limit_alert_text
+      string :value
+      int :file_size_limit
+    end
   end
 end

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

@@ -50,6 +50,7 @@ module Glib
 
       class Image < View
         string :url
+        string :base64Data
         action :onClick
       end
 
@@ -57,6 +58,13 @@ module Glib
         string :text
       end
 
+      class Map < View
+        float :latitude
+        float :longitude
+        int :zoom
+        string :height
+      end
+
     end
   end
 end

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

@@ -7,47 +7,59 @@ options = {
   method: 'post',
   padding: { top: 12, left: 20, right: 20, bottom: 12 }
 }
-json_body_with_form json, nil, nil, options do
-  json.child! do
-    json.view 'fields/text-v1'
-    json.name 'user[name]'
-    json.width 'matchParent'
-    json.label 'Name'
-  end
-
-  json.child! do
-    json.view 'fields/email-v1'
-    json.name 'user[email]'
-    json.width 'matchParent'
-    json.label 'Email'
-  end
-
-  json.child! do
-    json.view 'fields/password-v1'
-    json.name 'user[password]'
-    json.width 'matchParent'
-    json.label 'Password'
-  end
-
-  json.child! do
-    json.view 'panels/split-v1'
-    json.width 'matchParent'
-
-    json.rightViews do
-      json.child! do
-        json.view 'button-v1'
-        json.text 'Submit'
-        json.onClick do
-          json.action 'forms/submit-v1'
-
-          # json.action 'forms/encode-v1'
-          # json.paramName 'formData'
-          # json.onEncoded do
-          #   json.action 'http/post-v1'
-          #   json.url json_ui_garage_url(path: 'forms/basic_post')
-          # end
-        end
-      end
+
+json_ui_page json do |page|
+  page.form options.merge(childViews: ->(form) do
+    form.fields_text name: 'user[name]', width: 'matchParent', label: 'Name'
+    form.fields_email name: 'user[email]', width: 'matchParent', label: 'Email'
+    form.fields_password name: 'user[password]', width: 'matchParent', label: 'Password'
+    form.panels_split width: 'matchParent', rightViews: ->(split) do
+      split.button text: 'Submit', onClick: ->(action) { action.forms_submit }
     end
-  end
+  end)
 end
+
+# json_body_with_form json, nil, nil, options do
+#   json.child! do
+#     json.view 'fields/text-v1'
+#     json.name 'user[name]'
+#     json.width 'matchParent'
+#     json.label 'Name'
+#   end
+
+#   json.child! do
+#     json.view 'fields/email-v1'
+#     json.name 'user[email]'
+#     json.width 'matchParent'
+#     json.label 'Email'
+#   end
+
+#   json.child! do
+#     json.view 'fields/password-v1'
+#     json.name 'user[password]'
+#     json.width 'matchParent'
+#     json.label 'Password'
+#   end
+
+#   json.child! do
+#     json.view 'panels/split-v1'
+#     json.width 'matchParent'
+
+#     json.rightViews do
+#       json.child! do
+#         json.view 'button-v1'
+#         json.text 'Submit'
+#         json.onClick do
+#           json.action 'forms/submit-v1'
+
+#           # json.action 'forms/encode-v1'
+#           # json.paramName 'formData'
+#           # json.onEncoded do
+#           #   json.action 'http/post-v1'
+#           #   json.url json_ui_garage_url(path: 'forms/basic_post')
+#           # end
+#         end
+#       end
+#     end
+#   end
+# end

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

@@ -7,32 +7,40 @@ options = {
   method: 'post',
   padding: { top: 12, left: 20, right: 20, bottom: 12 }
 }
-json_body_with_form json, nil, nil, options do
-  json.child! do
-    json.view 'fields/file-v1'
-    json.name 'user[photo]'
-    json.width 'matchParent'
-    json.label 'Photo'
-
-    json.value 'VALUE_OF_THE_PREVIOUS_IMAGE_WHICH_IS_USEFUL_WHEN_UPDATING_EXISTING_MODEL'
-
-    json.accepts "image/*"
-    # json.s3_bucket 'BUCKET_NAME'
-    # json.s3_path_prefix 'uploads/images'
-    json.s3_direct_upload_url rails_direct_uploads_path
-
-    # This is for security so we don't have to reveal key/secret in the json api
-    # json.s3_signature_url 'URL_TO_OUR_SERVER_TO_GET_GENERATED_SIGNATURE'
-
-    json.file_size_limit 5000  # 5 MB
-    json.file_size_limit_alert_text 'Too big!'
-  end
-
-  json.child! do
-    json.view 'button-v1'
-    json.text 'Submit'
-    json.onClick do
-      json.action 'forms/submit-v1'
-    end
-  end
+
+json_ui_page json do |page|
+  page.form options.merge(childViews: ->(form) do
+    form.fields_file name: 'user[photo]', width: 'matchParent', label: 'Photo', accepts: "image/*", s3_direct_upload_url: rails_direct_uploads_path, file_size_limit: 5000, file_size_limit_alert_text: 'Too big!', value: 'VALUE_OF_THE_PREVIOUS_IMAGE_WHICH_IS_USEFUL_WHEN_UPDATING_EXISTING_MODEL'
+    form.button text: 'Submit', onClick: ->(action) { action.forms_submit }
+  end)
 end
+
+# json_body_with_form json, nil, nil, options do
+#   json.child! do
+#     json.view 'fields/file-v1'
+#     json.name 'user[photo]'
+#     json.width 'matchParent'
+#     json.label 'Photo'
+
+#     json.value 'VALUE_OF_THE_PREVIOUS_IMAGE_WHICH_IS_USEFUL_WHEN_UPDATING_EXISTING_MODEL'
+
+#     json.accepts "image/*"
+#     # json.s3_bucket 'BUCKET_NAME'
+#     # json.s3_path_prefix 'uploads/images'
+#     json.s3_direct_upload_url rails_direct_uploads_path
+
+#     # This is for security so we don't have to reveal key/secret in the json api
+#     # json.s3_signature_url 'URL_TO_OUR_SERVER_TO_GET_GENERATED_SIGNATURE'
+
+#     json.file_size_limit 5000  # 5 MB
+#     json.file_size_limit_alert_text 'Too big!'
+#   end
+
+#   json.child! do
+#     json.view 'button-v1'
+#     json.text 'Submit'
+#     json.onClick do
+#       json.action 'forms/submit-v1'
+#     end
+#   end
+# end

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

@@ -2,47 +2,59 @@ json.title 'Forms'
 
 render "#{@path_prefix}/nav_menu", json: json
 
-footer = Jbuilder.new do |json|
-  json.padding(top: 12, left: 20, right: 80, bottom: 12)
-  json.backgroundColor '#b3bac2'
-  json.subviews do
-    json.child! do
-      json.view 'label-v1'
-      json.text 'Demonstrates the use Floating Action Button on a form with footer'
-    end
-  end
-end
+# footer = Jbuilder.new do |json|
+#   json.padding(top: 12, left: 20, right: 80, bottom: 12)
+#   json.backgroundColor '#b3bac2'
+#   json.subviews do
+#     json.child! do
+#       json.view 'label-v1'
+#       json.text 'Demonstrates the use Floating Action Button on a form with footer'
+#     end
+#   end
+# end
 
 options = {
   url: json_ui_garage_url(path: 'forms/generic_post'),
   method: 'post',
   padding: { top: 12, left: 20, right: 20, bottom: 12 }
 }
-json_body_with_form json, nil, footer, options do
-  30.times do |i|
-    json.child! do
-      json.view 'fields/text-v1'
-      json.name "user[field#{i}]"
-      json.width 'matchParent'
-      json.label "Field#{i}"
-    end
-  end
-
-  json.child! do
-    json.view 'button-v1'
-    json.text 'Submit'
-    json.onClick do
-      json.action 'forms/submit-v1'
-    end
-  end
 
-  json.child! do
-    json.view 'fab-v1'
-    json.icon do
-      json.materialName 'send'
+json_ui_page json do |page|
+  page.form options.merge(childViews: ->(form) do
+    form.label text: 'Demonstrates the use Floating Action Button on a form with footer'
+    30.times do |i|
+      form.fields_text name: "user[field#{i}]", width: 'matchParent', label: "Field#{i}"
     end
-    json.onClick do
-      json.action 'forms/submit-v1'
-    end
-  end
+    form.button text: 'Submit', onClick: ->(action) { action.forms_submit }
+    form.fab icon: 'send', onClick: ->(action) { action.forms_submit }
+  end)
 end
+
+# json_body_with_form json, nil, footer, options do
+#   30.times do |i|
+#     json.child! do
+#       json.view 'fields/text-v1'
+#       json.name "user[field#{i}]"
+#       json.width 'matchParent'
+#       json.label "Field#{i}"
+#     end
+#   end
+
+#   json.child! do
+#     json.view 'button-v1'
+#     json.text 'Submit'
+#     json.onClick do
+#       json.action 'forms/submit-v1'
+#     end
+#   end
+
+#   json.child! do
+#     json.view 'fab-v1'
+#     json.icon do
+#       json.materialName 'send'
+#     end
+#     json.onClick do
+#       json.action 'forms/submit-v1'
+#     end
+#   end
+# end

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

@@ -2,42 +2,62 @@ json.title 'Forms'
 
 render "#{@path_prefix}/nav_menu", json: json
 
-json_body_with_list json do
-  json.rows do
-    json.child! do
-      json.template 'thumbnail-v1'
-      json.title 'Basic'
-      json.onClick do
-        json.action 'windows/open-v1'
-        json.url json_ui_garage_url(path: 'forms/basic')
+json_ui_page json do |page|
+  page.list firstSection: ->(section) do
+    section.rows do |row|
+      row.thumbnail title: 'Basic', onClick: ->(action) do
+        action.windows_open url: json_ui_garage_url(path: 'forms/basic')
       end
-    end
-
-    json.child! do
-      json.template 'thumbnail-v1'
-      json.title 'Submit Indicator'
-      json.onClick do
-        json.action 'windows/open-v1'
-        json.url json_ui_garage_url(path: 'forms/submit_indicator')
+      row.thumbnail title: 'Submit Indicator', onClick: ->(action) do
+        action.windows_open url: json_ui_garage_url(path: 'forms/submit_indicator')
       end
-    end
-
-    json.child! do
-      json.template 'thumbnail-v1'
-      json.title 'Floating Submit'
-      json.onClick do
-        json.action 'windows/open-v1'
-        json.url json_ui_garage_url(path: 'forms/floating_submit')
+      row.thumbnail title: 'Floating Submit', onClick: ->(action) do
+        action.windows_open url: json_ui_garage_url(path: 'forms/floating_submit')
       end
-    end
-    
-    json.child! do
-      json.template 'thumbnail-v1'
-      json.title 'File Upload'
-      json.onClick do
-        json.action 'windows/open-v1'
-        json.url json_ui_garage_url(path: 'forms/file_upload')
+      row.thumbnail title: 'File Upload', onClick: ->(action) do
+        action.windows_open url: json_ui_garage_url(path: 'forms/file_upload')
       end
     end
+
   end
 end
+
+# json_body_with_list json do
+#   json.rows do
+#     json.child! do
+#       json.template 'thumbnail-v1'
+#       json.title 'Basic'
+#       json.onClick do
+#         json.action 'windows/open-v1'
+#         json.url json_ui_garage_url(path: 'forms/basic')
+#       end
+#     end
+
+#     json.child! do
+#       json.template 'thumbnail-v1'
+#       json.title 'Submit Indicator'
+#       json.onClick do
+#         json.action 'windows/open-v1'
+#         json.url json_ui_garage_url(path: 'forms/submit_indicator')
+#       end
+#     end
+
+#     json.child! do
+#       json.template 'thumbnail-v1'
+#       json.title 'Floating Submit'
+#       json.onClick do
+#         json.action 'windows/open-v1'
+#         json.url json_ui_garage_url(path: 'forms/floating_submit')
+#       end
+#     end
+
+#     json.child! do
+#       json.template 'thumbnail-v1'
+#       json.title 'File Upload'
+#       json.onClick do
+#         json.action 'windows/open-v1'
+#         json.url json_ui_garage_url(path: 'forms/file_upload')
+#       end
+#     end
+#   end
+# end

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

@@ -7,26 +7,36 @@ options = {
   method: 'post',
   padding: { top: 12, left: 20, right: 20, bottom: 12 }
 }
-json_body_with_form json, nil, nil, options do
-  json.child! do
-    json.view 'fields/text-v1'
-    json.name 'user[name]'
-    json.width 'matchParent'
-    json.label 'Name'
-  end
 
-  json.child! do
-    json.view 'panels/split-v1'
-    json.width 'matchParent'
-
-    json.content do
-      json.right do
-        json.view 'button-v1'
-        json.text 'Submit'
-        json.onClick do
-          json.action 'forms/submit-v1'
-        end
-      end
+json_ui_page json do |page|
+  page.form options.merge(childViews: ->(form) do
+    form.fields_text name: 'user[name]', width: 'matchParent', label: 'Name'
+    form.panels_split width: 'matchParent', rightViews: ->(split) do
+      split.button text: 'Submit', onClick: ->(action) { action.forms_submit }
     end
-  end
+  end)
 end
+
+# json_body_with_form json, nil, nil, options do
+#   json.child! do
+#     json.view 'fields/text-v1'
+#     json.name 'user[name]'
+#     json.width 'matchParent'
+#     json.label 'Name'
+#   end
+
+#   json.child! do
+#     json.view 'panels/split-v1'
+#     json.width 'matchParent'
+
+#     json.content do
+#       json.right do
+#         json.view 'button-v1'
+#         json.text 'Submit'
+#         json.onClick do
+#           json.action 'forms/submit-v1'
+#         end
+#       end
+#     end
+#   end
+# end

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

@@ -2,24 +2,38 @@ json.title 'Lists'
 
 render "#{@path_prefix}/nav_menu", json: json
 
-json_body_with_list json do
-  json.rows do
-    json.child! do
-      json.template 'thumbnail-v1'
-      json.title 'Templating'
-      json.onClick do
-        json.action 'windows/open-v1'
-        json.url json_ui_garage_url(path: 'lists/templating')
+json_ui_page json do |page|
+  page.list firstSection: ->(section) do
+    section.rows do |row|
+      row.thumbnail title: 'Templating', onClick: ->(action) do
+        action.windows_open url: json_ui_garage_url(path: 'lists/templating')
       end
-    end
-
-    json.child! do
-      json.template 'thumbnail-v1'
-      json.title 'Infinite Scroll'
-      json.onClick do
-        json.action 'windows/open-v1'
-        json.url json_ui_garage_url(path: 'lists/infinite_scroll')
+      row.thumbnail title: 'Infinite Scroll', onClick: ->(action) do
+        action.windows_open url: json_ui_garage_url(path: 'lists/infinite_scroll')
       end
     end
+
   end
 end
+
+# json_body_with_list json do
+#   json.rows do
+#     json.child! do
+#       json.template 'thumbnail-v1'
+#       json.title 'Templating'
+#       json.onClick do
+#         json.action 'windows/open-v1'
+#         json.url json_ui_garage_url(path: 'lists/templating')
+#       end
+#     end
+
+#     json.child! do
+#       json.template 'thumbnail-v1'
+#       json.title 'Infinite Scroll'
+#       json.onClick do
+#         json.action 'windows/open-v1'
+#         json.url json_ui_garage_url(path: 'lists/infinite_scroll')
+#       end
+#     end
+#   end
+# end

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

@@ -2,44 +2,61 @@ json.title 'Lists'
 
 render "#{@path_prefix}/nav_menu", json: json
 
-json_body_with_list json do
-  json.header do
-    json.subviews do
-      json.child! do
-        json.view 'label-v1'
-        json.text 'Section Header'
-      end
+json_ui_page json do |page|
+  page.list firstSection: ->(section) do
+    section.header(padding: { top: 12, left: 16, right: 16, bottom: 12 }) do |header|
+      header.label text: 'Section Header'
     end
-  end
 
-  json.rows do
-    json.child! do
-      json.template 'thumbnail-v1'
-      json.title 'Click me'
-      json.onClick do
-        json.action 'dialogs/alert-v1'
-        json.message 'Perform action'
+    section.rows do |row|
+      row.thumbnail title: 'Click me', onClick: ->(action) do
+        action.dialogs_alert message: 'Perform action'
       end
+      row.thumbnail title: 'Item with subtitle', subtitle: 'Item subtitle'
+      row.thumbnail title: 'Item with subtitle', subtitle: 'Item subtitle', imageUrl: @sample_image_url
+      row.featured title: 'Item with subtitle', subtitle: 'Item subtitle', imageUrl: @sample_image_url
     end
+  end
+end
 
-    json.child! do
-      json.template 'thumbnail-v1'
-      json.title 'Item with subtitle'
-      json.subtitle 'Item subtitle'
-    end
+# json_body_with_list json do
+#   json.header do
+#     json.subviews do
+#       json.child! do
+#         json.view 'label-v1'
+#         json.text 'Section Header'
+#       end
+#     end
+#   end
 
-    json.child! do
-      json.template 'thumbnail-v1'
-      json.title 'Item with thumbnail image'
-      json.subtitle 'Item subtitle'
-      json.imageUrl @sample_image_url
-    end
+#   json.rows do
+#     json.child! do
+#       json.template 'thumbnail-v1'
+#       json.title 'Click me'
+#       json.onClick do
+#         json.action 'dialogs/alert-v1'
+#         json.message 'Perform action'
+#       end
+#     end
 
-    json.child! do
-      json.template 'featured-v1'
-      json.title 'Featured with featured image'
-      json.subtitle 'Item subtitle'
-      json.imageUrl @sample_image_url
-    end
-  end
-end
+#     json.child! do
+#       json.template 'thumbnail-v1'
+#       json.title 'Item with subtitle'
+#       json.subtitle 'Item subtitle'
+#     end
+
+#     json.child! do
+#       json.template 'thumbnail-v1'
+#       json.title 'Item with thumbnail image'
+#       json.subtitle 'Item subtitle'
+#       json.imageUrl @sample_image_url
+#     end
+
+#     json.child! do
+#       json.template 'featured-v1'
+#       json.title 'Featured with featured image'
+#       json.subtitle 'Item subtitle'
+#       json.imageUrl @sample_image_url
+#     end
+#   end
+# end

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

@@ -2,20 +2,28 @@ json.title 'Views'
 
 render "#{@path_prefix}/nav_menu", json: json
 
-json_body_with_scroll json do
-  json.child! do
-    json.view 'label-v1'
-    json.text "\n"
-  end
-  json.child! do
-    json.view 'h1-v1'
-    json.text 'Map'
-  end
-  json.child! do
-    json.view 'map-v1'
-    json.latitude 13.4837
-    json.longitude 144.7917
-    json.zoom 11
-    json.height '250px'
+json_ui_page json do |page|
+  page.scroll childViews: ->(scroll) do
+    scroll.label text: "\n"
+    scroll.h1 text: 'Map'
+    scroll.map latitude: 13.4837, longitude: 144.7917, zoom: 11, height: '250px'
   end
 end
+
+# json_body_with_scroll json do
+#   json.child! do
+#     json.view 'label-v1'
+#     json.text "\n"
+#   end
+#   json.child! do
+#     json.view 'h1-v1'
+#     json.text 'Map'
+#   end
+#   json.child! do
+#     json.view 'map-v1'
+#     json.latitude 13.4837
+#     json.longitude 144.7917
+#     json.zoom 11
+#     json.height '250px'
+#   end
+# end

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

@@ -5,96 +5,127 @@ render "#{@path_prefix}/nav_menu", json: json
 image_url1 = 'http://ichef.bbci.co.uk/news/976/cpsprodpb/18106/production/_97266589_gettyimages-474547165.jpg'
 image_url2 = 'https://s.abcnews.com/images/International/Guam03-gty-jrl-170809_16x9_992.jpg'
 
-json_body_with_scroll json do
-  json.child! do
-    json.view 'label-v1'
-    json.text "\n"
-  end
-  json.child! do
-    json.view 'h1-v1'
-    json.text 'Carousel with labels'
-  end
-  json.child! do
-    json.view 'panels/carousel-v1'
-    json.childViews do
-      json.child! do
-        json.view 'label-v1'
-        json.text "Item 1"
-      end
+json_ui_page json do |page|
+  page.scroll childViews: ->(scroll) do
+    scroll.label text: "\n"
+    scroll.h1 text: 'Carousel with labels'
+    scroll.panels_carousel width: 'matchParent', childViews: ->(carousel) do
+      carousel.label text: 'Item 1'
+      carousel.label text: 'Item 2'
+    end
 
-      json.child! do
-        json.view 'label-v1'
-        json.text "Item 2"
-      end
+    scroll.label text: "\n"
+    scroll.h1 text: 'Carousel with images'
+    scroll.panels_carousel width: 'matchParent', childViews: ->(carousel) do
+      carousel.image url: image_url1, width: 'matchParent'
+      carousel.image url: image_url2, width: 'matchParent'
     end
-  end
 
-  json.child! do
-    json.view 'label-v1'
-    json.text "\n"
-  end
-  json.child! do
-    json.view 'h1-v1'
-    json.text 'Carousel with images'
-  end
-  json.child! do
-    json.view 'panels/carousel-v1'
-    json.childViews do
-      json.child! do
-        json.view 'image-v1'
-        json.url image_url1
+    scroll.label text: "\n"
+    scroll.h1 text: 'Carousel with complex layout'
+    scroll.panels_carousel width: 'matchParent', childViews: ->(carousel) do
+      carousel.panels_vertical childViews: ->(panel) do
+        panel.h3 text: 'Item 1'
+        panel.image url: image_url1, width: 'matchParent'
       end
-
-      json.child! do
-        json.view 'image-v1'
-        json.url image_url2
+      carousel.panels_vertical childViews: ->(panel) do
+        panel.h3 text: 'Item 2'
+        panel.image url: image_url2, width: 'matchParent'
       end
     end
   end
+end
 
-  json.child! do
-    json.view 'label-v1'
-    json.text "\n"
-  end
-  json.child! do
-    json.view 'h1-v1'
-    json.text 'Carousel with complex layout'
-  end
-  json.child! do
-    json.view 'panels/carousel-v1'
-    json.width 'matchParent'
-    json.childViews do
-      json.child! do
-        json.view 'panels/vertical-v1'
-        json.childViews do
-          json.child! do
-            json.view 'h3-v1'
-            json.text "Item 1"
-          end
-          json.child! do
-            json.view 'image-v1'
-            json.width 'matchParent'
-            json.url image_url1
-          end
-        end
-      end
+# json_body_with_scroll json do
+#   json.child! do
+#     json.view 'label-v1'
+#     json.text "\n"
+#   end
+#   json.child! do
+#     json.view 'h1-v1'
+#     json.text 'Carousel with labels'
+#   end
+#   json.child! do
+#     json.view 'panels/carousel-v1'
+#     json.childViews do
+#       json.child! do
+#         json.view 'label-v1'
+#         json.text "Item 1"
+#       end
 
-      json.child! do
-        json.view 'panels/vertical-v1'
-        json.childViews do
-          json.child! do
-            json.view 'h3-v1'
-            json.text "Item 2"
-          end
-          json.child! do
-            json.view 'image-v1'
-            json.width 'matchParent'
-            json.url image_url2
-          end
-        end
-      end
+#       json.child! do
+#         json.view 'label-v1'
+#         json.text "Item 2"
+#       end
+#     end
+#   end
 
-    end
-  end
+#   json.child! do
+#     json.view 'label-v1'
+#     json.text "\n"
+#   end
+#   json.child! do
+#     json.view 'h1-v1'
+#     json.text 'Carousel with images'
+#   end
+#   json.child! do
+#     json.view 'panels/carousel-v1'
+#     json.childViews do
+#       json.child! do
+#         json.view 'image-v1'
+#         json.url image_url1
+#       end
 
-end
+#       json.child! do
+#         json.view 'image-v1'
+#         json.url image_url2
+#       end
+#     end
+#   end
+
+#   json.child! do
+#     json.view 'label-v1'
+#     json.text "\n"
+#   end
+#   json.child! do
+#     json.view 'h1-v1'
+#     json.text 'Carousel with complex layout'
+#   end
+#   json.child! do
+#     json.view 'panels/carousel-v1'
+#     json.width 'matchParent'
+#     json.childViews do
+#       json.child! do
+#         json.view 'panels/vertical-v1'
+#         json.childViews do
+#           json.child! do
+#             json.view 'h3-v1'
+#             json.text "Item 1"
+#           end
+#           json.child! do
+#             json.view 'image-v1'
+#             json.width 'matchParent'
+#             json.url image_url1
+#           end
+#         end
+#       end
+
+#       json.child! do
+#         json.view 'panels/vertical-v1'
+#         json.childViews do
+#           json.child! do
+#             json.view 'h3-v1'
+#             json.text "Item 2"
+#           end
+#           json.child! do
+#             json.view 'image-v1'
+#             json.width 'matchParent'
+#             json.url image_url2
+#           end
+#         end
+#       end
+
+#     end
+#   end
+
+# end

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

@@ -2,55 +2,76 @@ json.title 'Views'
 
 render "#{@path_prefix}/nav_menu", json: json
 
-json_body_with_scroll json do
-  json.child! do
-    json.view 'label-v1'
-    json.text "\n"
-  end
-  json.child! do
-    json.view 'h1-v1'
-    json.text 'Image with URL'
-  end
-  json.child! do
-    json.view 'image-v1'
-    json.width 100
-    json.url @sample_image_url
-  end
-
-  json.child! do
-    json.view 'label-v1'
-    json.text "\n"
-  end
-  json.child! do
-    json.view 'h1-v1'
-    json.text 'Image with base64 data'
-  end
-  json.child! do
-    json.view 'image-v1'
-    json.height 100
-    json.base64Data 'data:image/gif;base64,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'
-  end
+json_ui_page json do |page|
+  page.scroll childViews: ->(scroll) do
+    scroll.label text: "\n"
+    scroll.h1 text: 'Image with URL'
+    scroll.image width: 100, url: @sample_image_url
+    scroll.label text: "\n"
+    scroll.h1 text: 'Image with base64 data'
+    scroll.image height: 100, base64Data: 'data:image/gif;base64,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'
+    scroll.label text: "\n"
+    scroll.h1 text: 'QR Code as base64 image'
 
-  json.child! do
-    json.view 'label-v1'
-    json.text "\n"
-  end
-  json.child! do
-    json.view 'h1-v1'
-    json.text 'QR Code as base64 image'
-  end
-
-  if defined? RQRCode
-    json.child! do
-      json.view 'image-v1'
+    if defined? RQRCode
       qr_content = { version: 1, message: 'This is a test' }
       qr = RQRCode::QRCode.new(qr_content.to_json)
-      json.base64Data qr.as_png(size: 300).to_data_url
-    end
-  else
-    json.child! do
-      json.view 'label-v1'
-      json.text 'Include "rqrcode" gem to enable this'
+      scroll.image base64Data: qr.as_png(size: 300).to_data_url
+    else
+      scroll.label text: 'Include "rqrcode" gem to enable this'
     end
   end
 end
+
+# json_body_with_scroll json do
+#   json.child! do
+#     json.view 'label-v1'
+#     json.text "\n"
+#   end
+#   json.child! do
+#     json.view 'h1-v1'
+#     json.text 'Image with URL'
+#   end
+#   json.child! do
+#     json.view 'image-v1'
+#     json.width 100
+#     json.url @sample_image_url
+#   end
+
+#   json.child! do
+#     json.view 'label-v1'
+#     json.text "\n"
+#   end
+#   json.child! do
+#     json.view 'h1-v1'
+#     json.text 'Image with base64 data'
+#   end
+#   json.child! do
+#     json.view 'image-v1'
+#     json.height 100
+#     json.base64Data 'data:image/gif;base64,R0lGODlhPQBEAPeoAJosM//AwO/AwHVYZ/z595kzAP/s7P+goOXMv8+fhw/v739/f+8PD98fH/8mJl+fn/9ZWb8/PzWlwv///6wWGbImAPgTEMImIN9gUFCEm/gDALULDN8PAD6atYdCTX9gUNKlj8wZAKUsAOzZz+UMAOsJAP/Z2ccMDA8PD/95eX5NWvsJCOVNQPtfX/8zM8+QePLl38MGBr8JCP+zs9myn/8GBqwpAP/GxgwJCPny78lzYLgjAJ8vAP9fX/+MjMUcAN8zM/9wcM8ZGcATEL+QePdZWf/29uc/P9cmJu9MTDImIN+/r7+/vz8/P8VNQGNugV8AAF9fX8swMNgTAFlDOICAgPNSUnNWSMQ5MBAQEJE3QPIGAM9AQMqGcG9vb6MhJsEdGM8vLx8fH98AANIWAMuQeL8fABkTEPPQ0OM5OSYdGFl5jo+Pj/+pqcsTE78wMFNGQLYmID4dGPvd3UBAQJmTkP+8vH9QUK+vr8ZWSHpzcJMmILdwcLOGcHRQUHxwcK9PT9DQ0O/v70w5MLypoG8wKOuwsP/g4P/Q0IcwKEswKMl8aJ9fX2xjdOtGRs/Pz+Dg4GImIP8gIH0sKEAwKKmTiKZ8aB/f39Wsl+LFt8dgUE9PT5x5aHBwcP+AgP+WltdgYMyZfyywz78AAAAAAAD///8AAP9mZv///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAKgALAAAAAA9AEQAAAj/AFEJHEiwoMGDCBMqXMiwocAbBww4nEhxoYkUpzJGrMixogkfGUNqlNixJEIDB0SqHGmyJSojM1bKZOmyop0gM3Oe2liTISKMOoPy7GnwY9CjIYcSRYm0aVKSLmE6nfq05QycVLPuhDrxBlCtYJUqNAq2bNWEBj6ZXRuyxZyDRtqwnXvkhACDV+euTeJm1Ki7A73qNWtFiF+/gA95Gly2CJLDhwEHMOUAAuOpLYDEgBxZ4GRTlC1fDnpkM+fOqD6DDj1aZpITp0dtGCDhr+fVuCu3zlg49ijaokTZTo27uG7Gjn2P+hI8+PDPERoUB318bWbfAJ5sUNFcuGRTYUqV/3ogfXp1rWlMc6awJjiAAd2fm4ogXjz56aypOoIde4OE5u/F9x199dlXnnGiHZWEYbGpsAEA3QXYnHwEFliKAgswgJ8LPeiUXGwedCAKABACCN+EA1pYIIYaFlcDhytd51sGAJbo3onOpajiihlO92KHGaUXGwWjUBChjSPiWJuOO/LYIm4v1tXfE6J4gCSJEZ7YgRYUNrkji9P55sF/ogxw5ZkSqIDaZBV6aSGYq/lGZplndkckZ98xoICbTcIJGQAZcNmdmUc210hs35nCyJ58fgmIKX5RQGOZowxaZwYA+JaoKQwswGijBV4C6SiTUmpphMspJx9unX4KaimjDv9aaXOEBteBqmuuxgEHoLX6Kqx+yXqqBANsgCtit4FWQAEkrNbpq7HSOmtwag5w57GrmlJBASEU18ADjUYb3ADTinIttsgSB1oJFfA63bduimuqKB1keqwUhoCSK374wbujvOSu4QG6UvxBRydcpKsav++Ca6G8A6Pr1x2kVMyHwsVxUALDq/krnrhPSOzXG1lUTIoffqGR7Goi2MAxbv6O2kEG56I7CSlRsEFKFVyovDJoIRTg7sugNRDGqCJzJgcKE0ywc0ELm6KBCCJo8DIPFeCWNGcyqNFE06ToAfV0HBRgxsvLThHn1oddQMrXj5DyAQgjEHSAJMWZwS3HPxT/QMbabI/iBCliMLEJKX2EEkomBAUCxRi42VDADxyTYDVogV+wSChqmKxEKCDAYFDFj4OmwbY7bDGdBhtrnTQYOigeChUmc1K3QTnAUfEgGFgAWt88hKA6aCRIXhxnQ1yg3BCayK44EWdkUQcBByEQChFXfCB776aQsG0BIlQgQgE8qO26X1h8cEUep8ngRBnOy74E9QgRgEAC8SvOfQkh7FDBDmS43PmGoIiKUUEGkMEC/PJHgxw0xH74yx/3XnaYRJgMB8obxQW6kL9QYEJ0FIFgByfIL7/IQAlvQwEpnAC7DtLNJCKUoO/w45c44GwCXiAFB/OXAATQryUxdN4LfFiwgjCNYg+kYMIEFkCKDs6PKAIJouyGWMS1FSKJOMRB/BoIxYJIUXFUxNwoIkEKPAgCBZSQHQ1A2EWDfDEUVLyADj5AChSIQW6gu10bE/JG2VnCZGfo4R4d0sdQoBAHhPjhIB94v/wRoRKQWGRHgrhGSQJxCS+0pCZbEhAAOw=='
+#   end
+
+#   json.child! do
+#     json.view 'label-v1'
+#     json.text "\n"
+#   end
+#   json.child! do
+#     json.view 'h1-v1'
+#     json.text 'QR Code as base64 image'
+#   end
+
+#   if defined? RQRCode
+#     json.child! do
+#       json.view 'image-v1'
+#       qr_content = { version: 1, message: 'This is a test' }
+#       qr = RQRCode::QRCode.new(qr_content.to_json)
+#       json.base64Data qr.as_png(size: 300).to_data_url
+#     end
+#   else
+#     json.child! do
+#       json.view 'label-v1'
+#       json.text 'Include "rqrcode" gem to enable this'
+#     end
+#   end
+# end

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

@@ -2,33 +2,50 @@ json.title 'Views'
 
 render "#{@path_prefix}/nav_menu", json: json
 
-json_body_with_list json do
-  json.rows do
-    json.child! do
-      json.template 'thumbnail-v1'
-      json.title 'Basic'
-      json.onClick do
-        json.action 'windows/open-v1'
-        json.url json_ui_garage_url(path: 'views/basic')
+json_ui_page json do |page|
+  page.list firstSection: ->(section) do
+    section.rows do |row|
+      row.thumbnail title: 'Basic', onClick: ->(action) do
+        action.windows_open url: json_ui_garage_url(path: 'views/basic')
       end
-    end
-
-    json.child! do
-      json.template 'thumbnail-v1'
-      json.title 'Images'
-      json.onClick do
-        json.action 'windows/open-v1'
-        json.url json_ui_garage_url(path: 'views/images')
+      row.thumbnail title: 'Images', onClick: ->(action) do
+        action.windows_open url: json_ui_garage_url(path: 'views/images')
       end
-    end
-
-    json.child! do
-      json.template 'thumbnail-v1'
-      json.title 'Carousels'
-      json.onClick do
-        json.action 'windows/open-v1'
-        json.url json_ui_garage_url(path: 'views/carousels')
+      row.thumbnail title: 'Carousel', onClick: ->(action) do
+        action.windows_open url: json_ui_garage_url(path: 'views/carousels')
       end
     end
+
   end
 end
+
+# json_body_with_list json do
+#   json.rows do
+#     json.child! do
+#       json.template 'thumbnail-v1'
+#       json.title 'Basic'
+#       json.onClick do
+#         json.action 'windows/open-v1'
+#         json.url json_ui_garage_url(path: 'views/basic')
+#       end
+#     end
+
+#     json.child! do
+#       json.template 'thumbnail-v1'
+#       json.title 'Images'
+#       json.onClick do
+#         json.action 'windows/open-v1'
+#         json.url json_ui_garage_url(path: 'views/images')
+#       end
+#     end
+
+#     json.child! do
+#       json.template 'thumbnail-v1'
+#       json.title 'Carousels'
+#       json.onClick do
+#         json.action 'windows/open-v1'
+#         json.url json_ui_garage_url(path: 'views/carousels')
+#       end
+#     end
+#   end
+# end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: glib-web
 version: !ruby/object:Gem::Version
-  version: 0.0.13
+  version: 0.0.14
 platform: ruby
 authors:
 - ''