#
#                         *  BOOH  *
#
# A.k.a `Best web-album Of the world, Or your money back, Humerus'.
#
# The acronyn sucks, however this is a tribute to Dragon Ball by
# Akira Toriyama, where the last enemy beaten by heroes of Dragon
# Ball is named "Boo". But there was already a free software project
# called Boo, so this one will be it "Booh". Or whatever.
#
#
# Copyright (c) 2004 Guillaume Cottenceau <gc3 at bluewin.ch>
#
# This software may be freely redistributed under the terms of the GNU
# public license version 2.
#
# You should have received a copy of the GNU General Public License
# along with this program; if not, write to the Free Software
# Foundation, Inc., 675 Mass Ave, Cambridge, MA 02139, USA.

# holds static data to merge in the html "themes"

require 'gettext'
bindtextdomain("booh")

require 'booh/booh-lib'
include Booh

$head_code = <<'EOF'
<meta name="generator" content="Generated by Booh! http://zarb.org/~gc/html/booh.html">

<script language="JavaScript1.1" type="text/JavaScript">

var images = new Array(~~images~~);
~~other_images~~
var other_sizes = new Array(~~other_sizes~~);
var captions = new Array(~~captions~~);

var images_ary = new Array();
var images_loaded = new Array();
var current = 0;
var slideshow = 0;
var slideshow_pause = 3;
var slideshow_timer = null;

for (i = 0; i < images.length; i++) { 
    /* this array will contain 0 if image not yet loaded, 1 when loading,
     * 2 when complete */
    images_loaded[i] = 0;
}

function dbg(t) {
    document.getElementById('dbg_text').firstChild.data += t + "\n";
}

/* load image, return 1 if image is finished loading */
function load(i) {
    if (images_loaded[i] == 0) {
        images_ary[i] = new Image();
        images_ary[i].src = images[i];
        images_loaded[i] = 1;
    }
    if (images_loaded[i] == 1) {
        if (images_ary[i].complete) {
            images_loaded[i] = 2;
        } else {
            return 0;
        }
    }
    return 1;
}

function preload() { 

    /* favor current image, if user clicked on `last' or something */
    load(current);

    /* don't blindly preload all images at the beginning,
     * but rather load them one by one, in order to get
     * next ones faster, beginning with next to current
     */
    for (i = current + 1; i < images.length && i <= current + 5; i++) { 
        if (load(i) == 0) {
            setTimeout("preload()", 500);
            return;
        }
    }
    for (i = current - 1; i >= current - 3; i--) { 
        if (i >= 0) {
            if (load(i) == 0) {
                setTimeout("preload()", 500);
                return;
            }
        }
    }

    setTimeout("preload()", 500);
}

function init() {
  
    /* retrieve GET parameters */
    all_params = location.href.split("?")
    if (all_params.length > 1) {
        params = all_params[1].split("&");
        for (i = 0; i < params.length; i++) {
            keyvalue = params[i].split("=");
            if (keyvalue[0] == "slideshow_pause") {
                slideshow_pause = keyvalue[1];
            }
            if (keyvalue[0] == "run_slideshow") {
                toggle_slideshow();
            }
            if (keyvalue[0] == "current") {
                for (i = 0; i < images.length; i++) {
                    if (images[i] == keyvalue[1]) {
                        current = i;
                        break;
                    }
                }
            }
        }
    }

    preload();
    display_current();
}

function update_sensibilities() {
    if (current == 0) {
        document.getElementById("b_first").disabled = true;
        document.getElementById("b_previous").disabled = true;
        document.getElementById("b_next").disabled = false;
        document.getElementById("b_last").disabled = false;
    } else if (current == images.length - 1) {
        document.getElementById("b_first").disabled = false;
        document.getElementById("b_previous").disabled = false;
        document.getElementById("b_next").disabled = true;
        document.getElementById("b_last").disabled = true;
    } else {
        document.getElementById("b_first").disabled = false;
        document.getElementById("b_previous").disabled = false;
        document.getElementById("b_next").disabled = false;
        document.getElementById("b_last").disabled = false;
    }
}

