// -*-java-*-
// misc support stuff for esteticas.se
// (C) Bernt Nilsson, 2003 - 2008

// image zoom by Bernt Nilsson
// this works by dynamicly showing a large version
// of image in a placeholder between each row
// care is taken so that browsers without JavaScript and image swapping
// fallback to call server

num_cols = 5;
slideshow_delay = 3;
preload_next = true;

curr_image_num = null;
new_image_num = null;
slideshow_running = false;
scroll_margin = 10;

do_slide_menu = true;
slide_fraction = 0.1;
slide_interval = 20;

// debugging
do_debug = false;

// is_ie = document.all != null;
//is_ie = (navigator.appName == 'Microsoft Internet Explorer' && 
//	 parseFloat(navigator.appVersion) >= 4);
// check ie versions
ie_version = -1;
if (navigator.appName == 'Microsoft Internet Explorer') {
    var ua = navigator.userAgent;
    var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
    if (re.exec(ua) != null)
	ie_version = parseFloat( RegExp.$1 );
}
is_ie = (ie_version >= 4.0);
is_ie7 = (ie_version >= 7.0);
// document.layers test does NOT work for Mozilla!
// is_netscape = document.layers != null;
// should be safer
is_netscape = (navigator.appName == 'Netscape' && 
	       parseFloat(navigator.appVersion) >= 5);

preload_image = new Image();

// preload error icon
preload_image.src = 'buttons/error.gif';

