Ερώτηση σχετικά με setInterval στην JS

rafinos · 9 Ιουλίου 2017

Γεια σας παιδιά!

Θέλω να ρωτήσω το εξής.

Έστω ότι έχω ένα interval με όνομα timer που τρέχει στο προσκήνιο και γίνονται κάποια clicks (σωστά και λάθος) μέσα στη σελίδα. Πως μπορώ να μετρήσω για παράδειγμα αν γίνουν 5 σωστά clicks μέσα σε 3 δευτερόλεπτα;

Ρωτάω γιατί έχω ένα Interval που κάνει countdown ανά 1 sec αλλά θέλω να μπορώ να μετράω κιόλας πόσος χρόνος περνάει ανάμεσα στα clicks και γνωρίζω ότι στην JS κάτι τέτοιο δεν είναι και πολύ εφικτό, εκτός και αν κάνω λάθος.

defacer · 9 Ιουλίου 2017

Θα βάλεις κάποιον click handler που θα μετράει πόσα και τι clicks έγιναν, και ο timer απλά θα ελέγχει τα έτοιμα νούμερα.

Predatorkill · 9 Ιουλίου 2017

https://github.com/Reactive-Extensions/RxJS/blob/master/doc/api/core/operators/interval.md

http://reactivex.io/documentation/operators/interval.html

Δοκιμασε και με buffer:

https://gist.github.com/btroncone/d6cf141d6f2c00dc6b35#buffer

rafinos · 9 Ιουλίου 2017

Ορίστε τι γίνεται σε κάθε click μου. Ο counter μετράει τα σωστά.

$(document).on("click",".square",function(){
			var val = parseInt($(this).text());

			if(val === check_numbers[counter]){
				counter++;
				score++;
				
				$("#score").html("Score: " + score);
				
				if(!$(this).hasClass("gray")){
					$(this).addClass("gray");
				}
				
				//σταματάει το χρονόμετρο για 4 δευτερόλεπτα κάθε 15 σωστά νούμερα
				if(counter === 15 || counter === 30 || counter === 45){
					stopcountdown();
					setTimeout(function(){
						timer = setInterval(function(){ countdown() }, 1000);
					}, 4000);
				}
				
				if(counter === check_numbers.length){
					stopcountdown();
					score += time;
					$("#finish_message").html("blah blah blah");
					$("#finish_message_wrapper").show();
				}
			}else{
				stopcountdown();
				$("#finish_message").html("blah blah blah");
				$("#finish_message_wrapper").show();
			}
		});

Επειδή δεν ήξερα τι ακριβώς να κάνω με αυτό που ρώτησα, όρισα στάνταρ τιμές όπως θα δείτε εδώ:

				//σταματάει το χρονόμετρο για 4 δευτερόλεπτα κάθε 15 σωστά νούμερα
				if(counter === 15 || counter === 30 || counter === 45){
					stopcountdown();
					setTimeout(function(){
						timer = setInterval(function(){ countdown() }, 1000);
					}, 4000);
				}

Τι συνθήκη θα πρέπει να φτιάξω ώστε η συγκεκριμένη διαδικασία να συμβαίνει κάθε φορά που έχω 5 σωστά clicks μέσα σε 3 δευτερόλεπτα;

Επίσης ορίστε και τι κάνει το interval

function countdown(){
			time--;
			$("#time").html("Time: " + time);
			if(time === 0){
				stopcountdown();
				$("#finish_message").html("blah blah blah");
				$("#finish_message_wrapper").show();
			}
		}
		
		function stopcountdown(){
			clearInterval(timer);
		}
		
		var timer = setInterval(function(){ countdown() }, 1000);

@Predatorkill σίγουρα αυτό που έστειλες κάνει αυτό που θέλω;

alou · 9 Ιουλίου 2017

Εγώ θα οργάνωνα λίγο διαφορετικά αυτά που γίνονται, κάπως πρόχειρα και ενδεικτικά κάτι τέτοιο είναι πολύ πιο διαχειρίσιμο και εξελίξιμο:

<a id="whenclicked" href="#" class="square">click</a>
<div >You have <span id="display">0</span> correct answers in the last 5 seconds</div>

