coprl 3.0.0.beta.2 → 3.0.0.beta.7

data/app/demo/events/halted.pom

@@ -0,0 +1,23 @@
+Coprl::Presenters.define(:halted) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :events_drawer
+
+  indented_grid do
+    display 'Halted Events'
+    body 'This demonstrates how to respond to failed, or halted events'
+
+    content do
+      button :failed_post do
+        event :click do
+          posts '_echo_', status: 500
+        end
+        event 'V:eventsHalted' do
+          snackbar 'That did not work! Please try again later.'
+        end
+      end
+
+    end
+  end
+  attach :code, file: __FILE__
+end

data/app/demo/events/nav/drawer.pom

@@ -1,7 +1,7 @@
 Coprl::Presenters.define(:events_drawer) do
   helpers Coprl::Presenters::Helpers::Inflector
 
-  events = %i[field_level_events form_level_events tagged_input parallel_events].sort
+  events = %i[field_level_events form_level_events tagged_input parallel_events halted].sort
   actions = %i[dialog replaces loads toggle_visibility snackbar updates deletes posts clear last_response prompt_if_dirty].sort
 
   drawer 'Events' do

data/app/demo/events/tagged_input.pom

@@ -18,11 +18,11 @@ Coprl::Presenters.define(:tagged_input) do
 
     title 'Example'
 
-    content tag: :somefields do
+    content input_tag: :somefields do
       radio_button text: :on, name: :check_me, value: :on, checked: true
       radio_button text: :off, name: :check_me, value: :off
     end
-    text_field name: :myfield2, tag: :somefields do
+    text_field name: :myfield2, input_tag: :somefields do
       label 'More Data to post'
     end
 

data/app/demo/patterns/search_select.pom

@@ -21,7 +21,7 @@ Coprl::Presenters.define(:search_select) do
 
   page_title 'Search and Select Pattern'
   indented_grid do
-    grid tag: :input_data_container do
+    grid input_tag: :input_data_container do
       column 6 do
         grid do
           column 4 do

data/app/demo/plugins/animate.pom

@@ -0,0 +1,144 @@
+Coprl::Presenters.define(:animate, namespace: :plugins) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :plugin_drawer
+  plugin :animate, :scroll_to
+  page_title 'Animate', id: :page_title
+
+  indented_grid do
+    grid do
+      column 4 do
+        heading "Animations plugin", id: :animate_heading
+        subheading "Just-add-POM CSS animations"
+        body "It is based on [animate.css](https://animate.style/)."
+      end
+      column 8 do
+        [["Attention seekers",
+          %i( bounce
+              flash
+              pulse
+              rubber_band
+              shake_x
+              shake_y
+              head_shake
+              swing
+              tada
+              wobble
+              jello
+              heart_beat)],
+         ["Back entrances",
+          %i( back_in_down
+              back_in_left
+              back_in_right
+              back_in_up)],
+         ["Back exits",
+          %i( back_out_down
+              back_out_left
+              back_out_right
+              back_out_up)],
+         ["Bouncing entrances",
+          %i( bounce_in
+              bounce_in_down
+              bounce_in_left
+              bounce_in_right
+              bounce_in_up)],
+         ["Bouncing exits",
+          %i( bounce_out
+              bounce_out_down
+              bounce_out_left
+              bounce_out_right
+              bounce_out_up)],
+         ["Fading entrances",
+          %i( fade_in
+              fade_in_down
+              fade_in_down_big
+              fade_in_left
+              fade_in_left_big
+              fade_in_right
+              fade_in_right_big
+              fade_in_up
+              fade_in_up_big
+              fade_in_top_left
+              fade_in_top_right
+              fade_in_bottom_left
+              fade_in_bottom_right)],
+         ["Fading exits",
+          %i( fade_out
+              fade_out_down
+              fade_out_down_big
+              fade_out_left
+              fade_out_left_big
+              fade_out_right
+              fade_out_right_big
+              fade_out_up
+              fade_out_up_big
+              fade_out_top_left
+              fade_out_top_right
+              fade_out_bottom_right
+              fade_out_bottom_left)],
+         ["Flippers",
+          %i( flip
+              flip_in_x
+              flip_in_y
+              flip_out_x
+              flip_out_y)],
+         ["lightspeed",
+          %i(  light_speed_in_right
+              light_speed_in_left
+              light_speed_out_right
+              light_speed_out_left)],
+         ["Rotating entrances",
+          %i( rotate_in
+              rotate_in_down_left
+              rotate_in_down_right
+              rotate_in_up_left
+              rotate_in_up_right)],
+         ["Rotating exits",
+          %i( rotate_out
+              rotate_out_down_left
+              rotate_out_down_right
+              rotate_out_up_left
+              rotate_out_up_right)],
+         ["Specials",
+          %i( hinge
+              jack_in_the_box
+              roll_in
+              roll_out)],
+         ["Zooming entrances",
+          %i( zoom_in
+              zoom_in_down
+              zoom_in_left
+              zoom_in_right
+              zoom_in_up)],
+         ["Zooming exits",
+          %i( zoom_out
+              zoom_out_down
+              zoom_out_left
+              zoom_out_right
+              zoom_out_up)],
+         ["Sliding entrances",
+          %i( slide_in_down
+              slide_in_left
+              slide_in_right
+              slide_in_up)],
+         ["Sliding exits",
+          %i( slide_out_down
+              slide_out_left
+              slide_out_right
+              slide_out_up)]].each do |animiation_title, animiations|
+          subtitle animiation_title
+          animiations.each do |animation|
+            button animation do
+              event :click do
+                scroll_to :page_title
+                animate :animate_heading, animation, wait: true
+              end
+            end
+          end
+        end
+      end
+    end
+
+    attach :code, file: __FILE__
+  end
+end

