{% extends "base_AdminLTE.html"%}
{% block title %}Docklet | Settings{% endblock %}

{% block panel_title %}Settings{% endblock %}

{% block panel_list %}
<ol class="breadcrumb">
  <li>
      <a href="/dashboard/"><i class="fa fa-dashboard"></i>Home</a>
  </li>
  <li class="active">
      <strong>Settings</strong>
  </li>
</ol>
{% endblock %}

{% block css_src %}

<link href="//cdn.bootcss.com/datatables/1.10.11/css/dataTables.bootstrap.min.css" rel="stylesheet">
<link href="//cdn.bootcss.com/datatables/1.10.11/css/jquery.dataTables_themeroller.css" rel="stylesheet">
<link href="/static/dist/css/modalconfig.css" rel="stylesheet">

{% endblock %}


{% block content %}
<div class="row">
 <div class="col-md-12">
     <div class="box box-info">
         <div class="box-header with-border">
             <h3 class="box-title">Quota</h3>

             <div class="box-tools pull-right">
                 <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
                 </button>
                 <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i>
                 </button>
             </div>
         </div>
         <div class="box-body">
             <button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-target="#AddGroupModal"><i class="fa fa-plus"></i> Add Quota Group</button>
           <div class="modal inmodal" id="AddGroupModal" tabindex="-1" role="dialog" aria-hidden="true">
               <div class="modal-dialog">
               <div class="modal-content animated fadeIn">
                       <div class="modal-header">
                           <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                           <i class="fa fa-laptop modal-icon"></i>
                           <h4 class="modal-title">Add Group</h4>
                           <small class="font-bold">Add a group to Docklet</small>
                       </div>
                       <div class="modal-body">

                            <form action="/group/add/" method="POST" id="addGroupForm">
                                <div class="form-group">
                                    <label>Name</label>
                                    <input type="text" placeholder="Enter Name" class="form-control" name="groupname"/>
                                </div>
                                {% for quota in quotas %}
                                <div class="form-group">
                                    <label>{{ quota['name'] }}</label>
                                    {% if quota['name'] == 'vnode' %}
                                    <small class="font-bold"> Only 2^n - 3 is legal. Any other value will be reset to the nearest 2^n - 3.</small>
                                    {% endif %}
                                    <input type="text" class="form-control" name={{ quota['name'] }} placeholder="{{quota['hint']}}" />
                                </div>
                                {% endfor %}
                            </form>

                       </div>
                       <div class="modal-footer">
                           <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
                           <button type="button" class="btn btn-primary" onClick="javascript:sendAddGroup();">Submit</button>
                       </div>
                   </div>
               </div>
           </div>
             <button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-target="#AddQuotaModal"><i class="fa fa-plus"></i> Add Quota</button>
           <div class="modal inmodal" id="AddQuotaModal" tabindex="-1" role="dialog" aria-hidden="true">
               <div class="modal-dialog">
               <div class="modal-content animated fadeIn">
                       <div class="modal-header">
                           <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                           <i class="fa fa-laptop modal-icon"></i>
                           <h4 class="modal-title">Add Quota</h4>
                           <small class="font-bold">Add a quota to Docklet</small>
                       </div>
                       <div class="modal-body">

                            <form action="/quota/add/" method="POST" id="addQuotaForm">
                                <div class="form-group">
                                    <label>Name</label>
                                    <input type="text" placeholder="Enter Name" class="form-control" name="quotaname"/>
                                </div>
                                <div class="form-group">
                                    <label>Default Value</label>
                                    <input type="text" placeholder="Enter Default Value" class="form-control" name="default_value"/>
                                </div>
                                <div class="form-group">
                                    <label>Hint</label>
                                    <input type="text" placeholder="Enter Hint" class="form-control" name="hint"/>
                                </div>
                            </form>

                       </div>
                       <div class="modal-footer">
                           <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
                           <button type="button" class="btn btn-primary" onClick="javascript:sendAddQuota();">Submit</button>
                       </div>
                   </div>
               </div>
           </div>
             <button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-target="#ChangeDefaultModal"><i class="fa fa-plus"></i> Change Default</button>
           <div class="modal inmodal" id="ChangeDefaultModal" tabindex="-1" role="dialog" aria-hidden="true">
               <div class="modal-dialog">
               <div class="modal-content animated fadeIn">
                       <div class="modal-header">
                           <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                           <i class="fa fa-laptop modal-icon"></i>
                           <h4 class="modal-title">Change Default</h4>
                           <small class="font-bold">Change Default Quota Group</small>
                       </div>
                       <div class="modal-body">
                            <form action="/quota/chdefault/" method="POST" id="chDefaultForm">
                                <div class="form-group">
                                    <label>Default Group</label>
                                    <select class="form-control" name="defaultgroup" value={{ defaultgroup }} />
                                        {% for group in groups %}
                                        <option>{{ group['name'] }}</option>
                                        {% endfor %}
                                    </select>
                                </div>
                            </form>
                       </div>
                       <div class="modal-footer">
                           <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
                           <button type="button" class="btn btn-primary" onClick="javascript:sendChDefault();">Submit</button>
                       </div>
                   </div>
               </div>
           </div>
        <div class="table table-responsive">
         <table id="myGroupTable" class="table table-striped table-bordered">
           <thead>
               <tr>
                   <th>Name</th>
                   {% for quota in quotas %}
                   <th> {{ quota['name'] }} </th>
                   {% endfor %}
                   <th>Command</th>
               </tr>
           </thead>
           <tbody>
               {% for group in groups %}
               <tr>
                   <th>{{ group['name'] }}</th>
                    {% for quota in quotas %}
                    <th> {{ group['quotas'][quota['name']] }} </th>
                    {% endfor %}
                    <th><a class="btn btn-xs btn-info" data-toggle="modal" data-target="#ModifyGroupModal_{{ group['name'] }}">Edit</a>&nbsp;
                    {% if group['name'] in [ "root", "primary", "admin", "foundation" ] %}
                        <a class="btn btn-xs btn-default" href="javascript:void(0)">Delete</a>&nbsp;
                    {% else %}
                        <a class="btn btn-xs btn-danger" href="/group/delete/{{group['name']}}">Delete</a>&nbsp;
                    {% endif %}
                    {% if group['name'] == defaultgroup %}
                        <span class="glyphicon glyphicon-ok"></span>
                    {% endif %}
                    </th>
                    <div class="modal inmodal" id="ModifyGroupModal_{{ group['name'] }}" tabindex="-1" role="dialog" aria-hidden="true">
                        <div class="modal-dialog">
                        <div class="modal-content animated fadeIn">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                                    <i class="fa fa-laptop modal-icon"></i>
                                    <h4 class="modal-title">Modify Group</h4>
                                    <small class="font-bold">Modify a group in Docklet</small>
                                </div>
                                <form action="/group/modify/{{group['name']}}/" method="POST" >
                                    <div class="modal-body">
                                      <div class="form-group">
                                          <label>Name</label>
                                          <input type="text" placeholder="Enter Name" class="form-control" name="groupname" readonly="true" value={{ group['name'] }} />
                                      </div>
                                      {% for quota in quotas %}
                                      <div class="form-group">
                                          <label> {{ quota['name'] }}</label>
                                          {% if quota['name'] == 'vnode' %}
                                          <small class="font-bold"> Only 2^n - 3 are legal. Any other value will be reset to the nearest 2^n - 3.</small>
                                          {% endif %}
                                          <input type="text" placeholder="{{ quota['hint'] }}" class="form-control" name={{ quota['name'] }} value={{ group['quotas'][quota['name']] }} />
                                      </div>
                                      {% endfor %}
                                      <small class="font-bold"> *: The update of <i>vnode</i>, <i>input_rate_limit</i> and <i>output_rate_limit</i> will take effect when a user deletes all his/her workpsaces.</small>
                                    </div>
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
                                        <button type="submit" class="btn btn-primary">Submit</button>
                                    </div>
                                </form>
                        </div>
                        </div>
                    </div>
               </tr>
               {% endfor %}
           </tbody>
         </table>
       </div>
       </div>
     </div>
 </div>
    <div class="col-md-12">
        <div class="box box-info">
            <div class="box-header with-border">
                <h3 class="box-title">Update Base Image</h3>
                    <div class="box-tools pull-right">
                        <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                        <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
                    </div>
            </div>
            <div class="box-body">
                <div class="table table-responsive">
                    <table id="imageTable" class="table table-striped table-bordered">
                        <thead>
                            <tr>
                                <th>ImageName</th>
                                <th>CreateTime</th>
                                <th>Description</th>
                                <th>Operation</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for image in root_image %}
                            <tr>
                                <td>{{image['name']}}</td>
                                <td>{{image['time']}}</td>
                                <td><a href="/image/description/{{image['name']}}_root_private/" target="_blank">{{image['description']}}</a></td>
                                <td><button type="button" class="btn btn-xs btn-success" data-toggle="modal" data-target="#Update_{{image['name']}}">Update</button>
                                <div class="modal inmodal" id="Update_{{image['name']}}" tabindex="-1" role="dialog" aria-hidden="true">
                                    <div class="modal-dialog">
                                        <div class="modal-content animated fadeIn">
                                            <div class="modal-header">
                                                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                                                <i class="fa fa-save modal-icon"></i>
                                                <h4 class="modal-title">Update Package Image</h4>
                                                <small class="font-bold">Update Package Image From Chosen Image</small>
                                            </div>
                                            <div class="modal-body">
                                                <strong>Warning: This operation will update the package image. Maybe it will cause some error and then the package image will be destroyed. Please make sure you have the backup of package image.</strong>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
                                                <a href="/image/0.0.0.0/updatebase/{{image['name']}}/"><button type="button" class="btn btn-success">Update</button></a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </tr>
                            {% endfor %}
                        </tbody>
                     </table>
                 </div>
             </div>
         </div>
     </div>
 <div class="col-md-12">
     <div class="box box-info">
         <div class="box-header with-border">
             <h3 class="box-title">Container Default Setting</h3>

             <div class="box-tools pull-right">
                 <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
                 </button>
                 <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i>
                 </button>
             </div>
         </div>
         <div class="box-body">
             <form id="chlxcsetting" class="form-horizontal" action="/quota/chlxcsetting/" method="POST">
                 <div class="form-group">
                     <label class="control-label col-sm-2">CPU</label>
                     <div class="col-sm-8"><input type="number" class="form-control" name="lxcCpu" id="lxcCpu" value={{lxcsetting['cpu']}} />CORE</div>
                 </div>
                 <div class="form-group">
                     <label class="control-label col-sm-2">MEMORY</label>
                     <div class="col-sm-8"><input type="number" class="form-control" name="lxcMemory" id="lxcMemory" value={{lxcsetting['memory']}} />MB</div>
                 </div>
                 <div class="form-group">
                     <label class="control-label col-sm-2">DISK</label>
                     <div class="col-sm-8"><input type="number" class="form-control" name="lxcDisk" id="lxcDisk" value={{lxcsetting['disk']}} />MB</div>
                 </div>
                 <div class="form-group">
                    <div class="col-sm-4 col-sm-offset-2"><button class="btn btn-primary" type="submit">Modify</button></div>
                 </div>
             </form>
         </div>
     </div>
 </div>
