Merge pull request #1 from Curlyfingers/sub-categories

Added submenu feature for bootstrap3 template

flask_admin/base.py

@@ -569,11 +569,13 @@ class Admin(object):
                 The name of a parent_name category
         """
 
-        category = self.get_category_menu_item(name)
-        parent = self.get_category_menu_item(parent_name)
+        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] = category
+            self._menu_categories[name_text] = category
             parent.add_child(category)
 
     def add_link(self, link):

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/bootstrap3/admin/base.html

@@ -15,6 +15,7 @@
         <link href="{{ admin_static.url(filename='bootstrap/bootstrap3/css/bootstrap.min.css', v='3.3.5') }}" rel="stylesheet">
         <link href="{{ admin_static.url(filename='bootstrap/bootstrap3/css/bootstrap-theme.min.css', v='3.3.5') }}" rel="stylesheet">
         <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">
         <style>
         body {
             padding-top: 4px;

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 -%}
-            {% set class_name = child.get_class_name() %}
-            {%- if child.is_active(admin_view) %}
-            <li class="active{% if class_name %} {{class_name}}{% endif %}">
+            {%- if child.is_category() -%}
+              {{ menu(menu_root=[child]) }}
             {% else %}
-            <li{% if class_name %} class="{{class_name}}"{% endif %}>
+              {% 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>
+              </li>
             {%- endif %}
-              <a href="{{ child.get_url() }}"{% if child.target %} target="{{ child.target }}"{% endif %}>{{ menu_icon(child) }}{{ child.name }}</a>
-            </li>
           {%- endfor %}
           </ul>
         </li>