Merge branch 'sub-categories' of https://github.com/bepetersn/flask-admin into nested-categories

flask_admin/base.py

@@ -9,7 +9,7 @@ from flask_admin._compat import with_metaclass, as_unicode
 from flask_admin import helpers as h
 
 # For compatibility reasons import MenuLink
-from flask_admin.menu import MenuCategory, MenuView, MenuLink  # noqa: F401
+from flask_admin.menu import MenuCategory, MenuView, MenuLink, SubMenuCategory # noqa: F401
 
 
 def expose(url='/', methods=('GET',)):
@@ -581,6 +581,27 @@ class Admin(object):
         for view in args:
             self.add_view(view)
 
+    def add_sub_category(self, name, parent_name):
+
+        """
+            Add a category of a given name underneath
+            the category with parent_name.
+
+            :param name:
+                The name of the new menu category.
+            :param parent_name:
+                The name of a parent_name category
+        """
+
+        name_text = as_unicode(name)
+        parent_name_text = as_unicode(parent_name)
+        category = self.get_category_menu_item(name_text)
+        parent = self.get_category_menu_item(parent_name_text)
+        if category is None and parent is not None:
+            category = SubMenuCategory(name)
+            self._menu_categories[name_text] = category
+            parent.add_child(category)
+
     def add_link(self, link):
         """
             Add link to menu links collection.

flask_admin/menu.py

@@ -7,7 +7,7 @@ class BaseMenu(object):
     """
     def __init__(self, name, class_name=None, icon_type=None, icon_value=None, target=None):
         self.name = name
-        self.class_name = class_name
+        self.class_name = class_name if class_name is not None else ''
         self.icon_type = icon_type
         self.icon_value = icon_value
         self.target = target
@@ -141,3 +141,10 @@ class MenuLink(BaseMenu):
 
     def get_url(self):
         return self.url or url_for(self.endpoint)
+
+
+class SubMenuCategory(MenuCategory):
+    def __init__(self, *args, **kwargs):
+        super(SubMenuCategory, self).__init__(*args, **kwargs)
+        self.class_name += ' dropdown-submenu'
+

flask_admin/static/admin/css/bootstrap3/submenu.css

+.nav li.dropdown ul.dropdown-menu li:hover ul {
+	display:block;
+	position:absolute;
+	left:100%;
+	-webkit-border-radius: 3px;
+	-moz-border-radius: 3px;
+	border-radius: 3px;
+}
+.nav li.dropdown ul.dropdown-menu ul {
+	display: none;
+	float:right;
+	position: relative;
+	top: auto;
+	margin-top: -30px;
+}
+.nav li.dropdown a.dropdown-toggle .glyphicon {
+	margin: 0 4px;
+}

flask_admin/templates/bootstrap2/admin/layout.html

@@ -20,25 +20,33 @@
     {%- if item.is_category() -%}
       {% set children = item.get_children() %}
       {%- if children %}
-        {% set class_name = item.get_class_name() %}
+        {% set class_name = item.get_class_name() or '' %}
         {%- if item.is_active(admin_view) %}
-        <li class="active dropdown">
+        <li class="active dropdown{% if class_name %} {{class_name}}{% endif %}">
         {% else -%}
-        <li class="dropdown">
+        <li class="dropdown{% if class_name %} {{class_name}}{% endif %}">
         {%- endif %}
           <a class="dropdown-toggle" data-toggle="dropdown" href="javascript:void(0)">
-            {% if item.class_name %}<i class="{{ item.class_name }}"></i> {% endif %}{{ item.name }}<b class="caret"></b>
+            {% if item.class_name %}<i class="{{ item.class_name }}"></i> {% endif %}
+            {{ menu_icon(item) }}{{ item.name }}
+            {%- if 'dropdown-submenu' not in class_name -%}<b class="caret"></b>{%- endif -%}
           </a>
           <ul class="dropdown-menu">
           {%- for child in children -%}
+            {%- if child.is_category() -%}
+              {{ menu(menu_root=[child]) }}
+            {% else %}
               {% set class_name = child.get_class_name() %}
               {%- if child.is_active(admin_view) %}
               <li class="active{% if class_name %} {{class_name}}{% endif %}">
               {% else %}
               <li{% if class_name %} class="{{class_name}}"{% endif %}>
               {%- endif %}
-              <a href="{{ child.get_url() }}"{% if child.target %} target="{{ child.target }}"{% endif %}>{{ menu_icon(child) }}{{ child.name }}</a>
+              <a href="{{ child.get_url() }}"{% if child.target %}
+               target="{{ child.target }}"{% endif %}>
+              {{ menu_icon(child) }}{{ child.name }}</a>
               </li>
+            {%- endif %}
           {%- endfor %}
           </ul>
         </li>

flask_admin/templates/bootstrap3/admin/base.html

@@ -17,6 +17,7 @@
         <link href="{{ admin_static.url(filename='bootstrap/bootstrap3/css/bootstrap-theme.min.css', v='3.3.5') }}" rel="stylesheet">
         {%endif%}
         <link href="{{ admin_static.url(filename='admin/css/bootstrap3/admin.css', v='1.1.1') }}" rel="stylesheet">
+	<link href="{{ admin_static.url(filename='admin/css/bootstrap3/submenu.css') }}" rel="stylesheet">
         {% if admin_view.extra_css %}
           {% for css_url in admin_view.extra_css %}
             <link href="{{ css_url }}" rel="stylesheet">

flask_admin/templates/bootstrap3/admin/layout.html

@@ -20,25 +20,37 @@
     {%- if item.is_category() -%}
       {% set children = item.get_children() %}
       {%- if children %}
-        {% set class_name = item.get_class_name() %}
+        {% set class_name = item.get_class_name() or '' %}
         {%- if item.is_active(admin_view) %}
-        <li class="active dropdown">
+        <li class="active dropdown{% if class_name %} {{class_name}}{% endif %}">
         {% else -%}
-        <li class="dropdown">
+        <li class="dropdown{% if class_name %} {{class_name}}{% endif %}">
         {%- endif %}
           <a class="dropdown-toggle" data-toggle="dropdown" href="javascript:void(0)">
-            {% if item.class_name %}<span class="{{ item.class_name }}"></span> {% endif %}{{ item.name }}<b class="caret"></b>
+            {% if item.class_name %}<span class="{{ item.class_name }}"></span> {% endif %}
+            {{ menu_icon(item) }}{{ item.name }}
+            {%- if 'dropdown-submenu' in class_name -%}
+            <i class="glyphicon glyphicon-chevron-right small"></i>
+            {%- else -%}
+            <i class="glyphicon glyphicon-chevron-down small"></i>
+            {%- endif -%}
           </a>
           <ul class="dropdown-menu">
           {%- for child in children -%}
+            {%- if child.is_category() -%}
+              {{ menu(menu_root=[child]) }}
+            {% else %}
               {% set class_name = child.get_class_name() %}
               {%- if child.is_active(admin_view) %}
               <li class="active{% if class_name %} {{class_name}}{% endif %}">
               {% else %}
               <li{% if class_name %} class="{{class_name}}"{% endif %}>
               {%- endif %}
-              <a href="{{ child.get_url() }}"{% if child.target %} target="{{ child.target }}"{% endif %}>{{ menu_icon(child) }}{{ child.name }}</a>
+              <a href="{{ child.get_url() }}"{% if child.target %}
+               target="{{ child.target }}"{% endif %}>
+              {{ menu_icon(child) }}{{ child.name }}</a>
               </li>
+            {%- endif %}
           {%- endfor %}
           </ul>
         </li>