function initXMLHttpClient() {
      var xmlhttp;
      try {
          // Mozilla / Safari / IE7
          xmlhttp = new XMLHttpRequest();
      } catch (e) {
           // IE
           var XMLHTTP_IDS = new Array('MSXML2.XMLHTTP.5.0',
                                     'MSXML2.XMLHTTP.4.0',
                                     'MSXML2.XMLHTTP.3.0',
                                     'MSXML2.XMLHTTP',
                                     'Microsoft.XMLHTTP' );
          var success = false;
          for (var i=0;i < XMLHTTP_IDS.length && !success; i++) {
              try {
                   xmlhttp = new ActiveXObject(XMLHTTP_IDS[i]);
                      success = true;
                } catch (e) {}
          }
          if (!success) {
              throw new Error('Unable to create XMLHttpRequest.');
          }
     }
     return xmlhttp;
}

function loadAjaxContent(divId, html, isAppend) { 
  var temp = html;
  while(true) {
    var sindex = temp.indexOf("<script"+">");
    if(sindex < 0) break;
    var eindex = temp.indexOf("</"+"script>",sindex);
    var js = temp.substring(sindex+8,eindex);           
    eval(js);
    temp = temp.substring(eindex+9);
  }     
  if (isAppend == true) document.getElementById(divId).innerHTML+=html;
  else document.getElementById(divId).innerHTML = html;
}

function ajaxHeader (url, targetDiv, isAppend, animatorDiv, useHash) {
	
	ajaxAnimStart(targetDiv, animatorDiv);
	
	if (targetDiv === undefined) targetDiv = "isi";
	if (isAppend === undefined) isAppend = false;
	if (animatorDiv === undefined) animatorDiv = "ajax_load_anim";
	if (useHash === undefined) useHash = true;

	var isi = document.getElementById(targetDiv);
	var xhr = initXMLHttpClient();

	var url2 = (url.indexOf('?') != -1) ? (url + '&') : (url + '?');
	
//	if (isAppend == false) { set_hash(url.substring(url.lastIndexOf('/')+1)); };
	xhr.onreadystatechange = function () {
	if (xhr.readyState == 4) {
	    if (xhr.status == 200) { 
		if (isAppend == true) {
		    loadAjaxContent(targetDiv, xhr.responseText, isAppend);
		} else {
		    loadAjaxContent(targetDiv, xhr.responseText, isAppend);
		}
		if (useHash == true) set_hash(url.substring(url.lastIndexOf('/')+1, url.length));
		ajaxAnimEnd(targetDiv, animatorDiv);

	    } else {
		ajaxAnimEnd(targetDiv, animatorDiv);

		if (isAppend == true) {
		    isi.innerHTML += '<br /><div class="fberrorbox">Terjadi kesalahan: <strong>' + xhr.statusText + '</strong></div>';
		} else {
		    isi.innerHTML = '<br /><div class="fberrorbox">Terjadi kesalahan: <strong>' + xhr.statusText + '</strong></div>';
		}
	    }
	}
	}
	xhr.open('GET', url2 + 'req=xhr' , true);
	xhr.send(null);

}

function ajaxFormSubmit(theForm, theTarget, animator, messager) {

    ajaxAnimStart("profile_content", animator);

    var inputs = theForm.getElementsByTagName("input");
    var i;
    var sentData = "";
    var xhr = initXMLHttpClient();
    var msgbox = document.getElementById(messager);

    for (i=0; i<inputs.length; i++) {
	sentData += encodeURI(inputs[i].name + '=' + inputs[i].value + '&');
    }

    xhr.onreadystatechange = function () {
	if (xhr.readyState == 4) {
	    if (xhr.status == 200) { 
		msgbox.style.display = 'inline';
		msgbox.innerHTML = '<br /><br /><div class="fbinfobox">Perubahan tersimpan.</div>';
	    } else {
		msgbox.style.display = 'inline';
		msgbox.innerHTML = '<br /><br /><div class="fberrorbox">Terjadi kesalahan: <strong>' + xhr.statusText + '</strong></div>';		
	    }

	    ajaxAnimEnd("profile_content", animator);
	}
    }

    xhr.open('POST', theTarget, true);
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.send(sentData);

}

// ================= AJAXCOMMENT =============================================

