/* ========================================================================= */

var gal_THUMB_PIC_ZFILL = 4;  // e.g. 4 yields: pic0001-thumb.jpg & pic0001.jpg

var gal_THUMB_PREFIX = 'pic';
var gal_THUMB_SUFFIX = '-thumb.jpg';
var gal_THUMBS_FOLDER = 'gallery\/pics\/';

var gal_PIC_PREFIX = 'pic';
var gal_PIC_SUFFIX = '.jpg';
var gal_PICS_FOLDER = 'gallery\/pics\/';

var gal_MAX_THUMB_WIDTH = 160;   // max. width  of thumbs in pixel
var gal_MAX_THUMB_HEIGHT = 120;  // max. height of thumbs in pixel
var gal_THUMB_EXTRA_WIDTH = 50;  // adds some width  for border, caption & padding
var gal_THUMB_EXTRA_HEIGHT = 70; // adds some height for border, caption & padding

var gal_MAX_PIC_WIDTH = 800;   // max. width  of pics in pixel
var gal_MAX_PIC_HEIGHT = 600;  // max. height of pics in pixel
var gal_PIC_EXTRA_WIDTH = 40;  // adds some width  for border, caption & padding
var gal_PIC_EXTRA_HEIGHT = 80; // adds some height for border, caption & padding

var gal_FF_SCROLLBAR_WIDTH = 19; // actually smaller (usually ~ 16/17)

/* ========================================================================= */

window.onresize = function() {
    document.getElementById('gal-transparent-bg').style.width = 
        gal_page_width() + 'px';
    document.getElementById('gal-transparent-bg').style.height = 
        gal_page_height() + 'px';
}

/* Alternative (reload page):                                                */
/*                                                                           */
/* window.onresize = function() {window.location=window.location;}           */
/*                                                                           */
/* Remark: "window.location.reload()" does not work in FF(!)                 */

/* ========================================================================= */

function gal_writeThumb(num, caption) {
    var str = '';

    str += '<table class="gal-thumb" style="width:' + (gal_MAX_THUMB_WIDTH + gal_THUMB_EXTRA_WIDTH) + 'px; height:' + (gal_MAX_THUMB_HEIGHT + gal_THUMB_EXTRA_HEIGHT) + 'px;">';
    str += '  <tr>';
    str += '    <td class="gal-thumb">';
    str += '      <a onclick="gal_showPic(\''+ gal_zfill(num, gal_THUMB_PIC_ZFILL) + '\');" href="javascript:void(0);" class="gal-thumb">';
    str += '        <img src="' + gal_THUMBS_FOLDER + gal_THUMB_PREFIX + gal_zfill(num, gal_THUMB_PIC_ZFILL) + gal_THUMB_SUFFIX +'" class="gal-thumb" alt="" \/>';
    str += '      <\/a>';

    str += '      <br \/>';

    str += '      <span class="gal-thumb-caption">' + caption + '<\/span>';
    str += '    <\/td>';
    str += '  <\/tr>';
    str += '<\/table>';

    document.write(str);
}


function gal_writePic(num_prev, num, num_next, caption, float_right_caption) { 
    /* num IS 2ND ARGUMENT(!) */

    var str = '';

    str += '<div id="gal-pic' + gal_zfill(num, gal_THUMB_PIC_ZFILL) + '-overlay" class="gal-viewport-overlay">';
    str += '  <table class="gal-viewport-overlay">';
    str += '    <tr>';
    str += '      <td class="gal-viewport-overlay">';

    str += '        <table class="gal-viewport-overlay-content">';
    str += '          <tr>';
    str += '            <td class="gal-viewport-overlay-content" style="width:' + (gal_MAX_PIC_WIDTH + gal_PIC_EXTRA_WIDTH) + 'px; height:' + (gal_MAX_PIC_HEIGHT + gal_PIC_EXTRA_HEIGHT) + 'px;">';

    str += '              <table class="gal-pic-and-caption" cellpadding="0" cellspacing="0">';
    str += '                <tr>';
    str += '                  <td class="gal-pic">';
    str += '                    <a onclick="gal_closePic(\'' + gal_zfill(num, gal_THUMB_PIC_ZFILL) + '\');" href="javascript:void(0);" class="gal-plain"><img src="' + gal_PICS_FOLDER + gal_PIC_PREFIX + gal_zfill(num, gal_THUMB_PIC_ZFILL) + gal_PIC_SUFFIX + '" class="gal-pic" alt="" \/><\/a>';
    str += '                  <\/td>';
    str += '                <\/tr>';
    str += '                <tr>';
    str += '                  <td class="gal-caption">';

    if (typeof float_right_caption != 'undefined') {
        str += '                <span style="float:right;">' + float_right_caption + '<\/span>';
    }

    str += '                    ' + caption;
    str += '                  <\/td>';
    str += '                <\/tr>';
    str += '              <\/table>';

    str += '            <\/td>';
    str += '          <\/tr>';
    str += '          <tr>';
    str += '            <td>';

    if (num_prev != 0) {
        str += '          <a onclick="gal_prevPic(\'' + gal_zfill(num, gal_THUMB_PIC_ZFILL) + '\', \'' + gal_zfill(num_prev, gal_THUMB_PIC_ZFILL) + '\');" href="javascript:void(0);" class="gal-navigation-txt-1">Vorheriges Bild<\/a>';
    }
    else {
        str += '          <a href="javascript:void(0);" class="gal-navigation-txt-inactive">Vorheriges Bild<\/a>';
    }

    str += '              \&\#160;\&\#160;\&\#160;\&\#160;\&\#160;\&\#160;';
    str += '              \&\#160;\&\#160;\&\#160;\&\#160;\&\#160;\&\#160;';
    str += '              <a onclick="gal_closePic(\'' + gal_zfill(num, gal_THUMB_PIC_ZFILL) + '\');" href="javascript:void(0);" class="gal-navigation-txt-2">Bild wieder schließen<\/a>';
    str += '              \&\#160;\&\#160;\&\#160;\&\#160;\&\#160;\&\#160;';
    str += '              \&\#160;\&\#160;\&\#160;\&\#160;\&\#160;\&\#160;';

    if (num_next != 0) {
        str += '          <a onclick="gal_nextPic(\'' + gal_zfill(num, gal_THUMB_PIC_ZFILL) + '\', \'' + gal_zfill(num_next, gal_THUMB_PIC_ZFILL) + '\');" href="javascript:void(0);" class="gal-navigation-txt-1">Nächstes Bild<\/a>';
    }
    else {
        str += '          <a href="javascript:void(0);" class="gal-navigation-txt-inactive">Nächstes Bild<\/a>';
    }
    str += '            <\/td>';
    str += '          <\/tr>';
    str += '        <\/table>';

    str += '      <\/td>';
    str += '    <\/tr>';
    str += '  <\/table>';
    str += '<\/div>';

    document.write(str);
}

