This is a simple Percent count down with two counters.
A number count and a bar.
In this template the main code is in the header. And is called using a hype function with a button.
It is written this way to control when the count down starts.
PercentTimer.hypetemplate.zip (24.2 KB)
Here is and updated version that can be set to progress down or up.
ProgressBarMod.hypetemplate.zip (104.2 KB)
@MarkHunte I’m trying to download the files but it doesn’t work. Do you think you could upload them again? This is a project I’m currently figuring out. Thanks!!
Looks like the Server might be having issues, I can't download anything either. Even from other postings.
Please try again - seems to work.
Is it possible to update this as it doesn’t open in hype. Says Resource is missing and the files corrupt. (Both zips)
I just downloaded it and it opens fine.
Are you using the Pro Version ?
Yes using Pro v3.5.2 (528).
Edit: Still getting Cannot open Resources and saying files corrupt.
It sounds like the problem is you end.
Try a reboot , logout and back in or a different internet connection…
Could also be the unarchive utility; I’d try control-clicking the zip in the finder and choose ‘Open With > Archive Utility.app’
Had to explore file content and open the hype file within. Extracting seems to create a 2 level folder structure when should be one. Can open the templates now.
The ProgressBarMod.hype.zip says Document Version Incompaitibility even though I have 3.5.2 (528) Professional Edition.
528 is the beta version; 530 is the final release so you’ll probably need to move to the official version.
Ok thanks. Got the latest version now and file opens. Cheers.
Hi Mark
Thanks a lot for sharing this progress bar. It works great. However, I would like to tweak it by adding, for example, 40px to the green progress bar on mouse click. I tried triggering this code on button click but it doesn’t work
hypeDocument.getElementById(‘bar’).style.width = + “40px”;
How would I add 40px to the bar like that?
Thanks a lot for your help.
Greg
What green progress bar?
for the up count
The calculations are done by multipling percentTogo by 2 in the above example.
each step * 2
This means the width will change like this
20
40
60
80
100
120
140
160
80
200
if we multiply by 2.4 then we will change like this
24
48
72
96
120
144
168
192
216
240
This progress bar (it’s green when I open the project on my computer)
I understand multiplying the percent but would it be possible to add pixel values imstead of multiplying them?
Thanks
There is no green set on the progress bar.. as shown in the image you posted.??
What do you see here which one is green..
1 
2 
Probably but what are you actually trying to do..
Yes Mark the second square definitely looks green to me. I guess my brain must have associated progress with green colour and I changed it to green myself. Anyways, I found a simpler solution without too much code as I’m still learning javascript.
Thanks for your help and sorry to mess this thread with stupid questions like that.
Best Wishes
Greg
No problem, there are normally simpler ways of doing things depending on your goals…
