glib-web 0.2.11 → 0.2.12

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 28296441cfbabaa9915d315407f81ee8ff6c3d0f
-  data.tar.gz: 44bafc6c627fe454fca1630bd9e3288f8c71b52c
+  metadata.gz: 70a139ad04c9474b9ed21f76b4de4635191a19f9
+  data.tar.gz: c27f5af86e354a217f6f7703452beb8529a7d737
 SHA512:
-  metadata.gz: 6e043b39a9176c67a66027b2aed616d9c0b30c423047c72e3a48a075c5854ab85ae75e8ef50050b7a00faf6ad9afe535231e17b422642cf6c4c2a60e8be19ac0
-  data.tar.gz: e35a72b90a294c8cfee957d62788dab43a78801308cb17db43d0889ffce133e97175102456b70a4b5df6607ba3b10969719169dccafbb4d5758d7d585ff4c926
+  metadata.gz: 6166a3a64dcdbd590920add4aa4d301501cad52dce40f7ae13bb211c9fbd893a41030b68fdb80d1a83f6709feb29fb03463022d911c0ef29f06d4e2a4d122f77
+  data.tar.gz: 9270f172fe0eb7a15fc51e3611073958061cfcfa2a5e7eec758ffff21cad6e0383da191b5cb21bd58749a5101e68862dc262886027cf592c36d19af557836bfe

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

@@ -143,9 +143,11 @@ module Glib
         end
       end
 
-      def self.bool propName
+      def self.bool propName, options = {}
         define_method(propName) do |value|
-          json.set! propName, value == true
+          bool = value == true
+          instance_variable_set("@#{propName}", bool) if options[:cache]
+          json.set! propName, bool
         end
       end
 

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

@@ -68,6 +68,7 @@ module Glib
 
         def body(options = {})
           json.body do
+            # raise "OPT: #{options}"
             vertical_content(options)
           end
         end
@@ -106,7 +107,7 @@ module Glib
         def vertical_content(options)
           options = options.reverse_merge(width: 'matchParent')
 
-          [:padding, :backgroundColor, :width, :height].each do |name|
+          [:padding, :backgroundColor, :width, :height, :align].each do |name|
             if (value = options[name])
               json.set! name, value
             end

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

@@ -13,14 +13,19 @@ class Glib::JsonUi::ViewBuilder
       end
 
       def prop(prop)
-        if (form = page.current_form)
-          @name ||= form.field_name(prop)
-          @value ||= form.field_value(prop)
-        end
+        @prop = prop
+        # if (form = page.current_form)
+        #   @name ||= form.field_name(prop)
+        #   @value ||= form.field_value(prop)
+        # end
       end
 
       # Override
       def created
+        if (@prop && form = page.current_form)
+          @name ||= form.field_name(@prop, @multiple || false)
+          @value ||= form.field_value(@prop)
+        end
         json.name @name
         json.value @value
       end
@@ -72,14 +77,14 @@ class Glib::JsonUi::ViewBuilder
     class Select < AbstractField
       array :options
       bool :readOnly
-      bool :multiple
+      bool :multiple, cache: true
       bool :manualEntry
     end
 
     class DynamicSelect < AbstractField
       array :selectedOptions
       string :url
-      bool :multiple
+      bool :multiple, cache: true
       
       # Override
       def value(value)

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

@@ -4,11 +4,15 @@ class Glib::JsonUi::ViewBuilder
       # boolean :local
 
       def is_association?(prop)
-        @model.class.reflect_on_association(prop)
+        # Not all model is ActiveRecord
+        if @model.class.respond_to?(:reflect_on_association)
+          return @model.class.reflect_on_association(prop)
+        end
+        return false
       end
 
-      def field_name(prop)
-        suffix = is_association?(prop) ? '[]' : ''
+      def field_name(prop, multiple)
+        suffix = is_association?(prop) || multiple ? '[]' : ''
         "#{@model_name}[#{prop}]#{suffix}"
       end
 
@@ -45,23 +49,13 @@ class Glib::JsonUi::ViewBuilder
 
       # Override
       def created
+        @method ||= :get
+
         json.url @url
         json.method @method
-      end
-
-      def childViews(block)
-        # insert_method_field = false
-        # method = @args[:method].to_sym
-        # case method
-        # when :patch, :put, :delete
-        #   json.method :post
-        #   insert_method_field = true
-        # else
-        #   json.method method
-        # end
-
+        
         json.childViews do
