journal: real markdown editor (EasyMDE) with live preview toggle, fix default template
- Replace the plain textarea with EasyMDE (vendored locally, no CDN) for markdown authoring: syntax highlighting, smart list continuation, and a custom text-based toolbar (built-in EasyMDE toolbar icons require Font Awesome from a CDN, which this app doesn't use). unorderedListStyle is set to "-" to match the app's own template convention. - Add a preview/edit toggle button that swaps the editor for the exact same server-rendered markdown (via /journal/preview) shown after saving, instead of always showing both. - Fix create/edit entry routes to verify the submitted category_id actually belongs to the current user before inserting -- every other write path in this app already checked ownership; this one didn't (found while manually testing the new editor with a typo'd category id that happened to belong to someone else's category, which surfaced as an IntegrityError 500 instead of a clean 404-equivalent). - Fix the default "일상" category template: bare "-" bullet lines don't parse as list items in the markdown renderer (they need a trailing space), and the content_template validator was silently stripping that trailing space off on every save. Backfill migration updates any category still holding the old, broken template text. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -124,11 +124,20 @@
|
||||
categoryTemplates: {{ category_templates|tojson|forceescape }},
|
||||
content: '',
|
||||
lastAutoFilled: '',
|
||||
previewMode: false,
|
||||
togglePreview() {
|
||||
this.previewMode = !this.previewMode;
|
||||
if (this.previewMode) { this.$refs.contentField.dispatchEvent(new Event('input')); }
|
||||
},
|
||||
onCategoryChange(categoryId) {
|
||||
const tmpl = this.categoryTemplates[categoryId] || '';
|
||||
if (this.content === this.lastAutoFilled) {
|
||||
this.content = tmpl;
|
||||
this.lastAutoFilled = tmpl;
|
||||
this.$nextTick(() => {
|
||||
if (this.$refs.contentField._easymde) { this.$refs.contentField._easymde.value(tmpl); }
|
||||
this.$refs.contentField.dispatchEvent(new Event('input'));
|
||||
});
|
||||
}
|
||||
},
|
||||
init() { this.onCategoryChange(this.$refs.categorySelect.value); },
|
||||
@@ -173,7 +182,25 @@
|
||||
|
||||
<div class="field">
|
||||
<label for="new-entry-content">내용</label>
|
||||
<textarea id="new-entry-content" name="content" rows="8" required placeholder="오늘 하루는 어땠나요?" x-model="content"></textarea>
|
||||
{% include "partials/journal_editor_toolbar.html" %}
|
||||
<div x-show="!previewMode">
|
||||
<textarea
|
||||
id="new-entry-content"
|
||||
name="content"
|
||||
rows="8"
|
||||
required
|
||||
placeholder="오늘 하루는 어땠나요?"
|
||||
class="markdown-editor"
|
||||
x-model="content"
|
||||
x-ref="contentField"
|
||||
hx-post="/journal/preview"
|
||||
hx-trigger="input changed delay:400ms, load"
|
||||
hx-target="#new-entry-preview"
|
||||
hx-swap="innerHTML"
|
||||
hx-params="content"
|
||||
></textarea>
|
||||
</div>
|
||||
<div id="new-entry-preview" class="journal-preview journal-entry-content" x-show="previewMode" x-cloak></div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
|
||||
Reference in New Issue
Block a user