1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

JW Player Popout

Discussion in 'Styling and Customization Questions' started by masterchief, Jun 25, 2011.

  1. masterchief

    masterchief Well-Known Member

    I am currently utlizing JW Player in a popout avaialble from forum sidebar.

    Code:
    
    <div class="baseHtml messageText">
    
    <script type="text/javascript" src="/jwplayer/swfobject.js"></script>
    <script type="text/javascript">
    
    var currentFile = "";
    var currentItem = 0;
    var previousItem = -1;
    
    var player = null;
    function playerReady(thePlayer) {
        player = window.document[thePlayer.id];
        addListeners();
    }
     
    function addListeners() {
        if (player) {
            player.addControllerListener("ITEM", "itemListener");
        } else {
            setTimeout("addListeners()",100);
        }
    }
     
    function itemListener(obj) {
        if (obj.index != currentItem) {
            previousItem = currentItem;
            currentItem = obj.index;
        }
    }
     
    function deletePlayer(theWrapper, thePlaceholder, thePlayerId) {
            swfobject.removeSWF(thePlayerId);
            var tmp=document.getElementById(theWrapper);
            if (tmp) { tmp.innerHTML = "<div id=" + thePlaceholder + "></div>"; }
            player = null;
    }
     
    function createPlayer(theFile) {
        var flashvars = {
            file:theFile,
            autostart:"true",
            playlistsize:"100",
            playlist:"bottom"
        }
        var params = {
            wmode:"opaque",
            allowfullscreen:"true",
            allowscriptaccess:"always"
    
        }
        var attributes = {
            id:"player1",
            name:"player1"
        }
        swfobject.embedSWF("/jwplayer/player.swf", "placeholder1", "240", "24", "9.0.115", false, flashvars, params, attributes);
    }
     
    var popWin = null;
    function createWindow(theUrl) {
        if (player) {
            player.sendEvent("STOP");
            deletePlayer('wrapper', 'placeholder1', 'player1');
        }
    
        document.getElementById("buttonId1").style.visibility = "hidden";
        document.getElementById("buttonId2").style.visibility = "visible";
        document.getElementById("buttonId3").style.visibility = "visible";
    
        popWin = window.open(theUrl, "smallWin", "width=240,height=24,left=100,top=200,resizable=yes");
        popWin.focus();
    }
     
    function popWinPlay() {
        if ((popWin)&&(! popWin.closed)) { popWin.player.sendEvent('PLAY') }
        else { createWindow('jw_satellitewin.html?'+currentItem); }
    }
     
    function initPlayer() {
        document.getElementById("buttonId1").style.visibility = "visible";
        document.getElementById("buttonId2").style.visibility = "hidden";
        document.getElementById("buttonId3").style.visibility = "hidden";
    
        createPlayer('playlist_mixmedia.xml');
    }
    </script>
    <head>
    <body onload="initPlayer()" bgcolor="#CCCCCC">
    
    <div id="wrapper">
        <div id="placeholder1"></div>
    </div>
    <br>
    
    <input type="button" id="buttonId1" value="JW Player Popout" onClick="createWindow('jw_satellitewin.html?'+currentItem)"><br>
    <input type="button" id="buttonId2" value="Pauses player" onClick="popWin.close(); initPlayer()">
    <input type="button" id="buttonId3" value="Show Player" onClick="popWinPlay()">
    
    </div>
    
    
    This code looks for a 'jw_satellitewin.html' file located in the root.

    Code:
    
    <html>
    <head>
    <title>JW Player Popout</title>
    
    <script type='text/javascript' src='/jwplayer/jwplayer.js'></script>
    
    <div id='mediaspace'></div>
    
    <script type='text/javascript'>
      jwplayer('mediaspace').setup({
        'flashplayer': '/jwplayer/player.swf',
        'playlistfile': '/audio/myaudio.xml',
        'playlist': 'none',
        'autostart': 'true',
        'controlbar': 'bottom',
        'width': '240',
        'height': '24'
      });
    </script>
    </div>
    
    </body>
    </html>
    
    
    I need some help cleaning this up and making it more efficient. It does not work well as XenPorta addon module, but has much promise. Please lend a helping hand. peace.
     

Share This Page