I have used a jQuery script in order to have a countdown script on a php page that I am doing, but I would also like to have a score system in it based on the time the user takes to answer some questions.
I am using some drag and drops and click in a certain link into an image map -which is the only correct link in the webpage- and in the three pages I am using this countdown, but I would like to, once the user has completed the drags&drops or clicked the links, get the number on the countdown just when the user clicked on a "submit" button...but I am not even sure if I can do this.
Alternatively, could I use any countdown script that would let me get the actual number that is being showed just when the user click on the submit button?
Thanks a lot everybody in advance!
Only use the javascript countdown for display purposes, you cannot trust the client.
Keep the count down server side. Store it in the SESSION variable, or in the database.
Javascript is insecure because the client can change it. I could save your page on my machine, open it up, and modify how the timer reports and you'd get a completely different time than you should get. I could also just change the variable using the browsers address bar. The client can always, always change anything in javascript, and you must, absolutely must rely on the server to keep your users honest.
Why not just stash the time (as a numeric value) when you want the timer to start, and then just check the difference when you want to know how long it's been? In other words, you've already got the client computer's clock counting, because that's what clocks do. Just remember what time it was when the drag&drop completes (or whatever point in time serves as your reference), and then check the time again in an event handler for the submit button.
Related
I am planning to develop a website which works completely based on a timer. This is basically for a discount sales. Here I might have a number of users participating at the same time where the timer is initialized to zero , and each time users click the discount button, the timer starts from 11 sec, counting down to zero. And if any users click the discount button in between, then again the timer needs to starts from 11 sec. And it will continue until when no users click the discount button. Here I am able to restart the timer, but its working is not synchronized in all browsers. Means, the timer that one users see in his browser is not same to the one another user see in his browser, that too for a same product, which all users are playing for. The concept is more of that of bidding only. Can anyone please help me with this?
Your site needs to not only to reset the counter when the button is clicked, but also check the counter during the countdown. So basically on a timer on the client side you'll need to make an AJAX call back to update the counter.
So on the client side:
- Start the counter when the page is loaded with the current value.
- React to a click of the Discount button by sending a message to the server with with an AJAX call or by reloading the page. Likely AJAX as you need it anyway for the next item.
- Check the server regularly for updates. Given we only have 11s, you are going to have to decide on timing. Every 3-4s might be best. Make an AJAX call back to get an update.
On the server side:
- Send out pages to clients with the current counter value to start with.
- React to a press of a Discount button by resetting the counter.
- React to an update request with a quick return of the state of the counter.
I think all of those steps are required to get this to work. How you do them exactly is up to you, especially seeing as you've provided no code or anything.
Just like the title says. I want to create a shared online timer for my friends and say when one of my friends clicked the "refresh timer" button, ideally that all my other friends' page should get automatically refreshed with the new timer, or a notification saying that the timer has refreshed and require them to refresh the page.
I think at least the latter one is possible since when you get a comment of your question on Stackoverflow, you will get notified somewhere in the page telling you there's a new comment.
How to achieve this functionality? In JS or? Thanks in advance!
Javascript setInterval
using Javascript setInterval when the page is loaded, if you're not using MySQL, check a notepad for the text update(or whatever you want) and when it's found, clear it and then run whatever code
When the user presses a button, have it write to the file update(the same thing as above)
There would be 2 ways to go about it:
Simpler one would be to use polling through setInterval and look for changes on the backend.
A more accurate way would be to use Websockets which relay information to the clients that the timer has been reset.
Your choice of tool would depend on how complex you're willing to let it be
I have such a problem - I want to change value of an element on some external website.
Namely: I have webcam http interface which is password protected and there is a page with motion detection checkbox and "Apply" button (form submit). I want to create simple program with some sort of delayed toggling of motion detection (so I can launch this program and have some time to leave the building before motion detection starts). So I want to change checkbox state and write this change to system. I tried something like this, but that doesn't work:
jQuery.get("http://admin:password#192.168.0.1:12345/motion-page.asp",
function(data){
$('input[name="checkbox1"]').prop('checked', false);
// and there "simulate" clicking on Apply button - submit the form -- don't know how ...
}
);
Can anybody help me with this, please?
I would backtrack from the page that shows when you submit the camera form. See if the form itself is submitting the "turn camera on" variable as GET or POST. If you already know this, then all you would have to do is access the same URL as the form from the camera (assuming it's HTTP accessible on a network like this) and submit that same set of variables.
If you don't want to open a browser to do this, you could write yourself a custom application that submits it for you, but either way you have to open something to make the submission, as a script has to wait [X] amount of time before making the request. The fastest way will be through a browser.
I am not sure you need jquery for this (I never use jquery hardly at all). What I would do on the scripting side, since merely accessing this script means you want to activate the timer most likely, would be to create a timer object in javascript, and then make a single function that either accesses the URL of the camera form submission with the GET string parameters (that's easiest if it's doable via GET, because you wont have to build a form), or, if it's POST, have the function build a form and submit the form via POST to the same URL.
Google how to create a timer in javascript, and google how to automatically submit a form. Doing the code for you would be a waste of my time if you can figure it out on your own. If not, come back and we'll see what we can do :)
Good luck.
Why not after hitting the submit button, or after checking the box, have javascript actually run a timer? Look into the timer functions in js or jquery if that's more your thing. Not sure if you need it written to disk or whatever... since you're not giving much info, but whatever data you're wanting recorded could be captured when the box is checked and can be submitted along with the form whenever the timer runs out.
Submitting a form in jquery is simple:
http://api.jquery.com/submit/
:)
I am trying to record how long a person remains on a page in a web app, when viewed on an iOS device, and then record that number, if over 2 seconds, to a local database. Of course the app is written in HTML5/CSS3/JavaScript so the page is actually just a DIV that slides, fades etc. in/out of view on the iDevice.
The app will be used offline and the data will be recorded locally until the user goes to the server to update the app with weekly content. At that time the content from the local database will be transferred to the server.
I have a database created (CBNapp) and the necessary table (CBNapp_Usage) with a column for each page (NewKnife, Trivia, True, Musings, Jokes, Movies, Stories). My idea is to record each time to the appropriate column. In this way I can count the entries under each column to get page visits and use the actual seconds to determine average length of a page's visit etc. I would then record the time of the download to the server and subtract it from their previous download date to get a time frame for the recorded usage.
I have researched this for a while and have come across a question here on stackoverflow at
jQuery: How to bind an event for the div when it becomes visible?
that has an answer (the last one seems best to me) that I think will work but I can not seem to transfer it to my specific needs. This is my first web app. I am ok at HTML and CSS but a newcomer to JavaScript and jQuery so I will need specific examples to understand. Please be gentle :-)
The DIVs I need to record the visits on, all have a class of "root" and have ids as follows:
ContentNewKnife
ContentTrivia
ContentTrue
ContentMusings
ContentJokes
ContentMovies
ContentStories
I tried to identify the DIVs using the following
var ContentPages = $("div#[id*=Content]") and $(div.root);
which throws an error.
Could anyone show me how to do what I am trying to accomplish either using the code referenced above or with a completely new approach.
Any ideas are welcome.
Thanks,
Ted
OK the first thing you need to do is to capture the time.
I start an interval that updates every second (1000 ms). This rounds up the seconds you will notice. If you want more precise, you can have the timer go 500ms or even 100ms and then divide to get seconds).
Then you trigger the start and stop on the existing pre and post page transition events.
http://jsfiddle.net/TheFiddler/akEEx/6/
Rather than build this from the ground up, you might consider using an out-of-the-box mobile analytics program:
I'd recommend http://www.localytics.com/
but these might work too:
https://mixpanel.com
http://urbanairship.com/
http://www.flurry.com/
The benefit is that you can capture a lot more than just time on page or content. And it can integrate with any online stuff you might want to do.
Say I have a website which shows the user ten images and asks them to categorise each image by clicking on buttons. A button for "funny", a button for "scary", a button for "pretty" and so on. These buttons aren't exclusive. A picture can be both funny and scary.
The user clicks the "funny" button. An AJAX request is sent off to the database to mark that image as funny. The "funny" button lights up, by assigning a class in the DOM to mark it as "on".
But the user made a mistake. They meant to hit the next button over. They should click "funny" again to turn it off, right?
At this point I'm not sure whats the most efficient way to proceed.
The database knows that the "funny" flag is set, but it's inefficient to query the database every time a button is clicked to say, is this flag set or not, then go on with a second database call to toggle it.
Should I infer the state of the database flag from the DOM, i.e. if that button has the class "on" then the flag must be set, and branch at that point?
Or would it be better to have a data structure in Javascript in the page which duplicates the state of each image in the database, so that every time I set the database flag to true, I also set the value in the Javascript data to true and so on?
I would keep the state of the element in the js on the page and just issue state-change requests via Ajax. On the server side it is reasonable to either process directly or introduce a state validation check.
This depends on various aspects of your system architecture, however. If the rating is shared between users or other similar scenarios you may need to enforce the round-trip to check what the current status is (or if you have additive nominal flags)...
The page state should be plenty. After all, the page state is what the user sees and manipulates; and they expect the result of their manipulations to reflect what they see.