function ajaxComment1(theForm, theTarget) {	// in profile page
    var commentText = document.getElementById("profile_comment_area").value;
    var userData = document.getElementById("user_data").value;

    if (commentText != "") {
	disableForm(theForm);

	var xhr = initXMLHttpClient();

	var sentData = "comment=" + commentText + userData + "&req=xhr";

	xhr.onreadystatechange = function () {
	    if (xhr.readyState == 4) {
		if (xhr.status == 200) { 
		    var response = eval('(' + xhr.responseText + ')');
		    
		    if (response.status == 'ok') {
			drawNewComment(response, theTarget);
			theForm.reset();
		    } else
			fbAlert('error', 'Kesalahan', 'Terjadi kesalahan di database.');
		} else {
		    fbAlert('error', 'Kesalahan', 'Terjadi kesalahan: ' + xhr.statusText);
		}

		reEnableForm(theForm);
	    }
	}

	xhr.open('POST', 'ajax_profilecomments.php', true);
	xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xhr.send(encodeURI(sentData));

    }

}

function ajaxComment2(theForm, theTarget) {	// in home
    var commentText = document.getElementById("profile_comment_area").value;
    var userData = document.getElementById("user_data").value;

    if (commentText != "") {
	disableForm(theForm);

	var xhr = initXMLHttpClient();

	var sentData = "comment=" + commentText + userData + "&req=xhr";

	xhr.onreadystatechange = function () {
	    if (xhr.readyState == 4) {
		if (xhr.status == 200) { 
		    var response = eval('(' + xhr.responseText + ')');
		    
		    if (response.status == 'ok') {
			drawNewComment2(response, theTarget);
			theForm.reset();
		    } else
			fbAlert('error', 'Kesalahan', 'Terjadi kesalahan di database.');
		} else {
		    fbAlert('error', 'Kesalahan', 'Terjadi kesalahan: ' + xhr.statusText);
		}

		reEnableForm(theForm);
	    }
	}

	xhr.open('POST', 'ajax_profilecomments.php', true);
	xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xhr.send(encodeURI(sentData));

    }

}

function disableForm(theForm) {
    var i, j;
    var inputs = theForm.getElementsByTagName("input");
    var textareas = theForm.getElementsByTagName("textarea");
    for (i=0, j=0; i<inputs.length, j<textareas.length; i++, j++) {
	inputs[i].disabled = true;
	textareas[j].disabled = true;
    } 
}

function reEnableForm(theForm) {
    var i, j;
    var inputs = theForm.getElementsByTagName("input");
    var textareas = theForm.getElementsByTagName("textarea");
    for (i=0, j=0; i<inputs.length, j<textareas.length; i++, j++) {
	inputs[i].disabled = false;
	textareas[j].disabled = false;
    } 
}

function drawNewComment(response, where) {	// in profile page
    var commentCanvas = document.getElementById(where);

    var newComment  = "<div class='user_comment_block' id='comment_" + response.commentId + "'>";
	newComment += "<div class='profile_commenter'><img src='photos/avatar_" + response.senderId + ".jpg' /></div>";
	newComment += "<div class='user_comment'><a href='profile.php?id=" + response.senderId + "'>" + response.senderName + "</a><br />" + unescape(response.comment) + "</div>";
	newComment += "<div class='news_date' title='Pada " + response.date + "'>" + response.date + "&nbsp;·&nbsp;<a onclick='ajaxDeleteComment1(" + response.commentId + "); return false;' href='#' title='Hapus komentar ini'>Hapus</a></div>";
	newComment += "<br class='clearer'></div>";
    
    commentCanvas.innerHTML += newComment;

}

function drawNewComment2(response, where) {	// in home
    var commentCanvas = document.getElementById(where);

    var newComment  = "<div class='user_junk_block' id='comment_" + response.commentId + "' style='opacity: 0; filter: alpha(opacity = 0);'>";
	newComment += "<div class='profile_commenter'><img src='photos/avatar_" + response.senderId + ".jpg' /></div>";
	newComment += "<div class='user_comment'><strong><a href='profile.php?id=" + response.senderId + "'>" + response.senderName + "</a></strong>";
	newComment += "&nbsp;·&nbsp;<a class='junk_delete_link' onclick='ajaxDeleteComment1(" + response.commentId + "); return false;' href='#' title='Hapus komentar ini'>Hapus</a><br />" + unescape(response.comment) + "</div>";
	newComment += "<hr class='clearer' /><div class='news_date' title='Pada " + response.date + "'>" + response.date + "</div>";
	newComment += "<hr class='clearer'></div>";
    
    commentCanvas.innerHTML = newComment + commentCanvas.innerHTML;

    fade('comment_' + response.commentId);

}