data/app/demo/plugins/cacheable.pom

@@ -0,0 +1,64 @@
+require 'ostruct'
+
+Coprl::Presenters.define(:cacheable, namespace: :plugins) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :plugin_drawer
+  plugin :cacheable
+
+  page_title 'Cacheable'
+
+  helpers do
+    def cache_object
+      OpenStruct.new(cache_key: 'wild')
+    end
+
+    def cache_objects
+      [
+        OpenStruct.new(cache_key: 'abc'),
+        OpenStruct.new(cache_key: '123'),
+      ]
+    end
+  end
+
+  indented_grid do
+    body <<~DOC
+      The caching plugin provides russian doll caching support.
+      Declare the plugin in your pom, `plugin :cacheable`, or configure it globally:
+
+      ```
+      Coprl::Presenters::Settings.configure do |config|
+        config.presenters.plugins.push(:cacheable)
+      end
+      ```
+
+      For Rails it automatically uses the Rails::Cache. For other Rack apps you need to configure it with a block:
+
+      ```
+      Coprl::Presenters::Plugins::Cacheable::Settings.configure do |config|
+        # A cache needs to respond to fetch(key, &block) and exist?(key) or has_key?(key)
+        config.cache=cache_store
+      end
+      ```
+      Simply wrap your POM with the cache directive. 
+      Complex keys are supported.  If an object responds to `cache_key` then that will be used for it.  
+      An object that responds to `map` will be expanded.  As a last resort `to_s` is used.
+               
+      Examples (refresh your browser to observe cached values):
+    DOC
+    title "Not cached at #{DateTime.now}"
+    cache :remember_me do
+      title "Simple Cache Key - cached at #{DateTime.now}"
+    end
+
+    cache [:title, cache_object, cache_objects] do
+      title "Complex Cache Key - cached at #{DateTime.now}"
+    end
+    blank
+    body <<~DOC
+      Note: Confusion alert ... if you are using shotgun for the demo, it **will not cache**, since the demo uses an in memory cache and shotgun reloads its entire process with each refresh.
+    DOC
+
+  end
+  attach :code, file: __FILE__
+end

data/app/demo/plugins/clipboard.pom

@@ -0,0 +1,21 @@
+Coprl::Presenters.define(:clipboard, namespace: :plugins) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :plugin_drawer
+  plugin :clipboard
+  page_title 'Clipboard'
+
+  indented_grid do
+    headline 'Copy'
+    text_field id: :copy_me do
+      value "Don't copy that floppy!"
+    end
+    button :copy, type: :raised do
+      event :click do
+        clipboard copy: :copy_me
+      end
+    end
+  end
+
+  attach :code, file: __FILE__
+end

data/app/demo/plugins/color_picker.pom

@@ -0,0 +1,17 @@
+Coprl::Presenters.define(:color_picker, namespace: :plugins) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :plugin_drawer
+  plugin :color_picker
+  page_title 'Color picker'
+
+  indented_grid do
+    subheading 'Add a Color picker to your page'
+    color_picker 'color',
+                 value: '#f44336',
+                 color_per_row: 7,
+                 color_size: 25
+
+    attach :code, file: __FILE__
+  end
+end

data/app/demo/plugins/google_maps.pom

