[Git][gajim/gajim][master] imprv: Preview: Add loading placeholder

Daniel Brötzmann pushed to branch master at gajim / gajim

Commits: acf0c8f6 by wurstsalat at 2023-05-28T19:51:44+02:00 imprv: Preview: Add loading placeholder

Fixes #11264

- - - - -

4 changed files:

- gajim/data/gui/preview.ui - gajim/data/style/gajim.css - gajim/gtk/builder.pyi - gajim/gtk/preview.py

Changes:

===================================== gajim/data/gui/preview.ui ===================================== @@ -1,379 +1,436 @@ <?xml version="1.0" encoding="UTF-8"?> -<!-- Generated with glade 3.38.2 --> +<!-- Generated with glade 3.40.0 --> <interface> <requires lib="gtk+" version="3.24"/> - <object class="GtkBox" id="preview_box"> + <object class="GtkStack" id="preview_stack"> <property name="visible">True</property> <property name="can-focus">False</property> - <property name="spacing">12</property> + <property name="hhomogeneous">False</property> + <property name="vhomogeneous">False</property> + <property name="transition-duration">50</property> + <property name="transition-type">crossfade</property> <child> - <object class="GtkEventBox" id="icon_event_box"> + <object class="GtkBox"> + <property name="width-request">300</property> + <property name="height-request">200</property> <property name="visible">True</property> <property name="can-focus">False</property> - <property name="no-show-all">True</property> - <property name="halign">start</property> - <signal name="realize" handler="_on_realize" swapped="no"/> + <property name="orientation">vertical</property> + <property name="spacing">12</property> + <property name="homogeneous">True</property> <child> - <object class="GtkButton" id="icon_button"> + <object class="GtkSpinner"> <property name="visible">True</property> - <property name="can-focus">True</property> - <property name="receives-default">False</property> - <property name="relief">none</property> - <signal name="button-press-event" handler="_on_button_press_event" swapped="no"/> - <signal name="clicked" handler="_on_content_button_clicked" swapped="no"/> - <child> - <placeholder/> - </child> + <property name="can-focus">False</property> + <property name="valign">end</property> + <property name="active">True</property> + </object> + <packing> + <property name="expand">False</property> + <property name="fill">True</property> + <property name="position">0</property> + </packing> + </child> + <child> + <object class="GtkLabel"> + <property name="visible">True</property> + <property name="can-focus">False</property> + <property name="valign">start</property> + <property name="label" translatable="yes">Loading Preview…</property> <style> - <class name="preview-image-button"/> + <class name="dim-label"/> </style> </object> + <packing> + <property name="expand">False</property> + <property name="fill">True</property> + <property name="position">1</property> + </packing> </child> </object> <packing> - <property name="expand">False</property> - <property name="fill">True</property> - <property name="position">0</property> + <property name="name">loading</property> </packing> </child> <child> - <object class="GtkBox" id="right_box"> + <object class="GtkBox"> <property name="visible">True</property> <property name="can-focus">False</property> - <property name="orientation">vertical</property> - <property name="spacing">3</property> + <property name="spacing">12</property> <child> - <object class="GtkBox" id="progress_box"> + <object class="GtkEventBox" id="icon_event_box"> + <property name="visible">True</property> <property name="can-focus">False</property> <property name="no-show-all">True</property> - <property name="spacing">12</property> + <property name="halign">start</property> + <signal name="realize" handler="_on_realize" swapped="no"/> <child> - <object class="GtkProgressBar" id="progressbar"> + <object class="GtkButton" id="icon_button"> <property name="visible">True</property> - <property name="can-focus">False</property> - <property name="valign">center</property> - </object> - <packing> - <property name="expand">False</property> - <property name="fill">True</property> - <property name="position">0</property> - </packing> - </child> - <child> - <object class="GtkLabel" id="progress_text"> - <property name="visible">True</property> - <property name="can-focus">False</property> - <property name="valign">center</property> - <property name="width-chars">4</property> - <property name="single-line-mode">True</property> - <style> - <class name="dim-label"/> - <class name="small-label"/> - </style> - </object> - <packing> - <property name="expand">False</property> - <property name="fill">True</property> - <property name="position">1</property> - </packing> - </child> - <child> - <object class="GtkEventBox"> - <property name="visible">True</property> - <property name="can-focus">False</property> - <property name="valign">end</property> - <signal name="realize" handler="_on_realize" swapped="no"/> + <property name="can-focus">True</property> + <property name="receives-default">False</property> + <property name="relief">none</property> + <signal name="button-press-event" handler="_on_button_press_event" swapped="no"/> + <signal name="clicked" handler="_on_content_button_clicked" swapped="no"/> <child> - <object class="GtkButton" id="cancel_download_button"> - <property name="visible">True</property> - <property name="can-focus">True</property> - <property name="receives-default">False</property> - <property name="tooltip-text" translatable="yes">Cancel Download</property> - <property name="relief">none</property> - <signal name="clicked" handler="_on_cancel_download_clicked" swapped="no"/> - <child> - <object class="GtkImage"> - <property name="visible">True</property> - <property name="can-focus">False</property> - <property name="icon-name">process-stop-symbolic</property> - </object> - </child> - <style> - <class name="border"/> - <class name="flat"/> - </style> - </object> + <placeholder/> </child> + <style> + <class name="preview-image-button"/> + </style> </object> - <packing> - <property name="expand">False</property> - <property name="fill">True</property> - <property name="pack-type">end</property> - <property name="position">2</property> - </packing> </child> </object> <packing> <property name="expand">False</property> <property name="fill">True</property> - <property name="pack-type">end</property> <property name="position">0</property> </packing> </child> <child> - <object class="GtkBox" id="content_box"> + <object class="GtkBox" id="right_box"> <property name="visible">True</property> <property name="can-focus">False</property> <property name="orientation">vertical</property> - <property name="spacing">6</property> + <property name="spacing">3</property> <child> - <object class="GtkEventBox"> - <property name="visible">True</property> + <object class="GtkBox" id="progress_box"> <property name="can-focus">False</property> - <property name="halign">center</property> - <signal name="realize" handler="_on_realize" swapped="no"/> + <property name="no-show-all">True</property> + <property name="spacing">12</property> <child> - <object class="GtkButton" id="image_button"> + <object class="GtkProgressBar" id="progressbar"> <property name="visible">True</property> - <property name="can-focus">True</property> - <property name="receives-default">False</property> - <property name="relief">none</property> - <signal name="button-press-event" handler="_on_button_press_event" swapped="no"/> - <signal name="clicked" handler="_on_content_button_clicked" swapped="no"/> - <child> - <placeholder/> - </child> + <property name="can-focus">False</property> + <property name="valign">center</property> + </object> + <packing> + <property name="expand">False</property> + <property name="fill">True</property> + <property name="position">0</property> + </packing> + </child> + <child> + <object class="GtkLabel" id="progress_text"> + <property name="visible">True</property> + <property name="can-focus">False</property> + <property name="valign">center</property> + <property name="width-chars">4</property> + <property name="single-line-mode">True</property> <style> - <class name="preview-image-button"/> + <class name="dim-label"/> + <class name="small-label"/> </style> </object> + <packing> + <property name="expand">False</property> + <property name="fill">True</property> + <property name="position">1</property> + </packing> </child> - </object> - <packing> - <property name="expand">False</property> - <property name="fill">True</property> - <property name="position">0</property> - </packing> - </child> - <child> - <object class="GtkLinkButton" id="link_button"> - <property name="can-focus">True</property> - <property name="receives-default">False</property> - <property name="no-show-all">True</property> - <property name="halign">start</property> - <property name="relief">none</property> - </object> - <packing> - <property name="expand">False</property> - <property name="fill">True</property> - <property name="position">1</property> - </packing> - </child> - </object> - <packing> - <property name="expand">False</property> - <property name="fill">True</property> - <property name="position">1</property> - </packing> - </child> - <child> - <object class="GtkBox" id="button_box"> - <property name="visible">True</property> - <property name="can-focus">False</property> - <property name="spacing">6</property> - <child> - <object class="GtkEventBox"> - <property name="visible">True</property> - <property name="can-focus">False</property> - <property name="valign">end</property> - <signal name="realize" handler="_on_realize" swapped="no"/> <child> - <object class="GtkButton" id="download_button"> - <property name="can-focus">True</property> - <property name="receives-default">False</property> - <property name="no-show-all">True</property> - <property name="tooltip-text" translatable="yes">Download</property> - <property name="relief">none</property> - <signal name="clicked" handler="_on_download" swapped="no"/> + <object class="GtkEventBox"> + <property name="visible">True</property> + <property name="can-focus">False</property> + <property name="valign">end</property> + <signal name="realize" handler="_on_realize" swapped="no"/> <child> - <object class="GtkImage"> + <object class="GtkButton" id="cancel_download_button"> <property name="visible">True</property> - <property name="can-focus">False</property> - <property name="icon-name">folder-download-symbolic</property> + <property name="can-focus">True</property> + <property name="receives-default">False</property> + <property name="tooltip-text" translatable="yes">Cancel Download</property> + <property name="relief">none</property> + <signal name="clicked" handler="_on_cancel_download_clicked" swapped="no"/> + <child> + <object class="GtkImage"> + <property name="visible">True</property> + <property name="can-focus">False</property> + <property name="icon-name">process-stop-symbolic</property> + </object> + </child> + <style> + <class name="border"/> + <class name="flat"/> + </style> </object> </child> - <style> - <class name="border"/> - <class name="flat"/> - </style> </object> + <packing> + <property name="expand">False</property> + <property name="fill">True</property> + <property name="pack-type">end</property> + <property name="position">2</property> + </packing> </child> </object> <packing> <property name="expand">False</property> <property name="fill">True</property> <property name="pack-type">end</property> - <property name="position">1</property> + <property name="position">0</property> </packing> </child> <child> - <object class="GtkEventBox"> + <object class="GtkBox" id="content_box"> <property name="visible">True</property> <property name="can-focus">False</property> - <property name="valign">end</property> - <signal name="realize" handler="_on_realize" swapped="no"/> + <property name="orientation">vertical</property> + <property name="spacing">6</property> <child> - <object class="GtkButton" id="save_as_button"> - <property name="can-focus">True</property> - <property name="receives-default">False</property> - <property name="no-show-all">True</property> - <property name="tooltip-text" translatable="yes">Save as...</property> - <signal name="clicked" handler="_on_save_as" swapped="no"/> + <object class="GtkEventBox"> + <property name="visible">True</property> + <property name="can-focus">False</property> + <property name="halign">center</property> + <signal name="realize" handler="_on_realize" swapped="no"/> <child> - <object class="GtkImage"> + <object class="GtkButton" id="image_button"> <property name="visible">True</property> - <property name="can-focus">False</property> - <property name="icon-name">document-save-as-symbolic</property> + <property name="can-focus">True</property> + <property name="receives-default">False</property> + <property name="relief">none</property> + <signal name="button-press-event" handler="_on_button_press_event" swapped="no"/> + <signal name="clicked" handler="_on_content_button_clicked" swapped="no"/> + <child> + <placeholder/> + </child> + <style> + <class name="preview-image-button"/> + </style> </object> </child> - <style> - <class name="border"/> - <class name="flat"/> - </style> </object> + <packing> + <property name="expand">False</property> + <property name="fill">True</property> + <property name="position">0</property> + </packing> </child> - </object> - <packing> - <property name="expand">False</property> - <property name="fill">True</property> - <property name="pack-type">end</property> - <property name="position">2</property> - </packing> - </child> - <child> - <object class="GtkEventBox"> - <property name="visible">True</property> - <property name="can-focus">False</property> - <property name="valign">end</property> - <signal name="realize" handler="_on_realize" swapped="no"/> <child> - <object class="GtkButton" id="open_folder_button"> + <object class="GtkLinkButton" id="link_button"> <property name="can-focus">True</property> <property name="receives-default">False</property> <property name="no-show-all">True</property> - <property name="tooltip-text" translatable="yes">Open folder</property> - <signal name="clicked" handler="_on_open_folder" swapped="no"/> - <child> - <object class="GtkImage"> - <property name="visible">True</property> - <property name="can-focus">False</property> - <property name="icon-name">folder-symbolic</property> - </object> - </child> - <style> - <class name="border"/> - <class name="flat"/> - </style> + <property name="halign">start</property> + <property name="relief">none</property> </object> + <packing> + <property name="expand">False</property> + <property name="fill">True</property> + <property name="position">1</property> + </packing> </child> </object> <packing> <property name="expand">False</property> <property name="fill">True</property> - <property name="pack-type">end</property> - <property name="position">3</property> + <property name="position">1</property> </packing> </child> <child> - <object class="GtkBox"> + <object class="GtkBox" id="button_box"> <property name="visible">True</property> <property name="can-focus">False</property> - <property name="halign">start</property> - <property name="orientation">vertical</property> + <property name="spacing">6</property> <child> - <object class="GtkLabel" id="file_name"> + <object class="GtkEventBox"> <property name="visible">True</property> - <property name="can-focus">True</property> - <property name="selectable">True</property> - <property name="ellipsize">end</property> - <property name="single-line-mode">True</property> - <property name="max-width-chars">30</property> - <property name="xalign">0</property> - <style> - <class name="dim-label"/> - <class name="small-label"/> - </style> + <property name="can-focus">False</property> + <property name="valign">end</property> + <signal name="realize" handler="_on_realize" swapped="no"/> + <child> + <object class="GtkButton" id="download_button"> + <property name="can-focus">True</property> + <property name="receives-default">False</property> + <property name="no-show-all">True</property> + <property name="tooltip-text" translatable="yes">Download</property> + <property name="relief">none</property> + <signal name="clicked" handler="_on_download" swapped="no"/> + <child> + <object class="GtkImage"> + <property name="visible">True</property> + <property name="can-focus">False</property> + <property name="icon-name">folder-download-symbolic</property> + </object> + </child> + <style> + <class name="border"/> + <class name="flat"/> + </style> + </object> + </child> </object> <packing> <property name="expand">False</property> <property name="fill">True</property> - <property name="position">0</property> + <property name="pack-type">end</property> + <property name="position">1</property> </packing> </child> <child> - <object class="GtkLabel" id="file_size"> + <object class="GtkEventBox"> <property name="visible">True</property> - <property name="can-focus">True</property> - <property name="selectable">True</property> - <property name="single-line-mode">True</property> - <property name="max-width-chars">30</property> - <property name="xalign">0</property> - <style> - <class name="dim-label"/> - <class name="small-label"/> - </style> + <property name="can-focus">False</property> + <property name="valign">end</property> + <signal name="realize" handler="_on_realize" swapped="no"/> + <child> + <object class="GtkButton" id="save_as_button"> + <property name="can-focus">True</property> + <property name="receives-default">False</property> + <property name="no-show-all">True</property> + <property name="tooltip-text" translatable="yes">Save as...</property> + <signal name="clicked" handler="_on_save_as" swapped="no"/> + <child> + <object class="GtkImage"> + <property name="visible">True</property> + <property name="can-focus">False</property> + <property name="icon-name">document-save-as-symbolic</property> + </object> + </child> + <style> + <class name="border"/> + <class name="flat"/> + </style> + </object> + </child> </object> <packing> <property name="expand">False</property> <property name="fill">True</property> - <property name="position">1</property> + <property name="pack-type">end</property> + <property name="position">2</property> </packing> </child> <child> - <object class="GtkLabel" id="info_message"> + <object class="GtkEventBox"> <property name="visible">True</property> - <property name="can-focus">True</property> - <property name="selectable">True</property> - <property name="ellipsize">end</property> - <property name="single-line-mode">True</property> - <property name="max-width-chars">30</property> - <property name="xalign">0</property> - <style> - <class name="dim-label"/> - <class name="small-label"/> - </style> + <property name="can-focus">False</property> + <property name="valign">end</property> + <signal name="realize" handler="_on_realize" swapped="no"/> + <child> + <object class="GtkButton" id="open_folder_button"> + <property name="can-focus">True</property> + <property name="receives-default">False</property> + <property name="no-show-all">True</property> + <property name="tooltip-text" translatable="yes">Open folder</property> + <signal name="clicked" handler="_on_open_folder" swapped="no"/> + <child> + <object class="GtkImage"> + <property name="visible">True</property> + <property name="can-focus">False</property> + <property name="icon-name">folder-symbolic</property> + </object> + </child> + <style> + <class name="border"/> + <class name="flat"/> + </style> + </object> + </child> </object> <packing> <property name="expand">False</property> <property name="fill">True</property> - <property name="position">2</property> + <property name="pack-type">end</property> + <property name="position">3</property> + </packing> + </child> + <child> + <object class="GtkBox"> + <property name="visible">True</property> + <property name="can-focus">False</property> + <property name="halign">start</property> + <property name="orientation">vertical</property> + <child> + <object class="GtkLabel" id="file_name"> + <property name="visible">True</property> + <property name="can-focus">True</property> + <property name="selectable">True</property> + <property name="ellipsize">end</property> + <property name="single-line-mode">True</property> + <property name="max-width-chars">30</property> + <property name="xalign">0</property> + <style> + <class name="dim-label"/> + <class name="small-label"/> + </style> + </object> + <packing> + <property name="expand">False</property> + <property name="fill">True</property> + <property name="position">0</property> + </packing> + </child> + <child> + <object class="GtkLabel" id="file_size"> + <property name="visible">True</property> + <property name="can-focus">True</property> + <property name="selectable">True</property> + <property name="single-line-mode">True</property> + <property name="max-width-chars">30</property> + <property name="xalign">0</property> + <style> + <class name="dim-label"/> + <class name="small-label"/> + </style> + </object> + <packing> + <property name="expand">False</property> + <property name="fill">True</property> + <property name="position">1</property> + </packing> + </child> + <child> + <object class="GtkLabel" id="info_message"> + <property name="visible">True</property> + <property name="can-focus">True</property> + <property name="selectable">True</property> + <property name="ellipsize">end</property> + <property name="single-line-mode">True</property> + <property name="max-width-chars">30</property> + <property name="xalign">0</property> + <style> + <class name="dim-label"/> + <class name="small-label"/> + </style> + </object> + <packing> + <property name="expand">False</property> + <property name="fill">True</property> + <property name="position">2</property> + </packing> + </child> + </object> + <packing> + <property name="expand">True</property> + <property name="fill">True</property> + <property name="pack-type">end</property> + <property name="position">4</property> </packing> </child> </object> <packing> - <property name="expand">True</property> + <property name="expand">False</property> <property name="fill">True</property> <property name="pack-type">end</property> - <property name="position">4</property> + <property name="position">2</property> </packing> </child> </object> <packing> <property name="expand">False</property> <property name="fill">True</property> - <property name="pack-type">end</property> - <property name="position">2</property> + <property name="position">1</property> </packing> </child> </object> <packing> - <property name="expand">False</property> - <property name="fill">True</property> + <property name="name">preview</property> <property name="position">1</property> </packing> </child> <style> - <class name="preview-box"/> + <class name="preview-stack"/> </style> </object> </interface>

