UI - instances backend started

ui/entrypoint.py

@@ -26,12 +26,31 @@ def home():
 		return render_template("error.html", title="Error", error=services)
 	return render_template("home.html", title="Home", instances_number=len(instances), services_number=len(services))
 
-@app.route('/instances')
+@app.route('/instances', methods=["GET", "POST"])
 def instances():
+
+	# Manage instances
+	operation = ""
+	if request.method == "POST" :
+
+		# Check operation
+		if not "operation" in request.form or not request.form["operation"] in ["reload", "start", "stop", "restart", "delete"] :
+			return render_template("error.html", title="Error", error="Missing operation parameter on /instances.")
+
+		# Check that all fields are present
+		if not "INSTANCE_ID" in request.form :
+			return render_template("error.html", title="Error", error="Missing INSTANCE_ID parameter.")
+
+		# Do the operation
+		check, operation = wrappers.operation_instance(request.form)
+		if not check :
+			return render_template("error.html", title="Error", error=operation)
+
+	# Display instances
 	check, instances = wrappers.get_instances()
 	if not check :
 		return render_template("error.html", title="Error", error=instances)
-	return render_template("instances.html", title="Instances", instances=instances)
+	return render_template("instances.html", title="Instances", instances=instances, operation=operation)
 
 @app.route('/services', methods=["GET", "POST"])
 def services():
@@ -65,23 +84,10 @@ def services():
 			if not re.search("^([a-z\-0-9]+\.?)+$", request.form["SERVER_NAME"]) :
 				return render_template("error.html", title="Error", error="Parameter SERVER_NAME doesn't match regex.")
 
-		# Create new service
-		if request.form["operation"] == "new" :
-			check, operation = wrappers.new_service(env)
-			if not check :
-				render_template("error.html", title="Error", error=service)
-
-		# Edit existing service
-		elif request.form["operation"] == "edit" :
-			check, operation = wrappers.edit_service(request.form["OLD_SERVER_NAME"], env)
-			if not check :
-				render_template("error.html", title="Error", error=service)
-
-		# Delete existing service
-		elif request.form["operation"] == "delete" :
-			check, operation = wrappers.delete_service(request.form["SERVER_NAME"])
-			if not check :
-				render_template("error.html", title="Error", error=service)
+		# Do the operation
+		check, operation = wrappers.operation_service(request.form, env)
+		if not check :
+			render_template("error.html", title="Error", error=operation)
 
 	# Display services
 	check, services = wrappers.get_services()

ui/static/js/custom.js

@@ -43,14 +43,38 @@ function getData(id) {
 	return data;
 }
 
