libs/cbi: implement tabbing to split large sections and group options in tabs

[project/luci.git] / libs / cbi / luasrc / view / cbi / tsection.htm

diff --git a/libs/cbi/luasrc/view/cbi/tsection.htm b/libs/cbi/luasrc/view/cbi/tsection.htm
index 33d5c8e..7fdd7f4 100644 (file)
--- a/libs/cbi/luasrc/view/cbi/tsection.htm
+++ b/libs/cbi/luasrc/view/cbi/tsection.htm
@@ -24,12 +24,15 @@ $Id$
                                <input type="submit" name="cbi.rts.<%=self.config%>.<%=k%>" value="<%:cbi_del%>" />
                        </div>
                <%- end %>
-               <% section = k; isempty = false %>
+
+               <%- section = k; isempty = false -%>
 
                <% if not self.anonymous then -%>
-                       <h3><%=k:upper()%></h3>
+                       <h3><%=section:upper()%></h3>
                <%- end %>
 
+               <%+cbi/tabmenu%>
+
                <fieldset class="cbi-section-node" id="cbi-<%=self.config%>-<%=section%>">
                        <%+cbi/ucisection%>
                </fieldset>
@@ -41,13 +44,19 @@ $Id$
        <%- end %>
 
        <% if self.addremove then -%>
+               <% if self.template_addremove then include(self.template_addremove) else -%>
                <div class="cbi-section-create">
                        <% if self.anonymous then -%>
                                <input type="submit" class="cbi-button cbi-button-add" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>" value="<%:cbi_add%>" />
                        <%- else -%>
+                               <% if self.invalid_cts then -%><div class="cbi-section-error"><% end %>
                                <input type="text" class="cbi-section-create-name" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>" />
                                <input type="submit" class="cbi-button cbi-button-add" value="<%:cbi_add%>" />
+                               <% if self.invalid_cts then -%>
+                                       <br /><%:cbi_invalid%></div>
+                               <%- end %>
                        <%- end %>
                </div>
+               <%- end %>
        <%- end %>
 </fieldset>