navtastic 0.0.1 → 0.1.0

data/lib/navtastic/menu.rb

@@ -1,6 +1,16 @@
 module Navtastic
   # Stores items generated by a definition block
   class Menu
+    # Configuration settings per menu
+    class Configuration
+      # @return [String,nil] a url to prepend every item url with
+      attr_accessor :base_url
+
+      def initialize
+        @base_url = nil
+      end
+    end
+
     include Enumerable
 
     # @return [Array<Item>] the items in this menu
@@ -9,15 +19,18 @@ module Navtastic
     # @return [Menu,nil] this parent of this menu
     attr_reader :parent
 
+    # @return [Menu::Configuration] the configuration for this menu
+    attr_reader :config
+
     # Create a new empty menu
     #
-    # @param root [Menu] the root menu of this is a submenu
+    # @param parent [Menu] the parent menu of this is submenu
     def initialize(parent = nil)
       @parent = parent
 
+      @config = Menu::Configuration.new
       @current_item = nil
       @items = []
-      @items_by_url = {}
     end
 
     # @return [true] if this menu is the root menu
@@ -43,14 +56,24 @@ module Navtastic
     #
     # @param name [String]the name to display in the menu
     # @param url [String] the url to link to, if the item is a link
+    # @param options [Hash] extra confiration options
     #
     # @yield [submenu] block to generate a sub menu
     # @yieldparam submenu [Menu] the menu to be initialized
-    def item(name, url = nil)
-      item = Item.new(self, name, url)
+    def item(name, url = nil, options = {})
+      # If only options were given and no url, move options to the right place
+      if url.is_a?(Hash) && options.empty?
+        options = url
+        url = nil
+      end
+
+      item = Item.new(self, name, url, options)
 
       if block_given?
         submenu = Menu.new(self)
+
+        submenu.config.base_url = url if options[:base_url] && url
+
         yield submenu
         item.submenu = submenu
       end
@@ -74,7 +97,7 @@ module Navtastic
     # @return [Item] if an item with that url exists
     # @return [nil] if the item doens't exist
     def [](url)
-      @items_by_url[url]
+      items_by_url[url]
     end
 
     # Sets the current active item by url
@@ -87,7 +110,7 @@ module Navtastic
       return if current_url.nil?
 
       # Sort urls from longest to shortest and find the first matching substring
-      matching_item = @items_by_url
+      matching_item = items_by_url
                       .sort_by { |url, _item| -url.length }.to_h
                       .find { |url, _item| current_url.start_with? url }
 
@@ -106,6 +129,17 @@ module Navtastic
       end
     end
 
+    # The base url of this menu, including all parent base urls
+    #
+    # @return [String]
+    def base_url
+      base_url = config.base_url.to_s
+      base_url.prepend Navtastic.configuration.base_url.to_s if root?
+      base_url.prepend @parent.base_url.to_s unless root?
+      base_url = nil if base_url.empty?
+      base_url
+    end
+
     protected
 
     # Register a newly added item
@@ -114,14 +148,23 @@ module Navtastic
     def register_item(item)
       return unless item.url
 
-      @items_by_url[item.url] = item
-
       if root?
         # The first item with a url is the default current item
-        @current_item = item if @current_item.nil? && item.url
+        @current_item = item if @current_item.nil?
       else
         @parent.register_item(item)
       end
     end
+
+    def items_by_url
+      indexed_items = {}
+
+      @items.each do |item|
+        indexed_items[item.url] = item if item.url?
+        indexed_items.merge!(item.submenu.items_by_url) if item.submenu?
+      end
+
+      indexed_items
+    end
   end
 end

data/lib/navtastic/renderer.rb

@@ -1,7 +1,9 @@
 require 'arbre'
 
 module Navtastic
-  # Generate HTML based on a menu
+  # Generate HTML based on a menu.
+  #
+  # This base renderer only generates a structure and no css classes.
   #
   # The actual HTML generation is done using the
   # [Arbre](https://github.com/activeadmin/arbre) gem.
@@ -11,39 +13,32 @@ module Navtastic
     # Create a new renderer
     #
     # @param menu [Menu]
+    # @param options [Hash]
     #
-    # @return [Renderer]
-    def self.render(menu)
-      new(menu: menu) do
-        menu(menu)
+    # @return [Self]
+    def self.render(menu, options = {})
+      new(root: menu, options: options) do
+        render_menu(root)
       end
     end
 