function sel_zoom_num(image_num)
{
    return Math.floor(image_num / num_cols);
}
function get_elem_left(elem)
{
    if (is_ie || is_netscape) {
	var left = 0;
	while (elem != null) {
	    left += elem.offsetLeft;
	    elem = elem.offsetParent;
	}
	return left;
    }
    return 0;
}
function get_elem_top(elem)
{
    if (is_ie || is_netscape) {
	var top = 0;
	while (elem != null) {
	    top += elem.offsetTop;
	    elem = elem.offsetParent;
	}
	return top;
    }
    return 0;
}
function get_elem_width(elem)
{
    return (is_ie || is_netscape ? elem.offsetWidth : 0);
}
function get_elem_height(elem)
{
    return (is_ie || is_netscape ? elem.offsetHeight : 0);
}
function get_scroll_left()
{
    // is_ie ? window.document.body.scrollLeft :
    // is_netscape ? window.pageXOffset :
    return (is_ie7 ? document.documentElement.scrollLeft :
	    is_ie ? document.body.scrollLeft :
	    is_netscape ? window.scrollX :
	    0);
}
function get_scroll_top()
{
    // is_ie ? window.document.body.scrollTop :
    // is_netscape ? window.pageYOffset :
    return (is_ie7 ? document.documentElement.scrollTop :
	    is_ie ? document.body.scrollTop :
	    is_netscape ? window.scrollY :
	    0);
}
function get_scroll_width()
{
    // is document.body.scrollWidth better?
    return (is_ie ? document.body.clientWidth :
	    is_netscape ? window.innerWidth :
	    0);
}
function get_scroll_height()
{
    // is document.body.scrollHeight better?
    return (is_ie ? document.body.clientHeight :
	    is_netscape ? window.innerHeight :
	    0);
}
function make_visible_top(elem)
{
    if (is_ie || is_netscape) {
	window.scrollBy(0, get_elem_top(elem) - get_scroll_top() - scroll_margin);
    }
}
function get_elem(id) {
    return document.getElementById(id);
}
function set_opacity(elem, opacity)
{
    if (is_ie) {
	elem.style.filter = 'alpha(opacity = ' + opacity + ')';
    } else if (is_netscape) {
	//elem.style.MozOpacity = opacity + '%';
	elem.style.MozOpacity = opacity / 100.0;
    }
}
function raw_unzoom()
{
    if (curr_image_num != null) {
	var zoom_num = sel_zoom_num(curr_image_num);
	get_elem('p' + zoom_num).src = 'buttons/t1x1.gif';
	zoom_image = get_elem('li' + zoom_num);
	zoom_image.onload = null;
	zoom_image.src = 'buttons/t1x1.gif';
	get_elem('n' + zoom_num).src = 'buttons/t1x1.gif';
	get_elem('tss' + zoom_num).src = 'buttons/t1x1.gif';
	//location = '#a' + curr_image_num;
	var small_image = get_elem('si' + curr_image_num);
	set_opacity(small_image, 100);
	make_visible_top(small_image);
	curr_image_num = null;
    }
    return false;
}
function make_large_src(small_src)
{
    return small_src.replace(/\.125\./, '.600.');
}
function raw_zoom_3()
{
    // now the zoomed image is visible
    if (curr_image_num == null) {
	return;
    }
    var zoom_num = sel_zoom_num(curr_image_num);
    var zoom_image = get_elem('li' + zoom_num);
    zoom_image.onload = null;
    // changing hash changes url and adds to history,
    // so I use scroll instead
    // location = '#z' + zoom_num;
    // window.scrollTo(0, get_elem_top(this));
    //window.scrollBy(0, get_elem_top(this)
    make_visible_top(zoom_image);
    window.status = 'Ready';
}
function raw_zoom_2()
{
    // now the zoomed image is preloaded
    // shall we use it?
    if (new_image_num == null) {
	return;
    }
    var zoom_num = sel_zoom_num(new_image_num);
    var zoom_image = get_elem('li' + zoom_num);
    var small_image = get_elem('si' + new_image_num);
    var zoom_image_src = make_large_src(small_image.src);

    // collapse other zoom location
    if (curr_image_num != null &&
	zoom_num != sel_zoom_num(curr_image_num)) {
	raw_unzoom();
    }
    curr_image_num = new_image_num;
    new_image_num = null;

    // maybe show previous, next and slideshow
    get_elem('p' + zoom_num).src =
	get_elem('si' + (curr_image_num - 1))
	? 'buttons/previous.gif' 
	: 'buttons/t1x1.gif';
    get_elem('n' + zoom_num).src =
	get_elem('si' + (curr_image_num + 1))
	? 'buttons/next.gif' 
	: 'buttons/t1x1.gif';
    get_elem('tss' + zoom_num).src =
	get_elem('si' + (curr_image_num + 1))
	? (slideshow_running
	   ? 'buttons/pause.gif'
	   : 'buttons/start.gif')
	: 'buttons/t1x1.gif';

    zoom_image.onload = raw_zoom_3;
    zoom_image.src = zoom_image_src;

    if (slideshow_running) {
	setTimeout('slideshow()', slideshow_delay * 1000);
    }
    // preload next image
    if (curr_image_num != null &&
	(slideshow_running || preload_next)) {
	var next_small_image = get_elem('si' + (curr_image_num + 1));
	if (next_small_image) {
	    preload_image.onload = null;
	    preload_image.onerror = null;
	    preload_image.src = make_large_src(next_small_image.src);
	}
    }
}
function raw_zoom_2_error()
{
    slideshow_running = false;
    var zoom_num = sel_zoom_num(new_image_num);
    if (curr_image_num != null &&
	zoom_num != sel_zoom_num(curr_image_num)) {
	raw_unzoom();
    }
    curr_image_num = new_image_num;
    get_elem('tss' + zoom_num).src = 'buttons/error.gif';
    window.status = 'Failed to load image';
}
function raw_zoom(image_num)
{
    // check if browser support image swapping
    if (!document.images) {
	// use enclosing anchor
	return true;
    }
    // undo feedback for loading image
    if (new_image_num != null) {
 	set_opacity(get_elem('si' + new_image_num), 100);
	get_elem('tss' + sel_zoom_num(new_image_num)).src =
	    'buttons/t1x1.gif';
    }
    // abort loading of same
    if (image_num == new_image_num) {
	new_image_num = null;
	return false;
    }
    // collapse if already zoomed
    if (image_num == curr_image_num) {
	return raw_unzoom();
    }
    // remove highlight from previous
    if (curr_image_num != null) {
	set_opacity(get_elem('si' + curr_image_num), 100);
    }

    var small_image = get_elem('si' + image_num);
    // may not exist when previous and next
    if (!small_image) {
	return false;
    }
    // change style of image so we see which image is zoomed
    // small_image.style.border_color = 'red';
    set_opacity(small_image, 25);

    var zoom_image_src = make_large_src(small_image.src);

    new_image_num = image_num;
    // show loading
    window.status = 'Loading image';
    var zoom_num = sel_zoom_num(curr_image_num
				? curr_image_num
				: new_image_num);
    get_elem('tss' + zoom_num).src = 'buttons/loading.gif';
    // preload it
    preload_image.onload = raw_zoom_2;
    preload_image.onerror = raw_zoom_2_error;
    preload_image.src = zoom_image_src;

    // tell caller we handle this
    return false;
}
function unzoom()
{
    slideshow_running = false;
    return raw_unzoom();
}

