function $(id) {
	if (typeof id == 'string') return document.getElementById(id);
	else return null;
}
var Monta = {
	images: new Array(),
	createOverlay: function() {
        if ($('overlay-image')) return null;
        var css = document.createElement('link');
        css.setAttribute('rel', 'stylesheet');
        css.setAttribute('type', 'text/css');
        css.setAttribute('href', httpdocs + 'montana_overlay.css');
        css.id = 'overlay-style';
        document.getElementsByTagName('head')[0].appendChild(css);
        var div = document.createElement('div');
        div.id = 'overlay-image';
        var wWidth = self.innerWidth || (document.documentElement.clientWidth || document.body.clientWidth);
        var xScroll = document.body.scrollWidth || document.body.offsetWidth;
        var wHeight = self.innerHeight || (document.documentElement.clientHeight || document.body.clientHeight);
        if (window.innerHeight && window.scrollMaxY) {
            var yScroll = window.innerHeight + window.scrollMaxY;
        } else {
            var yScroll = document.body.scrollHeight || document.body.offsetHeight;
        }
        
        div.style.cssText = 'width:' + (xScroll < wWidth ? wWidth : xScroll) + 'px;height:' + (yScroll < wHeight ? wHeight : yScroll) + 'px;';
        var bg = div.cloneNode(false);
        bg.id = 'overlay-background';
        document.body.appendChild(bg);
        var y = self.pageYOffset || (document.documentElement.scrollTop || document.body.scrollTop);
        var p = document.createElement('p');
        p.appendChild(document.createTextNode('× クリックすると閉じます'));
        p.style.marginTop = y + 30 + 'px';
        div.appendChild(p);
        var img = document.createElement('img');
        Monta.addEvent(p, 'click', Monta.removeOverlay);
        Monta.addEvent(div, 'click', Monta.removeOverlay);
        Monta.addEvent(img, 'click', Monta.removeOverlay);
        div.appendChild(img);
        return div;
    },
    removeOverlay: function() {
        if (!$('overlay-image')) return;
        document.body.removeChild($('overlay-image'));
        document.body.removeChild($('overlay-background'));
        var head = document.getElementsByTagName('head')[0];
        head.removeChild($('overlay-style'));
        var css = document.createElement('link');
        css.setAttribute('rel', 'stylesheet');
        css.setAttribute('type', 'text/css');
        css.setAttribute('href', httpdocs + 'montana_overlay_remove.css');
        head.appendChild(css);
    },
    createMap: function() {
        var div = Monta.createOverlay();
        if (!div) return;
        div.getElementsByTagName('img')[0].src = httpdocs + 'map_deliver.gif';
        document.body.appendChild(div);
    },
	createCatalog: function() {
        var div = Monta.createOverlay();
        if (!div) return;
        div.getElementsByTagName('img')[0].src = catalogPath + imageId + '.jpg';
        var t = $('section-detail-table').cloneNode(true);
        div.appendChild(t);
        document.body.appendChild(div);
    },
	addEvent: function(src, type, listener) {
		if (src.addEventListener) src.addEventListener(type, listener, false);
		else if (src.attachEvent) src.attachEvent('on' + type, listener);
	},
	createThumbnail: function() {
		var thumbnail = $('item-thumbnail');
		if (!thumbnail) return;
		thumbnail.innerHTML = '';
		var p = document.createElement('p');
		var ul = document.createElement('ul');
		for (var i = 1; i <= imageNum; i++) {
			var li = document.createElement('li');
			var img = document.createElement('img');
			img.src = imagePath + 'thumb/' + imageId + '_' + i + '.jpg';
			img.setAttribute('title', '画像' + i);
			img.setAttribute('alt', '画像' + i);
			img.className = (i != 1 ? '' : 'current');
//			Monta.addEvent(img, 'click', Monta.selectThumbnail);
			Monta.addEvent(img, 'mouseover', Monta.selectThumbnail);
			li.appendChild(img);
			ul.appendChild(li);
		}
        var zoom = $('catalog');
        if (zoom) {
            var a = zoom.cloneNode(true);
			var li = document.createElement('li');
            li.appendChild(a);
            ul.appendChild(li);
            zoom.style.display = 'none';
        }
		for (var i = 1; i <= imageNum; i++) {
			Monta.images[i] = new Image();
			Monta.images[i].src = imagePath + imageId + '_' + i + '.jpg';
		}
		thumbnail.appendChild(p);
		thumbnail.appendChild(ul);
	},
	selectThumbnail : function(e) {
		var element = e.target || e.srcElement;
		var images = $('item-thumbnail').getElementsByTagName('img');
		for (var i = 0, length = images.length; i < length; i++) {
			images[i].className = '';
		}
		var image = $('item-image');
		if (!image) return;
		element.src.match(/_([0-9]+)\.jpg$/);
		element.className = 'current';
		var n = RegExp.$1;
		image.src = Monta.images[n].src;
		image.className = 'current';
	},
	createSelectBox : function() {
		var span = $('order-quantity');
		if (!span) return;
		var input = document.createElement('input');
		input.setAttribute('type', 'text');
		input.setAttribute('size', 2);
		input.setAttribute('name', $('select-dummy').value);
        input.style.width = '2ex';
		input.value = 1;
		span.appendChild(input);
	},
	setKey : function(src) {
		var span = $('order-quantity');
		if (!span) return;
		var input = span.getElementsByTagName('input')[0];
		input.setAttribute('name', src.value);
	},
	load : function() {
		var form = $('order-form');
		if (form) form.style.display = 'block';
		Monta.createSelectBox();
		Monta.createThumbnail();
	}
}
loc = location.href;
if (imageDir == undefined) var imageDir = '';
if (loc.indexOf('local.monta') == -1) {
	var imagePath = 'http://www.monta.co.jp/' + imageDir + '/img/';
    var catalogPath  = 'http://www.monta.co.jp/catalog/' + imageDir + '/';
    var httpdocs  = 'http://www.monta.co.jp/';
} else {
	var imagePath = '/web/img/' + imageDir + '/';
    var catalogPath  = '/web/monta/catalog/' + imageDir + '/';
    var httpdocs  = '/web/monta/';
	if (!imageNum) alert('画像枚数が入力されていません');
}
delete(loc);
Monta.addEvent(window, 'load', Monta.load);