Automatic API call using HTML textarea data - html

I have an html form which includes a textarea box and a submit button that calls the API (say the Google Translate API, or Twitter API).
Now I wish to get rid of the submit button and automatically call the API once the user has entered input.
I also wish to have a limited number of API calls: ideally just one API call once the user has finished typing in that textarea.
What would be your recommendation on:
the language to use (javascript, php, other)?
the process: what triggers the API call?
Any pointer would be appreciated.
Edit -> About the "finished typing" part: I will never know if the user has finished typing. The only thing I might know is that there is no typing since x seconds. It would be great if I can detect inactivity since 1 or 2 seconds and trigger the API call. Is that possible and how?

PoltoS has given you information about keyUp and setTimeout. Also you can handle onBlur() event. Form is submitted using submit() method of the form. See examples here. BTW you will probably find the sample for all parts of your question there.

You can bind keydown/keyup events of your field to some function that runs setTimeout (with 5 seconds delay) after clearing old one. Once the function mentioned in setTimeout is called - the user has not typed for 5 seconds - execute your API call.
Better would be to show a countdown timer on the right to let user understand that something would happen in 5 or 10 seconds.
And of course it should be done using JavaScript - no additional request to server needed

Related

Knowing in advance if re-captcha is going to be triggered (invisible V2, V3)

After reading some documentation, I figured out that the re-captcha risk-analysis of invisible re-captcha V2 and V3 is triggered just after that the user clicks on submit buttons. Then, according to the output of the risk-analysis system, is asked a challenge (or not) to be solved by the user. Once that the challenge has been solved, the re-captcha token populates the innerHTML of "g.recaptcha.response".
Does it work in this way right? Is it not possible knowing if the captcha-challenge is going to be triggered (or not) before of the event that activates the risk-analysis system of captcha?
I mean, are there parameters of the DOM that tell you if the captcha-challenge is going to be asked?

What would happen if # of events exceeds 500 on Firebase Analytics?

I have been using Firebase Analytics for my apps and I like it.
Currently I have 300 events set up on one of my apps.
I learned that the max number of events we can have is 500.
What would happen if # of events exceeds 500 on Firebase Analytics?
Would it just stop logging new event? (501st event)
Or is there any better way to avoid it?
I will appreciate your advice!
Extra events are dropped. A firebase_error event is logged with a firebase_error parameter which indicates the error code. See this documentation for more information.
There's no other way to avoid it, but to manage your event logging implementation properly. Note that event in Google Analytics for Firebase is equivalent to the user's interaction within your app.
I would not suggest to create or log an event with incremental index, prefix or suffix in the name. You may also want to use the event parameter.
For example, you have a login page (with authentication methods of using Facebook, Google or Username/Password) and you'd like to track what is the most commonly used by the users. With this, you could log a custom event with the name of "user_login" and a parameter or login_method. After this, add the parameter in the custom parameter reporting to see the counts.
Hope this helps :)
Just for clarification because this confused us and there is no clear documentation on this:
The 500 events limit is per user per day and not per project globally. So events are only dropped after a single user uses more than 500 unique events per day, everyone else will continue to log events.
So if you have more than 500 events thats fine, you dont need to replace them you just need to remove them from your current app from being logged and use new ones, then this user will never use the old events and it does not count towards his 500 event limit.

Multiple http requests every timeout

I have developed an web app using angular which connects with spotify and enables customers in my bar to add songs to the current playlist.
To do so I am calling the spotify API to get the current track, where i start a timeout using the time left of the currently playing song. Once this ends, I call the method again, as well as calling a request to get the playlist.
Currently using this method, it will make a few requests every few minutes.
To make it more accurate and update more readily, I want to make this timeout every ten seconds.Is this bad practice, and will it slow the app down or is this recommended?
if it is requesting more than one every time probably you need to make a little research about bubbling.
Shortly; probably your method is connected to a button and when the user clicked it, button calls the method. And also somewhere in your code you calling that method again (probably in a parent form element). when you click on a button that is inside a form, you also click to that form too so it calls both methods of form and button. In your case both of the same function so your method runs two times.

Custom HTML5 Geolocation Prompt

As I am testing out one of the HTML5 features - geolocation for my project,
I realized that users can close the prompt without allowing or denying it,
that defeats the whole purpose of the prompt.
And because in my project I want to dynamically display data to users depending on user's location, this can't be done, simply because without knowing user's response,
it doesn't trigger any of the two callbacks - success / error.
so I started searching to see if there's any solution to this,
and a lot of suggestions to this is to set timeout,
I tried and everything works perfectly.
However, one small flaw here is tho, by the time it hits the timeout expiration,
all the data are already displayed, and when i say all, i mean EVERYTHING,
because there's no location detected.
So I came up with two solutions that might work,
1) create a custom geolocation prompt that forces users to allow/deny location to be shared,
and pass the response to browser to set the location preference
2) pause page-load (stop stuff from being rendered) and wait till it hits the timeout expiration or it gets response from users
Does anyone have any idea how to implement one of these two solutions?
PS: sorry if this isn't unclear to you, i know my english sucks, but I can explain in more details.
Thanks guys!
You shouldn't be able to use a custom Geolocation prompt if your project is browser based, because malicious developers could use the method to trick the user. Also, since the Geolocation API is an asynchronous event, it's going to continue loading the rest of the page while it waits.
What I recommend is to use a conditional statement instead with an else clause. This way, your script functions should only execute after location has been shared, and you have a fall back on what should happen if no geolocation information is provided (which I highly recommend as situations will occur when the data isn't provided).
Example of the conditional statement to check for geolocation information using JS:
if (navigator.geolocation) {
// code to run if there is geolocation information
}
else{
// code to run if no geolocation info is given to the browser
}

Have form do two things on submit

Hey, I'm just wondering if it's possible to have a form in html do two things on submit, have the action go to a url like normal (for a search) but also run a mysql command.
Thanks!
A form can not run any SQL. HTML has nothing to do with databases, it doesn't know about them, it can't talk to them.
A script on your server can do SQL queries, and that script can be invoked by the browser request. The browser may also submit form data together with the request if it wishes.
It works like this:
User submits form
Browser generates a request and sends it to the given URL
Server receives request, starts up script corresponding to the URL
Script queries database, does something with the received form data
Script outputs some reply
Browser receives reply (website) and displays it
Stop. Never have a client ever run a MySQL (or any database) command. They could do a lot to seriously destroy the integrity of your database. You should have your processing page do the MySQL command after validating the input.
To answer your question, however, it is possible. Your form, upon submit, can call a Javascript function, which in turn does the two actions. But if you're doing this, there's probably some code that needs to be refactored.
I think you have a couple of options here. If your page requires javascript to be enabled for them to submit the form, then you could do an synchronous XMLHttpRequest call before the form submission. If you don't know if Javascript is enabled on the browser or there is a chance that someone can turn it off, then you would need to perform the two actions on the server after they submit the form.