-          if @method.downcase != 'get'
+          if @method != :get
             json.child! do
               json.view 'fields/hidden-v1'
               json.name 'authenticity_token'
@@ -79,9 +73,14 @@ class Glib::JsonUi::ViewBuilder
 
           # NOTE: this pattern will not work for views that can be nested. Luckily forms shouldn't be nested anyway.
           page.current_form = self
-          block.call(page.view_builder)
+          @childViewsBlock.call(page.view_builder)
           page.current_form = nil
         end
+
+      end
+
+      def childViews(block)
+        @childViewsBlock = block
       end
     end
 
@@ -115,6 +114,7 @@ class Glib::JsonUi::ViewBuilder
 
     class Scroll < View
       views :childViews
+      string :align
     end
 
     class Split < View
@@ -123,6 +123,17 @@ class Glib::JsonUi::ViewBuilder
       views :rightViews
     end
 
+    class Responsive < View
+      views :childViews
+    end
+
+    class Column < View
+      int :lg
+      int :md
+      int :sm
+      views :childViews
+    end
+
     class Vertical < View
       views :childViews
       string :distribution

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

@@ -58,10 +58,29 @@ module Glib
         string :text
       end
 
-      class Spacer < View
+      class P < View
+        string :text
+      end
+      
+      class Label < View
+        string :text
+        action :onClick
       end
 
-      class Hr < View
+      class Image < View
+        string :url
+        string :base64Data
+        action :onClick
+      end
+
+      class Avatar < View
+        string :url
+        action :onClick
+      end
+      
+      class Icon < View
+        string :name
+        action :onClick
       end
 
       class Button < View
@@ -76,23 +95,10 @@ module Glib
         action :onClick
       end
 
-      class Image < View
-        string :url
-        string :base64Data
-        action :onClick
-      end
-
-      class Avatar < View
-        string :url
-        action :onClick
+      class Hr < View
       end
 
-      class P < View
-        string :text
-      end
-      
-      class Label < View
-        string :text
+      class Spacer < View
       end
 
       class Map < View

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

@@ -5,6 +5,11 @@ json_ui_page json do |page|
   
   page.form url: json_ui_garage_url(path: 'forms/submission_indicator_post'), method: 'post', padding: { top: 12, left: 20, right: 20, bottom: 12 }, childViews: ->(form) do
     form.button text: 'This button gets disabled on submit', onClick: ->(action) { action.forms_submit }
+
+    # This needs to be long enough that the FAB is roughly at the bottom of a mobile screen.
+    # Ideally the spacer can expand dynamically depending on available space.
+    form.spacer height: 400
+
     form.fab icon: 'send', onClick: ->(action) { action.forms_submit }
   end
 end

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

@@ -14,11 +14,8 @@ json_ui_page json do |page|
       template.thumbnail title: 'Infinite Scroll', onClick: ->(action) do
         action.windows_open url: json_ui_garage_url(path: 'lists/infinite_scroll')
       end
-      template.thumbnail title: 'FAB (Floating Action Button) 1', onClick: ->(action) do
-        action.windows_open url: json_ui_garage_url(path: 'lists/fab1')
-      end
-      template.thumbnail title: 'FAB (Floating Action Button) 2', onClick: ->(action) do
-        action.windows_open url: json_ui_garage_url(path: 'lists/fab2')
+      template.thumbnail title: 'FAB (Floating Action Button)', onClick: ->(action) do
+        action.windows_open url: json_ui_garage_url(path: 'lists/fab')
       end
     end
 

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

@@ -6,7 +6,7 @@ image_url2 = 'https://s.abcnews.com/images/International/Guam03-gty-jrl-170809_1
 json_ui_page json do |page|
   render "#{@path_prefix}/nav_menu", json: json, page: page
   
-  page.scroll padding: { top: 12, bottom: 12, left: 16, right: 16 }, childViews: ->(scroll) do
+  page.scroll padding: json_padding_body, childViews: ->(scroll) do
     scroll.h1 text: 'Carousel panel'
     scroll.panels_carousel width: 'matchParent', childViews: ->(carousel) do
       carousel.image url: image_url1, width: 'matchParent'

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

