coprl 0.1.0 → 3.0.0.beta.1

data/app/demo/components/tooltips.pom

@@ -0,0 +1,119 @@
+require_relative '../helpers/indented_grid'
+
+Coprl::Presenters.define(:tooltips) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :component_drawer
+  page_title 'Tooltips'
+  
+  indented_grid do
+    headline 'Avatars'
+    subheading 'Cards'
+    card do
+      media do
+        avatar 'img/demo/rx.png' do
+          tooltip "Ill be back", position: :right
+        end
+      end
+    end
+
+    card do
+      media do
+        avatar :person do
+          tooltip "Ill be back", position: :right
+        end
+      end
+    end
+
+    subheading 'Lists (**Help Wanted**)'
+    list do
+      line do
+        text 'Terminator2'
+        avatar 'img/demo/rx.png' do
+          tooltip "I'll be back - not working", position: :right
+        end
+      end
+      line do
+        text 'Terminator3'
+        avatar :person do
+          tooltip "I'll be back - not working", position: :right
+        end
+      end
+    end
+
+    headline 'Buttons'
+
+    button 'Button', type: :raised do
+      tooltip "Yo\nsmile" # position: :left
+    end
+    button 'Button' do
+      tooltip "Yo\nsmile", position: :bottom
+    end
+    button icon: :mood do
+      tooltip "Yo\nsmile", position: :top
+    end
+
+    headline 'Chips'
+    chipset do
+      chip 'Hover over me' do
+        tooltip 'I have this tip!'
+      end
+    end
+
+    headline 'Tables'
+
+    table selectable: true do
+      header do
+        column 'Material'
+        column 'Quantity' do
+          tooltip 'This is the quantity on hand.', position: :top
+        end
+        column 'Unit price'
+      end
+
+      row do
+        column 'Caulk' do
+          tooltip 'This fixes leaks', position: :right
+        end
+        column 99
+        column "$299"
+      end
+    end
+
+
+    headline 'Toggles'
+
+    radio_button do
+      tooltip 'select it'
+    end
+
+    icon_toggle :star_border, on_icon: :star do
+      tooltip 'toggle it - uses on and off icons'
+    end
+
+    switch do
+      tooltip 'switch it'
+    end
+    checkbox do
+      tooltip 'check it'
+    end
+
+
+    headline 'Styles', level: 3
+    
+    headline 'Headline' do
+      tooltip 'I do nothing.'
+    end
+    title 'Title' do
+      tooltip 'I do nothing.'
+    end
+    subheading 'Subheading 2', level: 2 do
+      tooltip 'I do nothing.'
+    end
+    body 'Body 2 text, calling something out.', level: 2 do
+      tooltip 'I do nothing.'
+    end
+
+    attach :code, file: __FILE__
+  end
+end

data/app/demo/components/unordered_list.pom

@@ -0,0 +1,81 @@
+require_relative '../helpers/indented_grid'
+
+Coprl::Presenters.define(:unordered_lists) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :component_drawer
+  page_title 'Unordered Lists'
+  helpers do
+    def actors
+      [OpenStruct.new(name: "Bryan Cranston", episodes: 62, body: 'Bryan Cranston played the role of Walter in Breaking Bad. He is also known for playing Hal in Malcom in the Middle.'),
+       OpenStruct.new(name: "Aaron Paul", episodes: 62, body: 'Aaron Paul played the role of Jesse in Breaking Bad. He also featured in the "Need For Speed" Movie'),
+       OpenStruct.new(name: "Bob Odenkirk", episodes: 62, body: 'Bob Odinkrik played the role of Saul in Breaking Bad. Due to public fondness for the character, Bob stars in his own show now, called "Better Call Saul".'),
+       OpenStruct.new(name: "Giancarlo Esposito", episodes: 24, body: 'Giancarlo Giuseppe Alessandro Esposito played the role of Gustavo "Gus" Fring on the AMC shows Breaking Bad and Better Call Saul.')]
+    end
+  end
+
+  indented_grid do
+
+    headline 'List with Default Bullets'
+    unordered_list do
+      actors.each do |actor|
+         list_item do
+          text actor.name
+        end
+      end
+    end
+
+    headline 'List with Numbers'
+    subtitle '_(Any valid `list-style` works)_'
+    unordered_list list_style: :decimal do
+      actors.each do |actor|
+        list_item do
+          text actor.name
+        end
+      end
+    end
+
+    headline 'Nested Lists'
+    unordered_list do
+      list_item do
+        text 'Breaking Bad'
+        unordered_list do
+          actors.each do |actor|
+            list_item {text actor.name}
+          end
+        end
+      end
+      list_item do
+        text 'The Wire'
+        unordered_list do
+          list_item { text 'Dominic West'}
+          list_item { text 'Wendell Pierce'}
+          list_item { text 'Michael K. Williams'}
+          list_item { text 'Sonja Sohn'}
+        end
+      end
+    end
+
+    headline 'List with Icons'
+    unordered_list do
+      list_item do
+        text 'Money'
+        icon :attach_money
+      end
+      list_item do
+        text 'No Money'
+        icon :money_off
+      end
+      list_item do
+        text 'Font Awesome'
+        icon 'fa-arrow-circle-right'
+      end
+      list_item do
+        text 'Cat'
+        icon 'fa-cat'
+      end
+    end
+
+  end
+
+end