</div>

<div class="row">
  <div class="col-md-12">
      <div class="box box-primary">
          <div class="box-header with-border">
            <h3 class="box-title">Modify Settings</h3>
          </div>
          <div class="box-body">
          <form role="form" action="/settings/update/" method="POST" >
            <div class="box-body">
              <div class="form-group">
                <label for="ADMIN_EMAIL_ADDRESS">Admin Email Address</label>
                <p class="help-block">when an activating request is sent, an e-mail will be sent to this address to remind the admin. </p>
                <p class="help-block">if this address is "", no email will be sent to admin.</p>
                <input type="input" class="form-control" id="ADMIN_EMAIL_ADDRESS" value="{{ settings['ADMIN_EMAIL_ADDRESS'] }}" name="ADMIN_EMAIL_ADDRESS">
              </div>
              <div class="form-group">
                <label for="EMAIL_FROM_ADDRESS">Email From Address</label>
                <p class="help-block">the e-mail address to send activating e-mail to user</p>
                <p class="help-block">if this address is "", no email will be sent out.</p>
                <input type="input" class="form-control" id="EMAIL_FROM_ADDRESS" name="EMAIL_FROM_ADDRESS" value="{{ settings['EMAIL_FROM_ADDRESS'] }}">
              </div>
              <div class="form-group">
                <label for="OPEN_REGISTRY">OPEN_REGISTRY</label>
                <p class="help-block">whether allow user to register a new account</p>
                <p class="help-block">if the value is True, it will allow.</p>
                <input type="input" class="form-control" id="OPEN_REGISTRY" name="OPEN_REGISTRY" value="{{ settings['OPEN_REGISTRY'] }}">
              </div>
              <div class="form-group">
                <label for="APPROVAL_RBT">APPROVAL_RBT</label>
                <p class="help-block">whether to start the approval robot that will approve beans applications from users automatically</p>
                <p class="help-block">if the value is True, it will allow.</p>
                <input type="input" class="form-control" id="APPROVAL_RBT" name="APPROVAL_RBT"  value="{{ settings['APPROVAL_RBT'] }}">
              </div>
            </div>
            <div class="box-footer">
              <button type="submit" class="btn btn-primary">Submit</button>
            </div>
          </form>
        </div>
      </div>
    </div>
