/*

Written by: George Alexandrov / browseworks.com

*/

/* MODAL WINDOW */


function switchModalWindows(openedModalDivId, newModalDivId, width, height, padding) {
    _closeModalWindow(openedModalDivId, false);
    _openModalWindow(newModalDivId, width, height, padding, false);
}

function closeModalWindow(modalDivId) {
    _closeModalWindow(modalDivId, true);
}

function openModalWindow(modalDivId, width, height, padding){
    _openModalWindow(modalDivId, width, height, padding, true);
}


// Do not call these functions, they are internal for modal window
function _closeModalWindow(modalDivId, hideBackground) {
    $('#' + modalDivId + 'ModalWrapper').fadeOut(200);
    
    if (hideBackground) 
        $('body div.modalWindowBackground').fadeOut(300, function() { $('body div.modalWindowBackground').remove(); });        
}


function _openModalWindow(modalDivId, width, height, padding, showBackground) {
    var $modalContent = $('#' + modalDivId);
    var $body = $('body');
    var $modalWin;
    
    //check to see if a modal window wrapper exists from previous calls. If not create it:
    if ($body.find('#' + modalDivId + 'ModalWrapper').length == 0) {
        $body.append('<div id="'+modalDivId+'ModalWrapper" class="modalWindow"></div>');
    }
    $modalWin = $body.find('#' + modalDivId + 'ModalWrapper');
    
    //moving the content into the modal window
    $modalContent.appendTo($modalWin);
    
    var $bgr; 
    if (showBackground)
        $bgr = $body.append('<div class="modalWindowBackground" onclick="closeModalWindow(\'' + modalDivId + '\')"></div>').find('div.modalWindowBackground');

    //set width and height separately
    $modalWin.css('width', width + padding * 2).css('height', height + padding * 2);
    $modalContent.css('width', width)
                 .css('height', height)
                 .css('marginLeft', padding)
                 .css('marginTop', padding)
                 .css('marginRight', 0)
                 .css('marginBottom', 0)
                 .css('display', 'block');

    //position
    $modalWin.css('left', '50%')
             .css('marginLeft', -(width)/2-padding)
             .css('top', '50%')
             .css('marginTop', -(height)/2-padding);

    if (showBackground)
        $bgr.css({opacity:0}).show().animate({ opacity: 0.7 }, 300);
    
    $modalWin.fadeIn(200);
}


/* ZOOMABLE */

//check if the document has any divs with class zoomable and apply the magnifier
$(document).ready(function() {
	var $zoomable = $('div.zoomable');
	if ($zoomable.length === 0) return; //no zoomables -> exit

	$zoomable.each(function(index) {
		var $div = $(this);
		var $img = $div.find('img');
		var zoomSrc = $img.attr('src').replace('_thumb', '');
		$div.prepend('<a title="Enlarge image" href="javascript:zoomIn(\'' + zoomSrc + '\')"></a>');
	});
});

function zoomIn(src) {
	$('#modalZoom img').attr('src', src);
	setTimeout(function() {openModalWindow('modalZoom', $(document).width(), 800, 0)}, 300);
}