161 lines
10 KiB
HTML
161 lines
10 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block content %}
|
|
<div class="row justify-content-center">
|
|
<div class="col-md-8">
|
|
<div class="card shadow">
|
|
<div class="card-header bg-primary text-white">
|
|
<h4 class="mb-0"><i class="fas fa-magic me-2"></i>Project Setup</h4>
|
|
</div>
|
|
<div class="card-body">
|
|
<p class="text-muted">The AI has analyzed your concept. Review and edit the suggestions below before creating your project.</p>
|
|
|
|
<form method="POST" onsubmit="showLoading(this)">
|
|
<input type="hidden" name="concept" value="{{ concept }}">
|
|
<input type="hidden" name="persona_key" id="persona_key_input" value="{{ persona_key|default('') }}">
|
|
|
|
<!-- Refinement Bar -->
|
|
<div class="input-group mb-4 shadow-sm">
|
|
<span class="input-group-text bg-warning text-dark" data-bs-toggle="tooltip" title="Ask AI to change the suggestions"><i class="fas fa-magic"></i></span>
|
|
<input type="text" name="refine_instruction" class="form-control" placeholder="AI Instruction: e.g. 'Make it a trilogy', 'Change genre to Cyberpunk', 'Make the tone darker'">
|
|
<button type="submit" formaction="/project/setup/refine" class="btn btn-warning">Refine with AI</button>
|
|
</div>
|
|
|
|
<!-- Core Metadata -->
|
|
<div class="row mb-3">
|
|
<div class="col-md-12">
|
|
<label class="form-label fw-bold">Book Title</label>
|
|
<input type="text" name="title" class="form-control form-control-lg" value="{{ s.title }}" required>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-3">
|
|
<div class="col-md-6">
|
|
<label class="form-label">Genre</label>
|
|
<input type="text" name="genre" class="form-control" value="{{ s.genre }}">
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label">Target Audience</label>
|
|
<input type="text" name="audience" class="form-control" value="{{ s.target_audience }}">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<label class="form-label fw-bold text-primary">Select Author Persona (Optional)</label>
|
|
<select class="form-select" onchange="applyPersona(this)">
|
|
<option value="">-- Select a Persona to Auto-fill --</option>
|
|
{% for key, p in personas.items() %}
|
|
<option value="{{ key }}" data-name="{{ p.name }}" data-bio="{{ p.bio }}">{{ key }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label">Author Name</label>
|
|
<input type="text" name="author" class="form-control" value="{{ current_user.username }}">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label">Author Bio / Persona</label>
|
|
<textarea name="author_bio" class="form-control" rows="2">{{ s.author_bio }}</textarea>
|
|
</div>
|
|
|
|
<hr>
|
|
|
|
<!-- Structure -->
|
|
<h5 class="text-primary mb-3">Structure & Length</h5>
|
|
<div class="row mb-3">
|
|
<div class="col-md-12 mb-2">
|
|
<label class="form-label">Length Category</label>
|
|
<select name="length_category" class="form-select">
|
|
{% for key, val in lengths.items() %}
|
|
<option value="{{ key }}" {% if key == s.length_category %}selected{% endif %}>
|
|
{{ val.label }} ({{ val.words }} words)
|
|
</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label">Est. Chapters</label>
|
|
<input type="number" name="chapters" class="form-control" value="{{ s.estimated_chapters }}">
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label">Est. Word Count</label>
|
|
<input type="text" name="words" class="form-control" value="{{ s.estimated_word_count }}">
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<div class="form-check form-check-inline">
|
|
<input class="form-check-input" type="checkbox" name="include_prologue" {% if s.include_prologue %}checked{% endif %}>
|
|
<label class="form-check-label">Include Prologue</label>
|
|
</div>
|
|
<div class="form-check form-check-inline">
|
|
<input class="form-check-input" type="checkbox" name="include_epilogue" {% if s.include_epilogue %}checked{% endif %}>
|
|
<label class="form-check-label">Include Epilogue</label>
|
|
</div>
|
|
<div class="form-check form-check-inline">
|
|
<input class="form-check-input" type="checkbox" name="is_series" {% if s.is_series %}checked{% endif %}>
|
|
<label class="form-check-label">Is Series</label>
|
|
</div>
|
|
<div class="form-check form-check-inline">
|
|
<label class="form-label ms-2 small">Book Count:</label>
|
|
<input type="number" name="series_count" class="form-control d-inline-block py-0 px-2" style="width: 60px; height: 25px;" value="{{ s.series_count|default(1) }}">
|
|
</div>
|
|
</div>
|
|
|
|
<hr>
|
|
|
|
<!-- Style -->
|
|
<h5 class="text-primary mb-3">Style & Tone</h5>
|
|
<div class="row mb-3">
|
|
<div class="col-md-6 mb-2"><label class="form-label">Tone</label><input type="text" name="tone" class="form-control" value="{{ s.tone }}" data-bs-toggle="tooltip" title="e.g. Dark, Whimsical, Cynical, Hopeful"></div>
|
|
<div class="col-md-6 mb-2"><label class="form-label">POV Style</label><input type="text" name="pov_style" class="form-control" value="{{ s.pov_style }}"></div>
|
|
<div class="col-md-6 mb-2"><label class="form-label">Time Period</label><input type="text" name="time_period" class="form-control" value="{{ s.time_period }}"></div>
|
|
<div class="col-md-6 mb-2"><label class="form-label">Spice Level</label><input type="text" name="spice" class="form-control" value="{{ s.spice }}" data-bs-toggle="tooltip" title="e.g. Clean, Fade-to-Black, Explicit"></div>
|
|
<div class="col-md-6 mb-2"><label class="form-label">Violence</label><input type="text" name="violence" class="form-control" value="{{ s.violence }}" data-bs-toggle="tooltip" title="e.g. None, Mild, Graphic"></div>
|
|
<div class="col-md-6 mb-2"><label class="form-label">Narrative Tense</label><input type="text" name="narrative_tense" class="form-control" value="{{ s.narrative_tense }}"></div>
|
|
<div class="col-md-6 mb-2"><label class="form-label">Language Style</label><input type="text" name="language_style" class="form-control" value="{{ s.language_style }}"></div>
|
|
<div class="col-md-6 mb-2"><label class="form-label">Dialogue Style</label><input type="text" name="dialogue_style" class="form-control" value="{{ s.dialogue_style }}" data-bs-toggle="tooltip" title="e.g. Witty, Formal, Slang-heavy"></div>
|
|
<div class="col-md-6 mb-2"><label class="form-label">Page Orientation</label>
|
|
<select name="page_orientation" class="form-select"><option value="Portrait" {% if s.page_orientation == 'Portrait' %}selected{% endif %}>Portrait</option><option value="Landscape" {% if s.page_orientation == 'Landscape' %}selected{% endif %}>Landscape</option><option value="Square" {% if s.page_orientation == 'Square' %}selected{% endif %}>Square</option></select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-4">
|
|
<label class="form-label">Tropes (comma separated)</label>
|
|
<input type="text" name="tropes" class="form-control" value="{{ s.tropes|join(', ') }}">
|
|
</div>
|
|
|
|
<div class="mb-4">
|
|
<label class="form-label">Formatting Rules (comma separated)</label>
|
|
<input type="text" name="formatting_rules" class="form-control" value="{{ s.formatting_rules|join(', ') }}">
|
|
</div>
|
|
|
|
<div class="d-grid gap-2">
|
|
<button type="submit" formaction="/project/create" class="btn btn-success btn-lg">
|
|
<i class="fas fa-check me-2"></i>Create Project & Generate Bible
|
|
</button>
|
|
<a href="/" class="btn btn-outline-secondary">Cancel</a>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block scripts %}
|
|
<script>
|
|
function showLoading(form) {
|
|
// We don't disable buttons here because formaction needs the specific button click
|
|
// But we can show a global spinner or change cursor
|
|
document.body.style.cursor = 'wait';
|
|
}
|
|
|
|
function applyPersona(select) {
|
|
const opt = select.options[select.selectedIndex];
|
|
if (opt.value) {
|
|
document.querySelector('input[name="author"]').value = opt.dataset.name || opt.value;
|
|
document.querySelector('textarea[name="author_bio"]').value = opt.dataset.bio || '';
|
|
}
|
|
}
|
|
</script>
|
|
{% endblock %} |