Mercurial > libervia-web

comparison libervia/pages/_browser/editor.py @ 1420:925a7c498cda

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
pages (blog/edit): move preview code to new `BlogEditor` class in `editor` module
author Goffi <goffi@goffi.org>
date Sat, 01 May 2021 18:50:04 +0200
parents 8415d882b686
children 106bae41f5c8
comparison
equal deleted inserted replaced
1419:6fc41f000d24 1420:925a7c498cda
1 """text edition management""" 1 """text edition management"""
2 2
3 from browser import document, window, bind, timer 3 from browser import document, window, aio, bind, timer
4 from browser.local_storage import storage 4 from browser.local_storage import storage
5 from browser.object_storage import ObjectStorage 5 from browser.object_storage import ObjectStorage
6 from javascript import JSON
7 from aio_bridge import Bridge, BridgeException
6 from template import Template 8 from template import Template
7 9 import dialog
10
11 bridge = Bridge()
8 object_storage = ObjectStorage(storage) 12 object_storage = ObjectStorage(storage)
9 profile = window.profile 13 profile = window.profile
10 14
11 # how often we save forms, in seconds 15 # how often we save forms, in seconds
12 AUTOSAVE_FREQUENCY = 20 16 AUTOSAVE_FREQUENCY = 20
159 if evt.key in (",", "Enter"): 163 if evt.key in (",", "Enter"):
160 evt.stopPropagation() 164 evt.stopPropagation()
161 evt.preventDefault() 165 evt.preventDefault()
162 self.add_tag(self.tag_input_elt.value) 166 self.add_tag(self.tag_input_elt.value)
163 self.tag_input_elt.value = "" 167 self.tag_input_elt.value = ""
168
169
170 class BlogEditor:
171 """Editor class, handling tabs, preview, and submit loading button
172
173 It's using and HTML form as source
174 The form must have:
175 - a "title" text input
176 - a "body" textarea
177 - an optional "tags" text input with comma separated tags (may be using Tags
178 Editor)
179 - a "tab_preview" tab element
180 """
181
182 def __init__(self, form_id="blog_post_edit"):
183 self.tab_select = window.tab_select
184 self.item_tpl = Template('blog/item.html')
185 self.form = document[form_id]
186 for elt in document.select(".click_to_edit"):
187 elt.bind("click", self.on_edit)
188 for elt in document.select('.click_to_preview'):
189 elt.bind("click", lambda evt: aio.run(self.on_preview(evt)))
190 self.form.bind("submit", self.on_submit)
191
192
193 def on_edit(self, evt):
194 self.tab_select(evt.target, "tab_edit", "is-active")
195
196 async def on_preview(self, evt):
197 """Generate a blog preview from HTML form
198
199 """
200 print("on preview OK")
201 elt = evt.target
202 tab_preview = document["tab_preview"]
203 tab_preview.clear()
204 data = {
205 "content_rich": self.form.select_one('textarea[name="body"]').value.strip()
206 }
207 title = self.form.select_one('input[name="title"]').value.strip()
208 if title:
209 data["title_rich"] = title
210 tags_input_elt = self.form.select_one('input[name="tags"]')
211 if tags_input_elt is not None:
212 tags = tags_input_elt.value.strip()
213 if tags:
214 data['tags'] = [t.strip() for t in tags.split(',') if t.strip()]
215 try:
216 preview_data = JSON.parse(
217 await bridge.mbPreview("", "", JSON.stringify(data))
218 )
219 except BridgeException as e:
220 dialog.notification.show(
221 f"Can't generate item preview: {e.message}",
222 level="error"
223 )
224 else:
225 self.tab_select(elt, "tab_preview", "is-active")
226 item_elt = self.item_tpl.get_elt({
227 "item": preview_data,
228 "dates_format": "short",
229 })
230 tab_preview <= item_elt
231
232 def on_submit(self, evt):
233 submit_btn = document.select_one("button[type='submit']")
234 submit_btn.classList.add("is-loading")