Add breadcrumbs to address bar

[Antolius]

Address bar should represent path segments in current URI as breadcrumb buttons, similar to how elementary Files does it for folder structure. Address bar should always leave some empty space after the last URI segment button. Clicking on that should allow user to manually enter text. In case of long URIs apply ellipses to middle segments first. Clicking on individual path segment breadcrumbs should navigate to their corresponding URI. User should be able to turn this feature off and use manual address bar only.

If server doesn't have any content for a given URI sub-path it's segment should form the same breadcrumb with the next (more concrete) one. For example, given following server responses:

gemini://example.com -> 20 (success)
gemini://example.com/gemlog -> 20 (success)
gemini://example.com/gemlog/2021 -> 51 (not found), 31 (redirect) or other non 2x status
gemini://example.com/gemlog/2021/Jan -> 51 (not found), 31 (redirect) or other non 2x status
gemini://example.com/gemlog/2021/Jan/post.gmi -> 20 (success)

Breadcrumbs for the gemini://example.com/gemlog/2021/Jan/post.gmi URI should look like:

[gemini://example.com > gemlog > 2021/Jan/post.gmi >          ]

User can click on:

1. [gemini://example.com > to go to gemini://example.com
2. > gemlog > to go to gemini://example.com/gemlog
3. > 2021/Jan/post.gmi > to go to gemini://example.com/gemlog/2021/Jan/post.gmi
4. > ] to enter manual editing mode, which should start with full URI gemini://example.com/gemlog/2021/Jan/post.gmi selected. If address bar loses focus without user pressing enter or clicking on the go/refresh button it should revert back to breadcrumb mode and disregard manual changes to the URI.

[Antolius]

Another thing to consider is how to integrate the "check identity" functionality with this new address bar. Currently user can see information on server certificate and manage client certificate from an icon on the beginning of the address bar. In Gemini protocol a client certificate is tied to specific URI and is used for all sub-paths of that URI. It may be interesting to somehow integrate this information in the breadcrumbs. Perhaps we could apply a different background color to breadcrumbs covered by the currently used client certificate or insert the user icon (symbolizing client certificate) between the breadcrumb segments?

For example, given client certificate which covers gemini://example.com/game/app we could have:

[ 👤️ | gemini://example.com > game > app > rooms > hallway >          ]

Where > app > rooms > hallway > buttons are in a different color. Clicking the user icon [ 👤️ | opens a popover with information on both server and client certificates (and option to manage the client one).

Alternatively, we could go with:

[ 🛡️ | gemini://example.com > game | 👤️ | app > rooms > hallway >          ]

Here [ 🛡️ | opens a popover with just the server cert details, while | 👤️ | shows just the client cert.

Lastly, in case path does not use a client certificate, but there are some associated with other paths on the domain:

[ 🛡️ | gemini://example.com > game > how-to-play >          ]

In this case [ 🛡️ | popover shows info on the server cert and links to an option to "extend" existing client certificates to cover this path as well. This is essentially a "hack" to cover gemini://station.martinrue.com site which expects client certificate issued for the login sub-path to be applied to the root URI. As far as I can tell this is a non-standard behavior, but since Station is the first / largest social network in Geminispace I think we should make using it as easy as possible. Perhaps even use a slightly different icon for cert info in case there's no client certificate anywhere for the domain as opposed to this case when there is one currently defined for a sub-path.

[Suzie97]

[ 🛡️ | gemini://example.com > game | 👤️ | app > rooms > hallway >          ]

Here [ 🛡️ | opens a popover with just the server cert details, while | 👤️ | shows just the client cert.

Lastly, in case path does not use a client certificate, but there are some associated with other paths on the domain:

[ 🛡️ | gemini://example.com > game > how-to-play >          ]

Being a user who is not very used to the idea of server and client certificates, I don't find this very useful and might serve as unnecessary information on the address bar. I can imagine myself clicking on the 👤 icon and getting frustrated for not understanding the information. It might be useful for people who actually the certificates for sites. But I don't see this as an intuitive design.

What if there is just a lock icon at the start of the address bar, clicking on it opens a popover showing certificate information for both the server and the client?

I find this approach that you've proposed intuitive and understandable.

For example, given client certificate which covers gemini://example.com/game/app we could have:

[ 👤️ | gemini://example.com > game > app > rooms > hallway >          ]

Where > app > rooms > hallway > buttons are in a different color. Clicking the user icon [ 👤️ | opens a popover with information on both server and client certificates (and option to manage the client one).

Also, the use of a different colour looks interesting to me. It would serve as an extra indicator for the current page.

[Antolius]

I too actually like the unified icon approach better. (In fact that's how it's implemented right now.) Plus, playing with colored breadcrumb buttons sound fun.