Mercurial > libervia-web
changeset 291:89818bca1a33
browser_side: set the ideal width for the blog post update dialog
| author | souliane <souliane@mailoo.org> |
|---|---|
| date | Tue, 10 Dec 2013 13:04:51 +0100 |
| parents | 3216c8d5432b |
| children | 1a5dc08c2749 |
| files | browser_side/panels.py |
| diffstat | 1 files changed, 52 insertions(+), 30 deletions(-) [+] |
line wrap: on
line diff
--- a/browser_side/panels.py Tue Dec 10 10:27:58 2013 +0100 +++ b/browser_side/panels.py Tue Dec 10 13:04:51 2013 +0100 @@ -34,6 +34,7 @@ from pyjamas.ui.PopupPanel import PopupPanel from pyjamas.ui.StackPanel import StackPanel from pyjamas.ui.ClickListener import ClickHandler +from pyjamas.ui.FlowPanel import FlowPanel from pyjamas.ui.KeyboardListener import KEY_ENTER, KEY_UP, KEY_DOWN, KeyboardHandler from pyjamas.ui.Event import BUTTON_LEFT, BUTTON_MIDDLE, BUTTON_RIGHT from pyjamas.ui.MouseListener import MouseHandler @@ -345,41 +346,57 @@ self.pub_data = (mblog_entry.hash[0], mblog_entry.hash[1], mblog_entry.id) self.editable_content = (mblog_entry.xhtml, const._SYNTAX_XHTML) if mblog_entry.xhtml else (mblog_entry.content, None) - self.panel = HTMLPanel(""" - <div class='mb_entry_header'><span class='mb_entry_author'>%(author)s</span> on <span class='mb_entry_timestamp'>%(timestamp)s</span></div> - <div class='mb_entry_delete_update'> - <div id="id_delete"></div> - <div id="id_update"></div> - </div> - <div class="mb_entry_avatar" id='id_avatar'></div> - <div class="mb_entry_dialog" id='id_entry_dialog'></div> - </div> - """ % {"author": html_sanitize(self.author), - "timestamp": _datetime - }) + + self.panel = FlowPanel() + self.panel.setStyleName('mb_entry') + header = HTMLPanel("""<div class='mb_entry_header'> + <span class='mb_entry_author'>%(author)s</span> + <span>on</span> + <span class='mb_entry_timestamp'>%(timestamp)s</span> + </div>""" % {'author': html_sanitize(self.author), 'timestamp': _datetime}) + self.panel.add(header) + + if self.author == blog_panel.host.whoami.bare: + entry_delete_update = VerticalPanel() + entry_delete_update.setStyleName('mb_entry_delete_update') + self.delete_label = Label(u"✗") + self.delete_label.setTitle("Delete this message") + self.update_label = Label(u"✍") + self.update_label.setTitle("Edit this message") + entry_delete_update.add(self.delete_label) + entry_delete_update.add(self.update_label) + self.delete_label.addClickListener(self) + self.update_label.addClickListener(self) + self.panel.add(entry_delete_update) + else: + self.update_label = self.delete_label = None + + entry_avatar = SimplePanel() + entry_avatar.setStyleName('mb_entry_avatar') self.avatar = Image(blog_panel.host.getAvatar(self.author)) - self.panel.add(self.avatar, "id_avatar") + entry_avatar.add(self.avatar) + self.panel.add(entry_avatar) + + self.entry_dialog = SimplePanel() + self.entry_dialog.setStyleName('mb_entry_dialog') body = addURLToText(html_sanitize(mblog_entry.content)) if not mblog_entry.xhtml else mblog_entry.xhtml self.bubble = HTML(body) self.bubble.setStyleName("bubble") - self.panel.add(self.bubble, "id_entry_dialog") - self.panel.setStyleName('mb_entry') - if self.author == blog_panel.host.whoami.bare: - self.delete_label = Label(u"✗") - self.delete_label.setTitle("Delete this message") - self.panel.add(self.delete_label, "id_delete") - self.update_label = Label(u"✍") - self.update_label.setTitle("Edit this message") - self.panel.add(self.update_label, "id_update") - self.delete_label.addClickListener(self) - self.update_label.addClickListener(self) - else: - self.modify_label = self.delete_label = None + self.entry_dialog.add(self.bubble) + self.panel.add(self.entry_dialog) + self.editbox = None self.add(self.panel) ClickHandler.__init__(self) self.addClickListener(self) + def onWindowResized(self, width=None, height=None): + """The listener is active when the text is being modified""" + left = self.avatar.getAbsoluteLeft() + self.avatar.getOffsetWidth() + right = self.delete_label.getAbsoluteLeft() + ideal_width = right - left - 60 + self.entry_dialog.setWidth("%spx" % ideal_width) + def updateAvatar(self, new_avatar): """Change the avatar of the entry @param new_avatar: path to the new image""" @@ -410,8 +427,10 @@ """Send the new content to the backend""" if not self.editbox or not self.editbox.getVisible(): return - self.panel.remove(self.edit_panel) - self.panel.add(self.bubble, "id_entry_dialog") + Window.removeWindowResizeListener(self) + self.entry_dialog.setWidth("auto") + self.entry_dialog.remove(self.edit_panel) + self.entry_dialog.add(self.bubble) new_text = self.editbox.getText().strip() self.edit_panel = self.editbox = None if cancel or new_text == self.editable_content[0] or new_text == "": @@ -434,8 +453,10 @@ panel.add(container) panel.setStyleName("bubble") panel.addStyleName('bubble-editbox') - self.bubble.removeFromParent() - self.panel.add(panel, "id_entry_dialog") + Window.addWindowResizeListener(self) + self.onWindowResized() + self.entry_dialog.remove(self.bubble) + self.entry_dialog.add(panel) self.editbox.setFocus(True) self.editbox.setSelectionRange(len(text), 0) self.edit_panel = panel @@ -448,6 +469,7 @@ self.updateContent(result == richtext.CANCEL) editor = richtext.RichTextEditor(self._blog_panel.host, self.panel, cb, options=options) + editor.setWidth('100%') editor.setVisible(True) # needed to build the toolbar self.editbox = editor.textarea self._blog_panel.host.bridge.call('syntaxConvert', lambda d: setOriginalText(d, editor),