function DoAjax(url, callback)
	{
	 if (window.XMLHttpRequest) {
			req = new XMLHttpRequest();
			req.onreadystatechange = callback;
			req.open("GET", url, true);
			req.send(null);
		// branch for IE/Windows ActiveX version
		} else if (window.ActiveXObject) {
			req = new ActiveXObject("Microsoft.XMLHTTP");
			if (req) {
				req.onreadystatechange = callback;
			// document.getElementById('status').innerHTML = url
				req.open("GET", url, true);
				req.send();
			}
		}		
	}
	function IsAjaxResponseValid()
	{
		if (req.readyState != 4) return false;
		if (req.status != 200) return false;
    	if (req.responseText == "") return false;
	    return true;
	}
	
	function GetSegments()
	{
		if (document.getElementById('divSeg') == null)
		    document.getElementById('divInfo').innerHTML  += "<div id=divSeg></div>"
		var url = "api.aspx?cmd=GetSegments&arg1=" + gMediaID
		DoAjax(url, GetSegmentsCB)
	}
	
	
	var gSegCmd=""
	var gSegUrl=""
	
	function GetSegmentsCB()
	{
        if (!IsAjaxResponseValid()) return
		var strHTML = ""
		var segmentsArr = req.responseText.split("<br>");
		//alert(segmentsArr.length)
		if (segmentsArr.length == 1) return
		
		var playUrl = "", thumbUrl = "", title=""
		strHTML += "Segments<br><hr><table>"
		for (var i=0; i<segmentsArr.length-1; i++)
		{
		    var itemArr = segmentsArr[i].split("^")
		    if (itemArr.length == 0) continue
		    if (gSegCmd == "EDIT" && gSegUrl == itemArr[1])
		    {
	            strHTML += "<tr>"
	            strHTML += "<td><a href='" + itemArr[1] + "'><img id='imgSegThumb" + i.toString() + "' width=160 height=120 title='" + itemArr[0] + "' src='" + itemArr[2].replace("thumbs/","") + "' </a></td>"
		        strHTML += "<td><font size=2>Title:&nbsp;<b>" + "<input type=text id=txtSegTitle value='" + itemArr[0] + "'> </b><br>"
		        strHTML += "Play URL:&nbsp;<b>" + itemArr[1] + "</b><br>"
		        strHTML += "ThumbURL:&nbsp;<b>" + itemArr[2] + "</b><br>"
		        strHTML += "Clip Begin:&nbsp;<b>" + "<input type=text id=txtSegBegin value='" + itemArr[3] + "'> </b><br>"
		        strHTML += "Clip End:&nbsp;<b>" + "<input type=text id=txtSegEnd value='" + itemArr[4] + "'> </b><br>"
		        strHTML += "Artist/Presenter:&nbsp;<b>" + "<input type=text id=txtSegArtist value='" + itemArr[5] + "'> </b><br>"
		        strHTML += "Other Info:&nbsp;<b>" + "<input type=text id=txtSegInfo value='" + itemArr[6] + "'> </b><br></font></td></tr>"
		        strHTML += "<tr><td colspan=2><input type=button class=button id=btnSegApply value='Apply' onclick='EditSegmentSubmit()'>&nbsp;"
		        strHTML += "<input type=button class=button id=btnSegCancelEdit value='Cancel' onclick='CancelSeg()'>&nbsp;"
		        strHTML += "<tr><td colspan=3 width='100%'><hr></td></tr>"
		    }
		    else
		    {
		        var playUrl = itemArr[1] 
	            strHTML += "<tr>"
	            strHTML += "<td><a href='" + itemArr[1] + "'><img id='imgSegThumb" + i.toString() + "' width=160 height=120 title='" + itemArr[0] + "' src='img/loading.gif'></a>"
		        strHTML += "<img style='display:none' onerror='SegThumbError(this)' onload='loadSegThumb(this)' id='imgSegThumbPreload" + i.toString() + "' src='" + itemArr[2].replace("thumbs/","") + "?" + GetTimeID() +  "' </td>"
		        strHTML += "<td><font size=2>Title:&nbsp;<b>" + itemArr[0] + "</b><br>"
		        strHTML += "Play URL:&nbsp;<b>" + playUrl + "</b><br>"
		        strHTML += "ThumbURL:&nbsp;<b>" + itemArr[2] + "</b><br>"
		        strHTML += "Clip Begin:&nbsp;<b>" + itemArr[3] + "</b><br>"
		        strHTML += "Clip End:&nbsp;<b>" + itemArr[4] + "</b><br>"
		        strHTML += "Artist/Presenter:&nbsp;<b>" + itemArr[5] + "</b><br>"
		        strHTML += "Other Info:&nbsp;<b>" + itemArr[6] + "</b><br></font></td></tr>"
		        strHTML += "<tr><td colspan=2><input type=button class=button id=btnSegEdit value='Edit' onclick='EditSegment(\"" + playUrl + "\")' >&nbsp;"
		        strHTML += "<input type=button class=button id=btnSegDel value='Delete' onclick='DeleteSegment(\"" + playUrl + "\")' >&nbsp;"
		        strHTML += "<tr><td colspan=3 width='100%'><hr></td></tr>"
		    }
		}
		
		document.getElementById('divSeg').innerHTML  =  strHTML

		//alert(strHTML)
	}

	function SegThumbError(imgObj)
	{
	    var iFind = imgObj.src.indexOf("?")
	    var noCacheSrc = imgObj.src
	    if (iFind != -1)
	        noCacheSrc=imgObj.src.substr(imgObj.src.length,iFind)
		setTimeout(function(){ imgObj.src = noCacheSrc+"?"+GetTimeID();}, 2000)
	}
	function loadSegThumb(imgObj)
	{
	    document.getElementById(imgObj.id.replace("Preload","")).src = imgObj.src
	}

	function NewSegment()
	{
		var strHTML = "<b>Enter info for the new segment</b><br><table>"
	    strHTML += "<tr>"
	    strHTML += "<td align=right><font size=2>Title:&nbsp;<td>"
	    strHTML += "<td><input type=text maxlen=30 size=20 id='txtSegTitle'><td>"
	    strHTML += "</tr>"
	    strHTML += "<tr>"
	    strHTML += "<td align=right><font size=2>Begin Time:&nbsp;<td>"
	    strHTML += "<td><input type=text maxlen=30 size=20 id='txtSegBegin'><td>"
	    strHTML += "</tr>"
	    strHTML += "<tr>"
	    strHTML += "<td align=right><font size=2>End Time:&nbsp;<td>"
	    strHTML += "<td><input type=text maxlen=30 size=20 id='txtSegEnd'><td>"
	    strHTML += "</tr>"
	    strHTML += "<tr>"
	    strHTML += "<td align=right><font size=2>Artist/Presenter:&nbsp;<td>"
	    strHTML += "<td><input type=text maxlen=30 size=20 id='txtSegArtist'><td>"
	    strHTML += "</tr>"
	    strHTML += "<tr>"
	    strHTML += "<td align=right><font size=2>Other Info:&nbsp;<td>"
	    strHTML += "<td><input type=text maxlen=30 size=20 id='txtSegInfo'><td>"
	    strHTML += "</tr>"
	    strHTML += "<tr>"
	    strHTML += "<td align=right><font size=2>&nbsp;<td>"
	    strHTML += "<td><input type=button class=button value='Submit' onclick='NewSegmentSubmit()' id='btnSegSubmit'>"
	    strHTML += "&nbsp;<input type=button class=button value='Cancel' onclick='CancelSeg()' id='btnSegCancel'><td>"
	    strHTML += "</tr>"
		document.getElementById('divSeg').innerHTML  = "<br><br>" + strHTML + "</table>"
	}
	
	function NewSegmentSubmit()
	{
	    if (ValidateSegmentInput()==false)
	        return;
	    
		var url = "api.aspx?cmd=NewSeg&arg1=" + gMediaID
		url += "&arg2=" + document.getElementById('txtSegTitle').value;
		url += "&arg3=" + document.getElementById('txtSegBegin').value;
		url += "&arg4=" + document.getElementById('txtSegEnd').value;
		url += "&arg5=" + document.getElementById('txtSegArtist').value;
		url += "&arg6=" + document.getElementById('txtSegInfo').value;
		DoAjax(url, SegmentActionCB)
	}
	function SegmentActionCB()
	{
    	if (!IsAjaxResponseValid()) return
    	if (req.responseText.indexOf("Successful!") == -1)
    	    alert(req.responseText)
    	GetSegments()
	}
	
	
	function ValidateSegmentInput()
	{
	    
	}
	
	function EditSegment(playUrl)
	{
	    gSegCmd = 'EDIT'
	    gSegUrl = playUrl
	    GetSegments()
	}
	
	function EditSegmentSubmit()
	{
	    if (ValidateSegmentInput()==false)
	        return;
	    
		var url = "api.aspx?cmd=EditSeg&arg1=" + gMediaID
		url += "&arg2=" + document.getElementById('txtSegTitle').value;
		url += "&arg3=" + document.getElementById('txtSegBegin').value;
		url += "&arg4=" + document.getElementById('txtSegEnd').value;
		url += "&arg5=" + document.getElementById('txtSegArtist').value;
		url += "&arg6=" + document.getElementById('txtSegInfo').value;
		url += "&arg7=" + gSegUrl
	    gSegCmd= ''
	    gSegUrl = ''
		DoAjax(url, SegmentActionCB)
	}
	function CancelSeg()
	{
		document.getElementById('divSeg').innerHTML  = ""
	    gSegCmd= ''
	    gSegUrl = ''
	    GetSegments()
	}
	
	function DeleteSegment(playUrl)
	{
	    if (!confirm("Are you sure?")) return
		var url = "api.aspx?cmd=DelSeg&arg1=" + gMediaID
		url += "&arg2=" + playUrl
	    gSegCmd= ''
	    gSegUrl = ''
		DoAjax(url, SegmentActionCB)
    }