Some checks failed
ci/woodpecker/pr/pipeline Pipeline failed
Add i18n support to the blog web UI with 4 languages (en/ru/fr/de),
80 translation keys, automatic Accept-Language detection, persistent
locale cookie, and a language switcher dropdown in the header.
- Infrastructure: TranslationService, translation dicts, convenience _()
- Presentation: locale middleware, /web/lang/{locale} switcher route
- Templates: all 9 templates use {{ _(key, current_locale) }}
- Tests: 26 tests across TranslationService, locale detection helpers
- Docs: TEST_MODEL.md and FEATURE_INFRASTRUCTURE.md updated with TC-UNIT-811-821
120 lines
4.9 KiB
HTML
120 lines
4.9 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}{% if is_edit %}{{ _('post_form.title_edit', current_locale) }}{% else %}{{ _('post_form.title_new', current_locale) }}{% endif %} - {{ _('base.default_title', current_locale) }}{% endblock %}
|
|
|
|
{% block extra_css %}
|
|
<link rel="stylesheet" href="/static/css/easymde.min.css" data-testid="easymde-stylesheet">
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<section class="page-header" data-testid="page-header-form">
|
|
<h1 class="page-title" data-testid="page-title-form">
|
|
{% if is_edit %}{{ _('post_form.page_title_edit', current_locale) }}{% else %}{{ _('post_form.page_title_new', current_locale) }}{% endif %}
|
|
</h1>
|
|
</section>
|
|
|
|
<form
|
|
method="POST"
|
|
action="{% if is_edit %}/web/posts/{{ post.slug }}/edit{% else %}/web/posts/new{% endif %}"
|
|
class="card"
|
|
data-testid="form-post"
|
|
>
|
|
<div class="card-body" data-testid="form-post-body">
|
|
<div class="form-group" data-testid="form-group-title">
|
|
<label for="title" class="form-label form-label-required" data-testid="label-title">
|
|
{{ _('post_form.label_title', current_locale) }}
|
|
</label>
|
|
<input
|
|
type="text"
|
|
id="title"
|
|
name="title"
|
|
class="input input-lg"
|
|
value="{% if post %}{{ post.title }}{% endif %}"
|
|
placeholder="{{ _('post_form.placeholder_title', current_locale) }}"
|
|
required
|
|
data-testid="input-title"
|
|
>
|
|
<span class="form-hint" data-testid="hint-title">{{ _('post_form.hint_title', current_locale) }}</span>
|
|
</div>
|
|
|
|
<div class="form-group" data-testid="form-group-content">
|
|
<label for="content" class="form-label form-label-required" data-testid="label-content">
|
|
{{ _('post_form.label_content', current_locale) }}
|
|
</label>
|
|
<textarea
|
|
id="content"
|
|
name="content"
|
|
rows="12"
|
|
placeholder="{{ _('post_form.placeholder_content', current_locale) }}"
|
|
required
|
|
data-testid="textarea-content"
|
|
>{% if post %}{{ post.content }}{% endif %}</textarea>
|
|
<span class="form-hint" data-testid="hint-content">{{ _('post_form.hint_content', current_locale) }}</span>
|
|
</div>
|
|
|
|
<div class="form-group" data-testid="form-group-tags">
|
|
<label for="tags" class="form-label" data-testid="label-tags">
|
|
{{ _('post_form.label_tags', current_locale) }}
|
|
</label>
|
|
<input
|
|
type="text"
|
|
id="tags"
|
|
name="tags"
|
|
class="input"
|
|
value="{% if post %}{{ post.tags|join(', ') }}{% endif %}"
|
|
placeholder="{{ _('post_form.placeholder_tags', current_locale) }}"
|
|
data-testid="input-tags"
|
|
>
|
|
<span class="form-hint" data-testid="hint-tags">{{ _('post_form.hint_tags', current_locale) }}</span>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="card-footer" data-testid="form-post-footer">
|
|
<div class="flex justify-between items-center" data-testid="form-actions">
|
|
<a href="{% if is_edit %}/web/posts/{{ post.slug }}{% else %}/web/{% endif %}" class="btn" data-testid="btn-cancel">
|
|
{{ _('post_form.cancel', current_locale) }}
|
|
</a>
|
|
|
|
<div class="flex gap-2" data-testid="form-submit-actions">
|
|
<button type="submit" name="action" value="draft" class="btn" data-testid="btn-save-draft">
|
|
{{ _('post_form.save_draft', current_locale) }}
|
|
</button>
|
|
<button type="submit" name="action" value="publish" class="btn btn-primary" data-testid="btn-publish-post">
|
|
{% if is_edit %}{{ _('post_form.update_post', current_locale) }}{% else %}{{ _('post_form.publish_post', current_locale) }}{% endif %}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
{% endblock %}
|
|
|
|
{% block extra_js %}
|
|
<script src="/static/js/easymde.min.js" data-testid="easymde-script"></script>
|
|
<script>
|
|
(function() {
|
|
'use strict';
|
|
var easyMDE = new EasyMDE({
|
|
element: document.getElementById('content'),
|
|
spellChecker: false,
|
|
status: false,
|
|
minHeight: '300px',
|
|
placeholder: '{{ _('post_form.placeholder_content', current_locale) }}',
|
|
toolbar: [
|
|
'bold', 'italic', 'heading', '|',
|
|
'code', 'quote', 'unordered-list', 'ordered-list', '|',
|
|
'link', 'image', 'table', 'horizontal-rule', '|',
|
|
'preview', 'side-by-side', 'fullscreen', '|',
|
|
'guide'
|
|
]
|
|
});
|
|
var form = document.querySelector('form[data-testid="form-post"]');
|
|
if (form) {
|
|
form.addEventListener('submit', function() {
|
|
easyMDE.toTextArea();
|
|
});
|
|
}
|
|
})();
|
|
</script>
|
|
{% endblock %}
|