function ajaxDeleteComment1(id) {
if (confirm("Yakin hendak menghapus komentar ini?")) {
    var xhr = initXMLHttpClient();

    var sentData = "del=" + id + "&req=xhr";

    xhr.onreadystatechange = function () {
	if (xhr.readyState == 4) {
	    if (xhr.status == 200) { 
		var response = eval('(' + xhr.responseText + ')');

		if (response.status == 'ok') {
		    deleteComment(id);
		} else
		    fbAlert('error', 'Kesalahan', 'Terjadi kesalahan di database.');

	    } else {
		fbAlert('error', 'Kesalahan', 'Terjadi kesalahan: ' + xhr.statusText);
	    }

	}
    }

    xhr.open('POST', 'ajax_profilecomments.php', true);
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.send(encodeURI(sentData));
}
}

function deleteComment(id) {
    var theComment = document.getElementById("comment_" + id);
    var canvas = theComment.parentNode;

    fade('comment_' + id);	// effect
    setTimeout("document.getElementById('comment_" + id + "').style.display = 'none'", 500);	// hide
}

// ===========================================================================

function jsGotoHash(url) {

	//ajaxHeader(url);
	window.location = '#' + getFileName(url);

}

function ajaxAnimStart (targetDiv, animatorDiv) {
	if (targetDiv === undefined) targetDiv = "isi";
	if (animatorDiv === undefined) animatorDiv = "ajax_load_anim";

	var isi = document.getElementById(targetDiv);
	var animator = document.getElementById(animatorDiv);
	isi.setAttribute((document.all ? "className" : "class"), 'semitransparent');
	animator.style.display = 'inline';
}

function ajaxAnimEnd (targetDiv, animatorDiv) {
	if (targetDiv === undefined) targetDiv = "isi";
	if (animatorDiv === undefined) animatorDiv = "ajax_load_anim";

	var isi = document.getElementById(targetDiv);
	var animator = document.getElementById(animatorDiv);
	isi.setAttribute((document.all ? "className" : "class"), 'opaque');
	animator.style.display = 'none';
}


function isAllowed(page) {
	var allowedPages = "list.php, about.php, comments.php, profile_updates.php, index.php";
	if (allowedPages.indexOf(getExactFileName(page)) != -1) return true;
	else return false;
}

function set_hash( new_hash ) {
    window.location.hash = new_hash;
}

var current_hash = window.location.hash;

function check_hash() {
    if ( window.location.hash != current_hash ) {
	current_hash = window.location.hash;
	var destination = current_hash.substring( 1,  current_hash.length);
	if (isAllowed(destination)) {
	    ajaxHeader(destination);
	}
    }
}

window.onload = function () {
    var thehash = window.location.hash;
    if(thehash != "") {
	if (isAllowed(thehash)) ajaxHeader(thehash.substring(1, thehash.length));
    }
}

setInterval( "check_hash()", 100 );

function getFileName(url) {

    //this removes everything before the last slash in the path
    url = url.substring(url.lastIndexOf("/") + 1, url.length);
    //return
    return url;
}

function getExactFileName(url) {

    //this removes the anchor at the end, if there is one
    url = url.substring(0, (url.indexOf("#") == -1) ? url.length : url.indexOf("#"));
    //this removes the query after the file name, if there is one
    url = url.substring(0, (url.indexOf("?") == -1) ? url.length : url.indexOf("?"));
    //this removes everything before the last slash in the path
    url = url.substring(url.lastIndexOf("/") + 1, url.length);
    //return
    return url;
}

function tabActivate(elm) {
    var Parent = elm.parentNode;
	Parent = Parent.parentNode;	// parent of parent

    var tabs = Parent.getElementsByTagName("a");
    var i;
    
    for (i=0; i<tabs.length; i++)
	tabs[i].setAttribute((document.all ? "className" : "class"), 'tab');

    elm.setAttribute((document.all ? "className" : "class"), 'current');

//    alert(elm.getAttribute("class"));

}

function invoke_change(what) {	// pencatat perubahan
	
	document.getElementById('change_data').value += what.name + ",";
	
}

function setBodyBg() {
    var body = document.getElementById("body");
    if (isProfilePage()) {
	body.setAttribute((document.all ? "className" : "class"), "profilePage");
    } else {
	body.setAttribute((document.all ? "className" : "class"), "");
    }
}

// =========================== dialogboxes =====================================

function forcePhotoReload() {
    var thePhoto = document.getElementById("profile_photo");
    var time = new Date ();

    thePhoto.src += "?" + time.getMinutes() + time.getSeconds();
}

