runner-go #102
@ -14,10 +14,19 @@ const (
|
||||
)
|
||||
|
||||
type User struct {
|
||||
Id string `db:"u.id"`
|
||||
Username string `db:"u.username"`
|
||||
Email string `db:"u.email"`
|
||||
UserType int `db:"u.user_type"`
|
||||
Id string `db:"u.id" json:"id"`
|
||||
Username string `db:"u.username" json:"username"`
|
||||
Email string `db:"u.email" json:"email"`
|
||||
UserType int `db:"u.user_type" json:"user_type"`
|
||||
}
|
||||
|
||||
func UserFromId(db db.Db, id string) (*User, error) {
|
||||
var user User
|
||||
err := GetDBOnce(db, &user, "users as u where u.id=$1", id)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
return &user, nil
|
||||
}
|
||||
|
||||
func UserFromToken(db db.Db, token string) (*User, error) {
|
||||
|
@ -1313,7 +1313,7 @@ func generateExpandableDefinition(c BasePack, model *BaseModel, target_accuracy
|
||||
|
||||
log.Info("Size of the simple block", "loop", loop)
|
||||
|
||||
//loop = max(loop, 3)
|
||||
loop = max(loop, min(2, model.ImageMode))
|
||||
|
||||
for i := 0; i < loop; i++ {
|
||||
err = MakeLayerExpandable(db, def_id, order, LAYER_SIMPLE_BLOCK, "", 1)
|
||||
|
@ -1,7 +0,0 @@
|
||||
# Runner Protocol
|
||||
|
||||
```
|
||||
/----\
|
||||
\/ |
|
||||
Register -> Init -> Active ---> Ready -> Info
|
||||
```
|
@ -9,4 +9,5 @@ func HandleTasks(handle *Handle) {
|
||||
handleList(handle)
|
||||
handleRequests(handle)
|
||||
handleRemoteRunner(handle)
|
||||
handleRunnerData(handle)
|
||||
}
|
||||
|
@ -936,7 +936,12 @@ func handleRemoteRunner(x *Handle) {
|
||||
return c.E500M("Failed to set class status", err)
|
||||
}
|
||||
|
||||
_, err = c.Exec("update exp_model_head set status=$1 where status=$2 and model_id=$3", MODEL_HEAD_STATUS_READY, MODEL_HEAD_STATUS_TRAINING, model.Id)
|
||||
defs, err := model.GetDefinitions(c, "")
|
||||
if err != nil {
|
||||
return c.E500M("Failed to get definitions", err)
|
||||
}
|
||||
|
||||
_, err = c.Exec("update exp_model_head set status=$1 where status=$2 and def_id=$3", MODEL_HEAD_STATUS_READY, MODEL_HEAD_STATUS_TRAINING, defs[0].Id)
|
||||
if err != nil {
|
||||
return c.E500M("Failed to set head status", err)
|
||||
}
|
||||
|
@ -185,9 +185,7 @@ func RunnerOrchestrator(db db.Db, config Config, handler *Handle) {
|
||||
Prefix: "Runner Orchestrator Logger",
|
||||
})
|
||||
|
||||
// Setup vars
|
||||
handler.DataMap["runners"] = map[string]interface{}{}
|
||||
handler.DataMap["runners_mutex"] = &sync.Mutex{}
|
||||
setupHandle(handler)
|
||||
|
||||
base := BasePackStruct{
|
||||
Db: db,
|
||||
@ -206,7 +204,7 @@ func RunnerOrchestrator(db db.Db, config Config, handler *Handle) {
|
||||
|
||||
defer func() {
|
||||
if r := recover(); r != nil {
|
||||
logger.Error("Recovered in Orchestrator restarting", "due to", r)
|
||||
logger.Error("Recovered in Orchestrator restarting", "due to", r, "stack", string(debug.Stack()))
|
||||
for x := range task_runners {
|
||||
close(task_runners[x])
|
||||
}
|
||||
@ -221,6 +219,10 @@ func RunnerOrchestrator(db db.Db, config Config, handler *Handle) {
|
||||
for i := 0; i < gpu_workers; i++ {
|
||||
task_runners[i] = make(chan Task, 10)
|
||||
task_runners_used[i] = false
|
||||
AddLocalRunner(handler, LocalRunner{
|
||||
RunnerNum: i + 1,
|
||||
Task: nil,
|
||||
})
|
||||
go runner(config, db, task_runners[i], i+1, back_channel)
|
||||
}
|
||||
|
||||
@ -228,6 +230,7 @@ func RunnerOrchestrator(db db.Db, config Config, handler *Handle) {
|
||||
|
||||
for i := range back_channel {
|
||||
|
||||
if i != 0 {
|
||||
if i > 0 {
|
||||
logger.Info("Runner freed", "runner", i)
|
||||
task_runners_used[i-1] = false
|
||||
@ -237,6 +240,8 @@ func RunnerOrchestrator(db db.Db, config Config, handler *Handle) {
|
||||
task_runners_used[i] = false
|
||||
go runner(config, db, task_runners[i], i+1, back_channel)
|
||||
}
|
||||
AddLocalTask(handler, int(math.Abs(float64(i))), nil)
|
||||
}
|
||||
|
||||
if task_to_dispatch == nil {
|
||||
var task TaskT
|
||||
@ -290,6 +295,7 @@ func RunnerOrchestrator(db db.Db, config Config, handler *Handle) {
|
||||
if !task_runners_used[i] {
|
||||
task_runners[i] <- *task_to_dispatch
|
||||
task_runners_used[i] = true
|
||||
AddLocalTask(handler, i+1, task_to_dispatch)
|
||||
task_to_dispatch = nil
|
||||
break
|
||||
}
|
||||
|
51
logic/tasks/runner/utils.go
Normal file
51
logic/tasks/runner/utils.go
Normal file
@ -0,0 +1,51 @@
|
||||
package task_runner
|
||||
|
||||
import (
|
||||
"sync"
|
||||
|
||||
. "git.andr3h3nriqu3s.com/andr3/fyp/logic/tasks/utils"
|
||||
. "git.andr3h3nriqu3s.com/andr3/fyp/logic/utils"
|
||||
)
|
||||
|
||||
type LocalRunner struct {
|
||||
RunnerNum int `json:"id"`
|
||||
Task *Task `json:"task"`
|
||||
}
|
||||
|
||||
type LocalRunners map[int]*LocalRunner
|
||||
|
||||
func LockRunners(handler *Handle, t string) *sync.Mutex {
|
||||
req := t + "_runners_mutex"
|
||||
if t == "" {
|
||||
req = "runners_mutex"
|
||||
}
|
||||
mutex := handler.DataMap[req].(*sync.Mutex)
|
||||
mutex.Lock()
|
||||
return mutex
|
||||
}
|
||||
|
||||
func setupHandle(handler *Handle) {
|
||||
// Setup Remote Runner data
|
||||
handler.DataMap["runners"] = map[string]interface{}{}
|
||||
handler.DataMap["runners_mutex"] = &sync.Mutex{}
|
||||
|
||||
// Setup Local Runner data
|
||||
handler.DataMap["local_runners"] = &LocalRunners{}
|
||||
handler.DataMap["local_runners_mutex"] = &sync.Mutex{}
|
||||
}
|
||||
|
||||
func AddLocalRunner(handler *Handle, runner LocalRunner) {
|
||||
mutex := LockRunners(handler, "local")
|
||||
defer mutex.Unlock()
|
||||
|
||||
runners := handler.DataMap["local_runners"].(*LocalRunners)
|
||||
(*runners)[runner.RunnerNum] = &runner
|
||||
}
|
||||
|
||||
func AddLocalTask(handler *Handle, runner_id int, task *Task) {
|
||||
mutex := LockRunners(handler, "local")
|
||||
defer mutex.Unlock()
|
||||
|
||||
runners := handler.DataMap["local_runners"].(*LocalRunners)
|
||||
(*(*runners)[runner_id]).Task = task
|
||||
}
|
25
logic/tasks/runner_data.go
Normal file
25
logic/tasks/runner_data.go
Normal file
@ -0,0 +1,25 @@
|
||||
package tasks
|
||||
|
||||
import (
|
||||
. "git.andr3h3nriqu3s.com/andr3/fyp/logic/db_types"
|
||||
. "git.andr3h3nriqu3s.com/andr3/fyp/logic/tasks/runner"
|
||||
. "git.andr3h3nriqu3s.com/andr3/fyp/logic/utils"
|
||||
)
|
||||
|
||||
func handleRunnerData(x *Handle) {
|
||||
type NonType struct{}
|
||||
PostAuthJson(x, "/tasks/runner/info", User_Admin, func(c *Context, dat *NonType) *Error {
|
||||
mutex_remote := LockRunners(x, "")
|
||||
defer mutex_remote.Unlock()
|
||||
mutex_local := LockRunners(x, "local")
|
||||
defer mutex_local.Unlock()
|
||||
|
||||
return c.SendJSON(struct {
|
||||
RemoteRunners map[string]interface{} `json:"remoteRunners"`
|
||||
LocalRunner *LocalRunners `json:"localRunners"`
|
||||
}{
|
||||
RemoteRunners: x.DataMap["runners"].(map[string]interface{}),
|
||||
LocalRunner: x.DataMap["local_runners"].(*LocalRunners),
|
||||
})
|
||||
})
|
||||
}
|
@ -241,6 +241,17 @@ func UsersEndpints(db db.Db, handle *Handle) {
|
||||
return c.SendJSON(userReturn)
|
||||
})
|
||||
|
||||
PostAuthJson(handle, "/user/info/get", User_Admin, func(c *Context, dat *JustId) *Error {
|
||||
var user *User
|
||||
user, err := UserFromId(c, dat.Id)
|
||||
if err == NotFoundError {
|
||||
return c.SendJSONStatus(404, "User not found")
|
||||
} else if err != nil {
|
||||
return c.E500M("Could not get user", err)
|
||||
}
|
||||
return c.SendJSON(user)
|
||||
})
|
||||
|
||||
// Handles updating users
|
||||
type UpdateUserData struct {
|
||||
Id string `json:"id"`
|
||||
|
@ -114,12 +114,16 @@ func (c *Config) Cleanup(db db.Db) {
|
||||
tasks[i].UpdateStatus(base, TASK_FAILED_RUNNING, "Task inturupted by server restart please try again")
|
||||
_, err = db.Exec("update models set status=$1 where id=$2", READY_RETRAIN_FAILED, tasks[i].ModelId)
|
||||
failLog(err)
|
||||
_, err = db.Exec("update model_classes set status=$1 where model_id=$2 and status=$3", CLASS_STATUS_TO_TRAIN, tasks[i].ModelId, CLASS_STATUS_TRAINING)
|
||||
failLog(err)
|
||||
continue
|
||||
}
|
||||
if tasks[i].TaskType == int(TASK_TYPE_TRAINING) {
|
||||
tasks[i].UpdateStatus(base, TASK_FAILED_RUNNING, "Task inturupted by server restart please try again")
|
||||
_, err = db.Exec("update models set status=$1 where id=$2", FAILED_TRAINING, tasks[i].ModelId)
|
||||
failLog(err)
|
||||
_, err = db.Exec("update model_classes set status=$1 where model_id=$2 and status=$3", CLASS_STATUS_TO_TRAIN, tasks[i].ModelId, CLASS_STATUS_TRAINING)
|
||||
failLog(err)
|
||||
continue
|
||||
}
|
||||
}
|
||||
|
Binary file not shown.
4125
webpage/package-lock.json
generated
Normal file
4125
webpage/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
@ -15,7 +15,8 @@
|
||||
"devDependencies": {
|
||||
"@sveltejs/adapter-auto": "^3.2.0",
|
||||
"@sveltejs/kit": "^2.5.6",
|
||||
"@sveltejs/vite-plugin-svelte": "3.0.0",
|
||||
"@sveltejs/vite-plugin-svelte": "^3.0.0",
|
||||
"@types/d3": "^7.4.3",
|
||||
"@types/eslint": "^8.56.9",
|
||||
"@typescript-eslint/eslint-plugin": "^7.7.0",
|
||||
"@typescript-eslint/parser": "^7.7.0",
|
||||
@ -25,7 +26,7 @@
|
||||
"prettier": "^3.2.5",
|
||||
"prettier-plugin-svelte": "^3.2.3",
|
||||
"sass": "^1.75.0",
|
||||
"svelte": "5.0.0-next.104",
|
||||
"svelte": "^5.0.0-next.104",
|
||||
"svelte-check": "^3.6.9",
|
||||
"tslib": "^2.6.2",
|
||||
"typescript": "^5.4.5",
|
||||
@ -33,6 +34,8 @@
|
||||
},
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"chart.js": "^4.4.2"
|
||||
"chart.js": "^4.4.2",
|
||||
"d3": "^7.9.0",
|
||||
"highlight.js": "^11.9.0"
|
||||
}
|
||||
}
|
||||
|
@ -15,8 +15,18 @@
|
||||
{/if}
|
||||
<li class="expand"></li>
|
||||
{#if userStore.user}
|
||||
{#if userStore.user.user_type == 2}
|
||||
<li>
|
||||
<a href="/admin/runners">
|
||||
<span class="bi bi-cpu-fill"></span>
|
||||
Runner
|
||||
</a>
|
||||
</li>
|
||||
{/if}
|
||||
<li>
|
||||
<a href="/user/info"> <span class="bi bi-person-fill"></span> {userStore.user.username} </a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/logout"> <span class="bi bi-box-arrow-right"></span> Logout </a>
|
||||
</li>
|
||||
{:else}
|
||||
|
@ -9,6 +9,8 @@
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github.min.css">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Andada+Pro:ital,wght@0,400..840;1,400..840&family=Bebas+Neue&family=Fira+Code:wght@300..700&display=swap" rel="stylesheet">
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Andada+Pro:ital,wght@0,400..840;1,400..840&family=Bebas+Neue&display=swap"
|
||||
rel="stylesheet"
|
||||
|
@ -1,7 +1,7 @@
|
||||
import { goto } from '$app/navigation';
|
||||
import { rdelete } from '$lib/requests.svelte';
|
||||
|
||||
type User = {
|
||||
export type User = {
|
||||
token: string;
|
||||
id: string;
|
||||
user_type: number;
|
||||
|
348
webpage/src/routes/admin/runners/+page.svelte
Normal file
348
webpage/src/routes/admin/runners/+page.svelte
Normal file
@ -0,0 +1,348 @@
|
||||
<script lang="ts">
|
||||
import { goto } from '$app/navigation';
|
||||
import { notificationStore } from 'src/lib/NotificationsStore.svelte';
|
||||
import { post, showMessage } from 'src/lib/requests.svelte';
|
||||
import { userStore } from 'src/routes/UserStore.svelte';
|
||||
import { onMount } from 'svelte';
|
||||
import * as d3 from 'd3';
|
||||
|
||||
import type { Base } from './types';
|
||||
import CardInfo from './CardInfo.svelte';
|
||||
|
||||
let width = $state(0);
|
||||
let height = $state(0);
|
||||
|
||||
function drag(simulation: any) {
|
||||
function dragstarted(event: any, d: any) {
|
||||
if (!event.active) simulation.alphaTarget(0.3).restart();
|
||||
d.fx = d.x;
|
||||
d.fy = d.y;
|
||||
selected = d.data;
|
||||
}
|
||||
|
||||
function dragged(event: any, d: any) {
|
||||
d.fx = event.x;
|
||||
d.fy = event.y;
|
||||
}
|
||||
|
||||
function dragended(event: any, d: any) {
|
||||
if (!event.active) simulation.alphaTarget(0);
|
||||
d.fx = null;
|
||||
d.fy = null;
|
||||
}
|
||||
|
||||
return d3.drag().on('start', dragstarted).on('drag', dragged).on('end', dragended);
|
||||
}
|
||||
|
||||
let graph: HTMLDivElement;
|
||||
|
||||
let selected: Base | undefined = $state();
|
||||
|
||||
async function getData() {
|
||||
const dataObj: Base = {
|
||||
name: 'API',
|
||||
type: 'api',
|
||||
children: []
|
||||
};
|
||||
|
||||
if (!dataObj.children) throw new Error();
|
||||
|
||||
const localRunners: Base[] = [];
|
||||
const remotePairs: Record<string, Base[]> = {};
|
||||
|
||||
try {
|
||||
let data = await post('tasks/runner/info', {});
|
||||
|
||||
if (Object.keys(data.localRunners).length > 0) {
|
||||
for (const objId of Object.keys(data.localRunners)) {
|
||||
localRunners.push({ name: objId, type: 'local_runner' });
|
||||
}
|
||||
|
||||
dataObj.children.push({
|
||||
name: 'local runners',
|
||||
type: 'runner_group',
|
||||
children: localRunners
|
||||
});
|
||||
}
|
||||
|
||||
for (const objId of Object.keys(data.remoteRunners)) {
|
||||
let obj = data.remoteRunners[objId];
|
||||
if (remotePairs[obj.runner_info.user_id as string]) {
|
||||
remotePairs[obj.runner_info.user_id as string].push({
|
||||
name: objId,
|
||||
type: 'runner',
|
||||
task: obj.task,
|
||||
parent: data.remoteRunners[objId].runner_info.user_id
|
||||
});
|
||||
} else {
|
||||
remotePairs[data.remoteRunners[objId].runner_info.user_id] = [
|
||||
{
|
||||
name: objId,
|
||||
type: 'runner',
|
||||
task: obj.task,
|
||||
parent: data.remoteRunners[objId].runner_info.user_id
|
||||
}
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
dataObj.children.push({
|
||||
name: 'remote runners',
|
||||
type: 'runner_group',
|
||||
task: undefined,
|
||||
children: Object.keys(remotePairs).map(
|
||||
(name) =>
|
||||
({
|
||||
name,
|
||||
type: 'user_group',
|
||||
task: undefined,
|
||||
children: remotePairs[name]
|
||||
}) as Base
|
||||
)
|
||||
});
|
||||
} catch (ex) {
|
||||
showMessage(ex, notificationStore, 'Failed to get Runner information');
|
||||
return;
|
||||
}
|
||||
|
||||
const root = d3.hierarchy(dataObj);
|
||||
const links = root.links();
|
||||
const nodes = root.descendants();
|
||||
console.log(root, links, nodes);
|
||||
|
||||
const simulation = d3
|
||||
.forceSimulation(nodes)
|
||||
.force(
|
||||
'link',
|
||||
d3
|
||||
.forceLink(links)
|
||||
.id((d: any) => d.id)
|
||||
.distance((d: any) => {
|
||||
let data = d.source.data as Base;
|
||||
switch (data.type) {
|
||||
case 'api':
|
||||
return 150;
|
||||
case 'runner_group':
|
||||
return 90;
|
||||
case 'user_group':
|
||||
return 80;
|
||||
case 'runner':
|
||||
case 'local_runner':
|
||||
return 20;
|
||||
default:
|
||||
throw new Error();
|
||||
}
|
||||
})
|
||||
.strength(1)
|
||||
)
|
||||
.force('charge', d3.forceManyBody().strength(-1000))
|
||||
.force('x', d3.forceX())
|
||||
.force('y', d3.forceY());
|
||||
|
||||
const svg = d3
|
||||
.create('svg')
|
||||
.attr('width', width)
|
||||
.attr('height', height - 62)
|
||||
.attr('viewBox', [-width / 2, -height / 2, width, height])
|
||||
.attr('style', 'max-width: 100%; height: auto;');
|
||||
// Append links.
|
||||
const link = svg
|
||||
.append('g')
|
||||
.attr('stroke', '#999')
|
||||
.attr('stroke-opacity', 0.6)
|
||||
.selectAll('line')
|
||||
.data(links)
|
||||
.join('line');
|
||||
|
||||
const database_svg = `
|
||||
<svg xmlns="http://www.w3.org/2000/svg" stroke-width="0.2" width="32" height="32" fill="currentColor" class="bi bi-database" viewBox="0 0 32 32">
|
||||
<path transform="scale(2)" d="M4.318 2.687C5.234 2.271 6.536 2 8 2s2.766.27 3.682.687C12.644 3.125 13 3.627 13 4c0 .374-.356.875-1.318 1.313C10.766 5.729 9.464 6 8 6s-2.766-.27-3.682-.687C3.356 4.875 3 4.373 3 4c0-.374.356-.875 1.318-1.313M13 5.698V7c0 .374-.356.875-1.318 1.313C10.766 8.729 9.464 9 8 9s-2.766-.27-3.682-.687C3.356 7.875 3 7.373 3 7V5.698c.271.202.58.378.904.525C4.978 6.711 6.427 7 8 7s3.022-.289 4.096-.777A5 5 0 0 0 13 5.698M14 4c0-1.007-.875-1.755-1.904-2.223C11.022 1.289 9.573 1 8 1s-3.022.289-4.096.777C2.875 2.245 2 2.993 2 4v9c0 1.007.875 1.755 1.904 2.223C4.978 15.71 6.427 16 8 16s3.022-.289 4.096-.777C13.125 14.755 14 14.007 14 13zm-1 4.698V10c0 .374-.356.875-1.318 1.313C10.766 11.729 9.464 12 8 12s-2.766-.27-3.682-.687C3.356 10.875 3 10.373 3 10V8.698c.271.202.58.378.904.525C4.978 9.71 6.427 10 8 10s3.022-.289 4.096-.777A5 5 0 0 0 13 8.698m0 3V13c0 .374-.356.875-1.318 1.313C10.766 14.729 9.464 15 8 15s-2.766-.27-3.682-.687C3.356 13.875 3 13.373 3 13v-1.302c.271.202.58.378.904.525C4.978 12.71 6.427 13 8 13s3.022-.289 4.096-.777c.324-.147.633-.323.904-.525"/>
|
||||
</svg>
|
||||
`;
|
||||
|
||||
const cpu_svg = `
|
||||
<svg stroke="white" fill="white" xmlns="http://www.w3.org/2000/svg" stroke-width="0.2" width="32" height="32" fill="currentColor" class="bi bi-cpu-fill" viewBox="0 0 32 32">
|
||||
<path transform="scale(2)" d="M6.5 6a.5.5 0 0 0-.5.5v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-.5-.5z"/>
|
||||
<path transform="scale(2)" d="M5.5.5a.5.5 0 0 0-1 0V2A2.5 2.5 0 0 0 2 4.5H.5a.5.5 0 0 0 0 1H2v1H.5a.5.5 0 0 0 0 1H2v1H.5a.5.5 0 0 0 0 1H2v1H.5a.5.5 0 0 0 0 1H2A2.5 2.5 0 0 0 4.5 14v1.5a.5.5 0 0 0 1 0V14h1v1.5a.5.5 0 0 0 1 0V14h1v1.5a.5.5 0 0 0 1 0V14h1v1.5a.5.5 0 0 0 1 0V14a2.5 2.5 0 0 0 2.5-2.5h1.5a.5.5 0 0 0 0-1H14v-1h1.5a.5.5 0 0 0 0-1H14v-1h1.5a.5.5 0 0 0 0-1H14v-1h1.5a.5.5 0 0 0 0-1H14A2.5 2.5 0 0 0 11.5 2V.5a.5.5 0 0 0-1 0V2h-1V.5a.5.5 0 0 0-1 0V2h-1V.5a.5.5 0 0 0-1 0V2h-1zm1 4.5h3A1.5 1.5 0 0 1 11 6.5v3A1.5 1.5 0 0 1 9.5 11h-3A1.5 1.5 0 0 1 5 9.5v-3A1.5 1.5 0 0 1 6.5 5"/>
|
||||
</svg>
|
||||
`;
|
||||
|
||||
const user_svg = `
|
||||
<svg fill="white" stroke="white" xmlns="http://www.w3.org/2000/svg" stroke-width="0.2" width="32" height="32" fill="currentColor" class="bi bi-person-fill" viewBox="0 0 32 32">
|
||||
<path transform="scale(2)" d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6"/>
|
||||
</svg>
|
||||
`;
|
||||
|
||||
const inbox_fill = `
|
||||
<svg fill="white" stroke="white" xmlns="http://www.w3.org/2000/svg" stroke-width="0.2" width="32" height="32" fill="currentColor" class="bi bi-inbox-fill" viewBox="0 0 32 32">
|
||||
<path transform="scale(2)" d="M4.98 4a.5.5 0 0 0-.39.188L1.54 8H6a.5.5 0 0 1 .5.5 1.5 1.5 0 1 0 3 0A.5.5 0 0 1 10 8h4.46l-3.05-3.812A.5.5 0 0 0 11.02 4zm-1.17-.437A1.5 1.5 0 0 1 4.98 3h6.04a1.5 1.5 0 0 1 1.17.563l3.7 4.625a.5.5 0 0 1 .106.374l-.39 3.124A1.5 1.5 0 0 1 14.117 13H1.883a1.5 1.5 0 0 1-1.489-1.314l-.39-3.124a.5.5 0 0 1 .106-.374z"/>
|
||||
</svg>
|
||||
`;
|
||||
|
||||
const node = svg
|
||||
.append('g')
|
||||
.attr('fill', '#fff')
|
||||
.attr('stroke', '#000')
|
||||
.attr('stroke-width', 1.5)
|
||||
.selectAll('g')
|
||||
.data(nodes)
|
||||
.join('g')
|
||||
.attr('style', 'cursor: pointer;')
|
||||
.call(drag(simulation) as any)
|
||||
.on('click', (e) => {
|
||||
console.log('test');
|
||||
function findData(obj: HTMLElement) {
|
||||
if ((obj as any).__data__) {
|
||||
return (obj as any).__data__;
|
||||
}
|
||||
if (!obj.parentElement) {
|
||||
throw new Error();
|
||||
}
|
||||
return findData(obj.parentElement);
|
||||
}
|
||||
let obj = findData(e.srcElement);
|
||||
console.log(obj);
|
||||
selected = obj.data;
|
||||
});
|
||||
|
||||
node
|
||||
.append('circle')
|
||||
.attr('fill', (d: any) => {
|
||||
let data = d.data as Base;
|
||||
switch (data.type) {
|
||||
case 'api':
|
||||
return '#caf0f8';
|
||||
case 'runner_group':
|
||||
return '#00b4d8';
|
||||
case 'user_group':
|
||||
return '#0000ff';
|
||||
case 'runner':
|
||||
case 'local_runner':
|
||||
return '#03045e';
|
||||
default:
|
||||
throw new Error();
|
||||
}
|
||||
})
|
||||
.attr('stroke', (d: any) => {
|
||||
let data = d.data as Base;
|
||||
switch (data.type) {
|
||||
case 'api':
|
||||
case 'user_group':
|
||||
case 'runner_group':
|
||||
return '#fff';
|
||||
case 'runner':
|
||||
case 'local_runner':
|
||||
// TODO make this relient on the stauts
|
||||
return '#000';
|
||||
default:
|
||||
throw new Error();
|
||||
}
|
||||
})
|
||||
.attr('r', (d: any) => {
|
||||
let data = d.data as Base;
|
||||
switch (data.type) {
|
||||
case 'api':
|
||||
return 30;
|
||||
case 'runner_group':
|
||||
return 20;
|
||||
case 'user_group':
|
||||
return 25;
|
||||
case 'runner':
|
||||
case 'local_runner':
|
||||
return 30;
|
||||
default:
|
||||
throw new Error();
|
||||
}
|
||||
})
|
||||
.append('title')
|
||||
.text((d: any) => d.data.name);
|
||||
|
||||
node
|
||||
.filter((d) => {
|
||||
return ['api', 'local_runner', 'runner', 'user_group', 'runner_group'].includes(
|
||||
d.data.type
|
||||
);
|
||||
})
|
||||
.append('g')
|
||||
.html((d) => {
|
||||
switch (d.data.type) {
|
||||
case 'api':
|
||||
return database_svg;
|
||||
case 'user_group':
|
||||
return user_svg;
|
||||
case 'runner_group':
|
||||
return inbox_fill;
|
||||
case 'local_runner':
|
||||
case 'runner':
|
||||
return cpu_svg;
|
||||
default:
|
||||
throw new Error();
|
||||
}
|
||||
});
|
||||
|
||||
simulation.on('tick', () => {
|
||||
link
|
||||
.attr('x1', (d: any) => d.source.x)
|
||||
.attr('y1', (d: any) => d.source.y)
|
||||
.attr('x2', (d: any) => d.target.x)
|
||||
.attr('y2', (d: any) => d.target.y);
|
||||
|
||||
node
|
||||
.select('circle')
|
||||
.attr('cx', (d: any) => d.x)
|
||||
.attr('cy', (d: any) => d.y);
|
||||
node
|
||||
.select('svg')
|
||||
.attr('x', (d: any) => d.x - 16)
|
||||
.attr('y', (d: any) => d.y - 16);
|
||||
});
|
||||
|
||||
//invalidation.then(() => simulation.stop());
|
||||
|
||||
graph.appendChild(svg.node() as any);
|
||||
}
|
||||
|
||||
$effect(() => {
|
||||
console.log(selected);
|
||||
});
|
||||
|
||||
onMount(() => {
|
||||
// Check if logged in and admin
|
||||
if (!userStore.user || userStore.user.user_type != 2) {
|
||||
goto('/');
|
||||
return;
|
||||
}
|
||||
getData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<svelte:window bind:innerWidth={width} bind:innerHeight={height} />
|
||||
<svelte:head>
|
||||
<title>Runners</title>
|
||||
</svelte:head>
|
||||
|
||||
<div class="graph-container">
|
||||
<div class="graph" bind:this={graph}></div>
|
||||
{#if selected}
|
||||
<div class="selected">
|
||||
<CardInfo item={selected} />
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<style lang="css">
|
||||
.graph-container {
|
||||
position: relative;
|
||||
.selected {
|
||||
position: absolute;
|
||||
right: 40px;
|
||||
top: 40px;
|
||||
width: 20%;
|
||||
height: auto;
|
||||
padding: 20px;
|
||||
background: white;
|
||||
border-radius: 20px;
|
||||
box-shadow: 1px 1px 8px 2px #22222244;
|
||||
}
|
||||
}
|
||||
</style>
|
90
webpage/src/routes/admin/runners/CardInfo.svelte
Normal file
90
webpage/src/routes/admin/runners/CardInfo.svelte
Normal file
@ -0,0 +1,90 @@
|
||||
<script lang="ts">
|
||||
import { post, showMessage } from 'src/lib/requests.svelte';
|
||||
import type { Base } from './types';
|
||||
import { notificationStore } from 'src/lib/NotificationsStore.svelte';
|
||||
import type { User } from 'src/routes/UserStore.svelte';
|
||||
import Spinner from 'src/lib/Spinner.svelte';
|
||||
import Tooltip from 'src/lib/Tooltip.svelte';
|
||||
|
||||
let { item }: { item: Base } = $props();
|
||||
|
||||
let user_data: User | undefined = $state();
|
||||
|
||||
async function getUserData(id: string) {
|
||||
try {
|
||||
user_data = await post('user/info/get', { id });
|
||||
console.log(user_data);
|
||||
} catch (ex) {
|
||||
showMessage(ex, notificationStore, 'Could not get user information');
|
||||
}
|
||||
}
|
||||
|
||||
$effect(() => {
|
||||
user_data = undefined;
|
||||
if (item.type == 'user_group') {
|
||||
getUserData(item.name);
|
||||
} else if (item.type == 'runner') {
|
||||
getUserData(item.parent ?? '');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
{#if item.type == 'api'}
|
||||
<h3>API</h3>
|
||||
{:else if item.type == 'runner_group'}
|
||||
<h3>Runner Group</h3>
|
||||
This reprents a the group of {item.name}.
|
||||
{:else if item.type == 'user_group'}
|
||||
<h3>User</h3>
|
||||
{#if user_data}
|
||||
All Runners connected to this node bellong to <span class="accent">{user_data.username}</span>
|
||||
{:else}
|
||||
<div style="text-align: center;">
|
||||
<Spinner />
|
||||
</div>
|
||||
{/if}
|
||||
{:else if item.type == 'local_runner'}
|
||||
<h3>Local Runner</h3>
|
||||
This is a local runner
|
||||
<div>
|
||||
{#if item.task}
|
||||
test
|
||||
{:else}
|
||||
Not running any task
|
||||
{/if}
|
||||
</div>
|
||||
{:else if item.type == 'runner'}
|
||||
<h3>Runner</h3>
|
||||
{#if user_data}
|
||||
<p>
|
||||
This is a remote runner. This runner is owned by<span class="accent"
|
||||
>{user_data?.username}</span
|
||||
>
|
||||
</p>
|
||||
<div>
|
||||
{#if item.task}
|
||||
This runner is runing a <Tooltip title={item.task.id}>task</Tooltip>
|
||||
{:else}
|
||||
Not running any task
|
||||
{/if}
|
||||
</div>
|
||||
{:else}
|
||||
<div style="text-align: center;">
|
||||
<Spinner />
|
||||
</div>
|
||||
{/if}
|
||||
{:else}
|
||||
{item.type}
|
||||
{/if}
|
||||
|
||||
<style lang="scss">
|
||||
h3 {
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
}
|
||||
.accent {
|
||||
background: #22222222;
|
||||
padding: 1px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
</style>
|
10
webpage/src/routes/admin/runners/types.ts
Normal file
10
webpage/src/routes/admin/runners/types.ts
Normal file
@ -0,0 +1,10 @@
|
||||
import type { Task } from 'src/routes/models/edit/tasks/types';
|
||||
|
||||
export type BaseType = 'api' | 'runner_group' | 'user_group' | 'runner' | 'local_runner';
|
||||
export type Base = {
|
||||
name: string;
|
||||
type: BaseType;
|
||||
children?: Base[];
|
||||
task?: Task;
|
||||
parent?: string;
|
||||
};
|
@ -1,26 +1,22 @@
|
||||
<script lang="ts">
|
||||
import MessageSimple from 'src/lib/MessageSimple.svelte';
|
||||
import { onMount } from 'svelte';
|
||||
import { get } from '$lib/requests.svelte';
|
||||
import { get, showMessage } from '$lib/requests.svelte';
|
||||
import { notificationStore } from 'src/lib/NotificationsStore.svelte';
|
||||
import Spinner from 'src/lib/Spinner.svelte';
|
||||
|
||||
let list = $state<
|
||||
{
|
||||
| {
|
||||
name: string;
|
||||
id: string;
|
||||
}[]
|
||||
>([]);
|
||||
|
||||
let message: MessageSimple;
|
||||
| undefined
|
||||
>(undefined);
|
||||
|
||||
onMount(async () => {
|
||||
try {
|
||||
list = await get('models');
|
||||
} catch (e) {
|
||||
if (e instanceof Response) {
|
||||
message.display(await e.json());
|
||||
} else {
|
||||
message.display('Could not request list of models');
|
||||
}
|
||||
showMessage(e, notificationStore, 'Could not request list of models');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
@ -30,7 +26,7 @@
|
||||
</svelte:head>
|
||||
|
||||
<main>
|
||||
<MessageSimple bind:this={message} />
|
||||
{#if list}
|
||||
{#if list.length > 0}
|
||||
<div class="list-header">
|
||||
<h2>My Models</h2>
|
||||
@ -65,6 +61,11 @@
|
||||
<a class="button padded" href="/models/add"> Create a new model </a>
|
||||
</div>
|
||||
{/if}
|
||||
{:else}
|
||||
<div style="text-align: center;">
|
||||
<Spinner />
|
||||
</div>
|
||||
{/if}
|
||||
</main>
|
||||
|
||||
<style lang="scss">
|
||||
|
@ -1,15 +1,13 @@
|
||||
<script lang="ts">
|
||||
import FileUpload from 'src/lib/FileUpload.svelte';
|
||||
import MessageSimple from 'src/lib/MessageSimple.svelte';
|
||||
import { postFormData } from 'src/lib/requests.svelte';
|
||||
import { postFormData, showMessage } from 'src/lib/requests.svelte';
|
||||
import { goto } from '$app/navigation';
|
||||
import { notificationStore } from 'src/lib/NotificationsStore.svelte';
|
||||
|
||||
import 'src/styles/forms.css';
|
||||
|
||||
let submitted = $state(false);
|
||||
|
||||
let message: MessageSimple;
|
||||
|
||||
let buttonClicked: Promise<void> = $state(Promise.resolve());
|
||||
|
||||
let data = $state<{
|
||||
@ -21,7 +19,6 @@
|
||||
});
|
||||
|
||||
async function onSubmit() {
|
||||
message.display('');
|
||||
buttonClicked = new Promise<void>(() => {});
|
||||
|
||||
if (!data.file || !data.name) return;
|
||||
@ -34,11 +31,7 @@
|
||||
let id = await postFormData('models/add', formData);
|
||||
goto(`/models/edit?id=${id}`);
|
||||
} catch (e) {
|
||||
if (e instanceof Response) {
|
||||
message.display(await e.json());
|
||||
} else {
|
||||
message.display('Was not able to create model');
|
||||
}
|
||||
showMessage(e, notificationStore, 'Was not able to create model');
|
||||
}
|
||||
|
||||
buttonClicked = Promise.resolve();
|
||||
@ -75,7 +68,6 @@
|
||||
</div>
|
||||
</FileUpload>
|
||||
</fieldset>
|
||||
<MessageSimple bind:this={message} />
|
||||
{#await buttonClicked}
|
||||
<div class="text-center">File Uploading</div>
|
||||
{:then}
|
||||
|
@ -1,11 +1,14 @@
|
||||
<script lang="ts">
|
||||
import { post, postFormData } from 'src/lib/requests.svelte';
|
||||
import { post, postFormData, showMessage } from 'src/lib/requests.svelte';
|
||||
import type { Model } from './+page.svelte';
|
||||
import FileUpload from 'src/lib/FileUpload.svelte';
|
||||
import MessageSimple from 'src/lib/MessageSimple.svelte';
|
||||
import { createEventDispatcher, onDestroy } from 'svelte';
|
||||
import Spinner from 'src/lib/Spinner.svelte';
|
||||
import type { Task } from './TasksTable.svelte';
|
||||
import type { Task } from './tasks/TasksTable.svelte';
|
||||
import Tabs from 'src/lib/Tabs.svelte';
|
||||
import hljs from 'highlight.js';
|
||||
import { notificationStore } from 'src/lib/NotificationsStore.svelte';
|
||||
|
||||
let { model } = $props<{ model: Model }>();
|
||||
|
||||
@ -19,8 +22,6 @@
|
||||
let last_task: string | undefined = $state();
|
||||
let last_task_timeout: number | null = null;
|
||||
|
||||
let messages: MessageSimple;
|
||||
|
||||
async function reloadLastTimeout() {
|
||||
if (!last_task) {
|
||||
return;
|
||||
@ -42,7 +43,6 @@
|
||||
|
||||
async function submit() {
|
||||
if (!file) return;
|
||||
messages.clear();
|
||||
|
||||
let form = new FormData();
|
||||
form.append('json_data', JSON.stringify({ id: model.id }));
|
||||
@ -56,11 +56,7 @@
|
||||
file = undefined;
|
||||
last_task_timeout = setTimeout(() => reloadLastTimeout());
|
||||
} catch (e) {
|
||||
if (e instanceof Response) {
|
||||
messages.display(await e.json());
|
||||
} else {
|
||||
messages.display('Could not run the model');
|
||||
}
|
||||
showMessage(e, notificationStore, 'Could not run the model');
|
||||
}
|
||||
|
||||
dispatch('upload');
|
||||
@ -73,7 +69,72 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<form on:submit|preventDefault={submit}>
|
||||
<Tabs active="upload" let:isActive>
|
||||
<div class="buttons" slot="buttons" let:setActive let:isActive>
|
||||
<button class="tab" class:selected={isActive('upload')} on:click={setActive('upload')}>
|
||||
Upload
|
||||
</button>
|
||||
<button class="tab" class:selected={isActive('api')} on:click={setActive('api')}> Api </button>
|
||||
</div>
|
||||
<div class="content" class:selected={isActive('api')}>
|
||||
<div class="codeinfo">
|
||||
To perform an image classfication please follow the example bellow:
|
||||
<pre style="font-family: Fira Code;">{@html hljs.highlight(
|
||||
`let form = new FormData();
|
||||
form.append('json_data', JSON.stringify({ id: '${model.id}' }));
|
||||
form.append('file', file, 'file');
|
||||
|
||||
const headers = new Headers();
|
||||
headers.append('response-type', 'application/json');
|
||||
headers.append('token', token);
|
||||
|
||||
const r = await fetch('${window.location.protocol}//${window.location.hostname}/api/tasks/start/image', {
|
||||
method: 'POST',
|
||||
headers: headers,
|
||||
body: form
|
||||
});`,
|
||||
{ language: 'javascript' }
|
||||
).value}</pre>
|
||||
On Success the request will return a json with this format:
|
||||
<pre style="font-family: Fira Code;">{@html hljs.highlight(
|
||||
`{ id "00000000-0000-0000-0000-000000000000" }`,
|
||||
{ language: 'json' }
|
||||
).value}</pre>
|
||||
This id can be used to query the API for the result of the task:
|
||||
<pre style="font-family: Fira Code;">{@html hljs.highlight(
|
||||
`const headers = new Headers();
|
||||
headers.append('content-type', 'application/json');
|
||||
headers.append('token', token);
|
||||
|
||||
const r = await fetch('${window.location.protocol}//${window.location.hostname}/api/tasks/task', {
|
||||
method: 'POST',
|
||||
headers: headers,
|
||||
body: JSON.stringify({ id: '00000000-0000-0000-0000-000000000000' })
|
||||
});`,
|
||||
{ language: 'javascript' }
|
||||
).value}</pre>
|
||||
Once the task shows the status as 4 then the data can be obatined in the result field: The successful
|
||||
return value has this type:
|
||||
<pre style="font-family: Fira Code;">{@html hljs.highlight(
|
||||
`{
|
||||
"id": string,
|
||||
"user_id": string,
|
||||
"model_id": string,
|
||||
"status": number,
|
||||
"status_message": string,
|
||||
"user_confirmed": number,
|
||||
"compacted": number,
|
||||
"type": number,
|
||||
"extra_task_info": string,
|
||||
"result": string,
|
||||
"created": string
|
||||
}`,
|
||||
{ language: 'javascript' }
|
||||
).value}</pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content" class:selected={isActive('upload')}>
|
||||
<form on:submit|preventDefault={submit} style="box-shadow: none;">
|
||||
<fieldset class="file-upload">
|
||||
<label for="file">Image</label>
|
||||
<div class="form-msg">Run image through them model and get the result</div>
|
||||
@ -86,7 +147,6 @@
|
||||
</div>
|
||||
</FileUpload>
|
||||
</fieldset>
|
||||
<MessageSimple bind:this={messages} />
|
||||
<button> Run </button>
|
||||
{#if run}
|
||||
{#await _result}
|
||||
@ -108,4 +168,12 @@
|
||||
{/if}
|
||||
{/await}
|
||||
{/if}
|
||||
</form>
|
||||
</form>
|
||||
</div>
|
||||
</Tabs>
|
||||
|
||||
<style lang="scss">
|
||||
.codeinfo {
|
||||
padding: 20px;
|
||||
}
|
||||
</style>
|
||||
|
@ -18,7 +18,6 @@
|
||||
PointElement,
|
||||
LineElement
|
||||
} from 'chart.js';
|
||||
import ModelData from '../ModelData.svelte';
|
||||
|
||||
Chart.register(
|
||||
Title,
|
||||
@ -57,7 +56,9 @@
|
||||
}
|
||||
|
||||
let pie: HTMLCanvasElement;
|
||||
let pie2: HTMLCanvasElement;
|
||||
let pieChart: Chart<'pie'> | undefined;
|
||||
let pie2Chart: Chart<'pie'> | undefined;
|
||||
function createPie(s: TasksStatsDay) {
|
||||
if (pieChart) {
|
||||
pieChart.destroy();
|
||||
@ -72,23 +73,31 @@
|
||||
'Classfication Failure',
|
||||
'Classfication Preparing',
|
||||
'Classfication Running',
|
||||
'Classfication Unknown',
|
||||
'Non Classfication Error',
|
||||
'Non Classfication Success'
|
||||
'Classfication Unknown'
|
||||
],
|
||||
datasets: [
|
||||
{
|
||||
label: 'Total',
|
||||
data: [
|
||||
t.c_error,
|
||||
t.c_success,
|
||||
t.c_failure,
|
||||
t.c_pre_running,
|
||||
t.c_running,
|
||||
t.c_unknown,
|
||||
t.nc_error,
|
||||
t.nc_success
|
||||
data: [t.c_error, t.c_success, t.c_failure, t.c_pre_running, t.c_running, t.c_unknown]
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
animation: false
|
||||
}
|
||||
});
|
||||
|
||||
if (pie2Chart) {
|
||||
pieChart.destroy();
|
||||
}
|
||||
pie2Chart = new Chart(pie2, {
|
||||
type: 'pie',
|
||||
data: {
|
||||
labels: ['Non Classfication Error', 'Non Classfication Success'],
|
||||
datasets: [
|
||||
{
|
||||
label: 'Total',
|
||||
data: [t.nc_error, t.nc_success]
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -147,8 +156,13 @@
|
||||
<h1>Statistics (Day)</h1>
|
||||
|
||||
<h2>Total</h2>
|
||||
<div>
|
||||
<div class="pies">
|
||||
<div>
|
||||
<canvas bind:this={pie}></canvas>
|
||||
</div>
|
||||
<div>
|
||||
<canvas bind:this={pie2}></canvas>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2>Hourly</h2>
|
||||
@ -160,4 +174,12 @@
|
||||
canvas {
|
||||
width: 100%;
|
||||
}
|
||||
.pies {
|
||||
display: flex;
|
||||
align-content: stretch;
|
||||
|
||||
div {
|
||||
width: 50%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -1,16 +1,4 @@
|
||||
<script lang="ts" context="module">
|
||||
export type Task = {
|
||||
id: string;
|
||||
user_id: string;
|
||||
model_id: string;
|
||||
status: number;
|
||||
status_message: string;
|
||||
user_confirmed: number;
|
||||
compacted: number;
|
||||
type: number;
|
||||
created: string;
|
||||
result: string;
|
||||
};
|
||||
export const TaskType = {
|
||||
TASK_FAILED_RUNNING: -2,
|
||||
TASK_FAILED_CREATION: -1,
|
||||
@ -55,6 +43,8 @@
|
||||
import MessageSimple from 'src/lib/MessageSimple.svelte';
|
||||
import Tooltip from 'src/lib/Tooltip.svelte';
|
||||
|
||||
import type { Task } from './types';
|
||||
|
||||
let { model }: { model: Model } = $props();
|
||||
|
||||
let page = $state(0);
|
||||
|
12
webpage/src/routes/models/edit/tasks/types.ts
Normal file
12
webpage/src/routes/models/edit/tasks/types.ts
Normal file
@ -0,0 +1,12 @@
|
||||
export type Task = {
|
||||
id: string;
|
||||
user_id: string;
|
||||
model_id: string;
|
||||
status: number;
|
||||
status_message: string;
|
||||
user_confirmed: number;
|
||||
compacted: number;
|
||||
type: number;
|
||||
created: string;
|
||||
result: string;
|
||||
};
|
@ -2,5 +2,10 @@ import { sveltekit } from '@sveltejs/kit/vite';
|
||||
import { defineConfig } from 'vite';
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [sveltekit()]
|
||||
plugins: [sveltekit()],
|
||||
build: {
|
||||
commonjsOptions: {
|
||||
esmExternals: true
|
||||
}
|
||||
}
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user