function zoom(image_num)
{
    slideshow_running = false;
    return raw_zoom(image_num);
}
function zoom_previous()
{
    return zoom(curr_image_num - 1);
}
function zoom_next()
{
    return zoom(curr_image_num + 1);
}
function slideshow()
{
    if (slideshow_running) {
	if (curr_image_num == null) {
	    raw_zoom(0);
	} else if (get_elem('si' + (curr_image_num + 1))) {
	    raw_zoom(curr_image_num + 1);
	} else {
	    slideshow_running = false;
	    raw_unzoom();
	    return;
	}
    }
}
function start_slideshow()
{
    slideshow_running = true;
    slideshow();
    return false;
}
function pause_slideshow()
{
    slideshow_running = false;
    new_image_num = null;
    if (curr_image_num != null) {
	zoom_num = sel_zoom_num(curr_image_num);
	get_elem('tss' + zoom_num).src = 'buttons/start.gif';
    }
    return false;
}
function toggle_slideshow()
{
    if (slideshow_running) {
	pause_slideshow();
    } else {
	start_slideshow();
    }
    return false;
}

// mail support
function ContactEsteticas()
{
    var mc = '@.onifamtlcse:';
    //////////01234567890123
    var mi = [7,6,4,9,8,2,13,4,3,5,2,0,12,11,8,12,8,4,10,6,11,1,11,12];
    var ma = '';
    for (var i = 0; i < mi.length; ++i) {
	ma += mc.substring(mi[i], mi[i] + 1);
    }
    location = ma;
}

// slide menu
function slide_menu()
{
    var menu_top = get_elem_top(menu_elem);
    var menu_bottom = menu_top + get_elem_height(menu_elem);

    var scroll_top = get_scroll_top();
    var scroll_height = get_scroll_height();
    var scroll_bottom = scroll_top + get_scroll_height();

    var content_top = get_elem_top(content_elem);
    var content_height = get_elem_height(content_elem);
    var content_bottom = content_top + get_elem_height(content_elem);

    var top_diff = scroll_top + menu_orig_top - menu_top;
    var bottom_diff = (scroll_bottom < content_bottom
		       ? scroll_bottom 
		       : content_bottom)
	- menu_bottom;
    var diff = 0;

    if (do_debug) {
	// window.status = 
	get_elem('debug_data').innerHTML = 
	    "menu_top = " + menu_top +
	    ", menu_bottom = " + menu_bottom +
	    ", scroll_top = " + scroll_top +
	    ", scroll_bottom = " + scroll_bottom +
	    ", content_bottom = " + content_bottom +
	    ", document.body.scrollTop = " + document.body.scrollTop +
	    ", document.scrollTop = " + document.scrollTop +
	    ", window.scrollTop = " + window.scrollTop +
	    ", document.documentElement.scrollTop = " + document.documentElement.scrollTop +
	    "";
    }

    if (top_diff > 0 && bottom_diff > 0) {
	// move down - use the smaller
	diff = top_diff < bottom_diff ? top_diff : bottom_diff;
	// } else if (top_diff < 0 && bottom_diff < 0) {
    } else if (top_diff < 0) {
	// move up
	// diff = top_diff > bottom_diff ? top_diff : bottom_diff;
	diff = top_diff;
    }

    diff *= slide_fraction;

    // at least one step - round up
    if (diff < 0) {
	diff = Math.floor(diff);
    } else if (diff > 0) {
	diff = Math.ceil(diff);
    }

    spacer_elem.width = 1;
    spacer_elem.height = get_elem_height(spacer_elem) + diff;
}

// main stuff
function on_page_load()
{
    if (do_slide_menu) {
	if (is_ie || is_netscape) {
	    menu_elem = get_elem("menu");
	    menu_orig_top = get_elem_top(menu_elem);
	    spacer_elem = get_elem("spacer");
	    content_elem = get_elem("content");

	    setInterval("slide_menu()", slide_interval);
	}
    }
}

// debug
function set_debug()
{
    do_debug = true;
    get_elem('debug_data').innerHTML = "debugging...";
}