From c52fa27a2c744f008cd30e46fa00aa14d1b75b87 Mon Sep 17 00:00:00 2001
From: Till Brehm <tbrehm@ispconfig.org>
Date: Sun, 15 Nov 2015 13:23:55 +0100
Subject: [PATCH] Added accordion style collapsible on client limits form.
---
.../client/templates/client_edit_limits.htm | 167 +++++++++++++-----
1 file changed, 126 insertions(+), 41 deletions(-)
diff --git a/interface/web/client/templates/client_edit_limits.htm b/interface/web/client/templates/client_edit_limits.htm
index e7de5c6654..66db76bbc6 100644
--- a/interface/web/client/templates/client_edit_limits.htm
+++ b/interface/web/client/templates/client_edit_limits.htm
@@ -45,11 +45,21 @@
</div>
<div class="form-group">
<label for="reseller" class="col-sm-3 control-label">{tmpl_var name='reseller_txt'}</label>
- <div class="col-sm-9"><input class="form-control" type="checkbox" name="reseller" value="1" id="reseller" /></div></div>
+ <div class="col-sm-9"><input class="form-control" type="checkbox" name="reseller" value="1" id="reseller" /></div>
+ </div>
</tmpl_if>
- <div class="subsectiontoggle"><span class="showing"></span>{tmpl_var name='web_limits_txt'}<em class="showing"></em></div>
- <div>
- <div class="form-group">
+<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
+ <div class="panel panel-default">
+ <div class="panel-heading" role="tab" id="headingWeb">
+ <h4 class="panel-title">
+ <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseWeb" aria-expanded="true" aria-controls="collapseWeb">
+ {tmpl_var name='web_limits_txt'}
+ </a>
+ </h4>
+ </div>
+ <div id="collapseWeb" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingWeb">
+ <div class="panel-body">
+ <div class="form-group">
<label for="web_servers" class="col-sm-3 control-label">{tmpl_var name='web_servers_txt'}</label>
<div class="col-sm-9"><select data-placeholder="{tmpl_var name='web_servers_placeholder'}" multiple name="web_servers[]" id="web_servers" class="form-control">
{tmpl_var name='web_servers'}
@@ -153,10 +163,20 @@
{tmpl_var name='limit_backup'}
</div>
</div>
- </div>
- <div class="col-sm-3"></div><div class="col-sm-9"><button class="btn btn-default formbutton-default" type="button" data-toggle="collapse" data-target="#toggle-email_limits" aria-expanded="false" aria-controls="toggle-email_limits">{tmpl_var name='email_limits_txt'}</button></div>
- <div id="toggle-email_limits" class="collapse">
- <div class="form-group">
+ </div>
+ </div>
+ </div>
+ <div class="panel panel-default">
+ <div class="panel-heading" role="tab" id="headingMail">
+ <h4 class="panel-title">
+ <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseMail" aria-expanded="false" aria-controls="collapseMail">
+ {tmpl_var name='email_limits_txt'}
+ </a>
+ </h4>
+ </div>
+ <div id="collapseMail" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingMail>
+ <div class="panel-body">
+ <div class="form-group">
<label for="mail_servers" class="col-sm-3 control-label">{tmpl_var name='mail_servers_txt'}</label>
<div class="col-sm-9"><select data-placeholder="{tmpl_var name='mail_servers_placeholder'}" multiple name="mail_servers[]" id="mail_servers" class="form-control">
{tmpl_var name='mail_servers'}
@@ -204,11 +224,21 @@
<div class="col-sm-9"><input type="text" name="limit_spamfilter_user" id="limit_spamfilter_user" value="{tmpl_var name='limit_spamfilter_user'}" class="form-control" /></div></div>
<div class="form-group">
<label for="limit_spamfilter_policy" class="col-sm-3 control-label">{tmpl_var name='limit_spamfilter_policy_txt'}</label>
- <div class="col-sm-9"><input type="text" name="limit_spamfilter_policy" id="limit_spamfilter_policy" value="{tmpl_var name='limit_spamfilter_policy'}" class="form-control" /></div></div>
- </div>
- <div class="col-sm-3"></div><div class="col-sm-9"><button class="btn btn-default formbutton-default" type="button" data-toggle="collapse" data-target="#toggle-xmpp_limits" aria-expanded="false" aria-controls="toggle-xmpp_limits">{tmpl_var name='xmpp_limits_txt'}</button></div>
- <div id="toggle-xmpp_limits" class="collapse">
- <div class="form-group">
+ <div class="col-sm-9"><input type="text" name="limit_spamfilter_policy" id="limit_spamfilter_policy" value="{tmpl_var name='limit_spamfilter_policy'}" class="form-control" /></div>
+ </div>
+ </div>
+ </div>
+ <div class="panel panel-default">
+ <div class="panel-heading" role="tab" id="headingXMPP">
+ <h4 class="panel-title">
+ <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseXMPP" aria-expanded="false" aria-controls="collapseXMPP">
+ {tmpl_var name='xmpp_limits_txt'}
+ </a>
+ </h4>
+ </div>
+ <div id="collapseXMPP" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingXMPP">
+ <div class="panel-body">
+ <div class="form-group">
<label for="xmpp_servers" class="col-sm-3 control-label">{tmpl_var name='xmpp_servers_txt'}</label>
<div class="col-sm-9"><select data-placeholder="{tmpl_var name='xmpp_servers_placeholder'}" multiple name="xmpp_servers[]" id="xmpp_servers" class="form-control">
{tmpl_var name='xmpp_servers'}
@@ -268,11 +298,20 @@
{tmpl_var name='limit_xmpp_status'}
</div>
</div>
-
- </div>
- <div class="col-sm-3"></div><div class="col-sm-9"><button class="btn btn-default formbutton-default" type="button" data-toggle="collapse" data-target="#toggle-database_limits" aria-expanded="false" aria-controls="toggle-database_limits">{tmpl_var name='database_limits_txt'}</button></div>
- <div id="toggle-database_limits" class="collapse">
- <div class="form-group">
+ </div>
+ </div>
+ </div>
+ <div class="panel panel-default">
+ <div class="panel-heading" role="tab" id="headingDB">
+ <h4 class="panel-title">
+ <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseDB" aria-expanded="false" aria-controls="collapseDB">
+ {tmpl_var name='database_limits_txt'}
+ </a>
+ </h4>
+ </div>
+ <div id="collapseDB" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingDB">
+ <div class="panel-body">
+ <div class="form-group">
<label for="db_servers" class="col-sm-3 control-label">{tmpl_var name='db_servers_txt'}</label>
<div class="col-sm-9"><select data-placeholder="{tmpl_var name='db_servers_placeholder'}" multiple name="db_servers[]" id="db_servers" class="form-control">
{tmpl_var name='db_servers'}
@@ -284,11 +323,22 @@
<div class="form-group">
<label for="limit_database_quota" class="col-sm-3 control-label">{tmpl_var name='limit_database_quota_txt'}</label>
<div class="col-sm-6"><input type="text" name="limit_database_quota" id="limit_database_quota" value="{tmpl_var name='limit_database_quota'}" class="form-control" /></div><div class="col-sm-3 input-sm"> MB
- </div></div>
- </div>
- <div class="col-sm-3"></div><div class="col-sm-9"><button class="btn btn-default formbutton-default" type="button" data-toggle="collapse" data-target="#toggle-cron_job_limits" aria-expanded="false" aria-controls="toggle-cron_job_limits">{tmpl_var name='cron_job_limits_txt'}</button></div>
- <div id="toggle-cron_job_limits" class="collapse">
- <div class="form-group">
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="panel panel-default">
+ <div class="panel-heading" role="tab" id="headingCron">
+ <h4 class="panel-title">
+ <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseCron" aria-expanded="false" aria-controls="collapseCron">
+ {tmpl_var name='cron_job_limits_txt'}
+ </a>
+ </h4>
+ </div>
+ <div id="collapseCron" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingCron">
+ <div class="panel-body">
+ <div class="form-group">
<label for="limit_cron" class="col-sm-3 control-label">{tmpl_var name='limit_cron_txt'}</label>
<div class="col-sm-9"><input type="text" name="limit_cron" id="limit_cron" value="{tmpl_var name='limit_cron'}" class="form-control" /></div></div>
<div class="form-group">
@@ -299,11 +349,23 @@
</div>
<div class="form-group">
<label for="limit_cron_frequency" class="col-sm-3 control-label">{tmpl_var name='limit_cron_frequency_txt'}</label>
- <div class="col-sm-9"><input type="text" name="limit_cron_frequency" id="limit_cron_frequency" value="{tmpl_var name='limit_cron_frequency'}" class="form-control" /></div></div>
- </div>
- <div class="col-sm-3"></div><div class="col-sm-9"><button class="btn btn-default formbutton-default" type="button" data-toggle="collapse" data-target="#toggle-dns_limits" aria-expanded="false" aria-controls="toggle-dns_limits">{tmpl_var name='dns_limits_txt'}</button></div>
- <div id="toggle-dns_limits" class="collapse">
- <div class="form-group">
+ <div class="col-sm-9"><input type="text" name="limit_cron_frequency" id="limit_cron_frequency" value="{tmpl_var name='limit_cron_frequency'}" class="form-control" /></div>
+ </div>
+
+ </div>
+ </div>
+ </div>
+ <div class="panel panel-default">
+ <div class="panel-heading" role="tab" id="headingDNS">
+ <h4 class="panel-title">
+ <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseDNS" aria-expanded="false" aria-controls="collapseDNS">
+ {tmpl_var name='dns_servers_txt'}
+ </a>
+ </h4>
+ </div>
+ <div id="collapseDNS" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingDNS">
+ <div class="panel-body">
+ <div class="form-group">
<label for="dns_servers" class="col-sm-3 control-label">{tmpl_var name='dns_servers_txt'}</label>
<div class="col-sm-9"><select data-placeholder="{tmpl_var name='dns_servers_placeholder'}" multiple name="dns_servers[]" id="dns_servers" class="form-control">
{tmpl_var name='dns_servers'}
@@ -323,11 +385,22 @@
<div class="col-sm-9"><input type="text" name="limit_dns_slave_zone" id="limit_dns_slave_zone" value="{tmpl_var name='limit_dns_slave_zone'}" class="form-control" /></div></div>
<div class="form-group">
<label for="limit_dns_record" class="col-sm-3 control-label">{tmpl_var name='limit_dns_record_txt'}</label>
- <div class="col-sm-9"><input type="text" name="limit_dns_record" id="limit_dns_record" value="{tmpl_var name='limit_dns_record'}" class="form-control" /></div></div>
- </div>
- <div class="col-sm-3"></div><div class="col-sm-9"><button class="btn btn-default formbutton-default" type="button" data-toggle="collapse" data-target="#toggle-virtualization_limits" aria-expanded="false" aria-controls="toggle-virtualization_limits">{tmpl_var name='virtualization_limits_txt'}</button></div>
- <div id="toggle-virtualization_limits" class="collapse">
- <div class="form-group">
+ <div class="col-sm-9"><input type="text" name="limit_dns_record" id="limit_dns_record" value="{tmpl_var name='limit_dns_record'}" class="form-control" /></div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="panel panel-default">
+ <div class="panel-heading" role="tab" id="headingVM">
+ <h4 class="panel-title">
+ <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseVM" aria-expanded="false" aria-controls="collapseVM">
+ {tmpl_var name='virtualization_limits_txt'}
+ </a>
+ </h4>
+ </div>
+ <div id="collapseVM" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingVM">
+ <div class="panel-body">
+ <div class="form-group">
<label for="limit_openvz_vm" class="col-sm-3 control-label">{tmpl_var name='limit_openvz_vm_txt'}</label>
<div class="col-sm-9"><input type="text" name="limit_openvz_vm" id="limit_openvz_vm" value="{tmpl_var name='limit_openvz_vm'}" class="form-control" /></div></div>
<div class="form-group">
@@ -336,15 +409,27 @@
{tmpl_var name='limit_openvz_vm_template_id'}
</select></div>
</div>
- </div>
- <div class="col-sm-3"></div><div class="col-sm-9"><button class="btn btn-default formbutton-default" type="button" data-toggle="collapse" data-target="#toggle-aps_limits" aria-expanded="false" aria-controls="toggle-aps_limits">{tmpl_var name='aps_limits_txt'}</button></div>
- <div id="toggle-aps_limits" class="collapse">
- <div class="form-group">
+ </div>
+ </div>
+ </div>
+ <div class="panel panel-default">
+ <div class="panel-heading" role="tab" id="headingAPS">
+ <h4 class="panel-title">
+ <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseAPS" aria-expanded="false" aria-controls="collapseAPS">
+ {tmpl_var name='aps_limits_txt'}
+ </a>
+ </h4>
+ </div>
+ <div id="collapseAPS" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingAPS">
+ <div class="panel-body">
+ <div class="form-group">
<label for="limit_aps" class="col-sm-3 control-label">{tmpl_var name='limit_aps_txt'}</label>
- <div class="col-sm-9"><input type="text" name="limit_aps" id="limit_aps" value="{tmpl_var name='limit_aps'}" class="form-control" /></div></div>
- </div>
-
-
+ <div class="col-sm-9"><input type="text" name="limit_aps" id="limit_aps" value="{tmpl_var name='limit_aps'}" class="form-control" /></div>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
<input type="hidden" name="id" value="{tmpl_var name='id'}">
<div class="clear"><div class="right">
--
GitLab