Oversize Vivaldi Popup Translator need better accessibility

[dude99]

As u can see, when we translate a huge block of text, the popup translator placement is spawn at the end/bottom of the selected text, then it display the entire selected text again inside the popup... this redundancy is really unnecessary. As a result we have to constantly scrolling down half a page to read the translated result hidden off screen. IMHO this design is unnecessarily cumbersome & counter intuitive to use.

---

My suggestions:

1. Spawn oversize popup translator (total height is over 50vh) at the beginning of selected text instead of at the end, that way we don't need to scroll down as much to begin reading the translated result.

2. Add an Expand button & limit selected text display inside popup translator to 2 lines; then click on expand button to reveal the hidden text. We don't need to read the entire select text inside the popup, because we probably don't understand 'em anyway. So displaying only 2 lines of the selected text by default should be sufficient in most cases.

3. Also, please add option to invert the order of translated result with selected text inside the popup, so that we can always see the translated result first above the references text. Something like this:

   

---

IMHO the oversize popup translator should look & behave something like this:

[Pesala]

@dude99 The position of the popup is not always just below the text; it can be above the selected text, or out of sight at the top of the web page until you scroll up.

It makes more sense to use the Translation Panel for large blocks of text, but it makes little sense to duplicate the selected text while it is visible on the page.

Perhaps the dialog should open covering the selected text. It would be useful to see all of the text being translated in the dialog, especially when the selected text is not all visible at once

[dude99]

@pesala

I have thought of your suggestion at first, but then it just doesn't make any sense to have an overlay popup displaying the same stuff that covering the original text... that's redundancy that wasting resources.

It would be more efficient to just spawn the translated text directly below/beside of selected text inside a popup + detect & result language selectors. That would be a much cleaner presentation.

Unless, if someone want to learn different languages & Vivaldi translator support word for word highlighter, like when u select a word inside the popup & then Vivaldi will highlight the translated word (or vice versa). But it can't do that so it's kinda pointless to duplicate the same text inside the popup. LOL

[Pesala]

@dude99 Suppose a French user knows some English, but not well enough to be sure that he/she has understood it correctly.

Selecting all of the text, then duplicating it in the dialog is a waste of space as you said. However, if the dialog covered the selected text, but showed all of the text being translated, the user could compare the English and French translation one sentence at a time.

If only the blue part of the selected text is visible, as in your screenshot, the user cannot read the rest of the selected text as it is obscured by the dialog. May as well cover all of the selected text, and show it all in the scrollable dialog.

[dude99]

@pesala

If only the blue part of the selected text is visible, as in your screenshot, the user cannot read the rest of the selected text as it is obscured by the dialog.

That's why I settled with hidden references text block to 2 lines inside the popup & extend button idea in the OP. That would be a good compromise between having zero references & showing too much unnecessary info in plainview. As of now, we have to scroll through the references text block at the beginning of the popup every time, it gets really annoying when we have to repeat it over & over in the same page.

Another solution would be invert the order of contents inside the popup translator. Display the translated result at the top first, follow by 2 language selectors in single line, then reference text at the very bottom.

That way those who don't care about the references text don't have to deal with it, & those who need the references text can still access it by scrolling down.

[Seasonly]

I agree @dude99. In the most of use case, the first current part of translation popup is useless except that it covers a lot of space and gets you a lot of information which loses you more than it helps you to understand... Please remember this is a contextual tool whose purpose is to get clear to your mind (and quickly so more) what you can't understand alone, not the opposite.

But in some special cases it can be useful (here some of them) :

1. When program doesn't recognize correctly source language (when some words are the same writting (in several language) and only context can determine which language is (and sometimes only user knows it) => it can be resolved showing only droplist of source language for manually correction (language should be then saved to avoid doing this again for other translation calls on this page only)

2. When selected text is hovered by the popup as suggested by @Pesala =>letting an empty part onto popup should allow to catch it with mouse and move popup to see original text, transparency during moving should help too, shouldn't ?

3. When you want to precisely study the translation, the extracted source avoids you to be distracted from all others sentences =>very special case, and even then a better tool into panel should be more interesting then?

Is there more ? Indeed, i'm thinking about further feature as selecting words into source part and then this highlights the translation into the second part of the popup...

To conclude I would really see as an option that the first part of the popup is hidden and gets visible when hovering mouse on a special and small part of the popup. Further, a pin system may block the all source part into its visible status.

To be more precised, the popup should be opened with only the source droplist language (the source text is so kept unvisible) and this part is automatically disappearing after a bit of time so far user can have a confirmation that the machine has correctly found the good source language. And even this little animation should be played if the language is not the default expected (according to language setup into web page parameters) or if this is the same as the one from last popup call onto this web page.

[dude99]

@seasonly

I would really see as an option that the first part of the popup is hidden and gets visible when hovering mouse on a special and small part of the popup.

This would be what I do to make the popup translator more ergonomic, but unfortunately V team doesn't like this sort of UI. They preferred more conservative GUI like an expand/collapsed button. That's why I suggest a button GUI to hide the references text instead. LOL

I actually manage to use CSS to emulated this behavior via the devtool:

/* vivaldi translator */
.vivaldi-translate-text:not(:focus-within):not(:hover) {max-height: 2.3em;}

But unfortunately, the popup is spawn inside an iframe, so I'm unable to inject this code into #shadow-root via Stylus.

So is there anyone know how to do it? Best info I can find in the Internet is utilizing :host() or :host-context(), but so far I'm too dumb to make 'em work... LOL

[Seasonly]

@dude99

But unfortunately, the popup is spawn inside an iframe, so I'm unable to inject this code into #shadow-root via Stylus.

It seems that vivaldi doesn't want that user customizes this part of the ui. I experimented this #shadow-root limitation with javascript since this parameter become closed into vivaldi 4.3 which wasn't before.

[dude99]

@seasonly Oh, that's why it doesn't work even I follow the CSS instruction I found. I guess we can't mod the popup translator, then we will have to brute force with upvote... & wait for 5 years to see this improvement. LOL

[thedayismine]

@dude99 Brute force upvote! Where do I do this? Have you made a feature request?

[dude99]

@thedayismine This is the feature request thread, and after 3 years there are only 4 upvotes... Unfortunately, this will be just another archived thread after 2 more years. LOL

I wonder will Microsoft eventually steal this fabulous idea for their edge browser...

[SezginUlu]

This post is deleted!