﻿///

var searchResults = new Array();

function buildSearchResultsList() 
{
            var tab = document.getElementById(ListTab);
            tab.innerText = "";
            if(searchResults.length == 0)
            {
                tab.innerText = "No Result!";
                return;
            }
            var playlist= document.createElement("table");
            var row = playlist.insertRow();
    for (var i=0; i<searchResults.length; i++) 
    {
        var resultType = searchResults[i].resultType;
        if(resultType == "comment")
        {
            var item = new SearchItem(searchResults[i]);
            var cell = row.insertCell();
            cell.appendChild(item.Create());          
        }
        else if(resultType == "video")
        {
            var item = new PlaylistItem(searchResults[i]);
            var cell = row.insertCell();
            cell.appendChild(item.Create());
        }
        else
        {
            var cell = row.insertCell();
            cell.innerText = "No Data!";
        }
    }    
    tab.appendChild(playlist);
}

function removeAllFrames() 
{
    document.getElementById("SearchList").innerHTML = "";
}

function showCommentPreview(txt) 
{
    var commentPreviewObj = document.getElementById("commentPreview");
    commentPreviewObj.innerText = txt;
    commentPreviewObj.style.display = '';
    commentPreviewObj.style.left = event.clientX + document.body.scrollLeft + 1;
    commentPreviewObj.style.top = event.clientY + document.body.scrollTop + 1;
}

function addFrameOnImage(i) 
{
    var width = i.width;
    var height = i.height;
    var myFrame = createNewFrame("brown");
    var frameWidth = (width * i.obj.x2 - width * i.obj.x1) - 2;
    frameWidth = frameWidth > 1 ? frameWidth : 1;
    myFrame.width = Math.round(frameWidth);
    var frameHeight = (height * i.obj.y2 - height * i.obj.y1) - 2;
    frameHeight = frameHeight > 1 ? frameHeight : 1;
    myFrame.height = Math.round(frameHeight);
    myFrame.style.posLeft = Math.round(i.offsetLeft + width * i.obj.x1);
    myFrame.style.posTop = Math.round(i.offsetTop + height * i.obj.y1);            
    
    myFrame.onmousemove = new Function("loadCommentPreviewImage('" + i.obj.previewURL + "');showCommentPreview();");
    myFrame.onmouseout = new Function("document.getElementById('commentPreview').style.display='none';");
    myFrame.onclick = new Function("loadVideoAndPause(" + i.obj.videoID + "," + (parseFloat(i.obj.startTime) + parseFloat(0.02)) + ")");
}

function processSearchResults(xmldoc) 
{
    if(xmldoc.childNodes.length == 0)
    {
        alert("no data");
    }
    else
    {
        removeAllFrames();
        searchResults = new Array();
        var type = "Video";
        var results = xmldoc.getElementsByTagName('Video');
       
        if(xmldoc.getElementsByTagName("Comments").length != 0)
        {
            type = "Comment";
        }
        for (i = 0; results != null && i < results.length; i++) 
        {
            switch (type) 
            {
                case "Comment":
                    //get video:
                    var Vobj = 
                    {
	                    VideoID     : parseFloat( results[i].getAttribute("VideoID") ),
	                    Title       : results[i].getAttribute("Title"),
	                    AddUserID   : results[i].getAttribute("AddUserPassportName"),
	                    VideoUrl    : results[i].getAttribute("VideoUrl"),
	                    VisitCounts : results[i].getAttribute("VisitCounts"),
	                    SoapBoxID   : results[i].getAttribute("SoapBoxID"),
	                    ThumbnailUrl: results[i].getAttribute("ThumbnailUrl")
                    };
                    //get comments for video:
                    var CommentsArray = new Array();
                    var comments = results[i].getElementsByTagName("Comment");
                    for(var ci = 0;  ci < comments.length; ci++ )
                    {
                        var Cobj = 
                        {
	                        commentID      : parseFloat(comments[ci].getAttribute("CommentID")),
	                        videoID        : parseFloat(comments[ci].getAttribute("VideoID")),
	                        timeStamp      : comments[ci].getAttribute("TimeStamp") ,
	                        startTime      : parseFloat( comments[ci].getAttribute("StartTime") ),
	                        left           : parseFloat( comments[ci].getAttribute("Left") ),
	                        top            : parseFloat( comments[ci].getAttribute("Top") ),
	                        right          : parseFloat( comments[ci].getAttribute("Right") ),
	                        bottom         : parseFloat( comments[ci].getAttribute("Bottom") ),
	                        username       : comments[ci].getAttribute("WirtePassportName") ,
	                        content        : comments[ci].getAttribute("Content")		       
                        };
                        CommentsArray[ci]=Cobj;
                    }
                    var obj =
                    {
                        Video : Vobj,
                        Comments : CommentsArray,
                        resultType : "comment"
                    };
                    obj.previewURL = "GetVideoImage.aspx?videoID=" + obj.Video.videoID ;
                    searchResults[searchResults.length] = obj;	    
                    break;
               case "Video":
                    var obj = 
                    {
	                    VideoID     : parseFloat( results[i].getAttribute("VideoID") ),
	                    Title       : results[i].getAttribute("Title"),
	                    AddUserID   : results[i].getAttribute("AddUserPassportName"),
	                    VideoUrl    : results[i].getAttribute("VideoUrl"),
	                    VisitCounts : results[i].getAttribute("VisitCounts"),
	                    SoapBoxID   : results[i].getAttribute("SoapBoxID"),
	                    ThumbnailUrl: results[i].getAttribute("ThumbnailUrl"),
	                    resultType  : "video"			       
                    };
                    searchResults[searchResults.length] = obj;	  
                    break;  		        	   
            }
        }
        buildSearchResultsList();
    }
}