function fadeDialogBox() {
    var theDialog = document.getElementById("dialog_overlay");
    var theDialogBox = document.getElementById("dialog_box");    

    if (theDialogBox.style.opacity !== undefined) {
	theDialogBox.style.opacity -= 0.15;
	if (theDialogBox.style.opacity <= 0) {
	    theDialog.style.display = 'none';
	    theDialogBox.style.display = 'none';
	} else {
	    setTimeout('fadeDialogBox()', 10);
	}
    } else {
	    theDialog.style.display = 'none';
	    theDialogBox.style.display = 'none';
    }
}

function iframeDialog(title, src, w, h, onafterclose) {
    var theDialog = document.getElementById("dialog_overlay"); // yang ngatur overlaynya, bukan dialognya :P
    var theDialogBox = document.getElementById("dialog_box");
    var iframeanimator = document.getElementById("dialog_anim");

    theDialog.style.display = 'block';
    theDialogBox.style.display = 'block';
    iframeanimator.style.display = 'inline';

    if (theDialogBox.style.opacity !== undefined) theDialogBox.style.opacity = 1; 

    document.getElementById("dialog_content_title").innerHTML = "<div>" + title + "</div>";

    var dialogContent = document.getElementById("dialog_content");

    dialogContent.innerHTML = "<iframe id='dialog_frame' src='" + src + "' frameborder='0' scrolling='no' width='" + (w-40) + "' height='" + (h-100) + "'>Browser Anda tidak mendukung.</iframe>";
    theDialogBox.style.width = w + "px";
    theDialogBox.style.height = h + "px";

    document.getElementById("dialog_button_button").onclick = function () {
		fadeDialogBox();
		eval(onafterclose);
    };
}

function fbAlert(type, title, content) {
    var theDialog = document.getElementById("dialog_overlay"); // yang ngatur overlaynya, bukan dialognya :P
    var theDialogBox = document.getElementById("dialog_box");
    var iframeanimator = document.getElementById("dialog_anim");

    theDialog.style.display = 'block';
    theDialogBox.style.display = 'block';
    iframeanimator.style.display = 'none';

    if (theDialogBox.style.opacity !== undefined) theDialogBox.style.opacity = 1; 

    document.getElementById("dialog_content_title").innerHTML = "<div>" + title + "</div>";

    var dialogContent = document.getElementById("dialog_content");

    dialogContent.innerHTML = "<div class='fb" + type+ "box'>" + content + "</div>";
    theDialogBox.style.width = "400px";

    document.getElementById("dialog_button_button").onclick = function () {
	fadeDialogBox();
    };
    
}

// FADER

var TimeToFade = 500;

function fade(eid)
{
  var element = document.getElementById(eid);
  if(element == null)
    return;
   
  if(element.FadeState == null)
  {
    if(element.style.opacity == null
        || element.style.opacity == ''
        || element.style.opacity == '1')
    {
      element.FadeState = 2;
    }
    else
    {
      element.FadeState = -2;
    }
  }
   
  if(element.FadeState == 1 || element.FadeState == -1)
  {
    element.FadeState = element.FadeState == 1 ? -1 : 1;
    element.FadeTimeLeft = TimeToFade - element.FadeTimeLeft;
  }
  else
  {
    element.FadeState = element.FadeState == 2 ? -1 : 1;
    element.FadeTimeLeft = TimeToFade;
    setTimeout("animateFade(" + new Date().getTime() + ",'" + eid + "')", 33);
  }  
}

function animateFade(lastTick, eid)
{  
  var curTick = new Date().getTime();
  var elapsedTicks = curTick - lastTick;
 
  var element = document.getElementById(eid);
 
  if(element.FadeTimeLeft <= elapsedTicks)
  {
    element.style.opacity = element.FadeState == 1 ? '1' : '0';
    element.style.filter = 'alpha(opacity = '
        + (element.FadeState == 1 ? '100' : '0') + ')';
    element.FadeState = element.FadeState == 1 ? 2 : -2;
    return;
  }
 
  element.FadeTimeLeft -= elapsedTicks;
  var newOpVal = element.FadeTimeLeft/TimeToFade;
  if(element.FadeState == 1)
    newOpVal = 1 - newOpVal;

  element.style.opacity = newOpVal;
  element.style.filter = 'alpha(opacity = ' + (newOpVal*100) + ')';
 
  setTimeout("animateFade(" + curTick + ",'" + eid + "')", 33);
}