YunoHost/yunorunner
1
0
Fork 0
mirror of https://github.com/YunoHost/yunorunner.git synced 2024-09-03 20:05:52 +02:00
Code Issues Projects Releases Packages Wiki Activity

[enh] dynamic update of homepage using vuejs

Browse source
This commit is contained in:
Laurent Peuch 2018-07-11 05:07:05 +02:00
parent ea2b99b23a
commit 20fc770db2
2 changed files with 70 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
run.py
View file

@ -2,6 +2,7 @@
import os
import sys
import ujson
import asyncio
import random
@ -15,6 +16,8 @@ from websockets.exceptions import ConnectionClosed
from sanic import Sanic, response
from playhouse.shortcuts import model_to_dict, dict_to_model
from models import Repo, BuildTask, db
app = Sanic()
@ -100,7 +103,11 @@ async def run_jobs():
build_task.end_time = datetime.now()
build_task.save()
await broadcast_to_ws(all_index_ws, f"done for {build_task.repo.name}")
await broadcast_to_ws(all_index_ws, {
"target": "build_task",
"id": build_task.id,
"data": model_to_dict(build_task),
})
await asyncio.sleep(3)
@ -110,13 +117,14 @@ async def broadcast_to_ws(ws_list, message):
for ws in ws_list:
try:
await ws.send(message)
await ws.send(ujson.dumps(message))
except ConnectionClosed:
dead_ws.append(ws)
for to_remove in dead_ws:
ws_list.remove(to_remove)
@app.websocket('/index-ws')
async def index_ws(request, websocket):
all_index_ws.append(websocket)
@ -126,6 +134,11 @@ async def index_ws(request, websocket):
await websocket.send(f"echo {data}")
@app.route("/api/tasks")
async def api_tasks(request):
return response.json(map(model_to_dict, BuildTask.select()))
@app.route('/')
async def index(request):
return response.html(open("./templates/index.html", "r").read())

83
templates/index.html
View file

@ -1,37 +1,64 @@
<html>
<head>
<title>YunoRunner for CI</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
</head>
<body>
<h1>Tasks</h1>
<table border="0" cellspacing="5" cellpadding="5">
<tr>
<th>App</th>
<th>State</th>
<th>Revision</th>
<th>Ynh Version</th>
<th>Created time</th>
<th>Started time</th>
<th>End time</th>
</tr>
{% for build_task in build_tasks %}
<tr id="build_task_{{ build_task.id }}">
<td>{{build_task.repo.name}}</td>
<td>{{build_task.state}}</td>
<td>{{build_task.target_revision}}</td>
<td>{{build_task.yunohost_version}}</td>
<td>{{build_task.created_time}}</td>
<td>{{build_task.started_time}}</td>
<td>{{build_task.end_time}}</td>
</tr>
{% endfor %}
</table>
<div id="jobs">
<table border="0" cellspacing="5" cellpadding="5">
<tr>
<th>App</th>
<th>State</th>
<th>Revision</th>
<th>Ynh Version</th>
<th>Created time</th>
<th>Started time</th>
<th>End time</th>
</tr>
<tr v-for="build_task in build_tasks" :id="build_task.id">
<td>{{build_task.repo.name}}</td>
<td>{{build_task.state}}</td>
<td>{{build_task.target_revision}}</td>
<td>{{build_task.yunohost_version}}</td>
<td>{{build_task.created_time}}</td>
<td>{{build_task.started_time}}</td>
<td>{{build_task.end_time}}</td>
</tr>
</table>
</div>
<script>
(function() {
console.log('ws://' + document.domain + ':' + location.port + '/index-ws')
ws = new WebSocket('ws://' + document.domain + ':' + location.port + '/index-ws');
ws.onmessage = function (event) {
console.log(event.data);
};
var app = new Vue({
el: '#jobs',
data: {
build_tasks: []
},
})
ws.send('bob');
$.getJSON("/api/tasks").done(function(data) {
app.build_tasks = data;
})
ws = new WebSocket('ws://' + document.domain + ':' + location.port + '/index-ws');
ws.onmessage = function (event) {
var message = JSON.parse(event.data);
var data = message.data;
var target = message.target;
if (target == "build_task") {
for (var i = 0; i < app.build_tasks.length; ++i) {
if (app.build_tasks[i].id == data.id) {
Vue.set(app.build_tasks, i, data);
return;
}
}
}
};
})()
</script>
</body>