first commit
This commit is contained in:
commit
aa51255715
53
index.py
Normal file
53
index.py
Normal file
@ -0,0 +1,53 @@
|
|||||||
|
from flask import Flask, render_template
|
||||||
|
from flask_apscheduler import APScheduler
|
||||||
|
import docker
|
||||||
|
from pprint import pprint
|
||||||
|
import time
|
||||||
|
|
||||||
|
client = docker.from_env()
|
||||||
|
app = Flask(__name__)
|
||||||
|
scheduler = APScheduler()
|
||||||
|
|
||||||
|
|
||||||
|
@app.route("/", methods=['GET'])
|
||||||
|
def index():
|
||||||
|
containers = client.containers.list(all=True)
|
||||||
|
return render_template("index.html", title="test", containers_len=len(containers), containers=containers)
|
||||||
|
|
||||||
|
@app.route("/parts/modal/container/<container_id>", methods=['GET'])
|
||||||
|
def parts_container_modal(container_id):
|
||||||
|
container = client.containers.get(container_id)
|
||||||
|
|
||||||
|
project = ''
|
||||||
|
if('com.docker.compose.project' in container.attrs['Config']['Labels']):
|
||||||
|
project = container.attrs['Config']['Labels']['com.docker.compose.project']
|
||||||
|
|
||||||
|
return render_template("container_modal.html", name=container.name, project=project, ports=container.attrs['NetworkSettings']['Ports'], status=container.status)
|
||||||
|
|
||||||
|
@app.route("/api/<container_id>/<action>", methods=['DELETE', 'POST'])
|
||||||
|
def api_stop_container(container_id, action):
|
||||||
|
container = client.containers.get(container_id)
|
||||||
|
#pprint(vars(container))
|
||||||
|
try:
|
||||||
|
match action:
|
||||||
|
case 'stop':
|
||||||
|
container.stop()
|
||||||
|
case 'start':
|
||||||
|
container.start()
|
||||||
|
case _:
|
||||||
|
return 'False'
|
||||||
|
|
||||||
|
container = client.containers.get(container_id)
|
||||||
|
return container.status
|
||||||
|
except:
|
||||||
|
return 'False'
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
def scheduleTasks():
|
||||||
|
print("This test runs every 3 seconds")
|
||||||
|
|
||||||
|
if __name__ == '__main__':
|
||||||
|
#scheduler.add_job(id = 'scheduled_tasks', func=scheduleTasks, trigger="interval", seconds=3)
|
||||||
|
#scheduler.start()
|
||||||
|
app.run(host="0.0.0.0", port=99, debug=True)
|
0
templates/base.html
Normal file
0
templates/base.html
Normal file
7
templates/container_modal.html
Normal file
7
templates/container_modal.html
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
{{name}}</br>
|
||||||
|
{{project}}</br>
|
||||||
|
{{status}}</br>
|
||||||
|
{% for port in ports %}
|
||||||
|
<a href="//127.0.0.1:{{ port.split(" /")[0] }}">{{ port.split("/")[0] }}</a>
|
||||||
|
{%endfor%}
|
||||||
|
|
103
templates/index.html
Normal file
103
templates/index.html
Normal file
@ -0,0 +1,103 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<title>{{title}}</title>
|
||||||
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||||
|
integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<h1>{{title}}</h1>
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="row row-cols-auto bg-dark">
|
||||||
|
{% for container in containers %}
|
||||||
|
<div class="col-6 col-sm-4 col-md-4 col-lg-3 col-xxl-2 bg-light">
|
||||||
|
<div class="square-item">
|
||||||
|
<div class="square-content" onclick="openModalForContainer('{{container.id}}')">
|
||||||
|
<!-- Content for the square item -->
|
||||||
|
<div class="d-flex justify-content-between">
|
||||||
|
|
||||||
|
<img height="60" width="60"
|
||||||
|
src="https://raw.githubusercontent.com/walkxcode/dashboard-icons/main/svg/nginx.svg" alt="">
|
||||||
|
<div class="form-check form-switch form-check-reverse">
|
||||||
|
<input class="form-check-input" type="checkbox" id="flexSwitchCheckReverse"
|
||||||
|
onclick="toggleContainer('{{container.id}}', '{{container.status}}', this, event);" {% if
|
||||||
|
container.status=="running" %} checked {% endif %}>
|
||||||
|
<label class="form-check-label" for="flexSwitchCheckReverse">isRunning</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<h4 class="text-nowrap">{{container.attrs['Config']['Labels']['com.docker.compose.project']}}</h4>
|
||||||
|
<h5 class="text-truncate">{{container.name}}</h5>
|
||||||
|
{% for port in container.attrs['NetworkSettings']['Ports'] %}
|
||||||
|
<a href="//127.0.0.1:{{ port.split(" /")[0] }}">{{ port.split("/")[0] }}</a>
|
||||||
|
{%endfor%}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{%endfor%}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Modal -->
|
||||||
|
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
|
||||||
|
<div class="modal-dialog">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="spinner-border" role="status">
|
||||||
|
<span class="visually-hidden">Loading...</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.bundle.min.js"
|
||||||
|
integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm"
|
||||||
|
crossorigin="anonymous"></script>
|
||||||
|
<script>
|
||||||
|
async function toggleContainer(container_id, status, control, control_event) {
|
||||||
|
//control_event.preventDefault();
|
||||||
|
control_event.stopPropagation();
|
||||||
|
|
||||||
|
console.log(control);
|
||||||
|
control.disabled = true;
|
||||||
|
|
||||||
|
route = (status == 'running' ? 'stop' : 'start')
|
||||||
|
method = (status == 'running' ? 'DELETE' : 'POST')
|
||||||
|
|
||||||
|
|
||||||
|
const xhttp = new XMLHttpRequest();
|
||||||
|
|
||||||
|
xhttp.onreadystatechange = function () {
|
||||||
|
if (this.readyState == 4 && this.status == 200) {
|
||||||
|
console.log(this.responseText)
|
||||||
|
control.checked = (this.responseText == 'running' ? true : false);
|
||||||
|
}
|
||||||
|
control.disabled = false;
|
||||||
|
};
|
||||||
|
|
||||||
|
xhttp.open(method, '/api/' + container_id + '/' + route, true);
|
||||||
|
xhttp.send();
|
||||||
|
|
||||||
|
await new Promise(r => setTimeout(() => r(), 1000));
|
||||||
|
window.location.reload();
|
||||||
|
}
|
||||||
|
|
||||||
|
function openModalForContainer(container_id) {
|
||||||
|
const myModal = new bootstrap.Modal('#exampleModal')
|
||||||
|
myModal.show()
|
||||||
|
|
||||||
|
const xhttp = new XMLHttpRequest();
|
||||||
|
xhttp.onload = function () {
|
||||||
|
document.getElementById('exampleModal').getElementsByClassName('modal-content')[0].innerHTML = this.responseText;
|
||||||
|
}
|
||||||
|
xhttp.open("GET", "/parts/modal/container/" + container_id, true);
|
||||||
|
xhttp.send();
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
Loading…
Reference in New Issue
Block a user