</div>

 {% for field in ["docklet"] %}
 <div class="row">
 <div class="col-md-12">
 <div class="box box-info collapsed-box">
      <div class="box-header with-border">
            {% if field == "docklet" %}
             <h3 class="box-title">Docklet Config</h3>
             {% else %}
             <h3 class="box-title">Container Config</h3>
             {% endif %}
             <div class="box-tools pull-right">
                 <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-plus"></i>
                 </button>
                 <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i>
                 </button>
             </div>
      </div>
      <div class="box-body" style="display:none">

        <div class="table table-responsive">
          <table id="myGroupTable" class="table table-striped table-bordered">
           <thead>
               <tr>
                   <th>Parameter</th>
                   <th>Value</th>
                   <th>History (Click to Reuse)</th>
                   <th>Default</th>
                   <th>Command</th>
               </tr>
           </thead>
           <tbody>
              {% for editable in [1,0] %}
               {% for parm in parms[field] %}
               {% if parm["editable"] == editable %}
               <tr>

                    {% if parm["parm"]|length > 20%}
                    <th title={{parm["parm"]}}>{{ parm["parm"]|truncate(20) }}</th>
                    {% else %}
                    <th>{{ parm["parm"] }}</th>
                    {% endif %}

                    {% if parm["val"] == "novalidvaluea" %}
                    <th class="text-muted">No Valid Value</th>
                    {% elif parm["val"]|length > 20 %}
                    <th title="{{parm["val"]}}">{{ parm["val"]|truncate(20) }}</th>
                    {% else %}
                    <th>{{ parm["val"] }}</th>
                    {% endif %}

                    <th>
                    {% for history in parm["history"] %}
                      {% if history|length > 20 %}
                      <a class="btn btn-xs btn-default" data-toggle="modal" data-target="#UseHistoryModal_{{field}}_{{ parm["parm"]|replace(".","") }}_{{ loop.indexo }}" title="{{history}}">{{ history|truncate(20) }}</a>
                      {% else %}
                      <a class="btn btn-xs btn-default" data-toggle="modal" data-target="#UseHistoryModal_{{field}}_{{ parm["parm"]|replace(".","") }}_{{ loop.indexo }}">{{ history }}</a>
                      {% endif %}

                        <div class="modal inmodal" id="UseHistoryModal_{{field}}_{{ parm["parm"]|replace(".","") }}_{{ loop.indexo }}" tabindex="-1" role="dialog" aria-hidden="true">
                        <div class="modal-dialog">
                        <div class="modal-content animated fadeIn">
                                {% if parm["editable"] == 0 %}
                                <div class="modal-header">
                                    <i class="fa fa-laptop modal-icon"></i>
                                    <h4>The parameter <strong> {{ parm["parm"] }} </strong> is non-editable!</h4>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-white" data-dismiss="modal">Well</button>
                                </div>
                                {% else %}
                                <div class="modal-header">
                                    <i class="fa fa-laptop modal-icon"></i>
                                    <h4>Sure to set <strong> {{ parm["parm"] }} </strong>to <strong>{{ history }} </strong>?</h4>
                                </div>
                                <form action="/system/modify/" method="POST">
                                    <div style="display:none">
                                      <input type="text" placeholder="" class="" name="field" value={{field}} />
                                      </div>
                                    <div class="modal-body" style="display:none">
                                      <div class="form-group">
                                          <label>Parameter</label>
                                          <input type="text" placeholder="Enter Parameter" class="form-control" name="parm" value="{{ parm['parm'] }}" readonly="true" />
                                      </div>
                                      <div class="form-group">
                                          <label>Value</label>
                                          <input type="text" placeholder="Enter Value" class="form-control" name="val" value="{{ history }}" />
                                      </div>
                                    </div>
                                    <div class="modal-footer">
                                        <button type="submit" class="btn btn-primary">Yes</button>
                                        <button type="button" class="btn btn-white" data-dismiss="modal">No</button>
                                    </div>
                                </form>
                                {% endif %}
                        </div>
                        </div>
                    </div>
                    {% endfor %}
                    </th>

                    {% if parm["default"]|length > 20 %}
                    <th><a class="btn btn-xs btn-default" data-toggle="modal" data-target="#UseDefaultModal_{{field}}_{{ parm["parm"]|replace(".","") }}" title={{ parm["default"] }}> {{ parm["default"]|truncate(20) }}</a></th>
                    {% else %}
                    <th><a class="btn btn-xs btn-default" data-toggle="modal" data-target="#UseDefaultModal_{{field}}_{{ parm["parm"]|replace(".","") }}"> {{ parm["default"] }}</a></th>
                    {% endif %}
                    <th>
                      <a class="btn btn-xs btn-success" data-toggle="modal" data-target="#ViewParmModal_{{field}}_{{ parm["parm"]|replace(".","") }}">Details</a>&nbsp;
                    </th>
                    <div class="modal inmodal" id="ViewParmModal_{{field}}_{{ parm["parm"]|replace(".","") }}" tabindex="-1" role="dialog" aria-hidden="true" class="container">
                        <div class="modal-dialog">
                        <div class="modal-content animated fadeIn">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                                    <h4>Details of {{parm['parm']}}</h4>
                                </div>
                                <div class="modal-body">
                                  <pre>{{ parm['details'] }}</pre>
                                </div>
                                <div class="modal-footer">                                        <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
                                </div>
                        </div>
                        </div>
                    </div>
                    <div class="modal inmodal" id="ModifyParmModal_{{field}}_{{ parm["parm"]|replace(".","") }}" tabindex="-1" role="dialog" aria-hidden="true">
                        <div class="modal-dialog">
                        <div class="modal-content animated fadeIn">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                                    <i class="fa fa-laptop modal-icon"></i>
                                    <h4 class="modal-title">Modify Parameter</h4>
                                    <small class="font-bold">Modify a parameter in Docklet</small>
                                </div>
                                <form action="/system/modify/" method="POST" >
                                  <div style="display:none">
                                      <input type="text" placeholder="" class="" name="field" value={{field}} />
                                      </div>
                                    <div class="modal-body">
                                      <div class="form-group">
                                          <label>Parameter</label>
                                          <input type="text" placeholder="Enter Parameter" class="form-control" name="parm" value="{{ parm['parm'] }}" readonly="true" />
                                      </div>
                                      <div class="form-group">
                                          <label>Value</label>
                                          {% if parm['val'] == "novalidvaluea" %}
                                          <input type="text" placeholder="Enter Value" class="form-control" name="val" value="" />
                                          {% else %}
                                          <input type="text" placeholder="Enter Value" class="form-control" name="val" value="{{ parm['val'] }}" />
                                          {% endif %}
                                      </div>
                                    </div>
                                    <div class="modal-footer">
                                        <button type="submit" class="btn btn-primary">Submit</button>
                                        <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
                                    </div>
                                </form>
                        </div>
                        </div>
                    </div>
                    <div class="modal inmodal" id="UseDefaultModal_{{field}}_{{ parm["parm"]|replace(".","") }}" tabindex="-1" role="dialog" aria-hidden="true">
                        <div class="modal-dialog">
                        <div class="modal-content animated fadeIn">
                                {% if parm["editable"] == 0 %}
                                <div class="modal-header">
                                    <i class="fa fa-laptop modal-icon"></i>
                                    <h4>The parameter <strong> {{ parm["parm"] }} </strong> is non-editable!</h4>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-white" data-dismiss="modal">Well</button>
                                </div>
                                {% else %}
                                <div class="modal-header">
                                    <i class="fa fa-laptop modal-icon"></i>
                                    <h4>Sure to set <strong> {{ parm["parm"] }} </strong> to <strong> {{ parm["default"] }} </strong> ?</h4>
                                </div>
                                <form action="/system/modify/" method="POST">
                                    <div style="display:none">
                                      <input type="text" placeholder="" class="" name="field" value={{field}} />
                                      </div>
                                    <div class="modal-body" style="display:none">
                                      <div class="form-group">
                                          <label>Parameter</label>
                                          <input type="text" placeholder="Enter Parameter" class="form-control" name="parm" value="{{ parm['parm'] }}" readonly="true" />
                                      </div>
                                      <div class="form-group">
                                          <label>Value</label>
                                          <input type="text" placeholder="Enter Value" class="form-control" name="val" value="{{ parm["default"] }}" />
                                      </div>
                                    </div>
                                    <div class="modal-footer">
                                        <button type="submit" class="btn btn-primary">Yes</button>
                                        <button type="button" class="btn btn-white" data-dismiss="modal">No</button>
                                    </div>
                                </form>
                                {% endif %}
                        </div>
                        </div>
                    </div>
               </tr>
               {% endif %}
               {% endfor %}
               {% endfor %}
           </tbody>
         </table>
         </div>
      </div>
    </div>
 </div>
