#447 ✓ staged

bare-bone timer player

Reported by annasob | March 23rd, 2011 @ 03:31 PM | in 0.5

We need to make a simple player that starts a timer.

Comments and changes to this ticket

  • Rick

    Rick March 23rd, 2011 @ 04:04 PM

    Can you provide more details?

  • annasob

    annasob March 24th, 2011 @ 04:30 PM

    • Assigned user set to “Steven W”

    Assigning to Steven he will post more details soon

  • Steven W

    Steven W March 24th, 2011 @ 06:44 PM

    I think anna's looking for a basic player that mimics the HTMLMediaElement interface, and can execute some code (timeupdate event) at a regular interval. It'll have to be cleaned up and refactored a bit, but here's the idea:

    var undef;
    var msDelay = 250;
    var MediaElement = {
      load: function() {},
      play: function() {
        this.paused = 0;
        // So we can keep track of the instance
        timerTick.call( this );
      pause: function() {
        this.paused = 1;
      readyState: 0,
      currentTime: 0,
      duration: 0,
      paused: 1,
      ended: 0,
      volume: 1,
      muted: 0,
      playbackRate: 1,
      // These are considered to be "on" by being defined. Initialize to undefined
      autoplay: undef,
      loop: undef
    function timerTick() {
      // The player was paused since the last time update
      if ( this.paused ) {
      // So we can refer to the instance when setTimeout is run
      var self = this;
      // Run code here
      setTimeout( function() {
        timerTick.call( self );
      }, msDelay );
  • Rick

    Rick March 24th, 2011 @ 07:07 PM

    • State changed from “new” to “assigned”

    Without digging too deep, my first suggestion is to use a function constructor and it's prototype to create this, if you use an object literal, you won't be able to create more then one instance of the player at a time.

    I look forward to seeing what you come up with

  • Steven W

    Steven W March 27th, 2011 @ 02:26 PM

    • State changed from “assigned” to “peer-review-requested”

    I haven't been able to work on this for two days, but here's a pass at it. I've converted it to a function constructor and prototype, and made 'timerTick' a member function timeupdate.
    Examples of use can be seen in the unit tests.


  • Scott Downe

    Scott Downe March 29th, 2011 @ 10:42 AM

    • State changed from “peer-review-requested” to “review-needs-work”

    This should be in a folder with the other players, like players/baseplayer/

  • Steven W

    Steven W March 29th, 2011 @ 03:01 PM

    • State changed from “review-needs-work” to “peer-review-requested”

    Moved the code to players/baseplayer and added 2 more unit tests. Pinging this back to peer-review.


  • Steven W

    Steven W March 29th, 2011 @ 03:24 PM

    • State changed from “peer-review-requested” to “assigned”

    Putting this temporarily back from PR. Going to elaborate on one of the tests for clarity of overriding timeupdate

  • Steven W

    Steven W March 29th, 2011 @ 05:37 PM

    • State changed from “assigned” to “peer-review-requested”

    Test updated. Ready for PR. Same branch:

  • annasob

    annasob April 7th, 2011 @ 01:52 PM

    • State changed from “peer-review-requested” to “super-review-requested”
    • Assigned user changed from “Steven W” to “Scott Downe”

    This looks good!
    Unit tests and demo works in Chrome, FF 3.6 and 4.0 - VISTA.
    2 lint errors Steven please fix:

        Problem at line 4 character 4: Missing semicolon.
        Problem at line 25 character 4: Missing semicolon.
  • Steven W

    Steven W April 8th, 2011 @ 01:13 PM

    Linting issues fixed, branch updated :)

  • Scott Downe

    Scott Downe April 14th, 2011 @ 05:02 PM

    • State changed from “super-review-requested” to “review-looks-good”
    • Assigned user cleared.
    • Milestone order changed from “43” to “0”

    Yeah, this looks good, I have no concerns.

  • annasob

    annasob April 15th, 2011 @ 06:45 PM

    • State changed from “review-looks-good” to “staged”

    Staged in annasob/popcorn-js commit

Please Sign in or create a free account to add a new ticket.

With your very own profile, you can contribute to projects, track your activity, watch tickets, receive and update tickets through your email and much more.

New-ticket Create new ticket

Create your profile

Help contribute to this project by taking a few moments to create your personal profile. Create your profile »

Popcorn.js is an HTML5 video framework that lets you bring elements of the web into your videos.

Popcorn.js is a project of Web Made Movies, Mozilla's Open Video Lab.

Shared Ticket Bins

Referenced by