Updated generation pages.

This commit is contained in:
Aodhan Collins
2026-03-15 17:45:17 +00:00
parent 79bbf669e2
commit d756ea1d0e
30 changed files with 2033 additions and 189 deletions

View File

@@ -81,7 +81,7 @@
<div class="mb-3">
<label class="form-label fw-semibold">Identity Fields</label>
<div class="row g-2">
{% for k in ['base_specs','hair','eyes','hands','arms','torso','pelvis','legs','feet','extra'] %}
{% for k in ['base','head','upper_body','lower_body','hands','feet','additional'] %}
<div class="col-6 col-sm-4 col-md-4">
<div class="d-flex justify-content-between align-items-center border rounded p-2">
<small>{{ k | replace('_', ' ') }}</small>
@@ -114,7 +114,7 @@
value="{{ wd_cfg.get('outfit', 'default') }}" placeholder="default">
</div>
<div class="row g-2">
{% for k in ['full_body','headwear','top','bottom','legwear','footwear','hands','gloves','accessories'] %}
{% for k in ['base','head','upper_body','lower_body','hands','feet','additional'] %}
<div class="col-6 col-sm-4">
<div class="d-flex justify-content-between align-items-center border rounded p-2">
<small>{{ k | replace('_', ' ') }}</small>
@@ -144,7 +144,7 @@
</div>
<label class="form-label fw-semibold">Fields</label>
<div class="row g-2">
{% for k in ['full_body','additional','head','eyes','arms','hands'] %}
{% for k in ['base','head','upper_body','lower_body','hands','feet','additional'] %}
<div class="col-6 col-sm-4">
<div class="d-flex justify-content-between align-items-center border rounded p-2">
<small>{{ k | replace('_', ' ') }}</small>
@@ -266,6 +266,40 @@
</div>
</div>
<!-- Resolution -->
{% set res = d.get('resolution', {}) %}
<div class="card mb-4">
<div class="card-header py-2 d-flex justify-content-between align-items-center">
<strong>Resolution</strong>
<div class="form-check form-switch mb-0">
<input class="form-check-input" type="checkbox" name="res_random" id="res_random" {% if res.get('random', false) %}checked{% endif %}>
<label class="form-check-label small" for="res_random">Random aspect ratio</label>
</div>
</div>
<div class="card-body" id="res-fields">
<div class="d-flex flex-wrap gap-1 mb-2">
<button type="button" class="btn btn-sm btn-outline-secondary res-preset" data-w="1024" data-h="1024">1:1</button>
<button type="button" class="btn btn-sm btn-outline-secondary res-preset" data-w="1152" data-h="896">4:3 L</button>
<button type="button" class="btn btn-sm btn-outline-secondary res-preset" data-w="896" data-h="1152">4:3 P</button>
<button type="button" class="btn btn-sm btn-outline-secondary res-preset" data-w="1344" data-h="768">16:9 L</button>
<button type="button" class="btn btn-sm btn-outline-secondary res-preset" data-w="768" data-h="1344">16:9 P</button>
<button type="button" class="btn btn-sm btn-outline-secondary res-preset" data-w="1280" data-h="800">16:10 L</button>
<button type="button" class="btn btn-sm btn-outline-secondary res-preset" data-w="800" data-h="1280">16:10 P</button>
<button type="button" class="btn btn-sm btn-outline-secondary res-preset" data-w="1792" data-h="768">21:9 L</button>
<button type="button" class="btn btn-sm btn-outline-secondary res-preset" data-w="768" data-h="1792">21:9 P</button>
</div>
<div class="d-flex align-items-center gap-2">
<label class="form-label mb-0 small fw-semibold">W</label>
<input type="number" class="form-control form-control-sm" name="res_width" id="res-width"
value="{{ res.get('width', 1024) }}" min="64" max="4096" step="64" style="width:88px">
<span class="text-muted">&times;</span>
<label class="form-label mb-0 small fw-semibold">H</label>
<input type="number" class="form-control form-control-sm" name="res_height" id="res-height"
value="{{ res.get('height', 1024) }}" min="64" max="4096" step="64" style="width:88px">
</div>
</div>
</div>
<div class="d-flex gap-2 pb-4">
<button type="submit" class="btn btn-primary">Save Preset</button>
<a href="{{ url_for('preset_detail', slug=preset.slug) }}" class="btn btn-outline-secondary">Cancel</a>
@@ -274,3 +308,45 @@
</div>
</form>
{% endblock %}
{% block scripts %}
<script>
// Resolution preset buttons
document.querySelectorAll('.res-preset').forEach(btn => {
btn.addEventListener('click', () => {
document.getElementById('res-width').value = btn.dataset.w;
document.getElementById('res-height').value = btn.dataset.h;
document.querySelectorAll('.res-preset').forEach(b => {
b.classList.remove('btn-secondary');
b.classList.add('btn-outline-secondary');
});
btn.classList.remove('btn-outline-secondary');
btn.classList.add('btn-secondary');
});
});
// Highlight the matching preset button on load
(function() {
const w = document.getElementById('res-width').value;
const h = document.getElementById('res-height').value;
document.querySelectorAll('.res-preset').forEach(btn => {
if (btn.dataset.w === w && btn.dataset.h === h) {
btn.classList.remove('btn-outline-secondary');
btn.classList.add('btn-secondary');
}
});
// Toggle resolution fields visibility based on random checkbox
const randomCb = document.getElementById('res_random');
const resFields = document.getElementById('res-fields');
function toggleResFields() {
resFields.querySelectorAll('input, button.res-preset').forEach(el => {
el.disabled = randomCb.checked;
});
resFields.style.opacity = randomCb.checked ? '0.5' : '1';
}
randomCb.addEventListener('change', toggleResFields);
toggleResFields();
})();
</script>
{% endblock %}