How to embed a translator on a site - html

I am a foreign language teacher whos class does not have dictionaries. But we have a smartboard. I have all my tools and tasks for the students on a custom site similar to classroomscreen.com.
What I am missing is a way to embed translator.google.com or a similar translation website into my site, so students can write onto the smartboard for everyone else to see the translation.
What would be the right approach?
I tried the tag and adding deepl.com, but to make the input bar visible I need to make the way to large. All the unnecessary adds and banners show.
It would be optimal if there only was an input prompt and a list of results of the translation. Some JS accessing an API ...
But I am clueless about what to use in which way.

Related

Replacing a document node on a webpage with React code using a browser extension

I have a website that has a sidebar on it with way too many elements on it and I would like to write a browser add-on (available for as many modern browsers as possible) that lets users adjust the elements on the sidebar. Luckily I have access to the original React component that is used for the sidebar. I imagined the addon would work as follows:
A settings page allows users to design their own sidebar. For this, I believe I somehow must fetch the site content (which is probably React code) execute it (?), and find the node that I want to replace. Then I grab the elements on the sidebar to fill the default sidebar that the user can then configure to their own needs. Is executing the react code to get the elements the right approach here? If so, how would I do that?
When the user goes to the web page, a script is executed that will either find the dom element and replace it and update it each time the React Dom is updated (? not sure if that is even possible) or somehow locate the component in the React script and edit that. Again, not sure if that is even possible. An alternative would be to create an empty div and populate it with my custom component while setting the display property of the original component to none.
I would really appreciate it if somebody could let me know whether what I am trying to do is even possible, whether I am on the right track, and maybe can give me some hints on where to look for further information on how to achieve such a thing.

Mirador words highlighting

I am showing OCR-ed book pages in Mirador viewer. All words with coordinates are fetched from elasticsearch and search is across all books (meaning I can't use IIIF search api).
I need to highlight certain words in Mirador viewer.
I know that this is possible using annotations, but I need to use those annotations for something else (user comments), so I need another way for highlighting. Highlights should be displayed immediately, while annotations can be toggled.
Is there any solution with Mirador and IIIF presentation protocol or highlighting could be done on image server layer (currently I'm using IIPImage which doesn't support highlighting)?
Is there any other image server that supports highlighting and is it a good idea to do it this way?
Thanks!

Getting a specific text from a website using Regex in Shortcuts

I’m trying to create a Shortcut on iOS that uses Regex, what I’m trying to accomplish is getting the price of a product from a website but no matter what Regex commands I use don’t work. It would be easier if my computer was up and running and I was able to use addons to view the site better but I’m stuck on iOS for the time being. Viewing the source code line 606 displays
'productPrice':'409.99',
But nothing I try pulls the the price even from different lines in the code.
I’m trying to get the price from https://www.microcenter.com/product/512484/intel-core-i7-9700k-coffee-lake-36-ghz-lga-1151-boxed-processor
I just can’t figure out how to retrieve the price being shown, I’ve tried so many combinations I had to turn to more experienced user help.
this works for me: 'productPrice':'(.*?)', - link
Make sure you are getting the part of the page source that contains this information.
The answer was so simple, if using shortcuts on iOS I was able to pull the price of the MicroCenter product by these commands.
URL - microcenter page to product
Get Contents of URL (leave as is)
Get Text from Input
Match Text - Pattern - \$......
Get item from list - Item at Index / 2 (2 is for items on sale or not)
The rest you can decide what to do with it, make a notification or whatever you decide how to display the price. This answer I found was a way to make sure it works. Now I’ll make a menu of multiple items from micro I have my eye on to pull all the prices in 1 click display. https://m.imgur.com/Iljvsx6

How to set focus on tab in tabcontrol in URL

I am trying to call a page in my customers webapplication (Exact Synergy Enterprise)
This is the link: http://someserveridontdisclose/Synergy/docs/CSCANEduCourseCard.aspx?ProjectNr=ACPGINTV
Within this page is an Ajax TabContainer with several TabPanels. One of them is called 'Doelgroepen'
I dont have the source for this application, as i am not the developer of it. We only develop custom extentions to it.
Here's the question: Is it possible to focus on one of the tabs USING ONLY AN URL? If so How?
Thank you very much for your thoughts about this.
try to set with javascript. you'll have to write your own js to get index number you want from url, then set like this
$find('<%=TabContainer1.ClientID%>').set_activeTabIndex(2);
http://forums.asp.net/t/1127834.aspx
http://www.aspforums.net/Threads/420684/ASPNet-AJAX-TabContainer-Set-Active-Tab-Client-side-using-JavaScript/
If you do not have access to the code and if this is not part of the requirement / design specification for the application you are using (ie: what you asked the developer to do), then the answer is No.
The control does not have "native" support for URL tab selection. There needs to be specific code in the application in order to handle this.
It is however very easy to implement, if you absolutely need it, it shouldn't take much time (about 15-30 lines of code, depending on how many tabs/urls combination you need).
You can find a running sample of the AjaxControlToolkit Tabs control at the following link (the available functionnalities are described in there):
http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/Tabs/Tabs.aspx
If the TAB has an ID you could make it visible by adding '#tabid' to the URL.

How to use autocomplete plugin for refresh a div?

I have a doubt which involves an auto in a DIV (in which contains the name of other users with their image and age) when a user type the letters in a field that is positioned above the DIV.
As the auto search of Facebook friends.
Searching, I found a jQuery plugin that is the 'Autocomplete' but I want to modify to have the same behavior as facebook friend finder.
Does anyone have any example to do this? Or another way?
Note: I have a function in PHP that returns me all the names by letter. ¿I can consistently with ajax call this function to update the DIV?
jQuery UI has some nice built in functionality for that
http://jqueryui.com/demos/autocomplete/
You can either go the javascript way when retrieving the suggestions or you could do the ajax calls - that depends mostly on how many entries you have that are possible matches.
If you have too many, storing all elements in js might not be the best way to go.