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

function initializeGUI()
{
  var tools = document.getElementsByClassName("tool");
  tools.each(function(e)
	     {
	       e.observe("click", setTool);
	       e.observe("mouseover", mouseOverTool);
	       e.observe("mouseout", mouseOutTool);
	     });
  $("toolbox").observe("mouseover", graySelectedTool);
  $("toolbox").observe("mouseout", showSelectedTool);
  $("palette").observe("mouseover", previewColor);
  $("palette").observe("mousemove", updateColor);
  $("palette").observe("mouseout", resetColor);
  $("palette").observe("click", setColor);
  $("sizebox").observe("mousemove", moveSizeSlider);
  $("sizebox").observe("mouseover", mouseOverSizeBox);
  $("sizebox").observe("mouseout", mouseOutSizeBox);
  $("sizebox").observe("click", setSizeSlider);
  $("sizeslider").observe("click", setSizeSlider);
  selectedTool = "pencil";
  mypainter.changeToolByName(selectedTool);
  showSelectedTool();
  colorIdx = 22;
  mypainter.changeSwatch(colorIdx);
  showColor(colorIdx);
  setSizeSliderPos(40, true);
}

var sizeBoxMoused = false;
var clickedSliderPos = null;
var selectedSliderPos = null;

function mouseOutSizeBox(evt)
{
  var pos = Position.cumulativeOffset($("sizebox"));
  var dim = $("sizebox").getDimensions();
  var x = Event.pointerX(evt);
  var y = Event.pointerY(evt);
  var d = minimized ? 2 : 1;
  sizeBoxMoused =
    x >= pos[0] + 5 / d &&
    x <  pos[0] + dim.width - 5 /d &&
    y >= pos[1] + 4 /d &&
    y <  pos[1] + dim.height - 6 / d;
  if (!sizeBoxMoused && selectedSliderPos) {
    setSizeSliderPos(selectedSliderPos);
  }
}

function mouseOverSizeBox(evt)
{
  if (!sizeBoxMoused) {
    sizeBoxMoused = true;
    clickedSliderPos = null;
  }
}

function setSizeSliderPos(y, set)
{
  var d = minimized ? 2 : 1;
  if (y < 8 / d) y = 8 / d;
  else if (y > 56 / d) y = 56 / d;
  $("sizeslider").setStyle({top: y});
  if (set) {
    var f = 1 + 1.5 * (40 / d - y) / 48 / d;
    clickedSliderPos = y;
    selectedSliderPos = y;
    mypainter.changeWidth(f);
  }
}

function moveSizeSlider(evt)
{
  if (clickedSliderPos) return;
  var pos = Position.cumulativeOffset($("sizebox"));
  var y = evt.clientY - pos[1];
  setSizeSliderPos(y);
}

function setSizeSlider(evt)
{
  var pos = Position.cumulativeOffset($("sizebox"));
  var y = evt.clientY - pos[1];
  setSizeSliderPos(y, true);
}

var selectedTool = null;
var mousedTool = null;

function graySelectedTool()
{
  if (selectedTool && selectedTool != mousedTool)
    $(selectedTool).src = selectedTool + "gray.png";
}

function showSelectedTool()
{
  if (selectedTool)
    $(selectedTool).src = selectedTool + ".png";
}

function mouseOverTool(evt)
{
  var elm = Event.element(evt);
  elm.src = elm.id + ".png";
  mousedTool = elm.id;
}

function mouseOutTool(evt)
{
  var elm = Event.element(evt);
  elm.src = elm.id + "gray.png";
}

function setTool(evt)
{
  var elm = Event.element(evt);
  if (elm.id == "brush") {
    alert("not implemented yet");
    return;
  }
  mypainter.changeToolByName(elm.id);
  selectedTool = elm.id;
}

var colorIdx = null;
var clickedColorIdx = null;
var selectedColorIdx = null;

function updateColor(evt)
{
  var offset = minimized ? 4 : 7;
  var size = minimized ? 11 : 22;
  var pos = Position.cumulativeOffset($("palette"));
  var x = parseInt((evt.clientX - offset - pos[0]) / size);
  if (x < 0 || x >= 11) return resetColor();
  var y = parseInt((evt.clientY - offset - pos[1]) / size);
  if (y < 0 || y >= 2) return resetColor();
  debugStatus("x", x);
  debugStatus("y", y);
  var xi = 10 - x;
  var i = 1 + xi * 2 + y;
  debugStatus("i", i);
  showColor(clickedColorIdx ? clickedColorIdx : i);
  colorIdx = i;
}

function previewColor()
{
  clickedColorIdx = null;
}

function showColor(i)
{
  if (!i) var col = "transparent";
  else var col = mypainter.colors[i];
  $("swatch").setStyle({"backgroundColor": col});
}

function resetColor()
{
  showColor(selectedColorIdx);
}

function setColor()
{
  if (colorIdx) {
    selectedColorIdx = colorIdx;
    clickedColorIdx = colorIdx;
    showColor(colorIdx);
    mypainter.changeSwatch(colorIdx);
  }
}