/*

    attaches onclick full image popups to thumbnails.

    usage:
    1) put all thumbnails in an UL
    2) add "popup_thumbs" to class attribute of the containing UL element
       (multiple space-delimited class names are ok)
    3) add id attribtute to all img elements that need to be included
       the ID should be in form "x_y":
           x can be any alphanumeric string (no underscores!)
           y should be the object id of the full image
    4) include this js file in the page

    no additional scripting is needed.
    the script will scan the page and attach onclick event handlers to IMGs where necessary.

    example HTML:
    <ul class="popup_thumbs">
    <li>
        <a href="full_image_42.jpg">
            <img id="thumb_42" src="small_42.jpg" />
        </a>
    </li>
    </ul>
*/


/*
    attach the init call to the main onload event
    preserving any existing handlers already present
*/
var image_popup_old_onload = window.onload;
var image_popup_window_reference = null;
window.onload = function()
{
    if (typeof image_popup_old_onload == 'function')
    {
         image_popup_old_onload();
    }

    var imagePopups = new imagePopupScript();
    imagePopups.init();
}


/* class definition */
function imagePopupScript()
{
    this.containerClassName = 'popup_thumbs';
}

imagePopupScript.prototype.init = function()
{
    // get all ULs in document, look for needed class name, attach handlers if found
    var lists = document.getElementsByTagName('ul');
    var className = ' ' + this.containerClassName + ' ';
    for (var i = 0, item, position; item = lists[i]; i++) {
        if (!item.className)
        {
            continue;
        }

        position = ' ' + item.className + ' ';
        if (position.indexOf( className ) == -1)
        {
            continue;
        }

        this.attachHandlers( item );

    }
}

imagePopupScript.prototype.attachHandlers = function (element)
{
    // get all images in container element and attach onclick handlers
    var imgs = element.getElementsByTagName('img');
    var self = this;
    for (var i = 0, img, imgId; img = imgs[i]; i++) {
        img.onclick = function()
        {
            return self.popupImageFromClick(this);
        }
        img = null;

    }
    return;
}

imagePopupScript.prototype.popupImageFromClick = function (img)
{
    // the actual function that is called onclick

    var objectId = img.id.split('_')[1];

    return this.popupImage(objectId); // cancel click event
}

imagePopupScript.prototype.popupImage = function (objectId)
{
    return popupImage(objectId);
}

/*
    put this function in global namespace so that it can be called directly if needed
*/
function popupImage (objectId)
{
    var url = '/?module=image_popup&object_id=' + objectId ;

    var winName = 'popup_img_' + objectId ;
	var W = 480;
	var H = 410;

	var left = 100;
	var top  = 100;


	// if this is uncommented, only one popup window is allowed
	if (
	   (image_popup_window_reference)
	   &&
	   (image_popup_window_reference.close)
	)
	{
	    image_popup_window_reference.close();
	}



	image_popup_window_reference = window.open(url, winName, "scrollbars=no,resizable=yes,width=" + W + ",height=" + H + " , top=" + top + ", left=" + left);

    return false;
}