///search item
function SearchItem(result)
{
    this.comments = result.Comments;
    ///this.img = result.previewURL;
    this.Video = result.Video;
}

SP = SearchItem.prototype;

SP.Create = function()
{
    var DIV = document.createElement("div");
    var frame = document.createElement("table");
    var row = frame.insertRow();
    var cell = row.insertCell();
    cell.style.textAlign = "center";
    frame.style.width = "100%";
    
    var img = document.createElement("img");
    img.src = this.Video.ThumbnailUrl;
    img.width = "46";
    img.height = "38";
    cell.appendChild(img);
    
    row = frame.insertRow();
    var cell2 = row.insertCell();
    var InfContainer = document.createElement("div");
    var txt = this.Video.Title + "<br\>";
    InfContainer.innerHTML = txt;
    for( var i = 0 ;i < this.comments.length ; i ++)
    {
        var comment  = this.CreateComment(this.comments[i]);
        InfContainer.appendChild(comment);
    }
    InfContainer.style.height = "50";
    InfContainer.style.overflow = "auto";
    cell2.appendChild(InfContainer);
    DIV.style.border = "solid 1px black";
    DIV.style.width = "88px";
    DIV.style.height = "98px";
    cell2.style.fontSize = "8pt";
    DIV.appendChild(frame);
    this.AttachEvents(DIV);
    return DIV;
}

SP.CreateComment = function(comment)
{
    var commentA = document.createElement("a");
    var content = comment.startTime +"sec  "+ comment.content;
    if(content.length < 23 )
    {
        commentA.innerHTML = content + "<br\>";
    }
    else
    {
        commentA.innerHTML = content.substring(0,20) + "..."+ "<br\>";
    }
    commentA.herf = "#";
    commentA.style.fontSize = "8pt";
    commentA.style.textDecorationUnderline = "true";
    commentA.style.cursor = "pointer";
    commentA.onmouseover = function()
        {
            commentA.style.fontStyle = "italic";
        }
    commentA.onmouseout = function()
        {
            commentA.style.fontStyle = "";
        }
    return commentA;
}

SP.AddFrame = function(image)
{
}

SP.AttachEvents = function(obj)
{
    obj.onclick = new Function("loadVideoAndPlay(\""+ this.Video.VideoUrl +"\",\""+this.Video.VideoID+"\");");
}

function PlaylistItem(result)
{
    this.videoID = result.VideoID;
    this.title = result.Title;
    this.videoURL = result.VideoUrl;
    this.addUserID = result.AddUserID;
    this.visitCounts = result.VisitCounts;
    this.ThumbnailUrl = result.ThumbnailUrl;
}

PP = PlaylistItem.prototype;

PP.Create = function()
{
    var DIV = document.createElement("div");
    var frame = document.createElement("table");
    var row = frame.insertRow();
    var cell = row.insertCell();
    cell.style.textAlign = "center";
    
    var img = document.createElement("img");
    img.src = this.ThumbnailUrl;
    img.width = "46";
    img.height = "38";
    
    cell.appendChild(img);
    row = frame.insertRow();
    var cell2 = row.insertCell();
    var txt = this.title +"<br/>"+this.addUserID + "<br/>" + this.visitCounts + " visits.";
    cell2.innerHTML = txt;
    cell2.style.fontSize = "8pt";
    //frame.width = "100%";
    DIV.appendChild(frame);
    DIV.style.border = "solid 1px black";
    DIV.style.width = "auto";
    DIV.style.overflow = "hidden";
    this.AttachEvents(DIV);
    return DIV;
}

PP.AttachEvents = function(obj)
{
    obj.onclick = new Function("loadVideoAndPlay(\""+ this.videoURL +"\",\""+this.videoID+"\");");
}
