brett/Zordon
1
0
Fork 0
mirror of https://github.com/blw1138/Zordon.git synced 2025-12-17 08:48:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add presets.yaml and to web ui

Browse Source
This commit is contained in:
Brett Williams
2022-12-11 14:19:59 -08:00
parent 10dd5b4295
commit 9f291a1282
3 changed files with 102 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
lib/job_server.py
View File

@@ -10,6 +10,7 @@ from datetime import datetime
from zipfile import ZipFile from zipfile import ZipFile
import requests import requests
import yaml
from flask import Flask, request, render_template, send_file, after_this_request, Response, redirect, url_for, abort from flask import Flask, request, render_template, send_file, after_this_request, Response, redirect, url_for, abort
from werkzeug.utils import secure_filename from werkzeug.utils import secure_filename
@@ -42,8 +43,12 @@ def sorted_jobs(all_jobs, sort_by_date=True):
@server.route('/') @server.route('/')
@server.route('/index') @server.route('/index')
def index(): def index():
with open('utilities/presets.yaml') as f:
presets = yaml.load(f, Loader=yaml.FullLoader)
return render_template('index.html', all_jobs=sorted_jobs(RenderQueue.job_queue), hostname=RenderQueue.host_name, return render_template('index.html', all_jobs=sorted_jobs(RenderQueue.job_queue), hostname=RenderQueue.host_name,
renderer_info=renderer_info()) renderer_info=renderer_info(), render_clients=RenderQueue.render_clients, preset_list=presets)
@server.route('/ui/job/<job_id>/full_details') @server.route('/ui/job/<job_id>/full_details')

117
templates/index.html
View File

