glib-web 0.5.6 → 0.5.8

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 7d6201614facf8b8352af39682f255c003b37066
-  data.tar.gz: d69c8902174e35efb9c4fa0775bc32a800024f57
+  metadata.gz: d3229621ccc977c76e4adc70e1ab7271a76daf08
+  data.tar.gz: fa4e7c9f17a1d9c6b6cd770771730e13f583eb7e
 SHA512:
-  metadata.gz: 672842487e7541cf841b06892e463996e30a4a53a9489fdff1611267bf0fffbd4b30e847b55651a1f042b3328aed3eaa159d5104122f67a03f9913902b493357
-  data.tar.gz: 3b5c5b1a91b50e499ad68acac8d3b2059556471255f2c72817dc0dbe725735cb9fb3a589e4ee18f3ea26cc8ebed20412bfbf2fbd7622479b40a8760cb00ab459
+  metadata.gz: 2c1cf1ee7207ee7fa8276d6e94df95a6079bc011f429a0d9ca87a1305e4bb7201da04d13cda66de0c5872e7e1604374065dd307144e8e8d3110fcae424d5ae9f
+  data.tar.gz: '09fb824243fc37c0cd3ce3d6f0d0b6a85944ab02fa5b88383df8be9ff93394608fc1e0c394b9eadfa7fa51dbd854da3e8cf7ee4ed1da2895cfcdec06509a731e'

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

@@ -13,7 +13,7 @@ module Glib
           str.slice(0,1).capitalize + str.slice(1..-1)
         end
 
-        def add_singleton_element type, name, *args
+        def add_singleton_element(type, name, *args)
           name_components = name.to_s.split('_')
           json.set! type, "#{name_components.join('/')}" if type
           args = [yield] if block_given?
@@ -22,7 +22,7 @@ module Glib
           "#{self.class.name}::#{name_components.map{ |str| capitalize_first_letter_and_leave_others_alone(str) }.join('::')}".constantize.new(json, @page).props(*args)
         end
 
-        def add_element_to_array type, name, *args
+        def add_element_to_array(type, name, *args)
           json.child! do
             add_singleton_element type, name, *args
           end

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

@@ -99,9 +99,12 @@ module Glib
             #   options[:leftItems]&.call @menu_builder
             # end
             # json.logoUrl "http://localhost:3000/assets/logo_dark-02d9b6a91fdbf22515da7b921d31367b70696214415f6789d2f90232e4a287b7.svg"
-            json.rightItems do
-              options[:rightItems]&.call @menu_builder
-            end
+
+            # json.rightItems do
+            #   options[:rightItems]&.call @menu_builder
+            # end
+
+            @view_builder.add_singleton_view('appBar', options)
           end
         end
 

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

@@ -1,6 +1,9 @@
 module Glib
   module JsonUi
     module StylingHelper
+
+      ### Padding
+
       def glib_json_padding_body
         { top: 12, left: 20, right: 20, bottom: 12 }
       end
@@ -9,6 +12,12 @@ module Glib
         { top: 12, bottom: 12, left: 16, right: 16 }
       end
 
+      ###
+
+
+
+      ### Image
+
       def glib_json_image_standard_url
         'https://cdn-images-1.medium.com/max/1200/1*Qc0XxYm-qAZL-7tjjlNfrg.png'
       end
@@ -20,6 +29,19 @@ module Glib
       def glib_json_image_blob_key
         'o6CKzNt67PWnkPdUEnWMt7pr'
       end
+
+      ###
+
+
+
+      ### Color
+
+      def glib_color_panel_background
+        '#b3bac2'
+      end
+
+      ###
+
     end
   end
 end

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

@@ -15,6 +15,10 @@ module Glib
         end
       end
 
+      def add_singleton_view(name, *args)
+        add_singleton_element 'view', name, *args
+      end
+
       def method_missing(m, *args)
         add_view m, *args
       end
@@ -152,26 +156,22 @@ module Glib
             block.call page.menu_builder
           end
         end
+      end
 
-        # Should be deprecated
-        # def tabButtons(block)
-        #   json.tabButtons do
-        #     block.call page.menu_builder
-        #   end
-        # end
-
-        # def options(options)
-        #   current_url = page.context.request.base_url + page.context.request.fullpath
+      class AppBar < View
+        color :color
 