-    # Starting a new root menu or submenu (e.g. `<ul>` tag)
+    # Start a new root menu or submenu (e.g. `<ul>` tag)
     #
     # @param menu [Menu]
     # @return [Arbre::HTML::Tag]
-    def menu(menu)
-      ul do
-        menu.each do |item|
-          item_container item
-        end
-      end
+    def menu_tag(menu) # rubocop:disable Lint/UnusedMethodArgument
+      ul { yield }
     end
 
     # The container for every menu item (e.g. `<li>` tags)
     #
     # @param item [Item]
     # @return [Arbre::HTML::Tag]
-    def item_container(item)
-      li(class: css_classes_string(item, :item_container)) do
-        item_content item
-
-        menu(item.submenu) if item.submenu?
-      end
+    def item_tag(item) # rubocop:disable Lint/UnusedMethodArgument
+      li { yield }
     end
 
-    # The item itself (e.g. `<a>` tag for links)
+    # The item itself (e.g. `<a>` tag for links or `<span>` for text)
     #
     # @param item [Item]
     # @return [Arbre::HTML::Tag]
@@ -51,37 +46,65 @@ module Navtastic
       if item.url
         a(href: item.url) { item.name }
       else
-        span item.name
+        span { item.name }
       end
     end
 
-    # Decide which css classes are needed for this item
+    # Check if a submenu should be displayed inside the item container of after
+    # it.
     #
-    # For example, the {#item_container} uses this to retrieve the css class for
-    # the current active item.
+    # Defaults to `true`.
     #
-    # @param item [Item] the current item that is rendered
-    # @param context [Symbol] which method is asking for the css classes
+    # @param item [Item]
+    # @return [bool]
+    def menu_inside_container?(item) # rubocop:disable Lint/UnusedMethodArgument
+      true
+    end
+
+    private
+
+    # Render the menu structure
     #
-    # @return [Array<String>] list of css classes to apply to the HTML element
-    def css_classes(item, context)
-      classes = []
+    # @param menu [Menu]
+    # @return [Arbre::HTML::Tag]
+    def render_menu(menu)
+      menu_tag(menu) do
+        menu.each do |item|
+          render_item(item)
+        end
+      end
+    end
 
-      case context
-      when :item_container
-        classes << 'current' if item.current?
+    # Render the item structure
+    #
+    # @param item [Item]
+    # @return [Arbre::HTML::Tag]
+    def render_item(item)
+      element = item_tag(item) do
+        render_item_content(item)
       end
 
-      classes
+      # Add custom css classes to the element
+      element.class_list << item.options[:class] if item.options[:class]
+
+      return unless item.submenu? && !menu_inside_container?(item)
+      render_menu(item.submenu)
     end
 
-    # Same as {css_classes} method, but joins classes together in a string
+    # Render the item content
     #
-    # @see css_classes
-    #
-    # @return [String]
-    def css_classes_string(item, context)
-      css_classes(item, context).join ' '
+    # @param item [Item]
+    # @return [Arbre::HTML::Tag]
+    def render_item_content(item)
+      element = item_content(item)
+
+      # Add custom css classes to the element
+      if item.options[:content_class] && element.respond_to?(:class_list)
+        element.class_list << item.options[:content_class]
+      end
+
+      return unless item.submenu? && menu_inside_container?(item)
+      render_menu(item.submenu)
     end
   end
 end

data/lib/navtastic/renderer/bootstrap4.rb

@@ -0,0 +1,35 @@
+require 'arbre'
+
+module Navtastic
+  class Renderer
+    # This renderer adds css classes and structure for the bootstrap 4
+    # framework
+    class Bootstrap4 < Navtastic::Renderer
+      def menu_tag(_menu)
+        class_list = ['nav']
+        class_list << 'flex-column' if vertical?
+
+        ul(class: class_list.join(' ')) { yield }
+      end
+
+      def item_tag(item)
+        element = super(item)
+        element.class_list << 'nav-item'
+        element
+      end
+
+      def item_content(item)
+        element = super(item)
+        element.class_list << 'nav-link'
+        element.class_list << 'active' if item.current?
+        element
+      end
+
+      private
+
+      def vertical?
+        true
+      end
+    end
+  end
+end