/* ========================================================================= */

function gal_showPic(numstr) {
    document.getElementById('gal-pic'+numstr+'-overlay').style.left = 
        gal_x_scroll_offset() + 'px';
    document.getElementById('gal-pic'+numstr+'-overlay').style.top = 
        gal_y_scroll_offset() + 'px';
    document.getElementById('gal-pic'+numstr+'-overlay').style.width = 
        gal_viewport_width() + 'px';
    document.getElementById('gal-pic'+numstr+'-overlay').style.height = 
        gal_viewport_height() + 'px';
    document.getElementById('gal-pic'+numstr+'-overlay').style.display = 'block';

    document.getElementById('gal-transparent-bg').style.width = 
        gal_page_width() + 'px';
    document.getElementById('gal-transparent-bg').style.height = 
        gal_page_height() + 'px';
    document.getElementById('gal-transparent-bg').style.display = 'block';
}


function gal_closePic(numstr) {
    document.getElementById('gal-transparent-bg').style.display = 'none';
    document.getElementById('gal-pic'+numstr+'-overlay').style.display = 'none';
}


function gal_nextPic(old_numstr, numstr) {
    document.getElementById('gal-pic'+old_numstr+'-overlay').style.display = 'none';

    document.getElementById('gal-pic'+numstr+'-overlay').style.left = 
        gal_x_scroll_offset() + 'px';
    document.getElementById('gal-pic'+numstr+'-overlay').style.top = 
        gal_y_scroll_offset() + 'px';
    document.getElementById('gal-pic'+numstr+'-overlay').style.width = 
        gal_viewport_width() + 'px';
    document.getElementById('gal-pic'+numstr+'-overlay').style.height = 
        gal_viewport_height() + 'px';
    document.getElementById('gal-pic'+numstr+'-overlay').style.display = 'block';

    document.getElementById('gal-transparent-bg').style.width = 
        gal_page_width() + 'px';
    document.getElementById('gal-transparent-bg').style.height = 
        gal_page_height() + 'px';
}


function gal_prevPic(old_numstr, numstr) {
    document.getElementById('gal-pic'+old_numstr+'-overlay').style.display = 'none';

    document.getElementById('gal-pic'+numstr+'-overlay').style.left = 
        gal_x_scroll_offset() + 'px';
    document.getElementById('gal-pic'+numstr+'-overlay').style.top = 
        gal_y_scroll_offset() + 'px';
    document.getElementById('gal-pic'+numstr+'-overlay').style.width = 
        gal_viewport_width() + 'px';
    document.getElementById('gal-pic'+numstr+'-overlay').style.height = 
        gal_viewport_height() + 'px';
    document.getElementById('gal-pic'+numstr+'-overlay').style.display = 'block';

    document.getElementById('gal-transparent-bg').style.width = 
        gal_page_width() + 'px';
    document.getElementById('gal-transparent-bg').style.height = 
        gal_page_height() + 'px';
}

/* ========================================================================= */

function gal_zfill(n, zmax) {
    n += '';

    while(n.length < zmax) n = "0" + n;
    
    return n;
}

/* ========================================================================= */

function gal_x_scroll_offset() {
    if (typeof window.pageXOffset != 'undefined') {
        return window.pageXOffset;
    }
    else {
        return document.documentElement.scrollLeft;
    }
}


function gal_y_scroll_offset() {
    if (typeof window.pageYOffset != 'undefined') {
        return window.pageYOffset;
    }
    else {
        return document.documentElement.scrollTop;
    }
}

/* ========================================================================= */

function gal_page_width() {
    return document.documentElement.scrollWidth;
}


function gal_page_height() {
    return document.documentElement.scrollHeight;
}


function gal_viewport_width() {
    if (typeof window.innerWidth != 'undefined') {
        return window.innerWidth - gal_FF_SCROLLBAR_WIDTH;  // workaround
    }
    else {
        return document.documentElement.clientWidth;
    }
}


function gal_viewport_height() {
    if (typeof window.innerHeight != 'undefined') {
        return window.innerHeight;
    }
    else {
        return document.documentElement.clientHeight;
    }
}

/* ========================================================================= */