Order Now AdSolution Sign Up | Login » Bits on the Run Sign Up | Login »

Forums

JW Player
/
JavaScript Interaction

JW BOX - close when player state COMPLETED

6 replies [Last post]
Posted: Wed, 2009-11-18 12:02 Jimb
Anonymous's picture

@hobbs

I'm tinkering with the jw box and would like to force it to close automatically. I've tried this unsuccessfully.

<strong><script type="text/javascript">
      function playerReady(obj)
      {
        player = gid(obj.id);
        player.addModelListener('STATE', 'stateMonitor');
      };

      function stateMonitor(obj)
      {
        if(obj.newstate == 'COMPLETED')
        {
          $.jwbox.player.sendEvent("STOP");
          $.jwbox.player = null;
        }
      };

      function gid(name)
      {
        return document.getElementById(name);
      };
</script></strong>

Obviously I'm off the mark with my approach. Can you suggest anything that will get me on the right track?

Jimb

Posted: Wed, 2009-11-18 13:37 Jimb  
Jimb's picture

Ahhhh I got it now.

Jimb

Posted: Wed, 2009-11-18 14:59 hobbs  
hobbs's picture

 
Here's my Quick & Dirty.

    <script type="text/javascript">
      var player    =  null;
      var playlist  =  null;

      function playerReady(obj)
      {
        player = gid(obj.id);
        addListeners();
alert('Hi, I\'m ' + player.id);
      };

      function addListeners()
      {
        playlist = player.getPlaylist();

        if(playlist.length > 0)
        {
          player.addModelListener('STATE', 'stateMonitor');
        }
        else
        {
          setTimeout("addListeners();", 100);
        }
      };

      function stateMonitor(obj)
      {
alert('State: ' + obj.newstate);
        if(obj.newstate == 'COMPLETED')
        {
          player.sendEvent('STOP');
alert('Player: ' + player.id + ' stopped!');
          $.jwbox.toggle(true);
          player = null;
        }
      };

      function gid(name)
      {
        return document.getElementById(name);
      };
    </script>

Posted: Wed, 2009-11-18 15:37 Jimb  
Jimb's picture

Hi hobbs and thanks. Here's what I got to do the trick.

<strong>
<script type="text/javascript">
      function playerReady(obj)
      {
        player = gid(obj.id);
        player.addModelListener('STATE', 'stateMonitor');
      };

      function stateMonitor(obj)
      {
        if(obj.newstate == 'COMPLETED')
        {
$.jwbox.lightbox.css("display","none");
$.jwbox.lightbox = null;
$("#jwbox_background").fadeOut("fast");
        }
      };

      function gid(name)
      {
        return document.getElementById(name);
      };
</script>
</strong>

I'll take the time later ro see yours at work as well. One nice thing I noticed is that if the user is in the fullscreen mode they get dropped out of that when the jw box closes.

Regards - Jimb

Posted: Wed, 2009-11-18 15:50 hobbs  
hobbs's picture

 
When I have the time...

I want to integrate the basic API with the JW Box script, then when you want to do something like this, it's just a couple more lines of code since the player reference object is already available, etc.

Posted: Mon, 2010-11-01 19:07 ez  
ez's picture

how could we use this script? where to paste it?

Posted: Mon, 2010-11-08 11:16 Zach  
Zach's picture

You should be able to paste the script into the <head> of your page.

  • Locked