data/app/demo/custom_css.pom

@@ -0,0 +1,37 @@
+require_relative 'helpers/indented_grid'
+
+Coprl::Presenters.define(:custom_css) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+
+  page_title 'Custom CSS' do
+    icon :settings
+  end
+
+
+  indented_grid do
+    headline 'CSS', level: 1
+
+    body 'You can define custom CSS globally and for each namespace/presenter.'
+    blank
+    title 'Global CSS'
+    body 'Define global css in the file `public/presenters/global.css`. Styles defined here will be loaded after default styling.'
+
+    title 'Presenter CSS'
+    body 'Each `[namespace/]presenter` can have custom css.'
+    body 'Simply create a file `public/presenters/[namspace]/[presenter].css` that matches your namespace and presenter.'
+    body 'This page has a presenter css file that is located at: `public/presenters/custom_css.css`'
+
+    title 'Settings'
+    body 'You can set the default path to load css from using the following:'
+    body <<-HTML
+      ```
+        Coprl::Presenters::Settings.configure do |config|
+          config.presenters.web_client.custom_css = 'public/presenters'
+        end
+    ```
+    HTML
+
+  end
+  attach :code, file: __FILE__
+end

data/app/demo/events.pom

@@ -0,0 +1,29 @@
+Coprl::Presenters.define(:events) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :events_drawer
+
+  indented_grid do
+    heading 'Events'
+    body 'Events are able to be attached to most components. ',
+         'Common examples include `click` and `change` events. ',
+         'Events have actions.',
+         "To see how an individual component handles events, visit the [component page](#{presenters_path(:components)})"
+
+    icon 'fa-hand-point-left', position: :left
+    subheading 'Select an event action'
+    body ' '
+    title "Event Action Error Handling"
+    body 'Errors are automatically displayed in the following locations.',
+         '1. Field/input level errors will display on the field/input.',
+         '1. At the top of all forms.',
+         '1. At the top of all dialogs.',
+         '1. At the top of all cards.',
+         '1. At the top of content blocks if they turn on show_errors.',
+         '1. At the top of the page', level: 2
+
+    body 'The closest error element will be used.'\
+               'If you want to control where errors appear. Use the attribute `show_errors=(true|false)`'
+  end
+  attach :code, file: __FILE__
+end

data/app/demo/events/actions/autocomplete.pom

@@ -0,0 +1,32 @@
+Coprl::Presenters.define(:autocomplete_action) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :events_drawer
+
+  indented_grid do
+
+    heading 'Autocomplete'
+    title 'Work In Progress'
+    body 'Provides a text field that when typed into will fetch a set of items to select base on what was typed.',
+         'Useful for providing search clues as the user types.',
+         'The search command returned should either be an array of text terms found,
+              or optionally an id that will also be submitted using the same name as plus `_id` as the text field.'
+
+
+    heading 'Search'
+    content id: :search_field do
+      text_field name: :search, full_width: false do
+        label 'Search Silicon Valley'
+        event :input do
+          autocomplete '/_search_'
+        end
+        event :change do
+          replaces :context_list, :context_list, title: 'Search Results'
+        end
+      end
+    end
+    attach :context_list, title: 'Search Results'
+  end
+
+  attach :code, file: __FILE__
+end

data/app/demo/events/actions/clear.pom

@@ -0,0 +1,25 @@
+Coprl::Presenters.define(:clear_action) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :events_drawer
+
+  indented_grid do
+    heading 'Clear'
+    body 'Allows you to clear a component.',
+         'Takes the id of the element to clear.'
+
+    text_field id: :input_to_clear do
+      label 'Input to clear'
+      value 'Value to clear'
+    end
+
+    subtitle 'Text to clear', id: :text_to_clear
+
+    button 'clear' do
+      event :click do
+        clear :input_to_clear, :text_to_clear
+      end
+    end
+  end
+  attach :code, file: __FILE__
+end

