How to encode a progress bar

Question

I am creating a youtube player with user controls using apt youtube:

http://code.google.com/apis/youtube/youtube_player_demo.html?playerType=chromeless&playerVersion=as3

I have play / pause / skip buttons, but I have to create a progress bar and I can’t think how to do it. I have never programmed a progress bar before. I can access the total time of the video, and also poll the current playback time using setinterval ... so every 250 ms, for example, I can poll to find out the current position of the video.

My question is, how can I use this data to create a progress bar? I am thinking of a div that I could manipulate in width to show the progress of the video. My problem is how can I use the data (total video duration and current time) to decide when and how much to increase the width of this div.

Hope this makes sense.

Answer 1

The formula for calculating the size of your progress bar is very simple $download_size / $download_progress * $max_progressbar_width. You just need to make sure that both load sizes use the same units to get the right proportion.