Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add option to show button to confirm instant translation #94

Merged
merged 7 commits into from
Mar 14, 2021
Merged

Add option to show button to confirm instant translation #94

merged 7 commits into from
Mar 14, 2021

Conversation

davidyuk
Copy link
Contributor

I have used Google Translate extension in Chrome before, and I liked the option to show a small button when some text selected for translation confirmation. I miss that feature in this extension and proposing its implementation here.

Currently, I'm using Polyglot in "Instant Translation" mode it works fine except:

  • I have a habit to randomly select text while reading that invokes unnecessary translations
  • sometimes I'm copy/pasting some sensitive data and I don't want to invoke translation (sending to Google🙃) for it
  • unwanted translations brings closer to the translation API rate limit (I have hit it once)

As an alternative to this, I have found the context menu option to invoke translation of the selected text. This is close to the feature I'm proposing to implement, but from my perspective, the current feature is a bit more accessible.

I have added one switch in the settings:
Screenshot 2021-02-28 at 21 45 50
The designs and wording is quite a draft. Probably would be more reasonable to use a Combobox with values like "Disable Instant Translation"/"Instant Translation with confirmation"/"Instant Translation". But don't want to deal with settings migrations at least at the current step.

The translation confirmation button looks this way:
Screenshot 2021-02-28 at 21 46 18
It shows near the cursor. It works well in most cases, except when a long paragraph is selected from the end to the beginning.

@@ -3,13 +3,21 @@
--background: rgba(200, 200, 200, 0.7);
--text: #2b2b2b;
}

.polyglot__confirm-button img {
filter: invert(11%) sepia(0%) saturate(61%) hue-rotate(286deg) brightness(98%) contrast(84%);
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is generated by https://stackoverflow.com/a/50942954/6176994
I don't know a better solution, except:

  • convert icon to SVG and use currentColor
  • or add icon image twice with the necessary colors

Copy link
Owner

@uetchy uetchy Mar 11, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

svg sounds better, but for now your solution is plausible enough.

@davidyuk davidyuk marked this pull request as ready for review February 28, 2021 19:58
@uetchy
Copy link
Owner

uetchy commented Mar 10, 2021

Thank you for the PR, it looks super lit!
I will test this patch in my env.

@uetchy uetchy merged commit 76a0286 into uetchy:master Mar 14, 2021
@uetchy
Copy link
Owner

uetchy commented Mar 14, 2021

Testing for a couple of days, I found no major issues on this patch.
Again, thank you @davidyuk for giving great addition to Polyglot!

@uetchy
Copy link
Owner

uetchy commented Mar 17, 2021

PSA: This feature has landed on Mac App Store version of Polyglot.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants