// This file is part of the paintmyblog.com web site
// Copyright 2007 Karl Henrik Falck <f@lck.nu>

function pageLoaded()
{
  var elms = document.getElementsByClassName("mouseover");
  elms.each(function(e)
	    {
	      e.observe("mouseover", onMouseOverImage);
	      e.observe("mouseout", onMouseOutImage);
	      e.observe("mousedown", onMouseDownImage);
	      e.observe("mouseup", onMouseUpImage);
	      preloadMouseOvers(e.id);
	    });
  preloadImage("loading.gif");
  var elm = $("nextarrow");
  if (elm)
    elm.observe("click", onNextButtonClicked);
  elms = document.getElementsByTagName("input");
  for (var i = 0, e = null; e = elms[i]; i++)
    {
      e.observe("keypress", onInputKeypress);
    }
  Ajax.Responders.register({
    onCreate: function() {
	if (Ajax.activeRequestCount == 1)
	  showLoading();
      },
	onComplete: function() {
	if (Ajax.activeRequestCount == 0)
	  resetNextArrow();
      }
    });
  if (typeof(onLoad) != "undefined")
    onLoad();
}

function preloadImage(fname)
{
  new Image().src = "img/" + fname;
}

function preloadMouseOvers(id)
{
  preloadImage(id + "0.png");
  preloadImage(id + "1.png");
  preloadImage(id + "2.png");
}

function onInputKeypress(evt)
{
  if (evt.keyCode == Event.KEY_RETURN)
    onNextButtonClicked();
}

var isLoading = false;

function onNextButtonClicked(evt)
{
  onNext();
}

function showLoading()
{
  var elm = $("nextarrow");
  if (elm) {
    elm.toggleClassName("loading");
    elm.src = "img/loading.gif";
    isLoading = true;
  } else if ($("result")) {
    showResult("Saving...");
  }
}

function resetNextArrow()
{
  var elm = $("nextarrow");
  if (elm) {
    elm.src = "img/nextarrow0.png";
    elm.toggleClassName("loading");
  } else if ($("result")) {
    showResult("Saved!");
    setTimeout(hideResult, 2000);
  }
  isLoading = false;
}

function onMouseOverImage(evt)
{
  var elm = Event.element(evt);
  if (elm.id == "nextarrow" && isLoading) return;
  elm.src = "img/" + elm.id + "1.png";
}

function onMouseOutImage(evt)
{
  var elm = Event.element(evt);
  if (elm.id == "nextarrow" && isLoading) return;
  elm.src = "img/" + elm.id + "0.png";
}

function onMouseDownImage(evt)
{
  var elm = Event.element(evt);
  if (elm.id == "nextarrow" && isLoading) return;
  elm.src = "img/" + elm.id + "2.png";
}

function onMouseUpImage(evt)
{
  var elm = Event.element(evt);
  if (elm.id == "nextarrow" && isLoading) return;
  elm.src = "img/" + elm.id + "1.png";
}

function showError(str)
{
  var elm = $("error");
  elm.innerHTML = str;
  elm.setStyle({visibility: "visible"});
}

function showResult(str)
{
  var elm = $("result");
  elm.innerHTML = str;
  elm.setStyle({visibility: "visible"});
}

function hideError()
{
  var elm = $("error");
  elm.innerHTML = "";
  elm.setStyle({visibility: "hidden"});
}

function hideResult()
{
  var elm = $("result");
  elm.innerHTML = "";
  elm.setStyle({visibility: "hidden"});
}

function onFailure(req)
{
  showError("Terribly sorry, but there appears to be some problem communicating with the server.<br>Please try again later.");
}

function onException()
{
  showError("Terribly sorry, but an error occurred.<br>Please try again later.");
}

function hideNextArrow()
{
  $("nextarrow").hide();
}

function apostrophize(str)
{
  if (str.substr(str.length - 1, 1) == "s")
    return str + "'";
  else
    return str + "'s";
}

function formatTimeAgo(ago)
{
  var fn = function(x, y) {
    x = parseInt(x);
    if (x == 0) return null;
    if (x == 1) return x + " " + y + " ago";
    return x + " " + y + "s ago";
  }
  if (ago < 10)
    return "just now";
  if (ago < 60) {
    var secs = fn(ago, "second");
    if (secs) return secs;
  }
  else if (ago < 60 * 60) {
    var mins = fn(ago / 60, "minute");
    if (mins) return mins;
  }
  var years = fn(ago / 60 / 60 / 24 / 365, "year");
  if (years) return years;
  var days = fn(ago / 60 / 60 / 24, "day");
  if (days) return days;
  var hours = fn(ago / 60 / 60, "hour");
  if (hours) return hours;
  return "unknown";
}

function makeRequest(action, parameters, onSuq)
{
  parameters["action"] = action;
  new Ajax.Request(accountApiUrl,
		   {
		   method: "post",
		       parameters: parameters,
		       onSuccess: (onSuq ? onSuq : onSuccess),
		       onFailure: onFailure,
		       onException: onFailure
		       });
}

var dataSource = null;
var dataSourceName = null;

function initializeEditableData(name, data)
{
  dataSource = data;
  dataSourceName = name;
  var elms = document.getElementsByClassName("editable");
  elms.each(function(e) { showEditableData(e); });
  onDataChanged(data);
}


function showEditableData(elm)
{
  var id = elm.id.substr(5);
  elm.innerHTML = dataSource[id] + '&nbsp;<a href="javascript:editData(\'' + id + '\')">edit</a>';
}

function editData(id)
{
  var elm = $("data-" + id);
  elm.innerHTML = '<input id="edit-' + id + '" type="text" value="' + dataSource[id] + '">&nbsp;<a href="javascript:changeData(\'' + id + '\')">change</a>&nbsp;<a href="javascript:cancelEdit(\'' + id + '\')">cancel</a>';
  $("edit-" + id).observe("keypress", onEditDataKeyPress);
  $("edit-" + id).focus();
  $("edit-" + id).select();
}

function onEditDataKeyPress(evt)
{
  if (evt.keyCode != Event.KEY_RETURN)
    return;
  var elm = Event.element(evt);
  var id = elm.id.substr(5);
  changeData(id);
}

function changeData(id)
{
  dataSource[id] = $F("edit-" + id);
  showEditableData($("data-" + id));
  commitEditableData(id);
}

function cancelEdit(id)
{
  showEditableData($("data-" + id));
}

function commitEditableData(id)
{
  makeRequest("modify", {object: dataSourceName, name: dataSource.name, prop: id, value: dataSource[id]}, onDataSaved);
}

function onDataSaved(req)
{
  var res = req.responseText.evalJSON();
  if (res.r != "success" || !res.data) {
    onFailure();
    return;
  }
  onDataChanged(res.data);
}