How to design and code a Timer in AppLab?

Thanks. I’m going to check out those links now.

RE: Set-Style

I stumbled upon that “beauty” back in December and it was fun to know you can adjust BOLD and a few other features.

Thanks

Looks really solid and clear. Thanks so much!

I appreciate the time you spent for a solution.

Do you have a tip jar?

Peace

Looking at the code now. Thanks so much! Cool stuff!

There are a handful of “advanced” commands that we’ve been hesitant to put into the default toolbox to avoid overcrowding and confusion. I’m slowly adding documentation for these commands so that they’re a bit more discoverable (eg https://docs.code.org/applab/setStyle/ )

RE: Globe, 5% re positioning…Great stuff.

Side Thought:
It’s problems/solutions like this which can inspire how we approach what we should be teaching 9-12th graders. Instead of the standard Algebra 1, Geometry, Alg II, Pre-Cal, Calculus pathway, perhaps it is a two-four year pathway of computer science skills, problems, labs, thought experiments which incorporate Geometry, Conics, Trig, Calculus, Statistics, Data Science, Cryptography, CyberCrime, etc. It’s just a matter of time. It would be a lot of fun creating a 4 year pathway combing the skills young minds need in this changing world. We would also need a whole new generation of teachers as well.

Fun times ahead!

Thanks again

1 Like

I just saw this but I love the idea! @jkeays you always have great ideas!

I feel like we are just starting to scratch the surface of this, students want more, but it is hard to fit it into already crammed schedules! I love the idea of doing a completely integrated data science/stats course for students to take in their “math” electives (we require 3 HS credits of math, but most students get 1-2 of those credits in MS and want to take math all 4 years, which means if they need 1-2 math “electives”). Right now our stats course is super simulation based, which is a step in a positive direction, but it would be cool to have students BUILD the simulations, rather than just put in inputs for the computer…

… when I have my dream job that is 50% teaching and 50% curriculum writing, I am going to do that. For now I just have to run mini-experiments on my students. You might want to check out Bootstrap’s data science unit (http://www.bootstrapworld.org/materials/spring2017/courses/data-science/) which takes a stab at this. I’m still trying to figure out how to implement it in a mini-unit in my advanced algebra class, but I think there’s something there!

1 Like

I can make login his block is

onEvent(“Okbtn”, “click”, function( ) {
if (getText(“TxtInputUsername”)) {
setScreen(“Start”);
setText(“LabelUsername”, getText(“TxtInputUsername”));
setText(“LabelAccount1”, getText(“TxtInputUsername”));
setText(“TxtInputUsername”, “”);
} else {
showElement(“imgEror”);
showElement(“LabelIncorecct”);
setTimeout(function() {
hideElement(“imgEror”);
hideElement(“LabelIncorecct”);
}, 3000);
}
});

We created a timer using the code below with three buttons, a start, stop, and reset. What do you think?

var seconds = 10;
onEvent(“timer_start_btn”, “click”, function( ) {
timedLoop(1000, function() {
seconds = seconds -1;
console.log(seconds + " seconds have elapsed");
setText(“timer_number”, seconds);
if (seconds <= 0) {
stopTimedLoop();
showElement(“timer_reset_btn”);
onEvent(“timer_reset_btn”, “click”, function( ) {
var seconds = 10;
stopTimedLoop();
});
}
});
});
onEvent(“timer_stop_btn”, “click”, function( ) {
stopTimedLoop();
});
onEvent(“timer_reset_btn”, “click”, function( ) {
var time = 10;
setText(“timer_number”, time);
});

@haley.kalinichenko,

Cool! Would it be possible for you to use the “Share” feature (in the upper-left corner of your App Lab window) and paste the link here so we can also see your app in action and access the different screens and components?

Thanks!

hello,
Making a timer could use the setInterval() command.

for example:

var a = 0;
var timerOn

setInterval(function() {
     if (timerOn) a++; //adding to a if the timer is active
     else a = 0;
}, 10); //1000 ms in sec. runs code inside every 10 ms.

function displayTime() {
     return(a/100); //dividing a by 100 to get the seconds with 2 decimal points.
}