Overhaul UI #280

boerdereinar · 2024-05-08T00:07:18Z

Overhaul UI

Description

This pr fully overhauls the UI as per #185.

New Features

Complete overhaul of UI
- Adwaita colors (customisation is still possible)
- Favorite/close button only visible on hover (configurable)
- Pano window floats
  - Can be disabled
  - Each margin can be configured
- Configurable item width and height
File previews
- Text files
- Images
- Files that have a generated thumbnail i.e. pdfs/videos
- File paths containing /home/user/* are shortened to ~/*
- Multiple copied files are listed under their common directory to shorten the paths of the copied files. Usually this will result in only the file names being shown
- Color item foreground is computed using luminance
Header Styles
- Headers are hidden by default
- Visible
- Compact
Compact Mode
- Height of item is halved
- Layout of items is restructured
- File previews are hidden
Open at pointer
- Pano can open at the current pointer position
- Height of the window is configurable
Middle click to delete items
Paste file content
Items are no longer selected after deleting an item (if no items were selected before)
Any single grapheme cluster is now displayed as an emoji

Misc

yarn run clean:ts can now fail in build:ts to make building easier while pano is still running

Dependencies

Added color-string for easy color parsing and conversion to rgb
Added graphemer for checking if the copied string contains a single grapheme cluster for the emoji item. This fixes ZWJ sequences not being detected as an emoji
Removed validate-color
Removed hex-color-converter

Screenshots

New UI

Compact Mode

Window Position: Pointer

Incognito Mode

Header Style: Compact

Fixes

Fixes #124
Fixes #150
Fixes #176
Fixes #185
Fixes #272
Fixes #300

Type of change

Breaking change (fix or feature that would cause existing functionality to not work as expected)
This change requires a documentation update

Checklist

My code follows the style guidelines of this project
My commits follow the commit standards of this project
I have performed a self-review of my own code
I have commented my code, particularly in hard-to-understand areas
I have made corresponding changes to the documentation
My changes generate no new warnings
I have checked my code and corrected any misspellings

Totto16 · 2024-05-08T00:36:22Z

Thank you for your contribution, I don't know if it makes sense to review this yet, since this and #278 clash and might create merge conflicts. I also am in favor of publishing the already working UI with #278 to EGO first, before doing this. And then testing it extensively and by multiple users, before releasing it.

But overall it really looks good, so I'm going to look at this as soon as the issues and PR's with more priority are resolved.

And just from glancing over it, there are a few things to do:

replace images / videos in the README with the new design (do that at the end, since we might change something)

package.json

AshtakaOOf · 2024-10-21T08:28:27Z

Hello I'm sorry if this might be rude, but will this PR be merged at some point or is oae MIA?

JE-Amouel · 2024-12-11T15:08:51Z

Hi,
Is this PR still in the scope?

paulovbettio · 2025-01-18T17:40:11Z

What is missing to merge this pull request? How could I help to speed this up?

JE-Amouel · 2025-01-23T21:06:43Z

i just try this branch, and is f*cking awesome 💯

we really need this

paulovbettio · 2025-01-24T12:22:17Z

So, it’s currently broken? Bummer.
I could also submit a new pull request with the design, but would it actually get merged? If not, I think it might be better to create a new fork or start a new project with a different vision.

No problem with Pano tho, it is great! I understand if they don't want to change the design.

JE-Amouel · 2025-01-24T12:57:00Z

@paulovbettio

So, it’s currently broken? Bummer.

If you're talking about the artifacts on the screenshot, it's Just because of my screenshot tool which, I think, only works well under wayland,
otherwise I spent a little afternoon 😎 testing the different features, and I opted for a centralized interface like on the screenshot ,

I could also submit a new pull request with the design, but would it actually get merged? If not, I think it might be better to create a new fork or start a new project with a different vision.

If your code is hot, I think it's worth a try before launching into a new branch, I would also like to take advantage of the progress of the main branch which has Added highlighting features for code. And also without mentioning all the refactoring necessary to adapt it to the new version of gnome, but frankly if you are determined enough to launch a new branch or even a new extension with these features, it's really worth it.✨👌

No problem with Pano tho, it is great! I understand if they don't want to change the design.

😵‍💫

boerdereinar · 2025-01-24T16:27:10Z

Afaik everything works, that screenshot just has the background set to transparent and the headers enabled. I just haven't updated it since the current branch still works fine.

paulovbettio · 2025-01-24T17:03:53Z

Sorry, I thought it was broken because of the artifacts and headers, my bad, how embarrassing 😅
Even so, is there anything I can do to speed up the merge process? I'm willing to work on this because I really like the work that was done in this PR.

JE-Amouel · 2025-01-24T17:45:00Z

@paulovbettio

Sorry, I thought it was broken because of the artifacts and headers, my bad, how embarrassing 😅

😆 , sorry, my bad...

I send a better screenshot

I think there is still some work to be done, because there are sometimes images that are not displayed.
but still great.

is there anything I can do to speed up the merge process? I'm willing to work on this because I really like the work that was done in this PR.

since there no any activities concerning this PR, it difficult to know 😕

oae · 2025-02-13T23:44:57Z

@boerdereinar could you please resolve the conflicts so I can merge them?

Totto16

The code looks good from my side. Thanks for this amazing UI overhaul ❤️

package.json

Totto16 · 2025-02-22T15:12:01Z

resources/icons/hicolor/scalable/actions/blend-tool-symbolic.svg

General question regarding new icons, is there no adwaita-icon from https://github.com/GNOME/adwaita-icon-theme that is similar and could be used instead?

Totto16 · 2025-02-22T15:24:00Z

@boerdereinar could you please resolve the conflicts so I can merge them?

Since he ticked the box Maintainers are allowed to edit this pull request I'll just resolve the merge conflicts, one thing that needs to be done (but can be after this PR is merged) is the updating of the screenshots in the README

… again

…style in compact mode

Can be triggered by: 1. Pressing the action button 2. Ctrl + click on the item 3. Ctrl + enter on the item

This adds support for ZWJ sequences

Note: this causes a windows xp like visual bug in the link item when running Pano in a nested shell

…eight

…ting

…respected - Item color didn't support this format: rgb(255 0 0)

Totto16 · 2025-02-22T16:05:07Z

I rebased the branch on master, there were many merge conflicts, that were not that easy to resolve, so I made a backup of the changes before the rebase on https://github.com/oae/gnome-shell-pano/tree/gnome-theming-v2_before_rebase

I think I did it correctly and everything is as expected, but I might have made a mistake. Feel free to modify this or force push (--force-with-lease to be sure) your own rebase or edits 😄

…cal (which is being deprecated)

oae · 2025-02-22T16:53:01Z

resources/schemas/org.gnome.shell.extensions.pano.gschema.xml

There are some default value changes in gschema. If people have already customized it before, these changes will not take effect on their system, right? Maybe we should change the keys or the schema ID. What do you think, @Totto16?

Yes that would be a good idea, as someone, who didn't change most of the settings in didn't notice it.

Changing the schema ID seems to be a good idea, so that incorporates some version or something of that sort 🤔

My first thought would be id="org.gnome.shell.extensions.pano.v2" or something similar, what do you think?

Also, since accent colors are a thing now, maybe we can adapt them as default value for these two customization options

That would also be great, but I think it is out of the scope of this PR, as accent colors are only introduced as of gnome 47, if I remember correctly. And we need to listen for changes correctly, and interpret colors correctly, since as far as I know, some distros (and maybe also stock gnome) refers to accent colors by name and not by rgb or hex color 🤔

After the schema change, we can merge this.

Totto16

Please incorporate the schema id change as discussed in #280 (comment)

radiolamp · 2025-03-01T09:24:59Z

Great job, would it be possible to switch the color scheme in gnome depending on the light/dark theme?

Totto16 · 2025-03-01T12:47:31Z

Great job, would it be possible to switch the color scheme in gnome depending on the light/dark theme?

That is not that easy, as there are many customizations, that can't just be applied to the dark / light heme. But it's generally a good idea.

mbeps · 2025-04-13T14:11:27Z

So I am guessing this is almost finished?

JE-Amouel · 2025-04-24T01:18:08Z

Hi, i would really like to set two things, so for me pano will be totally completed, first is the search entry if is not possible to dynamically display it, is it possible to add option to set is position to bottom and also change the border color, so I can make it presence less visible when I don't need it, seconde is the border radius of the content preview, thanks

Totto16 self-assigned this May 8, 2024

Totto16 added the Priority Medium Priority Medium label May 8, 2024

Totto16 requested changes May 8, 2024

View reviewed changes

package.json Outdated Show resolved Hide resolved

boerdereinar force-pushed the gnome-theming-v2 branch 2 times, most recently from 101ea17 to ff610a6 Compare May 21, 2024 12:17

boerdereinar mentioned this pull request Jun 21, 2024

Emoji with skin tone is not recognized as emoji #300

Closed

4 tasks

oae mentioned this pull request Feb 13, 2025

Issue tracker for Full GNOME 46 support #271

Open

4 tasks

Totto16 mentioned this pull request Feb 20, 2025

Disable code highlighting #344

Merged

8 tasks

Totto16 approved these changes Feb 22, 2025

View reviewed changes

boerdereinar added 9 commits February 22, 2025 16:36

Change to headerless style + add compact mode

5c23667

Remove redundant settings

1cc39ef

Shorten /home/user to ~

cab6c9f

add back headers

753732b

add close item with middle click

a0c6d08

Add file preview + various style fixes

4d20537

Add file type detection for files without an extension

5fae86f

Modify file item look

e3296f6

Change file styling again

6d69a70

boerdereinar added 19 commits February 22, 2025 16:55

Reduce margins of compact text item to fit more lines

53a8a49

Only disable pointer location for indicator

2b58b9e

Fix link button background

58d4d36

Fix jumpy animations when filtering/deleting items + fix item spacing…

40dca4b

… again

Move file icons to header icon if headers are enabled

d4d28ff

Fix metadata height for link item with header

4e866d4

Fix window height not updating + update resource files

62a526d

Add favorite indicator + modify file icon placement and link preview …

cc03d1b

…style in compact mode

Fix shortcuts

b4d1c9f

Add paste file content functionality to text file items

56d926e

Can be triggered by: 1. Pressing the action button 2. Ctrl + click on the item 3. Ctrl + enter on the item

Store any single grapheme as an emoji item

1279908

This adds support for ZWJ sequences

Fix transparent header color

0f75a6a

Note: this causes a windows xp like visual bug in the link item when running Pano in a nested shell

Decrease height of files preview if it contains less files than the h…

2495497

…eight

Fix emoji display for wide emojis like 👩🏽‍👩🏿‍👧🏻‍👧🏽

4ae6e54

Fix header date updater not being destroyed

70eb2aa

Fix warnings that happen when toggling the show-controls-on-hover set…

a949f9c

…ting

Add border around window

5c3403e

Fix item shadow + color item color + remove on mmb setting not being …

1e26455

…respected - Item color didn't support this format: rgb(255 0 0)

Fix pixel inconsistencies

f142b4d

Totto16 force-pushed the gnome-theming-v2 branch from bee6a39 to f142b4d Compare February 22, 2025 16:02

fix: use orientation compatibility functions instead of setting verti…

8917be5

…cal (which is being deprecated)

Totto16 approved these changes Feb 22, 2025

View reviewed changes

oae reviewed Feb 22, 2025

View reviewed changes

Totto16 mentioned this pull request Feb 22, 2025

Issue tracker for UI Overhaul and some more features #346

Open

3 tasks

Totto16 requested changes Feb 22, 2025

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Overhaul UI #280

Overhaul UI #280

boerdereinar commented May 8, 2024 •

edited

Loading

Totto16 commented May 8, 2024 •

edited

Loading

AshtakaOOf commented Oct 21, 2024

JE-Amouel commented Dec 11, 2024

paulovbettio commented Jan 18, 2025

JE-Amouel commented Jan 23, 2025 •

edited

Loading

paulovbettio commented Jan 24, 2025 •

edited

Loading

JE-Amouel commented Jan 24, 2025

boerdereinar commented Jan 24, 2025

paulovbettio commented Jan 24, 2025

JE-Amouel commented Jan 24, 2025 •

edited

Loading

oae commented Feb 13, 2025

Totto16 left a comment

Totto16 Feb 22, 2025

Totto16 commented Feb 22, 2025

Totto16 commented Feb 22, 2025

oae Feb 22, 2025

Totto16 Feb 22, 2025

oae Feb 22, 2025 •

edited

Loading

Totto16 Feb 22, 2025

oae Feb 22, 2025

Totto16 left a comment •

edited

Loading

radiolamp commented Mar 1, 2025

Totto16 commented Mar 1, 2025

mbeps commented Apr 13, 2025

JE-Amouel commented Apr 24, 2025

Overhaul UI #280

Are you sure you want to change the base?

Overhaul UI #280

Conversation

boerdereinar commented May 8, 2024 • edited Loading

Overhaul UI

Description

New Features

Misc

Dependencies

Screenshots

New UI

Compact Mode

Window Position: Pointer

Incognito Mode

Header Style: Compact

Fixes

Type of change

Checklist

Totto16 commented May 8, 2024 • edited Loading

AshtakaOOf commented Oct 21, 2024

JE-Amouel commented Dec 11, 2024

paulovbettio commented Jan 18, 2025

JE-Amouel commented Jan 23, 2025 • edited Loading

paulovbettio commented Jan 24, 2025 • edited Loading

JE-Amouel commented Jan 24, 2025

boerdereinar commented Jan 24, 2025

paulovbettio commented Jan 24, 2025

JE-Amouel commented Jan 24, 2025 • edited Loading

oae commented Feb 13, 2025

Totto16 left a comment

Choose a reason for hiding this comment

Totto16 Feb 22, 2025

Choose a reason for hiding this comment

Totto16 commented Feb 22, 2025

Totto16 commented Feb 22, 2025

oae Feb 22, 2025

Choose a reason for hiding this comment

Totto16 Feb 22, 2025

Choose a reason for hiding this comment

oae Feb 22, 2025 • edited Loading

Choose a reason for hiding this comment

Totto16 Feb 22, 2025

Choose a reason for hiding this comment

oae Feb 22, 2025

Choose a reason for hiding this comment

Totto16 left a comment • edited Loading

Choose a reason for hiding this comment

radiolamp commented Mar 1, 2025

Totto16 commented Mar 1, 2025

mbeps commented Apr 13, 2025

JE-Amouel commented Apr 24, 2025

boerdereinar commented May 8, 2024 •

edited

Loading

Totto16 commented May 8, 2024 •

edited

Loading

JE-Amouel commented Jan 23, 2025 •

edited

Loading

paulovbettio commented Jan 24, 2025 •

edited

Loading

JE-Amouel commented Jan 24, 2025 •

edited

Loading

oae Feb 22, 2025 •

edited

Loading

Totto16 left a comment •

edited

Loading