229 lines
9.5 KiB
HTML
229 lines
9.5 KiB
HTML
{% extends 'base_AdminLTE.html' %}
|
|
|
|
{% block title %}Docklet | Create Workspace{% endblock %}
|
|
|
|
{% block css_src %}
|
|
<!--<style>
|
|
.divcontent { overflow-y:scroll; height:200px;}
|
|
</style>-->
|
|
<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 panel_title %}Workspace Info{% endblock %}
|
|
|
|
{% block panel_list %}
|
|
<ol class="breadcrumb">
|
|
<li>
|
|
<a href="/dashboard/"><i class="fa fa-dashboard"></i>Home</a>
|
|
</li>
|
|
</ol>
|
|
{% endblock %}
|
|
|
|
<div>
|
|
{% block content %}
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<div class="box box-info">
|
|
<div class="box-header with-border">
|
|
<h3 class="box-title">Workspace Add</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="form" class="form-horizontal" action="/workspace/{{masterips[0].split("@")[0]}}/add/" method="POST">
|
|
|
|
<div class="form-group"><label class="col-sm-2 control-label">Workspace Name</label>
|
|
<div class="col-sm-10"><input type="text" class="form-control" name="clusterName" id="clusterName"></div>
|
|
</div>
|
|
<div class="hr-line-dashed"></div>
|
|
<br/>
|
|
<div class="form-group"><label class="col-sm-2 control-label">Location</label>
|
|
<div class="col-sm-10"><select id="masterselector" class="form-control">
|
|
{% for master in masterips %}
|
|
<option value="{{master.split("@")[0]}}">{{master.split("@")[1]}}</option>
|
|
{% endfor %}
|
|
</select></div>
|
|
</div>
|
|
<br/>
|
|
<div class="form-group"><label class="col-sm-2 control-label"></label>
|
|
<div class="col-sm-10"><p id="masterdesc">{{masterdesc}}</p></div>
|
|
</div>
|
|
<br/>
|
|
<div class="form-group"><label class="col-sm-2 control-label">Image Choose</label>
|
|
<div class="col-sm-10">
|
|
<table id="imagetable" class="table table-striped table-bordered table-hover table-image" >
|
|
<thead>
|
|
<tr>
|
|
<th>ImageName</th>
|
|
<th>Type</th>
|
|
<th>Owner</th>
|
|
<th>Description</th>
|
|
<th>Choose</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>base</td>
|
|
<td>public</td>
|
|
<td>docklet</td>
|
|
<td>A base image for you</td>
|
|
<td><div class="i-checks"><label><input type="radio" name="image" value="base_base_base" checked="checked"></label></div></td>
|
|
</tr>
|
|
{% for image in images['private'] %}
|
|
<tr>
|
|
<td>{{image['name']}}</td>
|
|
<td>private</td>
|
|
<td>{{user}}</td>
|
|
<td><a href="/image/{{masterips[0].split("@")[1]}}/description/{{image['name']}}_{{user}}_private/" target="_blank">{{image['description']}}</a></td>
|
|
<td><div class="i-checks"><label><input type="radio" name="image" value="{{image['name']}}_{{user}}_private"></label></div></td>
|
|
</tr>
|
|
{% endfor %}
|
|
{% for p_user,p_images in images['public'].items() %}
|
|
{% for image in p_images %}
|
|
<tr>
|
|
<td>{{image['name']}}</td>
|
|
<td>public</td>
|
|
<td>{{p_user}}</td>
|
|
<td><a href="/image/{{masterips[0].split("@")[1]}}/description/{{image['name']}}_{{p_user}}_public/" target="_blank">{{image['description']}}</a></td>
|
|
<td><div class="i-checks"><label><input type="radio" name="image" value="{{image['name']}}_{{p_user}}_public"></label></div></td>
|
|
</tr>
|
|
{% endfor %}
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="hr-line-dashed"></div>
|
|
<div class="panel-group" id="accordion">
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<h4 class="panel-title">
|
|
<a data-toggle="collapse" data-panel="#accordion" href="#collapseOne">
|
|
show advanced options
|
|
</a>
|
|
</h4>
|
|
</div>
|
|
<div id="collapseOne" class="panel-collapse collapse">
|
|
<div class="panel-body">
|
|
<div class="form-group">
|
|
<label class="col-sm-2 control-label">CPU</label>
|
|
<div class="col-sm-3"><input type="number" class="form-control" name="cpuSetting" id="cpuSetting" value = {{defaultsetting['cpu']}} /> {{usage['cpu']}}CORE/{{quota['cpu']}}CORE
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="col-sm-2 control-label">MEMORY</label>
|
|
<div class="col-sm-3"><input type="number" class="form-control" name="memorySetting" id="memorySetting" value = {{defaultsetting['memory']}} /> {{usage['memory']}}MB/{{quota['memory']}}MB
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="col-sm-2 control-label">DISK</label>
|
|
<div class="col-sm-3"><input type="number" class="form-control" name="diskSetting" id="diskSetting" value= {{defaultsetting['disk']}} /> {{usage['disk']}} MB/{{quota['disk']}}MB
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<br/>
|
|
<div class="hr-line-dashed"></div>
|
|
<div class="row">
|
|
<div class="form-group">
|
|
<div class="col-sm-4 col-sm-offset-2">
|
|
<button class="btn btn-primary" type="submit">Create</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block script_src %}
|
|
<!-- Custom and plugin javascript -->
|
|
<script src="/static/js/inspinia.js"></script>
|
|
|
|
<script src="http://cdn.bootcss.com/pace/1.0.2/pace.min.js"></script>
|
|
|
|
<!-- Steps -->
|
|
<script src="http://cdn.bootcss.com/jquery-steps/1.1.0/jquery.steps.min.js"></script>
|
|
|
|
<!-- Jquery Validate -->
|
|
<script src="http://cdn.bootcss.com/jquery-validate/1.15.0/jquery.validate.min.js"></script>
|
|
|
|
|
|
<script src="http://cdn.bootcss.com/datatables/1.10.11/js/jquery.dataTables.js"></script>
|
|
<script src="http://cdn.bootcss.com/datatables/1.10.11/js/dataTables.bootstrap.js"></script>
|
|
<script src="http://cdn.bootcss.com/datatables-tabletools/2.1.5/js/TableTools.min.js"></script>
|
|
|
|
|
|
<script type="text/javascript">
|
|
$("select#masterselector").change(function() {
|
|
var masterip=$(this).children('option:selected').val();
|
|
var mastername=$(this).children('option:selected').html();
|
|
console.log(masterip);
|
|
document.getElementById("form").action="/workspace/"+masterip+"/add/";
|
|
var host = window.location.host;
|
|
$.post("http://"+host+"/getmasterdesc/"+mastername+"/", {}, function(data) {
|
|
$("#masterdesc").html(data);
|
|
});
|
|
$.post("http://"+host+"/image/"+masterip+"/list/",{},function(data){
|
|
var images = data.images;
|
|
var imagehtml =
|
|
"<thread>"
|
|
+"<tr>"
|
|
+"<th>ImageName</th>"
|
|
+"<th>Type</th>"
|
|
+"<th>Owner</th>"
|
|
+"<th>Description</th>"
|
|
+"<th>Choose</th>"
|
|
+"</tr>"
|
|
+"</thead>"
|
|
+"<tbody>"
|
|
+"<tr>"
|
|
+"<td>base</td>"
|
|
+"<td>public</td>"
|
|
+"<td>docklet</td>"
|
|
+"<td>A base image for you</td>"
|
|
+'<td><div class="i-checks"><label><input type="radio" name="image" value="base_base_base" checked="checked"></label></div></td>'
|
|
+"</tr>";
|
|
for(var index in images.private) {
|
|
var image = images.private[index];
|
|
imagehtml +=
|
|
"<tr>"
|
|
+"<td>"+image.name+"</td>"
|
|
+"<td>private</td>"
|
|
+"<td>{{user}}</td>"
|
|
+'<td><a href="/image/' + masterip + '/description/' + image.name + '_' + '{{user}}' + '_private/" target="_blank">' + image.description + '</a></td>'
|
|
+'<td><div class="i-checks"><label><input type="radio" name="image" value="' + image.name + '_{{user}}_private"><label></div></td>'
|
|
+"</tr>";
|
|
}
|
|
for(var p_user in images.public) {
|
|
for(var index in images.public[p_user]) {
|
|
image=images.public[p_user][index];
|
|
imagehtml +=
|
|
"<tr>"
|
|
+"<td>"+image.name+"</td>"
|
|
+"<td>public</td>"
|
|
+"<td>" + p_user + "</td>"
|
|
+'<td><a href="/image/' + masterip + '/description/' + image.name + "_" + p_user + '_public/" target="_blank">' + image.description + '</a></td>'
|
|
+'<td><div class="i-checks"><label><input type="radio" name="image" value="' + image.name + "_" + p_user + '_public"><label></div></td>';
|
|
}
|
|
}
|
|
$("#imagetable").html(imagehtml);
|
|
},"json");
|
|
});
|
|
</script>
|
|
{% endblock %}
|