===================================== gajim/data/style/gajim.css ===================================== @@ -644,7 +644,7 @@ .code-widget-header button { }

/* PreviewWidget */ -.preview-box { +.preview-stack > box { border: 1px solid; border-color: @borders; border-radius: 4px;

===================================== gajim/gtk/builder.pyi ===================================== @@ -701,7 +701,7 @@ class PreferencesBuilder(Builder):

class PreviewBuilder(Builder): - preview_box: Gtk.Box + preview_stack: Gtk.Stack icon_event_box: Gtk.EventBox icon_button: Gtk.Button right_box: Gtk.Box

===================================== gajim/gtk/preview.py ===================================== @@ -67,7 +67,7 @@ def __init__(self, account: str) -> None:

self._ui = get_builder('preview.ui') self._ui.connect_signals(self) - self.add(self._ui.preview_box) + self.add(self._ui.preview_stack)

leftclick_action = app.settings.get('preview_leftclick_action') self._ui.icon_button.set_tooltip_text( @@ -93,6 +93,7 @@ def get_text(self) -> str:

@ensure_not_destroyed def update_progress(self, _preview: Preview, progress: float) -> None: + self._ui.preview_stack.set_visible_child_name('preview') self._ui.download_button.hide()

self._ui.progress_box.show() @@ -105,6 +106,7 @@ def update_progress(self, _preview: Preview, progress: float) -> None: def update(self, preview: Preview, data: GdkPixbufType | None) -> None: self._preview = preview

+ self._ui.preview_stack.set_visible_child_name('preview') self._ui.progress_box.hide() self._ui.info_message.hide()

View it on GitLab: https://dev.gajim.org/gajim/gajim/-/commit/acf0c8f692ce7c2185c1b053a6201c2ec...