<script>

	//each answer must have some properties
	function Answer (result, ts) {
		this.result = result;
		this.timestamp = ts;
	}

	//the click state object with everything it needs to help the rest of the app
	//state array should not be directly accesible like clickstate.state but use methods and return stuff
	function clickState(initValue) {

		var state = [];

		var that = this; //or use arrow functions

		//update the state
		this.pushStateAndReturnCorrect = function(bool, ts ) {
			state.push(new Answer(bool,ts));
			return that.getCorrectAnswers(ts-5000).length;
		}

		this.getCorrectAnswers = function(fromTS) {
			return state.filter(function(item){
				return item.timestamp >= fromTS && item.result === true;
			});
		}

		this.cleanState = function() {
			state = [];
		}

		//maybe you need to get all correct answers
		this.getAllCorrectAnswers = function() {
			var correctAnswers = state.map(function(item){
				return item.result === true;
			});
			return correctAnswers;
		}
	}

	var goodClicks = new clickState();

	var target = document.getElementById('whenclicked');
	var display = document.getElementById('display');

	target.addEventListener('click', function(e){
		var res = true; //do the check for correct answer here
		var clickCount = goodClicks.pushStateAndReturnCorrect(res,Date.now());

		display.innerHTML = clickCount;
		console.log(clickCount);
	});

</script>

rafinos · 9 Ιουλίου 2017

@Alou δεν γνωρίζεις καν για ποιο λόγο το χρειάζομαι όλο αυτό. Πως μπορείς να ξέρεις ότι ο δικός σου κώδικας είναι πιο σωστός από τον δικό μου;

Tα id είναι μοναδικά και εγώ δεν θα κάνω click πάντα στο ίδιο element ενώ ο δικός σου κώδικας, ναι είναι πρόχειρος, αλλά αναφέρεται ξεκάθαρα σε ένα id.

Είναι must για εμένα η jquery όσο λάθος και αν φαίνεται αυτό.

Επίσης, χρειάζομαι Interval κάθε ένα δευτερόλεπτο για να τρέχω έναν counter ο οποίος μου εμφανίζεται στην οθόνη.

Τέλος, νομίζω πως ο κώδικάς σου ουδεμία σχέση έχει με τον δικό μου. Να πω την αλήθεια δεν γνωρίζω πως δουλεύει και πολύ η "αντικειμενοστραφής" προσέγγιση στην js, αλλά από τα λίγα που ξέρω δεν βρίσκω και πολλά κοινά. Εκτός και αν είμαι τόσο άσχετος.

Επεξ/σία 9 Ιουλίου 2017 από rafinos

alou · 9 Ιουλίου 2017

Αν αυτό κατάλαβες, κάνεις ότι νομίζεις αλλά ειλικρινά, απαντάς με επιθετικό ύφος σε μια προσπάθεια να σε βοηθήσω? really?

good luck.

rafinos · 9 Ιουλίου 2017

Αν αυτό κατάλαβες, κάνεις ότι νομίζεις αλλά ειλικρινά, απαντάς με επιθετικό ύφος σε μια προσπάθεια να σε βοηθήσω? really?

good luck.

Τώρα μόλις ετοιμαζόμουν να σου πω ευχαριστώ γιατί ίσως με βοηθήσει το να παίρνω το Date.now() και να κάνω κάποια σύγκριση.

Βέβαια το ύφος μου δεν είναι επιθετικό, απλά θέλω να σου εξηγήσω πως μπορεί όντως η δικιά σου προσέγγιση να είναι πιο σωστή από άποψη κώδικά, αλλά ας λύσω πρώτα αυτό το οποίο με προβληματίζει και μετά τα υπόλοιπα.

tsofras · 9 Ιουλίου 2017

@Alou δεν γνωρίζεις καν για ποιο λόγο το χρειάζομαι όλο αυτό. Πως μπορείς να ξέρεις ότι ο δικός σου κώδικας είναι πιο σωστός από τον δικό μου;

Tα id είναι μοναδικά και εγώ δεν θα κάνω click πάντα στο ίδιο element ενώ ο δικός σου κώδικας ναι είναι πρόχειρος αλλά αναφέρεται ξεκάθαρα σε ένα id.

Είναι must για εμένα η jquery όσο λάθος και αν φαίνεται αυτό.

Επίσης, χρειάζομαι Interval κάθε ένα δευτερόλεπτο για να τρέχω έναν counter ο οποίος μου εμφανίζεται στην οθόνη.

Τέλος, νομίζω πως ο κώδικάς σου ουδεμία σχέση έχει με τον δικό μου. Να πω την αλήθεια δεν γνωρίζω πως δουλεύει και πολύ η "αντικειμενοστραφής" προσέγγιση στην js, αλλά από τα λίγα που ξέρω δεν βρίσκω και πολλά κοινά. Εκτός και αν είμαι τόσο άσχετος.

