As many people have used google translation, I want to create a website like "translate.google.com" based on my own machine translation system. I hope somebody can help me with the following questions since I'm not experienced in web development, .
The input area of google-translate is a textarea . When a user hovers on the target phrase, the corresponding source phrase was highlighted. How can I achieve such effects? Do I need to modify the textarea or use span-like control?
The output area of google-translate seems to be not a textarea. When a user clicks on the target phrase, it triggered an event and make communication with the back-end, then the corresponding translation options are displayed right on the target phrase. I want to make the position of the translation options the same as google-translate, how can I achieve this without refreshing the whole page?
Any comment will be welcome.
Related
I'm working on a Chrome Extension which I want to replace certain characters in a specific text field on one specific website. It is basically to change emoticon text (like ":-D") into the proper emoji's, such as "😄". I tried a few things I found online (I'm not very good with JS):
- A MutationObserver and then look for all text fields with a certain name, then replace all emoticons by hand. Didn't really do the job properly and also kept firing up the print window for some reason
- Event listener added with event 'keyup' but it doesn't seem to fire up.
Hope you guys know a good solution!
This question does not give anywhere near enough information to answer. Are you using the program for input fields on the website? What solutions have you tried? Where is the code? Essentially, you are asking us to write the entire program for you. This forum is meant for programming help, NOT doing the entire program for you. You need to fix the question to be more specific.
If you just want to replace text elements, you would have to use the select elements by tag name to select all text elements on the page and then search through each of these for the sets of emoticons. Once finding these, you would have to change the elements inner html to fit the emoticon from UTF-8.
I am relatively new to both programming and developing chrome extensions. I am developing a chrome extension that will do this simple thing.
On selecting a text, show a button on clicking which the text will be highlighted. (Somewhat like the pin button)
When i revisit the page I can see what where the areas i highlighted.
So currently I have a extension working which can save the bookmark to the database. This is the link from which i got this understanding http://markashleybell.com/building-a-simple-google-chrome-extension.html. If you want i can share the actual code also but it is going to crowd the question.
I think I can make get the selected text to go in to the database if i use contextmenus. But this is what i intend to do is
select the text
A icon comes up (How do i trigger the jquery to add the button, which chrome api i need to use and in which file i should put the code)
3 On clicking the icon the text gets highlighted. (how should i change the DOM of the current page)
I can do the part of extracting the text and sending it to the Database.
The next problem i have no idea about what information I need to store in the database (Example do i need to store the start or end node) so that i can have the text highlighted when i return to the URl. How does a chrome extension start on its own to figure out what part of the page need to be highlighted.
In case you have a sample code that will be great or just tell me what is the logic and chrome api's i need to use.
I know the question is too broad but even if you have a few links that can help to understand this flow it will be great. The project i am working on it to create a far similar version of https://www.diigo.com/, with just the ability to store URL along with the highlighted notes.
basically, I would like to develop a django based application for a synonym dictionary, where the user can write a paragraph and my application, highlights a set of words in different colors and by clicking on those highlight words, a set of synonym will be shown as a popup box (exactly like gmail spell checker) and by clicking they get replaced by the word.
The main question is from where should I start. Is there any API that can assist me ? Also, I wonder, if such a editable area is still called "textarea" ? What library are already out there to help me me out with coloring and pop-up box or any similar code ?
I appreciate any hint.
I have a tinyMCE editor with a SignalR Connection. Right now I am writing and formatting text on one client and receiving text on the other client in real-time with the use of SignalR. Now what I need to do is give a separate caret to each of the clients so that all clients sharing the same document can edit at the same time (same concept of Google Docs - separate cursors with the user's name or a specific color associated with the user). I am stuck on what to look for to be able to do this. Anybody has some useful links that I can look into?
EDIT: I have now looked through all the methods in tinyMCE and SignalR and noticed that there are no easy methods for this. After some thinking I came up with the idea to implement a custom caret myself. i.e. use a UNICODE character like | and place it at position 0 when a client opens a document. I need to give this character the behavior of a normal writing caret i.e. keep at the end of the text and move to a position upon clicking a certain area in the document. Do you guys think it is a good idea?
I've been looking around for a good back-end independent HTML/CSS/JS widget for many-to-many/has_many relations with XHR filtering and I can't seem to find any.
I find hard to believe people are constantly re-inventing this wheel.
What am I missing?
EDIT: Ok, from the number of people that didn't understand it, this was a crappy question.
I believe that regular web interactions should come at minimal cost (it should either already be in HTML or a package install away).
That's true for most cases. However, I'm having a hard time finding something for picking up an item from a collection (Not autocomplete, something more elaborate than merely a string. If you want an example, assume you want to pick users and have their avatar displayed while picking.).
Picture this:
When you want the user to provide
a short string in a form, you give them an input box
a long text in a form, you give them a text area
a piece of HTML (for a blog post's body, for example), you give them a text area with CKEditor or TinyMCE
pick something from a short list, you give them a drop down menu (like a select box)
a string based on a wide range of known alternatives, you give them an input box with autocomplete (jQuery UI Autocomplete, YUI Autocomplete, etc..)
a set of items from a wide range of options, you give them... drumroll...
I don't know! And that's my question. I've searched a bit and could only come up with jquery-tokeninput as a credible option.