data/app/demo/events/actions/deletes.pom

@@ -0,0 +1,24 @@
+Coprl::Presenters.define(:deletes_action) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :events_drawer
+
+  indented_grid do
+    heading 'Deletes'
+    body 'Issues a DEL to a given url',
+         'Generally used to destroy/delete a restful resource.'
+    body '*Note: Will generate a 404.*'
+
+    title 'Deletes'
+    body 'issues a DELETE to the passed path'
+    content do
+      button 'deletes' do
+        event :click do
+          # Will generate an error
+          deletes 'deletepath', {optional: :params}
+        end
+      end
+    end
+  end
+  attach :code, file: __FILE__
+end

data/app/demo/events/actions/dialog.pom

@@ -0,0 +1,19 @@
+Coprl::Presenters.define(:dialog_action) do
+  helpers Demo::Helpers::IndentedGrid
+  attach :top_nav
+  attach :events_drawer
+  
+  indented_grid do
+    heading 'Dialog'
+    body 'A dialog event displays a, you guessed it, dialog.'
+
+    title 'Dialog'
+    button 'dialog' do
+      event :click do
+        dialog :my_dialog
+      end
+    end
+    attach :show_dialog
+  end
+  attach :code, file: __FILE__
+end

data/app/demo/events/actions/dialogs/discard.pom

@@ -0,0 +1,9 @@
+Coprl::Presenters.define(:discard_dialog) do
+  dialog id: :discard_dialog do
+    title 'Discard unsaved changes?'
+    actions do
+      button :discard, id: :discard_button
+      button :cancel, type: :raised, id: :cancel_button
+    end
+  end
+end

data/app/demo/events/actions/dialogs/show_dialog.pom

@@ -0,0 +1,11 @@
+Coprl::Presenters.define(:show_dialog) do
+  dialog id: :my_dialog do
+    title "Show Dialog"
+    body 'This is an example and event opening a dialog'
+
+    actions do
+      button 'Close'
+      button 'Disabled action', disabled: true
+    end
+  end
+end

data/app/demo/events/actions/dialogs/trigger.pom

@@ -0,0 +1,86 @@
+Coprl::Presenters.define(:trigger_dialog) do
+  attach :top_nav
+  attach :events_drawer
+
+  grid do
+    column 1
+    column 11 do
+      heading 'Events'
+
+      subheading 'Dialog'
+      button 'dialog' do
+        event :click do
+          dialog :my_dialog
+        end
+      end
+      attach :show_dialog
+
+      subheading 'Replaces'
+      button 'replaces' do
+        event :click do
+          replaces :replace_me, :replace_text, text: "I was replaced"
+        end
+      end
+      attach :replace_text
+
+      subheading 'Toggle Visibility'
+      button 'toggle visibility' do
+        event :click do
+          toggle_visibility :toggle_me
+        end
+      end
+      heading 'Sometimes I appear', id: :toggle_me
+
+      subheading 'Snackbar'
+      button 'snackbar' do
+        event :click do
+          snackbar 'I want a snack!'
+        end
+      end
+
+      subheading context['reloaded'] ? "Reloaded" : 'Loads'
+      button 'loads' do
+        event :click do
+          loads :events, reloaded: true
+        end
+      end
+      heading context['reloaded'] ? "Reloaded" : 'Loaded'
+
+      title "A Note on errors:"
+      body ['These will display an error. Errors are displayed in four locations.',
+            '1. Field/input level errors will display on the field/input.',
+            '2. By default all content blocks will display errors. Use `show_errors=false` to turn this off on a block',
+            '3. At the top of all forms.',
+            '4. At the top of the page'], level: 2
+
+      subheading 'Update'
+      body 'issues a PUT to the passed path'
+      content do
+        button 'updates' do
+          event :click do
+            updates 'updatepath', {optional: :params}
+          end
+        end
+      end
+
+      subheading 'Delete'
+      body 'issues a DELETE to the passed path'
+      content do
+        button 'deletes' do
+          event :click do
+            deletes 'deletepath', {optional: :params}
+          end
+        end
+        subheading 'Posts'
+        body "issues a POST to the passed path\nAlias: creates"
+        content shows_errors: false do
+          button 'posts' do
+            event :click do
+              posts 'postpath', {optional: :params}
+            end
+          end
+        end
+      end
+    end
+  end
+end