Μην είσαι άδικος φίλε rafinos ο alou δεν είπε ότι είναι καλύτερος τρόπος είπε διαφορετική προσέγγιση, δεν σου είπε κάποιος κάτι κακό για τον δικό σου κώδικα, απλά διαφορετικές προσεγγίσεις.

Η κριτική στον κώδικα μας κάνει καλύτερους οπότε προτείνω να την δέχεσαι

rafinos · 9 Ιουλίου 2017

Παιδιά με παρεξηγήσατε!

Φυσικά και ευχαριστώ τον καθένα που σπαταλάει το χρόνο του για να με βοηθήσει και φυσικά τη δέχομαι την όποια κριτική μιας που δεν με θεωρώ και πολύ καλό προγραμματιστή. Απλά αρχικά με ενδιαφέρει να βρεθεί όντως μια λύση για αυτό που ψάχνω. Και εν συνεχεία μεταφερόμαστε στο αν ο κώδικάς μου χρειάζεται βελτιώσεις γιατί τώρα ας πούμε έχουμε φύγει αρκετά εκτός θέματος.

Και καμιά φορά ο γραπτός λόγος παρεξηγείται είτε γιατί είναι κακογραμμένος, είτε γιατί αυτός που τον σύνταξε βιαζόταν κτλ.

tsofras · 9 Ιουλίου 2017

Ωραίος, λοιπόν στο θέμα σου αν και δεν γραφω js,αν βάλεις μια global μεταβλητή για τα σωστά clicks και μια global μεταβλητή που μετράει τον χρόνο, δεν μπορείς μετά να φτιάξεις την συνθήκη που θέλεις ? Έχεις κάποιο άλλο πρόβλημα που δεν κατάλαβα εγώ ?

rafinos · 9 Ιουλίου 2017

Βασικα να ξεκαθαρισω πως υπαρχουν μονο σωστα κλικς. Σε περιπτβση λαθους το προγραμμα σταματαει.

Τα σωστα κλικς μετριουνται. Απλα ο μετρητης τρεχει καθε ενα δευτερολεπτο και αφαιρει ενα απο το timer μεχρι να γινει μηδεν.

Αυτο που θελω ειναι αν γινουν πεντε σωστα κλικς μεσα σε 3 δευτερολεπτα να σταματησει ο μετρητης για διαστημα που θα ορισω εγω και μετα απο αυτο το διαστημα αν ξαναγινουν παλι τα ιδια κοκ.

Σκεφτομαι να φτιαξω ενα array που σε καθε κλικ θα αποθηκευει ενα timestamp και θα ανατρεχει πισω τεσσερα κελια και θα τσεκαρει αν εχουν διαφορα 3 δευτερολεπτα. Πως σας ακουγεται αυτο;

Predatorkill · 9 Ιουλίου 2017

Ραφα διαβασες αυτα που εγραψα;

rafinos · 9 Ιουλίου 2017

Διαβασα, αλλα καπου το εχασα.

Προοριζεται για android 4.4.* και πανω εχω συμβατοτητα;

defacer · 9 Ιουλίου 2017

Τι συνθήκη θα πρέπει να φτιάξω ώστε η συγκεκριμένη διαδικασία να συμβαίνει κάθε φορά που έχω 5 σωστά clicks μέσα σε 3 δευτερόλεπτα;

Ε, προφανώς η συνθήκη θα λέει "αν τα σωστά clicks μέσα σε 3 δευτερόλεπτα είναι 5 τότε...."

Θέλω να πω δηλαδή, η συνθήκη προφανώς δεν είναι το θέμα, το καταλαβαίνεις. Το θέμα είναι πώς θα κρατήσεις ένα running count σωστά. Πολλοί τρόποι υπάρχουν, για το πρακτικά μηδενικό "traffic" που θα έχεις ο,τι κι αν κάνεις το ίδιο σωστό θα είναι. Π.χ.

var correctClickTimestamps = [];
function onCorrectClick() {
    var now = Date.now();
    correctClickTimestamps.push(now);
    while(correctClickTimestamps[0] < now - 3000) {
        correctClickTimestamps.shift();
    }

    if (correctClickTimestamps.length === 5) fiveCorrectClicksIn3Secods();
}

Σύνδεση

Ερώτηση σχετικά με setInterval στην JS

Προτεινόμενες αναρτήσεις

rafinos

defacer

Predatorkill

rafinos

alou

rafinos

alou

rafinos

tsofras

rafinos

tsofras

rafinos

Predatorkill

rafinos

defacer

Δημιουργήστε ένα λογαριασμό ή συνδεθείτε για να σχολιάσετε

Δημιουργία λογαριασμού

Σύνδεση

Σύνδεση