var selectedVideoId = '';

function getSelectedVideoId() {
    var videoId = querystring(window.location.toString(), 'vidId');
    if (videoId == 'null') videoId = '';
    return videoId;
}

function getLineupId() {
    var lineupId = querystring(window.location.toString(), 'refId');
    if (lineupId == 'null') lineupId = playerLineup;
    //return lineupId;
	return playerLineup;
}

function selectPlaylistItem(displayname, item, dontplay) 
{
    selectedVideoId = item;

    if (!dontplay)
        playVideo(item);

	cto.trackLink("video_"+displayname);

    var itemRollover = document.getElementById('rollover' + item);

    if (itemRollover != null) 
    {
        itemRollover.style.backgroundRepeat = "no-repeat";
        setDivBackgroundImage(itemRollover, 'images/arrow_outline.png')
    }
    
    document.getElementById('preview'+item).style.display="none";
    document.getElementById('thumb'+item).style.display="none";
    document.getElementById('yaw'+item).style.display="block";
    
    var divs = document.getElementsByTagName('div');

    for (var i=0; i < divs.length; i++) 
    {
        if (divs[i].id.indexOf('rollover') == 0) 
        {
            if (divs[i].id != 'rollover' + item)
                divs[i].style.backgroundImage = "";
        }
        
        if (divs[i].id.indexOf('preview') == 0) 
        {
            if (divs[i].id != 'preview' + item)
                divs[i].style.display = "none";
        }
        
        if (divs[i].id.indexOf('yaw') == 0) 
        {
            if (divs[i].id != 'yaw' + item)
                divs[i].style.display = "none";
        }
        
        if (divs[i].id.indexOf('thumb') == 0) 
        {
             if (divs[i].id != 'thumb' + item)
                divs[i].style.display = "block";
        }
    }
	document.getElementById('videoPlayer').focus();
}

function playlistItemRollover(videoId, action) 
{    
    if ((videoId != null) && (videoId != selectedVideoId))
    {
        var rolloverDiv = document.getElementById('rollover' + videoId);
        var previewDiv = document.getElementById('preview' + videoId);
        var thumbDiv = document.getElementById('thumb' + videoId);

        if (action == 'mouseover') 
        {
            if (rolloverDiv != null)
            {
                setDivBackgroundImage(rolloverDiv, 'images/outline.png')
            }
            
            if (previewDiv != null)
                previewDiv.style.display = "block";

            if (thumbDiv != null)
                thumbDiv.style.display = "none";
        } 
        else
        {
            if (rolloverDiv != null)
            {
                setDivBackgroundImage(rolloverDiv, 'images/submeenu_bg.png')
            }

            if (previewDiv != null)
            {
                previewDiv.style.display = "none";
            }

            if (thumbDiv != null)
            {
                thumbDiv.style.display = "block";
            }
        }
    }
}

function playVideo(titleId) {
    thisMovie('videoPlayer').loadTitle(titleId);
}

function thisMovie(movieName) {
    if (navigator.appName.indexOf("Microsoft") != -1) {
        return window[movieName]
    } else {
        return document[movieName]
    }
}

function isIe() 
{
    if (navigator.appName.indexOf("Microsoft") != -1) 
    {
        return true;
    } 
    else 
    {
        return false;
    }
}

function isIe6()
{
    if (isIe())
    {
        var version = parseFloat(navigator.appVersion.split("MSIE")[1]);

        if (version == "6")
        {
            return true;
        }
        else
        {
            return false;
        }
    }
    else
    {
        return false;
    }
}

function isIe7()
{
    if (isIe())
    {
        var version = parseFloat(navigator.appVersion.split("MSIE")[1]);

        if (version == "7")
        {
            return true;
        }
        else
        {
            return false;
        }
    }
    else
    {
        return false;
    }
}

function loadPlaylist(videos) {
    if (thisMovie('videoPlayer') != null && videos != null) 
    {
        buildPlaylistItem(videos);
    }
}