function set_cursor_(value, element) {

    if (!element || !element.style) {
        return;
    }

    element.style.cursor = value;

    children = element.childNodes;
    for (i = 0; i < children.length; i++) {
        set_cursor_(value, children.item[i]);
    }
}

function set_cursor(value) {
    set_cursor_(value, document.getElementById('body'));
}

function show_current_text() {
    /* don't show text if image not yet loaded because navigator
     * won't refresh it during load */
    if (images_loaded[current] == 2) {
        eval("document.getElementById('image_counter')" +
                     ".firstChild.data = '" + ( current + 1 ) + "/" + images.length + "'");
        eval("document.getElementById('main_text')" +
                     ".firstChild.data = \"" + ( captions[current] || images[current] ) + "\"");
        for (i = 0; i < other_sizes.length; i++) { 
            eval("linkelems = document.getElementById('link" + other_sizes[i] + "').href.split('?');" +
                 "document.getElementById('link" + other_sizes[i] + "').href = linkelems[0] + '?current=" + eval("images_" + other_sizes[i] + "[current]") + "'");
        }
        set_cursor("default");
    } else {
        setTimeout("show_current_text()", 100);
        set_cursor("wait");
    }
}

function display_current() {
    eval("document.main_img.src = images[" + current + "]");
    show_current_text();
    update_sensibilities();
}

function first() {
    if (slideshow == 1) {
        toggle_slideshow(true);
    }
    
    current = 0;
    display_current();
}

function next() {
    if (slideshow == 1) {
        toggle_slideshow(true);
    }

    if (current < images.length - 1) {
        current++;
        display_current();
    }
}

function previous() {
    if (slideshow == 1) {
        toggle_slideshow(true);
    }

    if (current > 0) {
        current--;
        display_current();
    }
}

function last() {
    if (slideshow == 1) {
        toggle_slideshow(true);
    }

    current = images.length - 1;
    display_current();
}

function toggle_slideshow(now) {
    if (slideshow == 0) {
        document.getElementById("b_slideshow").value = "~~stop_slideshow~~";
        slideshow = 1;
        if (current == images.length - 1) {
            current = -1;
        }
        if (now) {
            run_slideshow();
        } else {
            setTimeout("run_slideshow()", slideshow_pause * 1000);
        }
    } else {
        clearTimeout(slideshow_timer);
        document.getElementById("b_slideshow").value = "~~run_slideshow~~";
        slideshow = 0;
    }
}

function run_slideshow() {
    if (slideshow == 0) {
        return;
    }

    if (images_loaded[current + 1] == 2) {
        current++;
        display_current();
        slideshow_timer = setTimeout("run_slideshow()", slideshow_pause * 1000);
    } else {
        slideshow_timer = setTimeout("run_slideshow()", 500);
    }

    if (current == images.length - 1) {
        toggle_slideshow(true);
    }
}
</script>
EOF

$head_code.sub!('~~run_slideshow~~', utf8(_('Run slideshow!')))
$head_code.sub!('~~stop_slideshow~~', utf8(_('Stop slideshow')))

$body_additions = <<'EOF'
onload="init()" id="body"
EOF

$button_first = '
    <form><input type="button"
                 onclick="first()"
                 value="' + utf8(_('<<- First')) + '"
                 id="b_first"></form>';

$button_previous = '
    <form><input type="button"
                 onclick="previous()"
                 value="' + utf8(_('<- Previous')) + '"
                 id="b_previous"></form>';

$button_next = '
    <form><input type="button"
                 onclick="next()"
                 value="' + utf8(_('Next ->')) + '"
                 id="b_next"></form>';

$button_last = '
    <form><input type="button"
                 onclick="last()"
                 value="' + utf8(_('Last ->>')) + '"
                 id="b_last"></form>';

$button_slideshow = '
  <form><input type="button"
               onclick="toggle_slideshow(true)"
               value="' + utf8(_('Run slideshow!')) + '"
               id="b_slideshow">
  </form>';

$image = <<'EOF'
  <img name="main_img">
EOF

$image_counter_additions = <<'EOF'
  id="image_counter"
EOF

$caption_additions = <<'EOF'
  id="main_text"
EOF

$body_code = <<'EOF'
EOF