@@ -0,0 +1,24 @@
+Coprl::Presenters.define(:google_maps, namespace: :plugins) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :plugin_drawer
+  plugin :google_maps
+  page_title 'Maps'
+
+  indented_grid do
+    unless ENV['GOOGLE_API_KEY']
+      headline 'You must define the ENV variable GOOGLE_API_KEY for this to render a map'
+      subtitle 'Dev hint: Create an .env file with a `GOOGLE_API_KEY=yourkey` and restart. Goto [Google Using API Keys](https://developers.google.com/maps/documentation/javascript/get-api-key) to create a key.'
+    end
+    subheading 'Static Maps'
+    address = '125 Park Street, Traverse City, MI'
+    google_map address: address, height: "300px", width: "400px"  do
+      event :click do
+        loads "https://www.google.com/maps/place/#{address}"
+      end
+    end
+
+    attach :code, file: __FILE__
+  end
+
+end

data/app/demo/plugins/iframe.pom

@@ -0,0 +1,14 @@
+Coprl::Presenters.define(:iframe, namespace: :plugins) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :plugin_drawer
+  plugin :iframe
+  page_title 'Iframe'
+
+
+  indented_grid do
+    subheading 'Embed an iFrame'
+    iframe 'https://en.wikipedia.org/wiki/Special:Random', height: "500px",scrolling: :yes # | :no (default)
+    attach :code, file: __FILE__
+  end
+end

data/app/demo/plugins/image_crop.pom

@@ -20,7 +20,7 @@ Coprl::Presenters.define(:image_crop, namespace: :plugins) do
           grid do
             column 12 do
               card do
-                text 'Drop it here'
+                text 'Drop an image or click'
                 button icon: :cloud_upload
               end
             end

data/app/demo/plugins/markup.pom

@@ -0,0 +1,14 @@
+Coprl::Presenters.define(:markup, namespace: :plugins) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :plugin_drawer
+  plugin :markup
+  page_title 'Markup'
+
+
+  indented_grid do
+    markup "<h1>Hello Cruel World</h1>"
+
+    attach :code, file: __FILE__
+  end
+end

data/app/demo/plugins/nav/drawer.pom

@@ -7,7 +7,7 @@ Coprl::Presenters.define(:plugin_drawer, namespace: :plugins) do
           loads :index
         end
       end
-      %i(image_crop chart).sort.each do |comp|
+      %i(image_crop chart google_maps cacheable script scroll_to clipboard markup iframe color_picker timer animate).sort.each do |comp|
         item titleize(comp) do
           event :click do
             loads comp

data/app/demo/plugins/script.pom

@@ -0,0 +1,17 @@
+Coprl::Presenters.define(:script, namespace: :plugins) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :plugin_drawer
+  plugin :script
+  page_title 'Script'
+
+  script inline: <<~JAVASCRIPT
+      alert( 'Hello, world!' );
+  JAVASCRIPT
+  indented_grid do
+    subheading 'You can write arbitrary javascript using the script component. For example, the alert you just dismissed.'
+
+    attach :code, file: __FILE__
+  end
+
+end

data/app/demo/plugins/scroll_to.pom

@@ -0,0 +1,22 @@
+Coprl::Presenters.define(:scroll_to, namespace: :plugins) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :plugin_drawer
+  plugin :scroll_to
+  page_title 'Scroll to'
+
+  indented_grid do
+    subheading 'Sometimes you need to scroll to find content after some action. This is what the scroll to plugin is for.'
+    button :scroll do
+      event :click do
+        scroll_to :scroll_target #, smooth: true, offset: 100
+      end
+    end
+    (1..100).each do
+      body '.'
+    end
+    title 'Thanks for scrolling here', id: :scroll_target
+
+    attach :code, file: __FILE__
+  end
+end

data/app/demo/plugins/timer.pom

@@ -0,0 +1,24 @@
+Coprl::Presenters.define(:timer, namespace: :plugins) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :plugin_drawer
+  plugin :timer
+  page_title 'Timer'
+
+  indented_grid do
+    subheading 'Using an expiration timer'
+
+    count_down_timer DateTime.now + + Rational(130, 60 * 60 * 24), # add 2 minutes and 10 seconds
+                     expired_message: 'Something important (shoping cart for example) has Expired',
+                     safe_color: 'green',
+                     warn_color: 'red',
+                     delete_url: 'TODO', # TODO URL to delete something on expiration
+                     delete_params: {}, # parmeters to pass on expiration
+                     redirect_url: 'TODO', # Where to redirect after delete?
+                     redirect_params: {} do
+      icon 'fas fa-stopwatch', color: :white
+    end
+
+    attach :code, file: __FILE__
+  end
+end