-function postNew() {
+function newService() {
 	post("new", "services", getData('form-new'));
 }
 
-function postEdit(id) {
+function editService(id) {
 	post("edit", "services", getData('form-edit-' + id));
 }
 
-function postDelete(id) {
+function deleteService(id) {
 	post("delete", "services", getData('form-delete-' + id));
 }
+
+function reloadInstance(id) {
+	post("reload", "instances", getData('form-instance-' + id));
+}
+
+function startInstance(id) {
+	post("start", "instances", getData('form-instance-' + id));
+	return false;
+}
+
+function stopInstance(id) {
+	post("stop", "instances", getData('form-instance-' + id));
+	return false;
+}
+
+function restartInstance(id) {
+	post("restart", "instances", getData('form-instance-' + id));
+	return false;
+}
+
+function deleteInstance(id) {
+	post("delete", "instances", getData('form-instance-' + id));
+	return false;
+}

ui/templates/error.html

@@ -2,8 +2,13 @@
 
 {% block content %}
 
-Something went wrong.
-
-Some information : {{ error }}
+<div class="row justify-content-center">
+	<div class="col col-6 text-center">
+		<div class="alert alert-danger">
+			Something went wrong...<br />
+			{{ error }}
+		</div>
+	</div>
+</div>
 
 {% endblock %}

ui/templates/instances.html

@@ -2,9 +2,16 @@
 
 {% block content %}
 
-<!--<div class="text-center">
-	<button class="btn btn-success btn-lg mb-5"><i class="fas fa-plus"></i> new</button>
-</div>-->
+{% if operation != "" %}
+<div class="row justify-content-center">
+	<div class="col col-4 mb-3 text-center">
+		<div class="alert alert-primary alert-dismissible fade show text-break" role="alert">
+			{{ operation }}
+			<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+		</div>
+	</div>
+</div>
+{% endif %}
 
 <div class="row justify-content-center">
 
@@ -19,6 +26,9 @@
 		{% endif %}
 
 	<div class="col col-6">
+		<form id="form-instance-{{ instance["id"] }}">
+			<input type="hidden" name="INSTANCE_ID" value="{{ instance["id"] }}">
+		</form>
 		<div class="card border-{{ color }} mb-3" style="max-width: 80rem;">
 			<div class="card-header border-{{ color }} bg-{{ color }} text-white">
 				{{ instance["name"] }}
@@ -27,13 +37,13 @@
 						<i class="fas fa-cogs"> manage container</i>
 					</button>
 					<ul class="dropdown-menu" aria-labelledby="btnGroupDrop1">
-						<li><a class="dropdown-item" href="instance/start/{{ instance["id"] }}">Start</a></li>
-						<li><a class="dropdown-item" href="instance/stop/{{ instance["id"] }}">Stop</a></li>
-						<li><a class="dropdown-item" href="instance/restart/{{ instance["id"] }}">Restart</a></li>
-						<li><a class="dropdown-item" href="#">Remove</a></li>
+						<li><a class="dropdown-item" href="#" onClick="return startInstance('{{ instance["id"] }}');">Start</a></li>
+						<li><a class="dropdown-item" href="#" onClick="return stopInstance('{{ instance["id"] }}');">Stop</a></li>
+						<li><a class="dropdown-item" href="#" onClick="return restartInstance('{{ instance["id"] }}');">Restart</a></li>
+						<li><a class="dropdown-item" href="#" onClick="return deleteInstance('{{ instance["id"] }}');">Delete</a></li>
 					</ul>
 				</div>
-				<button class="btn btn-sm mx-2 float-end btn-light"><i class="fas fa-redo-alt"></i> reload nginx</button>
+				<button class="btn btn-sm mx-2 float-end btn-light" onClick="reloadInstance('{{ instance["id"] }}');"><i class="fas fa-redo-alt"></i> reload nginx</button>
 			</div>
 			<div class="card-body text-dark">
 				<h5 class="card-title">Status : {{ instance["status"] }}</h5>

ui/templates/services-delete.html

@@ -13,7 +13,7 @@
 			</div>
 			<div class="modal-footer">
 				<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-				<button type="button" class="btn btn-danger" onClick="postDelete('{{ id_server_name }}');">Delete</button>
+				<button type="button" class="btn btn-danger" onClick="deleteInstance('{{ id_server_name }}');">Delete</button>
 			</div>
 		</div>
 	</div>

ui/templates/services-edit.html

@@ -34,7 +34,7 @@
 			</div>
 			<div class="modal-footer">
 				<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-				<button type="button" class="btn btn-primary" onClick="postEdit('{{ id_server_name }}');">Save</button>
+				<button type="button" class="btn btn-primary" onClick="editInstance('{{ id_server_name }}');">Save</button>
 			</div>
 		</div>
 	</div>

ui/templates/services-new.html

@@ -33,7 +33,7 @@
 			</div>
 			<div class="modal-footer">
 				<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-				<button type="button" class="btn btn-primary" onClick="postNew();">Save</button>
+				<button type="button" class="btn btn-primary" onClick="newInstance();">Save</button>
 			</div>
 		</div>
 	</div>

ui/templates/services.html

@@ -5,7 +5,7 @@
 {% if operation != "" %}
 <div class="row justify-content-center">
 	<div class="col col-4 mb-3 text-center">
-		<div class="alert alert-primary alert-dismissible fade show" role="alert">
+		<div class="alert alert-primary alert-dismissible fade show text-break" role="alert">
 			{{ operation }}
 			<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
 		</div>

ui/wrappers.py

@@ -51,5 +51,41 @@ def edit_service(old_server_name, env) :
 	return True, "Web service " + old_server_name + " has been edited."
 
 def delete_service(server_name) :
-	return True, "Web service " + env["SERVER_NAME"] + " has been deleted."
+	return True, "Web service " + server_name + " has been deleted."
 
+def operation_service(form, env) :
+	if form["operation"] == "new" :
+		return new_service(env)
+	if form["operation"] == "edit" :
+		return edit_service(form["OLD_SERVER_NAME"], env)
+	if form["operation"] == "delete" :
+		return delete_service(form["SERVER_NAME"])
+	return False, "Wrong operation parameter."
+
+def reload_instance(id) :
+	return True, "Instance " + id + " has been reloaded."
+
+def start_instance(id) :
+	return True, "Instance " + id + " has been started."
+
+def stop_instance(id) :
+	return True, "Instance " + id + " has been stopped."
+
+def restart_instance(id) :
+	return True, "Instance " + id + " has been restarted."
+
+def delete_instance(id) :
+	return True, "Instance " + id + " has been deleted."
+
+def operation_instance(form) :
+	if form["operation"] == "reload" :
+		return reload_instance(form["INSTANCE_ID"])
+	if form["operation"] == "start" :
+		return start_instance(form["INSTANCE_ID"])
+	if form["operation"] == "stop" :
+		return stop_instance(form["INSTANCE_ID"])
+	if form["operation"] == "restart" :
+		return restart_instance(form["INSTANCE_ID"])
+	if form["operation"] == "delete" :
+		return delete_instance(form["INSTANCE_ID"])
+	return False, "Wrong operation parameter."