@@ -3,7 +3,7 @@ json.title 'Panels'
 json_ui_page json do |page|
   render "#{@path_prefix}/nav_menu", json: json, page: page
   
-  page.scroll padding: { top: 12, bottom: 12, left: 16, right: 16 }, childViews: ->(scroll) do
+  page.scroll padding: json_padding_body, childViews: ->(scroll) do
     scroll.h1 text: 'Horizontal panel'
     scroll.panels_horizontal backgroundColor: '#b3bac2', childViews: ->(panel) do
       panel.button text: '1'

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

@@ -10,15 +10,18 @@ json_ui_page json do |page|
       end
 
       section.rows builder: ->(template) do
-        template.thumbnail title: 'Vertical', onClick: ->(action) do
+        template.thumbnail title: 'Vertical', subtitle: 'Arrange child components vertically', onClick: ->(action) do
           action.windows_open url: json_ui_garage_url(path: 'panels/vertical')
         end
-        template.thumbnail title: 'Horizontal', onClick: ->(action) do
+        template.thumbnail title: 'Horizontal', subtitle: 'Arrange child components horizontally', onClick: ->(action) do
           action.windows_open url: json_ui_garage_url(path: 'panels/horizontal')
         end
-        template.thumbnail title: 'Carousel', onClick: ->(action) do
+        template.thumbnail title: 'Carousel', subtitle: 'Arrange child components horizontally in a carousel', onClick: ->(action) do
           action.windows_open url: json_ui_garage_url(path: 'panels/carousel')
         end
+        template.thumbnail title: 'Responsive', subtitle: 'Arrange *column panels* horizontally using flex', onClick: ->(action) do
+          action.windows_open url: json_ui_garage_url(path: 'panels/responsive')
+        end
         
       end
     end, ->(section) do
@@ -38,8 +41,6 @@ json_ui_page json do |page|
         template.thumbnail title: 'List', subtitle: 'Sub-panels: header, footer', onClick: ->(action) do
           action.windows_open url: json_ui_garage_url(path: 'lists/index')
         end
-        template.thumbnail title: 'Flex', subtitle: 'TODO', onClick: ->(action) do
-        end
       end
     end, ->(section) do
       section.header padding: json_padding_list, childViews: ->(header) do
@@ -72,6 +73,9 @@ json_ui_page json do |page|
         template.thumbnail title: 'Card', subtitle: 'Adds card-like bevel', onClick: ->(action) do
           action.windows_open url: json_ui_garage_url(path: 'panels/card')
         end
+        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
         
       end
     end, ->(section) do

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

@@ -0,0 +1,43 @@
+json.title 'Panels'
+
+json_ui_page json do |page|
+  render "#{@path_prefix}/nav_menu", json: json, page: page
+  
+  page.scroll padding: json_padding_body, childViews: ->(scroll) do
+    scroll.label text: 'Shrink the browser\'s width to see how the column panels are rearranged. On mobile screens, they are always arranged vertically'
+
+    scroll.spacer height: 20
+    scroll.h2 text: 'Responsive panel with 12 columns'
+    scroll.spacer height: 6
+    scroll.panels_responsive childViews: ->(horizontal) do
+      horizontal.panels_column lg: 8, backgroundColor: '#c3cad2', childViews: ->(column) do
+        column.button text: '1'
+      end
+      horizontal.panels_column lg: 4, backgroundColor: '#b3bac2', childViews: ->(column) do
+        column.button text: '2'
+      end
+    end
+
+    scroll.spacer height: 20
+    scroll.h2 text: 'Responsive panel with more than 12 columns'
+    scroll.spacer height: 6
+    scroll.panels_responsive childViews: ->(horizontal) do
+      horizontal.panels_column lg: 4, backgroundColor: '#c3cad2', childViews: ->(column) do
+        column.button text: '1'
+      end
+      horizontal.panels_column lg: 4, backgroundColor: '#b3bac2', childViews: ->(column) do
+        column.button text: '2'
+      end
+      horizontal.panels_column lg: 4, backgroundColor: '#c3cad2', childViews: ->(column) do
+        column.button text: '3'
+      end
+      horizontal.panels_column lg: 4, backgroundColor: '#b3bac2', childViews: ->(column) do
+        column.button text: '4'
+      end
+      horizontal.panels_column lg: 4, backgroundColor: '#c3cad2', childViews: ->(column) do
+        column.button text: '5'
+      end
+    end
+
+  end
+end

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

