Bruce
Posts: 0
Joined: Sat Jul 26, 2014 7:59 pm

Display picture when timer completes!

I'm having difficulties with the following bit of code. I can get the "picture" and timer function working fine separately, but am having trouble combining the codes into one function. See below:

var seconds = 15;
var minutes = 0;
var secondPassed = function(){
Appery("timer_div").text(minutes + " : " + seconds);
{seconds--;
if (seconds === 0){
if (minutes === 0){
var picture = function () {
clearInterval(countdownTimer);
Appery("timer_div").text("timer done!");
getRandomInt(min, max);
return Math.floor(Math.random() * (max - min)) + min; };
var randNum = getRandomInt(0,10);
var imageUrl = Appery.getImagePath("img_" + randNum + ".png");
Apperyio("mobileimage_27").attr("src", imageUrl); }
else {seconds = 60;
minutes--;}}
var countdownTimer = setInterval(secondPassed, 1000);
secondPassed();

Can someone please advise what I'm doing incorrect??

Also, when I click the timer button twice, the timer is running two different times.... any idea how to prevent this?

thanks in advance for any help!!!

Evgene Karachevtsev
Posts: 12
Joined: Mon Apr 28, 2014 1:12 pm

Display picture when timer completes!

Hello Bruce,

Could you please clarify, are you sure that you definitely have an image with the same name which is formed in this line:
prevar imageUrl = Appery.getImagePath("img_" + randNum + ".png");/pre
You may output result to the console or to the alert to check. Unfortunately , ot isn't very clear what does timer do by a double click, could you please detail?

Bruce
Posts: 0
Joined: Sat Jul 26, 2014 7:59 pm

Display picture when timer completes!

definitely sure that there is an image with the same name. The code for the image works separately in a different function:

function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min)) + min;
}
var randNum = getRandomInt(0,10);

var imageUrl = Appery.getImagePath("img_" + randNum + ".png");
Apperyio("mobileimage_27").attr("src", imageUrl);

When I click a button once, the countdown timer starts. When it is clicked again when the countdown is in progress, two times are running simultaneously. E.g. 15, 14, 13, 12, 15, 11, 14, 10, 13, 9 .......

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

Display picture when timer completes!

Hi Bruce,

It seems you have provided us not full JS.

Thus it's hard to help you now.

Please give us your app public link. And describe steps to reproduce it.

Regards.

Bruce
Posts: 0
Joined: Sat Jul 26, 2014 7:59 pm

Display picture when timer completes!

There are only the two different functions, both listed above. One executes at the click of a button and the other executes on the click of a picture.

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

Display picture when timer completes!

Dear Bruce,

As i mentioned above i can not see FULL code.

You have provide us some part of this code. This part does not clear. And thus we can not help you.

See details on screen shot:

http://prntscr.com/4by9sv/direct

Regards.

Bruce
Posts: 0
Joined: Sat Jul 26, 2014 7:59 pm

Display picture when timer completes!

oops - here's the full code. How do I provide the app public link? Or will this do?
var seconds = 15; var minutes = 0;
var secondPassed = function(){
Appery("timer_div").text(minutes + " : " + seconds);
{seconds--;
if (seconds === 0){
if (minutes === 0){
var chad = function () {
clearInterval(countdownTimer);
Appery("timer_div").text("timer done");
getRandomInt(min, max);
return Math.floor(Math.random() * (max - min)) + min;};
var randNum = getRandomInt(0,10);
var imageUrl = Appery.getImagePath("img_" + randNum + ".png");
Apperyio("mobileimage_27").attr("src", imageUrl); }
else {seconds = 60;
minutes--;}}
}};
var countdownTimer = setInterval(secondPassed, 1000);
secondPassed();

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

Display picture when timer completes!

Hi Bruce,

This is corrected JS code:

pre

function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min)) + min;
};
var randNum = getRandomInt(0,10);

var seconds = 15;
var minutes = 0;
var secondPassed = function() {
Appery("timer_div").text(minutes + " : " + seconds); {
seconds--;
if (seconds === 0) {
if (minutes === 0) {
//var chad = function() {
clearInterval(countdownTimer);
Appery("timer_div").text("timer done");
//getRandomInt(min, max);
// return Math.floor(Math.random() * (max - min)) + min;
//};
var randNum = getRandomInt(0, 10);
var imageUrl = Appery.getImagePath("img_" + randNum + ".png");
Apperyio("mobileimage_27").attr("src", imageUrl);
} else {
seconds = 60;
minutes--;
}
}
}
};
clearInterval(self.countdownTimer);
self.countdownTimer = setInterval(secondPassed, 1000);
secondPassed();

/pre

After countdown is finished "mobileimage_27" component asset changed to something like "files/views/assets/image/img_3.png"

You can make it sure by click "ispect element" on image component.

Regards

Bruce
Posts: 0
Joined: Sat Jul 26, 2014 7:59 pm

Display picture when timer completes!

This is awesome!! Really appreciate your help. Thanks a lot!

Return to “Issues”