data/lib/navtastic/renderer/bulma.rb

@@ -0,0 +1,44 @@
+require 'arbre'
+
+module Navtastic
+  class Renderer
+    # This renderer adds css classes and structure for the bulma.io framework
+    # @see file:README.md#Bulma_Configuration documentation on bulma renderer
+    #   options
+    class Bulma < Navtastic::Renderer
+      def submenu_inside_container?(item)
+        !(headers? && item.menu.root?)
+      end
+
+      def menu_tag(menu)
+        if headers? && menu.root?
+          nav(class: 'menu') { yield }
+        else
+          ul(class: 'menu-list') { yield }
+        end
+      end
+
+      def item_tag(item)
+        if headers? && item.menu.root?
+          para(class: 'menu-label') { yield }
+        else
+          li { yield }
+        end
+      end
+
+      def item_content(item)
+        element = super(item)
+
+        element.class_list << 'is-active' if item.current?
+
+        element
+      end
+
+      private
+
+      def headers?
+        options[:headers]
+      end
+    end
+  end
+end

data/lib/navtastic/renderer/foundation6.rb

@@ -0,0 +1,58 @@
+require 'arbre'
+
+module Navtastic
+  class Renderer
+    # This renderer adds css classes and structure for the foundation 6
+    # framework
+    # @see file:README.md#Foundation_Configuration documentation on foundation
+    #   renderer options
+    class Foundation6 < Navtastic::Renderer
+      def menu_tag(menu)
+        class_list = ['menu']
+        class_list << 'vertical' if vertical?
+        class_list << 'nested' unless menu.root?
+
+        list = ul(class: class_list.join(' ')) { yield }
+
+        if drilldown? && menu.root?
+          list.class_list << 'drilldown'
+          list.set_attribute('data-drilldown', true)
+        end
+
+        list
+      end
+
+      def item_tag(item)
+        element = super(item)
+        element.class_list << 'is-active' if item.current?
+        element
+      end
+
+      def item_content(item)
+        element = if item.url?
+                    a(href: item.url) { item.name }
+                  elsif drilldown?
+                    a(href: '#') { item.name }
+                  else
+                    span(class: 'menu-text') { item.name }
+                  end
+
+        if drilldown? && item.active? && options[:active_class]
+          element.class_list << options[:active_class]
+        end
+
+        element
+      end
+
+      private
+
+      def vertical?
+        true
+      end
+
+      def drilldown?
+        options[:style] == :drilldown
+      end
+    end
+  end
+end

data/lib/navtastic/renderer/simple.rb

@@ -0,0 +1,18 @@
+require 'arbre'
+
+module Navtastic
+  class Renderer
+    # This renderer only adds a `current` css class to the current item
+    class Simple < Navtastic::Renderer
+      def item_tag(item)
+        li(class: current_css_class(item)) { yield }
+      end
+
+      private
+
+      def current_css_class(item)
+        item.current? ? 'current' : nil
+      end
+    end
+  end
+end

data/lib/navtastic/version.rb

@@ -1,3 +1,3 @@
 module Navtastic
-  VERSION = '0.0.1'.freeze
+  VERSION = '0.1.0'.freeze
 end

data/spec/demo/index.rhtml

@@ -1,29 +1,16 @@
-<%
-Navtastic.define :main_menu do |menu|
-  menu.item "Home", '/' do |submenu|
-    submenu.item "Posts", '/posts'
-    submenu.item "About", '/about'
-  end
-
-  menu.item "Settings" do |submenu|
-    submenu.item "General", '/settings'
-    submenu.item "Profile", '/settings/profile'
-  end
-end
-%>
-
 <html>
   <head>
     <title>Navtastic Demo Server</title>
-    <style type="text/css">
-      .current { font-weight: bold }
-      .current ul { font-weight: normal }
-    </style>
   </head>
 
   <body>
-    <%= Navtastic.render :main_menu, current_url %>
+    <h1>Renderers:</h1>
 
-    <pre>current_url: <%= current_url %></pre>
+    <ul>
+      <li><a href="simple">Simple</a></li>
+      <li><a href="bootstrap4">Bootstrap4</a></li>
+      <li><a href="bulma">Bulma</a></li>
+      <li><a href="foundation6">Foundation6</a></li>
+    </ul>
   </body>
 </html>