@@ -3,7 +3,7 @@ json.title 'Panels'
 json_ui_page json do |page|
   render "#{@path_prefix}/nav_menu", json: json, page: page
   
-  page.scroll padding: { top: 12, bottom: 12, left: 16, right: 16 }, childViews: ->(scroll) do
+  page.scroll padding: json_padding_body, childViews: ->(scroll) do
     scroll.h1 text: 'Vertical panel'
     scroll.panels_vertical backgroundColor: '#b3bac2', childViews: ->(panel) do
       panel.button text: 'Button1'

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

@@ -8,6 +8,11 @@ json_ui_page json do |page|
     scroll.spacer height: 6
     scroll.avatar url: json_image_avatar_url
 
+    scroll.spacer height: 20
+    scroll.h2 text: 'Icon'
+    scroll.spacer height: 6
+    scroll.icon name: 'info'
+
     scroll.spacer height: 20
     scroll.h2 text: 'Image with URL'
     scroll.spacer height: 6

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

@@ -21,7 +21,14 @@ json_ui_page json do |page|
     scroll.spacer height: 20
     scroll.h2 text: 'Button with link style'
     scroll.spacer height: 6
-    scroll.button text: 'Link', styleClass: 'link', onClick: ->(action) do
+    scroll.button text: 'Styled Button', styleClass: 'link', onClick: ->(action) do
+      action.windows_open url: json_ui_garage_url(path: 'home/blank')
+    end
+
+    scroll.spacer height: 20
+    scroll.h2 text: 'Label with onClick URL'
+    scroll.spacer height: 6
+    scroll.label text: 'Clickable Link', onClick: ->(action) do
       action.windows_open url: json_ui_garage_url(path: 'home/blank')
     end
 
@@ -41,6 +48,13 @@ json_ui_page json do |page|
       action.windows_open url: json_ui_garage_url(path: 'home/blank')
     end
 
+    scroll.spacer height: 20
+    scroll.h2 text: 'Icon with onClick'
+    scroll.spacer height: 6
+    scroll.icon name: 'info', onClick: ->(action) do
+      action.windows_open url: json_ui_garage_url(path: 'home/blank')
+    end
+
     scroll.fab icon: 'add', onClick: ->(action) do
       action.windows_open url: json_ui_garage_url(path: 'home/blank')
     end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: glib-web
 version: !ruby/object:Gem::Version
-  version: 0.2.11
+  version: 0.2.12
 platform: ruby
 authors:
 - ''
@@ -72,8 +72,7 @@ files:
 - app/views/json_ui/garage/home/index.json.jbuilder
 - app/views/json_ui/garage/lists/_infinite_scroll_section.json.jbuilder
 - app/views/json_ui/garage/lists/edit_actions.json.jbuilder
-- app/views/json_ui/garage/lists/fab1.json.jbuilder
-- app/views/json_ui/garage/lists/fab2.json.jbuilder
+- app/views/json_ui/garage/lists/fab.json.jbuilder
 - app/views/json_ui/garage/lists/index.json.jbuilder
 - app/views/json_ui/garage/lists/infinite_scroll.json.jbuilder
 - app/views/json_ui/garage/lists/templating.json.jbuilder
@@ -87,6 +86,7 @@ files:
 - app/views/json_ui/garage/panels/custom.json.jbuilder
 - app/views/json_ui/garage/panels/horizontal.json.jbuilder
 - app/views/json_ui/garage/panels/index.json.jbuilder
+- app/views/json_ui/garage/panels/responsive.json.jbuilder
 - app/views/json_ui/garage/panels/split.json.jbuilder
 - app/views/json_ui/garage/panels/table.json.jbuilder
 - app/views/json_ui/garage/panels/vertical.json.jbuilder

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

@@ -1,13 +0,0 @@
-json.title 'Lists'
-
-json_ui_page json do |page|
-  render "#{@path_prefix}/nav_menu", json: json, page: page
-
-  page.header childViews: ->(header) do
-    header.fab icon: 'add', onClick: ->(action) { action.dialogs_alert message: 'Perform action' }
-  end
-  
-  page.list firstSection: ->(section) do
-    render 'json_ui/garage/lists/infinite_scroll_section', json: json, page: 0
-  end
-end