-        #   buttons ->(menu) do
-        #     options.each do |tab|
-        #       menu.button text: tab[:text], disabled: tab[:url] == current_url, onClick: ->(action) do
-        #         action.windows_reload url: tab[:url]
-        #       end
-        #     end
+        # def leftButtons(block)
+        #   json.leftButtons do
+        #     block.call page.menu_builder
         #   end
         # end
 
+        def rightButtons(block)
+          json.rightButtons do
+            block.call page.menu_builder
+          end
+        end
       end
 
       class Datetime < View
@@ -182,4 +182,4 @@ module Glib
 
     end
   end
-end
+end

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

@@ -5,6 +5,8 @@ json_ui_page json do |page|
 
   page.list sections: [
     ->(section) do
+      render "#{@path_prefix}/actions/reload", section: section
+    end, ->(section) do
       render "#{@path_prefix}/actions/dialogs", section: section
     end, ->(section) do
       render "#{@path_prefix}/actions/snackbars", section: section
@@ -16,8 +18,6 @@ json_ui_page json do |page|
       render "#{@path_prefix}/actions/timeouts", section: section
     end, ->(section) do
       render "#{@path_prefix}/actions/http", section: section
-    end, ->(section) do
-      render "#{@path_prefix}/actions/reload", section: section
     end
   ]
 end

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

@@ -4,11 +4,14 @@ json_ui_page json do |page|
   render "#{@path_prefix}/nav_menu", json: json, page: page
 
   page.form url: json_ui_garage_url(path: 'forms/basic_post'), method: 'post', padding: glib_json_padding_body, childViews: ->(form) do
-    form.fields_text name: 'user[name]', width: 'matchParent', label: 'Search', styleClasses: ['outlined', 'rounded']
+    form.fields_text name: 'user[name]', width: 'matchParent', label: 'Search', placeholder: 'Enter a keyword', styleClasses: ['outlined', 'rounded']
 
     form.spacer height: 14
     form.fields_password name: 'user[password]', width: 'matchParent', label: 'Password', placeholder: 'Type your password', styleClass: 'outlined'
 
+    form.spacer height: 14
+    form.fields_textarea name: 'user[bio]', width: 'matchParent', label: 'Bio', placeholder: 'Enter your bio', styleClasses: ['outlined']
+
     form.spacer height: 14
     form.fields_stripeToken name: 'user[stripe_token_outlined]', width: 'matchParent', publicKey: 'pk_test_TYooMQauvdEDq54NiTphI7jx', styleClass: 'outlined'
 

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

@@ -41,6 +41,17 @@ json_ui_page json do |page|
           action.windows_open url: json_ui_garage_url(path: 'pages/full_width')
         end
       end
+    end,
+    ->(section) do
+      section.header padding: glib_json_padding_list, childViews: ->(header) do
+        header.h2 text: 'Misc (Web Only)'
+      end
+
+      section.rows builder: ->(template) do
+        template.thumbnail title: 'Nested Scroll', onClick: ->(action) do
+          action.windows_open url: json_ui_garage_url(path: 'pages/nested_scroll')
+        end
+      end
     end
   ]
 

data/app/views/json_ui/garage/pages/layout.json.jbuilder

@@ -1,19 +1,18 @@
 json.title 'Pages'
 
-json_ui_page json do |page|
-  render "#{@path_prefix}/nav_menu", json: json, page: page
-  
-  page.header padding: glib_json_padding_body, backgroundColor: '#b3bac2', childViews: ->(header) do
-    header.h1 text: 'Header'
-  end
+page = json_ui_page json
+render "#{@path_prefix}/nav_menu", json: json, page: page
 
-  page.footer padding: glib_json_padding_body, backgroundColor: '#b3bac2', childViews: ->(footer) do
-    footer.h1 text: 'Footer'
-  end
+page.header padding: glib_json_padding_body, backgroundColor: '#b3bac2', childViews: ->(header) do
+  header.h1 text: 'Header'
+end
+
+page.footer padding: glib_json_padding_body, backgroundColor: '#b3bac2', childViews: ->(footer) do
+  footer.h1 text: 'Footer'
+end
 
-  page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
-    (1..100).each do |index|
-      scroll.label text: 'Content'
-    end
+page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
+  (1..100).each do |index|
+    scroll.label text: 'Content'
   end
 end

data/app/views/json_ui/garage/pages/nav_buttons.json.jbuilder

@@ -1,21 +1,33 @@
 json.title 'Pages'
 