@@ -9,7 +9,7 @@
<script src="https://kit.fontawesome.com/698705d14d.js" crossorigin="anonymous"></script> <script src="https://kit.fontawesome.com/698705d14d.js" crossorigin="anonymous"></script>
<script type="text/javascript" src="{{ url_for('static', filename = 'modals.js') }}"></script> <script type="text/javascript" src="{{ url_for('static', filename = 'modals.js') }}"></script>
</head> </head>
<body onload="configureDropDownLists(document.getElementById('renderer'), document.getElementById('export_format'))"> <body onload="rendererChanged(document.getElementById('renderer'))">
<nav class="navbar is-dark" role="navigation" aria-label="main navigation"> <nav class="navbar is-dark" role="navigation" aria-label="main navigation">
<div class="navbar-brand"> <div class="navbar-brand">
@@ -26,13 +26,18 @@
<div class="navbar-end"> <div class="navbar-end">
<div class="navbar-item"> <div class="navbar-item">
<button class="button is-primary is-outlined js-modal-trigger" data-target="add-job-modal">Submit Job</button> <button class="button is-primary is-outlined js-modal-trigger" data-target="add-job-modal">
<span class="icon">
<i class="fa-solid fa-plus"></i>
</span>
<span>Submit Job</span>
</button>
</div> </div>
</div> </div>
</nav> </nav>
<div class="table-container"> <div class="table-container">
<table class="table is-bordered is-striped is-hoverable is-fullwidth"> <table class="table is-bordered is-striped is-hoverable is-fullwidth is-narrow">
<thead> <thead>
<tr> <tr>
<th>Preview</th> <th>Preview</th>
@@ -107,9 +112,10 @@
<section class="modal-card-body"> <section class="modal-card-body">
<!-- File Uploader --> <!-- File Uploader -->
<label class="label">Upload File</label>
<div id="file-uploader" class="file has-name is-fullwidth"> <div id="file-uploader" class="file has-name is-fullwidth">
<label class="file-label"> <label class="file-label">
<input class="file-input" type="file" name="file"> <input class="file-input is-small" type="file" name="file">
<span class="file-cta"> <span class="file-cta">
<span class="file-icon"> <span class="file-icon">
<i class="fas fa-upload"></i> <i class="fas fa-upload"></i>
@@ -132,7 +138,19 @@
fileName.textContent = fileInput.files[0].name; fileName.textContent = fileInput.files[0].name;
} }
} }
function configureDropDownLists(ddl1, ddl2) {
const presets = {
{% for preset in preset_list: %}
{{preset}}: {
name: '{{preset_list[preset]['name']}}',
renderer: '{{preset_list[preset]['renderer']}}',
args: '{{preset_list[preset]['args']}}',
},
{% endfor %}
};
function rendererChanged(ddl1) {
var renderers = { var renderers = {
{% for renderer in renderer_info: %} {% for renderer in renderer_info: %}
{% if renderer_info[renderer]['supported_export_formats']: %} {% if renderer_info[renderer]['supported_export_formats']: %}
@@ -143,13 +161,26 @@
], ],
{% endif %} {% endif %}
{% endfor %} {% endfor %}
} };
var selectedRenderer = ddl1.value;
var ddl3 = document.getElementById('preset_list');
ddl3.options.length = 0;
createOption(ddl3, '-Presets-', '');
for (var preset_name in presets) {
if (presets[preset_name]['renderer'] == selectedRenderer) {
createOption(ddl3, presets[preset_name]['name'], preset_name);
};
};
document.getElementById('raw_args').value = "";
var ddl2 = document.getElementById('export_format');
ddl2.options.length = 0; ddl2.options.length = 0;
var options = renderers[ddl1.value] var options = renderers[selectedRenderer];
for (i = 0; i < options.length; i++) { for (i = 0; i < options.length; i++) {
createOption(ddl2, options[i], options[i]); createOption(ddl2, options[i], options[i]);
} };
} }
function createOption(ddl, text, value) { function createOption(ddl, text, value) {
@@ -158,39 +189,57 @@
opt.text = text; opt.text = text;
ddl.options.add(opt); ddl.options.add(opt);
} }
function addPresetTextToInput(presetfield, textfield) {
var p = presets[presetfield.value];
textfield.value = p['args'];
}
</script> </script>
<!-- Renderer --> <!-- Renderer & Priority -->
<div class="field"> <div class="field is-grouped">
<label class="label">Renderer</label> <p class="control">
<div class="control"> <label class="label">Renderer</label>
<div class="select"> <span class="select">
<select id="renderer" name="renderer" onchange="configureDropDownLists(this, document.getElementById('export_format'))"> <select id="renderer" name="renderer" onchange="rendererChanged(this)">
{% for renderer in renderer_info: %} {% for renderer in renderer_info: %}
<option name="renderer" value="{{renderer}}">{{renderer}}</option> <option name="renderer" value="{{renderer}}">{{renderer}}</option>
{% endfor %} {% endfor %}
</select> </select>
</div> </span>
</div> </p>
<p class="control">
<label class="label">Client</label>
<span class="select">
<select name="client">
<option name="client" value="">First Available</option>
{% for client in render_clients: %}
<option name="client" value="{{client}}">{{client}}</option>
{% endfor %}
</select>
</span>
</p>
<p class="control">
<label class="label">Priority</label>
<span class="select">
<select name="priority">
<option name="priority" value="1">1</option>
<option name="priority" value="2" selected="selected">2</option>
<option name="priority" value="3">3</option>
</select>
</span>
</p>
</div> </div>
<!-- Priority -->
<div class="control">
<label class="label">Priority</label>
<label class="radio"><input type="radio" name="priority" value="1">1</label>
<label class="radio"><input type="radio" name="priority" value="2" checked>2</label>
<label class="radio"><input type="radio" name="priority" value="3">3</label>
</div>
<br>
<!-- Output Path --> <!-- Output Path -->
<label class="label">Output</label> <label class="label">Output</label>
<div class="field has-addons"> <div class="field has-addons">
<div class="control is-expanded"> <div class="control is-expanded">
<input class="input is-success" type="text" placeholder="Output Name" name="output_path"> <input class="input is-small" type="text" placeholder="Output Name" name="output_path">
</div> </div>
<p class="control"> <p class="control">
<span class="select"> <span class="select is-small">
<select id="export_format" name="export_format"> <select id="export_format" name="export_format">
<option value="ar">option</option> <option value="ar">option</option>
</select> </select>
@@ -206,8 +255,18 @@
<!-- </div>--> <!-- </div>-->
<!-- </div>--> <!-- </div>-->
<div class="control"> <label class="label">Command Line Arguments</label>
<input class="input" type="text" placeholder="Custom Args" name="raw_args"> <div class="field has-addons">
<p class="control">
<span class="select is-small">
<select id="preset_list" onchange="addPresetTextToInput(this, document.getElementById('raw_args'))">
<option value="preset-placeholder">presets</option>
</select>
</span>
</p>
<p class="control is-expanded">
<input class="input is-small" type="text" placeholder="Args" id="raw_args" name="raw_args">
</p>
</div> </div>
<!-- End Add Form --> <!-- End Add Form -->

8
utilities/presets.yaml Normal file
View File

@@ -0,0 +1,8 @@
fast_preview_ffmpeg:
name: "Fast Preview - Full Res"
renderer: "ffmpeg"
args: "-vf format=yuv420p -preset ultrafast"
fast_preview_ffmpeg_720:
name: "Fast Preview - 720p"
renderer: "ffmpeg"
args: "-vf format=yuv420p,scale=720:-2 -preset ultrafast"