function buildPlaylistItemIE(videos) 
{
    for (var i=0; i<videos.length; i++) 
    {
        var playlist = document.getElementById('playlistHome');

        if (playlist != null) 
        {
            var newDiv = document.createElement("div");
            newDiv.setAttribute('id', 'item' + videos[i].id);

            switch (videos[i].tags[0]) 
            {
                case 'NOWPPV':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_nowppv.jpg')";
                    break;
                case 'NOWVOD':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_nowvod.jpg')";
                    break;
                case 'NOWVODPPV':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_nowvodppv.jpg')";
                    break;
                case 'COMINGPPV':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_comingppv.jpg')";
                    break;
                case 'COMINGVOD':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_comingvod.jpg')";
                    break;
                case 'COMINGVODPPV':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_comingvodppv.jpg')";
                    break;
                case 'TUTORIALPPV':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_tutorialppv.jpg')";
                    break;
                case 'TUTORIALVOD':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_tutorialvod.jpg')";
                    break;
            }
            
            newDiv.style.backgroundRepeat = "no-repeat";
            newDiv.style.padding = "1px 0 1px 0";
            newDiv.style.width = "459px";
            newDiv.style.height = "78px";

            var rollover = document.createElement("div");
            rollover.setAttribute('id', 'rollover' + videos[i].id);
            hEvt(rollover, 'onMouseOver', 'playlistItemRollover(' + videos[i].id + ', \'mouseover\')');
            hEvt(rollover, 'onMouseOut', 'playlistItemRollover(' + videos[i].id + ' , \'mouseout\')');
            rollover.style.width = "459px";
            rollover.style.height = "78px";

            newDiv.appendChild(rollover);

            var thumb = document.createElement("div");
            thumb.setAttribute('id', 'thumb' + videos[i].id);
            thumb.style.cursor = "pointer";
            thumb.style.width = "76px";
            thumb.style.height = "56px";
            //thumb.style.backgroundImage = "url('" + videos[i].thumbnailURL + "')";
            thumb.style.margin = "9px 0 0 24px";
			var thePic = document.createElement("IMG");
			thePic.setAttribute("src",videos[i].thumbnailURL);
			thePic.setAttribute("alt",proseName);
			thePic.setAttribute("width","76");
			thePic.setAttribute("height","56");
			thumb.appendChild(thePic);
			var proseName = videos[i].displayName.replace(/\'/, "\\\'");
            hEvt(thumb, 'onClick', 'selectPlaylistItem(\''+proseName+'\',' + videos[i].id + ' )');

            rollover.appendChild(thumb);

            var preview = document.createElement("div");
            preview.setAttribute('id', 'preview' + videos[i].id);
            preview.style.width = "76px";
            preview.style.height = "56px";
            preview.style.display = "none";
            preview.style.backgroundImage = "url('images/preview.png')";
            preview.style.margin = "9px 0 0 24px";
            hEvt(preview, 'onClick', 'selectPlaylistItem(\''+proseName+'\',' + videos[i].id + ' )');

            rollover.appendChild(preview);

            var yaw = document.createElement("div");
            yaw.setAttribute('id', 'yaw' + videos[i].id);
            yaw.style.width = "76px";
            yaw.style.height = "56px";
            yaw.style.margin = "9px 0 0 24px";
            yaw.style.display = "none";
            yaw.style.backgroundImage = "url('images/youarewatching.png')";
            yaw.style.margin = "9px 0 0 24px";

            rollover.appendChild(yaw);

            var title = document.createElement("div");
            title.setAttribute('id', 'title' + videos[i].id);
            title.className = "playlistTitle";
            title.style.margin = "-60px 0 0 115px";
            title.style.width = "284px";
            title.appendChild(document.createTextNode(truncate(videos[i].displayName, 30)));

            rollover.appendChild(title);

            var description = document.createElement("div");
            description.className = "playlistDesc";
            description.style.margin = "5px 0 0 115px";
            description.style.height = "25px";
            description.style.width = "274px";
            description.appendChild(document.createTextNode(truncate(videos[i].shortDescription, 100)));

            rollover.appendChild(description);

            var moreDetails = document.createElement('a');
            moreDetails.className = "playlistMoreLink";
            moreDetails.setAttribute('href', videos[i].linkURL+'?refId=' + playerLineup + '&vidId='+ videos[i].id +'&title=' + escape(videos[i].displayName));
            moreDetails.appendChild(document.createTextNode('More about ' + truncate(videos[i].linkText, 28) + ' >> '));
            moreDetails.style.margin = "5px 0 0 115px";
            moreDetails.backgroundColor = "#000000";

            rollover.appendChild(moreDetails);

            playlist.appendChild(newDiv);
        }
    }
        
    if (videos.length > 0) {
        selectPlaylistItem(videos[0].displayName, videos[0].id, true);
    }
}

function buildPlaylistItem(videos) 
{
    if (isIe7())
    {
        buildPlaylistItemIE(videos);
        return;
    }    
    else if (isIe6())
    {
        buildPlaylistItemIE(videos);
        return;
    }


    for (var i=0; i<videos.length; i++) 
    {
		var theName = videos[i].displayName.replace(/\'/, "\\\'");
        var itemHTML = '';
        itemHTML += '<div id="rollover' + videos[i].id + '" onmouseover="playlistItemRollover(' + videos[i].id + ', \'mouseover\')" onmouseout="playlistItemRollover(' + videos[i].id + ', \'mouseout\')" style="position:relative;">\n';
        //itemHTML += '    <div id="thumb' + videos[i].id + '" style="margin:9px 0 0 24px;float:left;width:76px;height:56px;cursor:pointer;background-image:url(\'' + videos[i].thumbnailURL + '\')" onclick="javascript:selectPlaylistItem(' + videos[i].id + ');" ></div>\n';
		itemHTML += '    <div id="thumb' + videos[i].id + '" style="margin:9px 0 0 24px;float:left;width:76px;height:56px;cursor:pointer;" onclick="javascript:selectPlaylistItem(\''+theName+'\','+ videos[i].id +');" ><img src="'+ videos[i].thumbnailURL +'" style="width:76px;height:56px;" alt="'+theName+'"></div>\n';
        itemHTML += '    <div id="preview' + videos[i].id + '" style="position:absolute;left:24px;top:9px;width:76px;height:56px;cursor:pointer;background-image:url(\'images/preview.png\');display:none;" onclick="javascript:selectPlaylistItem(\''+theName+'\','+ videos[i].id +');"></div>\n';
        itemHTML += '    <div id="yaw' + videos[i].id + '" style="position:absolute;left:24px;top:9px;width:76px;height:56px;cursor:pointer;background-image:url(\'images/youarewatching.png\');display:none;"></div>\n';
        itemHTML += '    <div style="margin:0 60px 0 0;height:78px;overflow:hidden;float:right;">\n';
        itemHTML += '        <div id="item' + videos[i].id + 'Title" class="playlistTitle" style="margin:7px 0 0 11px;width:284px;overflow:hidden">' + truncate(videos[i].displayName, 30) + '</div>\n';
        itemHTML += '        <div style="float:left;margin:3px 0 0 13px;width:260px">\n';
        itemHTML += '            <div class="playlistDesc" style="height:25px">' + truncate(videos[i].shortDescription, 100) + '</div>\n';
        itemHTML += '            <div class="playlistMoreLink" style="margin-top:3px">\n';
        if (videos[i].tags[0].indexOf('TUTORIAL') < 0)
            itemHTML += '            <a href="'+videos[i].linkURL+'?refId=' + playerLineup + '&vidId='+ videos[i].id +'&title=' + escape(videos[i].displayName) + '">More about ' + truncate(videos[i].linkText, 28) + ' >></a>\n';
        itemHTML += '            &nbsp;</div>\n';
        itemHTML += '        </div>\n';
        itemHTML += '        <div class="clearboth"></div>\n';
        itemHTML += '        <div style="margin-top:-20px;left:8px;width:75px;height:23px;cursor:pointer" onclick="javascript:selectPlaylistItem(\''+theName+'\','+ videos[i].id +');"></div>\n';
        itemHTML += '    </div>\n';
        itemHTML += '    <div class="clearboth"></div>\n';
        itemHTML += '</div>\n';

        var playlist = document.getElementById('playlistHome');
        if (playlist != null) {
            var newDiv = document.createElement("div");
            newDiv.setAttribute('id', 'item' + videos[i].id);
            switch (videos[i].tags[0]) {
                case 'NOWPPV':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_nowppv.jpg')";
                    break;
                case 'NOWVOD':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_nowvod.jpg')";
                    break;
                case 'NOWVODPPV':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_nowvodppv.jpg')";
                    break;
                case 'COMINGPPV':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_comingppv.jpg')";
                    break;
                case 'COMINGVOD':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_comingvod.jpg')";
                    break;
                case 'COMINGVODPPV':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_comingvodppv.jpg')";
                    break;
                case 'TUTORIALPPV':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_tutorialppv.jpg')";
                    break;
                case 'TUTORIALVOD':
                    newDiv.style.backgroundImage = "url('images/playlist_bg_tutorialvod.jpg')";
                    break;
            }
            newDiv.style.backgroundRepeat = "no-repeat";
            newDiv.style.padding = "1px 0 1px 0";
            newDiv.style.width = "459px";
            newDiv.style.height = "78px";
            newDiv.style.backgroundPosition = "center center";
            newDiv.innerHTML = itemHTML;
            playlist.appendChild(newDiv);
        }
    }
        
    if (videos.length > 0) {
        selectPlaylistItem(videos[0].displayName, videos[0].id, true);
    }
}

function truncate(text, len) {
    if (text.length > len) {
        text = text.substring(0, len);
        text += '...';
    }
    return text;
}

function two(x) {
    return ((x>9)?"":"0")+x;
}

function formatDuration(milliseconds) {
    var t = '';
    var sec = Math.floor(milliseconds/1000);
    var min = Math.floor(sec/60);
    sec = sec % 60;
    t = two(sec);

    var hr = Math.floor(min/60);
    min = min % 60;
    t = two(min) + ":" + t;

    return t;
}

//hook event to a function call
function hEvt(obj,evtName,fnCall)
{
  evtName=evtName.toLowerCase();
  doCapture=false;
  
  if (obj.addEventListener)
  {
      obj.addEventListener(evtName.replace('on',''), function(){eval(fnCall);}, false);
  }
  else if(obj.attachEvent)
  {
    obj.attachEvent(evtName,function(){eval(fnCall);});
    //also do detachEvent later
  }
  else
  {
     eval(obj+"."+evtName +"="+ fnCall);
  }
}

//unhook /detach event that was earlier hooked..to avoid double-calls
function uhEvt(obj,evtName,fnCall)
{
  evtName=evtName.toLowerCase();
  doCapture=false;

  if (obj.addEventListener)
  {
      obj.removeEventListener(evtName.replace('on',''),
    function(){eval(fnCall);},doCapture);
  }
  else if(obj.attachEvent)
  {
   obj.detachEvent(evtName,function(){eval(fnCall);});
  }
  else
  {
     eval(obj+"."+evtName +"='';");
  }
}

function setDivBackgroundImage(divName, sImage)
{
    if (pngAlpha)
    {            
        divName.src = sImage;
        divName.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'" + sImage + "\', sizingMethod='image')";
    }
    else
    {
        divName.style.backgroundImage = "url('" + sImage + "')";
    }
}