-json_ui_page json do |page|
-  render "#{@path_prefix}/nav_menu", json: json, page: page
-  
-  page.rightNavButtons do |menu|
-    menu.button icon: 'search', onClick: ->(action) do 
-      action.dialogs_alert message: 'Perform some action'
-    end
-    menu.button icon: { name: 'star', badge: { text: '1', backgroundColor: '#ff0000' } }, onClick: ->(action) do 
-      action.dialogs_alert message: 'Perform some action'
-    end
-    menu.button icon: { name: 'map', badge: '2' }, onClick: ->(action) do 
-      action.dialogs_alert message: 'Perform some action'
-    end
-  end
+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.label text: 'See the right menu buttons on the nav bar'
+page.navBar backgroundColor: '#a8c4e3', rightButtons: ->(menu) do
+  menu.button icon: 'search', onClick: ->(action) do 
+    action.dialogs_alert message: 'Perform some action'
+  end
+  menu.button icon: { name: 'star', badge: { text: '1', backgroundColor: '#ff0000' } }, onClick: ->(action) do 
+    action.dialogs_alert message: 'Perform some action'
+  end
+  menu.button icon: { name: 'map', badge: '2' }, onClick: ->(action) do 
+    action.dialogs_alert message: 'Perform some action'
   end
 end
+
+# page.rightNavButtons do |menu|
+#   menu.button icon: 'search', onClick: ->(action) do 
+#     action.dialogs_alert message: 'Perform some action'
+#   end
+#   menu.button icon: { name: 'star', badge: { text: '1', backgroundColor: '#ff0000' } }, onClick: ->(action) do 
+#     action.dialogs_alert message: 'Perform some action'
+#   end
+#   menu.button icon: { name: 'map', badge: '2' }, onClick: ->(action) do 
+#     action.dialogs_alert message: 'Perform some action'
+#   end
+# end
+
+page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
+  scroll.label text: 'See the right menu buttons on the nav bar'
+end

data/app/views/json_ui/garage/pages/nested_scroll.json.jbuilder

@@ -0,0 +1,40 @@
+json.title 'Pages'
+
+page = json_ui_page json
+render "#{@path_prefix}/nav_menu", json: json, page: page
+
+# page.template 'fullWidth'
+
+page.header childViews: ->(header) do
+  header.panels_vertical width: 'matchParent', styleClass: 'card', padding: glib_json_padding_body, childViews: ->(vertical) do
+    vertical.h1 text: 'Header'
+  end
+  header.spacer height: 10
+end
+
+page.footer childViews: ->(footer) do
+  footer.spacer height: 10
+  footer.panels_vertical width: 'matchParent', styleClass: 'card', padding: glib_json_padding_body, childViews: ->(vertical) do
+    vertical.h1 text: 'Footer'
+  end
+end
+
+page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
+  scroll.label text: 'Inner Header'
+  scroll.label text: 'Inner Header'
+  scroll.label text: 'Inner Header'
+  scroll.spacer height: 20
+
+  scroll.panels_vertical width: 'matchParent', styleClass: 'card', backgroundColor: glib_color_panel_background, padding: glib_json_padding_body.merge(right: nil), childViews: ->(padder) do
+    padder.panels_scroll width: 'matchParent', height: 300, childViews: ->(inner_scroll) do
+      (1..100).each do |index|
+        inner_scroll.label text: 'Content'
+      end
+    end
+  end
+
+  scroll.spacer height: 20
+  scroll.label text: 'Inner Footer'
+  scroll.label text: 'Inner Footer'
+  scroll.label text: 'Inner Footer'
+end

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

@@ -1,16 +1,37 @@
 json.title 'Panels'
 
-image_url1 = 'http://ichef.bbci.co.uk/news/976/cpsprodpb/18106/production/_97266589_gettyimages-474547165.jpg'
+image_url1 = 'https://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_ui_page json do |page|
   render "#{@path_prefix}/nav_menu", json: json, page: page
-  
+
   page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
-    scroll.h1 text: 'Carousel panel'
+    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
+
+    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
+
+    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
+      carousel.panels_vertical childViews: ->(panel) do
+        panel.h3 text: 'Item 2'
+        panel.image url: image_url2, width: 'matchParent'
+      end
+    end
   end
 end

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