</div>
{% endfor %}

 <div class="row">
 <div class="col-md-12">
 <div class="box box-info collapsed-box">
      <div class="box-header with-border">
             <h3 class="box-title">Container Config</h3>
             <div class="box-tools pull-right">
                 <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-plus"></i>
                 </button>
                 <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i>
                 </button>
             </div>
      </div>
      <div class="box-body" style="display:none">
      <pre> {{ parms["container"] }} </pre>
      </div>
      </div>
      </div>
      </div>

{% endblock %}

{% block script_src %}
<script src="//cdn.bootcss.com/datatables/1.10.11/js/jquery.dataTables.min.js"></script>
<script src="//cdn.bootcss.com/datatables/1.10.11/js/dataTables.bootstrap.min.js"></script>
<script src="http://cdn.bootcss.com/datatables-tabletools/2.1.5/js/TableTools.min.js"></script>

<script type="text/javascript">
    $(document).ready(function() {
      $('#myGroupTable').DataTable();
    })
    function sendAddGroup(){
        document.getElementById("addGroupForm").submit();
    }
    function sendAddQuota(){
        document.getElementById("addQuotaForm").submit();
    }
    function sendChDefault(){
        document.getElementById("chDefaultForm").submit();
    }
    function setFormGroup(arg){
      $.post("/group/query/",
      {
        name: arg
      },
      function(data,status){
        var result = eval("("+data+")").data;
        $("#mGroupname").val(result.name);
        $("#mCpu").val(result.cpu);
        $("#mMemory").val(result.memory);
        $("#mImage").val(result.imageQuantity);
        $("#mLifecycle").val(result.lifeCycle);
      });
    }
</script>
{% endblock %}