// ==UserScript==
// @name          FlickrLeechFavMagnifier
// @namespace     http://www.norcimo.com/fun/mozilla/greasemonkey/
// @description   Shows small picture version when you "mouseover" a flickr favorite on flickrleech.
// @include       http://www.flickrleech.net/*
// @include       http://flickrleech.net/*
// ==/UserScript==

// Adapted from the original FlickrLeechFavMagnifier by norcimo
// v1.0 2007-01-29

var thumbsBox=null;
var thumbsLinks=null;
var thumbsImages=null;
var altTemp = '';

function addGlobalStyle(css) {
  var head, style;
  head = document.getElementsByTagName('head')[0];
  if (!head) { return; }
  style = document.createElement('style');
  style.type = 'text/css';
  style.innerHTML = css;
  head.appendChild(style);
} // borrowed from -> http://diveintogreasemonkey.org/patterns/add-css.html

function modifyImgSrc(imgSrc) {
	imgSrc=imgSrc.replace(/_s.jpg/, '_m.jpg');
	imgSrc=imgSrc.replace(/_t.jpg/, '_m.jpg');
	return imgSrc;
}

function preloadSmallImages() {
  var imageArray = new Array();
  for(var i=0; i<thumbsImages.length; i++) {
    imageArray[i] = new Image();
    imageArray[i].src = modifyImgSrc(thumbsImages[i].getAttribute('src'));
  }
}

function createMagnifier() {
  if (thumbsBox) {
    var magnifier = document.createElement('div');
    magnifier.setAttribute('id', 'magnifier'); 
    magnifier.style.position = 'absolute';
    magnifier.style.border = '6px solid rgb(221, 221, 221)';
    magnifier.style.padding = '0px';
    magnifier.style.backgroundColor = 'rgb(221, 221, 221)';
    magnifier.style.display = 'none';
    thumbsBox.parentNode.insertBefore(magnifier, thumbsBox);
    return true;
  }
  return false;
}

function clearLinkTitle() {
  for(var i=0; i<thumbsLinks.length; i++) {
    thumbsLinks[i].setAttribute('title', '');
  }
}

function showMagnifier(event) {
  var magnifier = document.getElementById('magnifier')
  if (magnifier) {
    var altTag = event.target.getAttribute('alt');
    if (altTag==null || altTag=="null")
    	altTag=="";
    addGlobalStyle('#magnifier > h5 { margin-top: 0px ! important; font-size: x-small ! important }');
    magnifier.innerHTML = '<h5>' + altTag + '</h5><img src="' + modifyImgSrc(event.target.getAttribute('src')); + '" border="0" />';
    magnifier.style.display = '';
    altTemp = altTag;
    event.target.setAttribute('alt', '');
    document.body.insertBefore(magnifier, document.body.firstChild);
  }
}

function moveMagnifier(event) {
  var gap = 10;
  var magnifier = document.getElementById('magnifier')
  if (magnifier) { 
    event.target.setAttribute('alt', altTemp);
    var pos=event.clientX + document.body.scrollLeft+document.documentElement.scrollLeft+gap;
    if (event.target.offsetLeft>window.innerWidth/2)
    	pos=pos-magnifier.offsetWidth-gap*2;
    magnifier.style.left = pos+"px";
    pos=event.clientY + document.body.scrollTop+document.documentElement.scrollTop+gap;
    if (pos>window.innerHeight/2)
    	pos=pos-magnifier.offsetHeight-gap*2;
    magnifier.style.top = pos+"px";

  }
}

function hideMagnifier(event) {
  var magnifier = document.getElementById('magnifier')
  if (magnifier) { magnifier.style.display = 'none'; }
}

function iterateThumbnails(event) {
  for(var i=0; i<thumbsImages.length; i++) {
    thumbsImages[i].addEventListener('mouseover', function(event) { showMagnifier(event); }, true);
    thumbsImages[i].addEventListener('mousemove', function(event) { moveMagnifier(event); }, true);
    thumbsImages[i].addEventListener('mouseout', function(event) { hideMagnifier(event); }, true);
  }
}

window.addEventListener('load', function(event) { 
	//Overide the show photos routine so we can do our goodness once their loaded
  	var oldRoutine=unsafeWindow.showPhotos;
  	unsafeWindow.showPhotos=function(str) {oldRoutine(str); parseThumbs(event)};
}, false);


function parseThumbs(event) {
  thumbsBox=document.getElementById("photos").firstChild;
  if (thumbsBox.getAttribute("class")=="pageinfo")
  	thumbsBox=thumbsBox.nextSibling;
  if (!thumbsBox)
  	return;
  thumbsLinks = thumbsBox.getElementsByTagName('a');
  thumbsImages = thumbsBox.getElementsByTagName('img');
  preloadSmallImages();
  if (createMagnifier()) { 
    clearLinkTitle();
    iterateThumbnails(event); 
  }
}