@@ -0,0 +1,22 @@
+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
+  # TODO: Scrape all names from https://material.io/resources/icons
+  icon_names = [
+    'info', 'info', 'info', 'info', 'info', 'info', 'info', 'info',
+    'info', 'info', 'info', 'info', 'info', 'info', 'info', 'info',
+    'info', 'info', 'info', 'info', 'info', 'info', 'info', 'info',
+  ]
+  icon_names.each do |icon_name|
+    scroll.panels_column lg: { cols: 2 }, childViews: ->(column) do
+      column.panels_horizontal align: 'middle', childViews: ->(horizontal) do
+        horizontal.icon spec: icon_name
+        horizontal.spacer width: 6
+        horizontal.label text: icon_name
+      end
+    end
+  end
+end

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

@@ -11,10 +11,10 @@ page.scroll padding: glib_json_padding_body, childViews: ->(scroll) do
   scroll.spacer height: 6
   scroll.avatar url: glib_json_image_avatar_url
 
-  scroll.spacer height: 20
-  scroll.h2 text: 'Icon'
-  scroll.spacer height: 6
-  scroll.icon spec: 'info'
+  # scroll.spacer height: 20
+  # scroll.h2 text: 'Icon'
+  # scroll.spacer height: 6
+  # scroll.icon spec: 'info'
 
   scroll.spacer height: 20
   scroll.h2 text: 'Image with base64 data'

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

@@ -16,15 +16,15 @@ json_ui_page json do |page|
         template.thumbnail title: 'Images', onClick: ->(action) do
           action.windows_open url: json_ui_garage_url(path: 'views/images')
         end
-        template.thumbnail title: 'Carousels', onClick: ->(action) do
-          action.windows_open url: json_ui_garage_url(path: 'views/carousels')
-        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: 'Icons', onClick: ->(action) do
+          action.windows_open url: json_ui_garage_url(path: 'views/icons')
+        end
         template.thumbnail title: 'Misc', onClick: ->(action) do
           action.windows_open url: json_ui_garage_url(path: 'views/misc')
         end

data/lib/glib/test_helpers.rb

@@ -20,21 +20,21 @@ module Glib
         end
         @__log_dir
       end
-      
+
       def __log_file
         @__log_file ||= "#{self.method_name}.json"
       end
-      
+
       def __log json
         File.open("#{File.join(__log_dir, __log_file)}", "w") do |f|
           f << JSON.pretty_generate( JSON.parse(json) )
         end
         json
       end
-      
+
       def __get_previous_result_from_git
         `git checkout -- "#{File.join(__log_dir, __log_file)}" > /dev/null 2>&1` if __git_is_available?
-        File.exists?(File.join(__log_dir, __log_file)) ? File.open(File.join(__log_dir, __log_file)).read : "\{\}"
+        File.exist?(File.join(__log_dir, __log_file)) ? File.open(File.join(__log_dir, __log_file)).read : "\{\}"
       end
   end
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: glib-web
 version: !ruby/object:Gem::Version
-  version: 0.5.6
+  version: 0.5.8
 platform: ruby
 authors:
 - ''
@@ -158,6 +158,7 @@ files:
 - app/views/json_ui/garage/pages/layout.json.jbuilder
 - app/views/json_ui/garage/pages/loading_indicator.json.jbuilder
 - app/views/json_ui/garage/pages/nav_buttons.json.jbuilder
+- app/views/json_ui/garage/pages/nested_scroll.json.jbuilder
 - app/views/json_ui/garage/pages/tab_bar.json.jbuilder
 - app/views/json_ui/garage/panels/_styled.json.jbuilder
 - app/views/json_ui/garage/panels/card.json.jbuilder
@@ -183,8 +184,8 @@ files:
 - app/views/json_ui/garage/views/_chart_data.json.jbuilder
 - app/views/json_ui/garage/views/banners.json.jbuilder
 - app/views/json_ui/garage/views/calendar_data.json.jbuilder
-- app/views/json_ui/garage/views/carousels.json.jbuilder
 - app/views/json_ui/garage/views/charts.json.jbuilder
+- app/views/json_ui/garage/views/icons.json.jbuilder
 - app/views/json_ui/garage/views/images.json.jbuilder
 - app/views/json_ui/garage/views/index.json.jbuilder
 - app/views/json_ui/garage/views/links.json.jbuilder

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

@@ -1,37 +0,0 @@
-json.title 'Views'
-
-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_ui_page json do |page|
-  render "#{@path_prefix}/nav_menu", json: json, page: 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
-
-    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
-
-    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
-      carousel.panels_vertical childViews: ->(panel) do
-        panel.h3 text: 'Item 2'
-        panel.image url: image_url2, width: 'matchParent'
-      end
-    end
-  end
-end