function ImgShw(ID, width, height, alt)
{
	var scroll = "no";
	var top=0, left=0;
	if(width > screen.width-10 || height > screen.height-28) scroll = "yes";
	if(height < screen.height-28) top = Math.floor((screen.height - height)/2-14);
	if(width < screen.width-10) left = Math.floor((screen.width - width)/2-5);
	width = Math.min(width, screen.width-10);
	height = Math.min(height, screen.height-28);
	var wnd = window.open("","","scrollbars="+scroll+",resizable=yes,width="+width+",height="+height+",left="+left+",top="+top);
	wnd.document.write(
		"<html><head>"+
		"<"+"script type=\"text/javascript\">"+
		"function KeyPress()"+
		"{"+
		"	if(window.event.keyCode == 27) "+
		"		window.close();"+
		"}"+
		"</"+"script>"+
		"<title>"+(alt == ""? "Картинка":alt)+"</title></head>"+
		"<body topmargin=\"0\" leftmargin=\"0\" marginwidth=\"0\" marginheight=\"0\" onKeyPress=\"KeyPress()\">"+
		"<img src=\""+ID+"\" border=\"0\" alt=\""+alt+"\" />"+
		"</body></html>"
	);
	wnd.document.close();
}

Event.observe(window, 'load', function() {
	$$('#catalogue a i').each(function(s){s.style.display = 'block';});
	// Уголки в каталоге
	new NS.Corners('#ffefe0');
	// Быстрый поиск в каталоге
	Averi.qs = new Averi.QuickSearch();
});

NS = {

	// Уголки
	//
	Corners: new Class.create({
		// Конструктор
		initialize: function(bg)
		{
			this.bg = bg;			
			// Изменение всех элементов
			var parent, inner, d, style;
			//alert("test");
			var elements = $$('.nsCorners').each((function(e)
			{
				e.complete	? 
							this.showCorners(e) : 
							e.observe('load',(function(event){this.showCorners(e);}).bind(this));
			}).bind(this));
		},

		showCorners: function(e){
				parent = e.up();
				var a = new Array();
				// Добавление дочернего элемента-обертки
				d = e.getDimensions();

				inner = new Element('div', {style: 'cursor: pointer; position: relative; width: '+d.width+'px; height: '+d.height+'px; margin: 0px auto;'});
				
				// Поля
				if (e.getStyle('float') != '') inner.setStyle({float: e.getStyle('float')});
				e.setStyle({margin: '0px', float: 'none'});

				parent.insert({top: inner});

				// Перенос картинки внутрь добавленного элемента
				inner.insert({top: e});

				// Добавление уголков
				style = 'position: absolute; display: block; overflow: hidden;'
				inner.insert(
					'<i style="'+style+' top: 0px; left: 0px; border-top: solid 1px '+this.bg+'; border-left: solid 1px '+this.bg+'; width: 8px; height: 8px;">'+
						'<b style="'+style+' top: 0px; left: 0px; border-top: solid 1px '+this.bg+'; border-left: solid 1px '+this.bg+'; width: 4px; height: 4px;">'+
							'<s style="'+style+' top: 0px; left: 0px; border-top: solid 1px '+this.bg+'; border-left: solid 1px '+this.bg+'; width: 1px; height: 1px;"></s>'+
						'</b>'+
					'</i>'+

					'<i style="'+style+' top: 0px; right: 0px; border-top: solid 1px '+this.bg+'; border-right: solid 1px '+this.bg+'; width: 8px; height: 8px;">'+
						'<b style="'+style+' top: 0px; right: 0px; border-top: solid 1px '+this.bg+'; border-right: solid 1px '+this.bg+'; width: 4px; height: 4px;">'+
							'<s style="'+style+' top: 0px; right: 0px; border-top: solid 1px '+this.bg+'; border-right: solid 1px '+this.bg+'; width: 1px; height: 1px;"></s>'+
						'</b>'+
					'</i>'+

					'<i style="'+style+' bottom: 0px; right: 0px; border-bottom: solid 1px '+this.bg+'; border-right: solid 1px '+this.bg+'; width: 8px; height: 8px;">'+
						'<b style="'+style+' bottom: 0px; right: 0px; border-bottom: solid 1px '+this.bg+'; border-right: solid 1px '+this.bg+'; width: 4px; height: 4px;">'+
							'<s style="'+style+' bottom: 0px; right: 0px; border-bottom: solid 1px '+this.bg+'; border-right: solid 1px '+this.bg+'; width: 1px; height: 1px;"></s>'+
						'</b>'+
					'</i>'+

					'<i style="'+style+' bottom: 0px; left: 0px; border-bottom: solid 1px '+this.bg+'; border-left: solid 1px '+this.bg+'; width: 8px; height: 8px;">'+
						'<b style="'+style+' bottom: 0px; left: 0px; border-bottom: solid 1px '+this.bg+'; border-left: solid 1px '+this.bg+'; width: 4px; height: 4px;">'+
							'<s style="'+style+' bottom: 0px; left: 0px; border-bottom: solid 1px '+this.bg+'; border-left: solid 1px '+this.bg+'; width: 1px; height: 1px;"></s>'+
						'</b>'+
					'</i>'
				);
		}
	}),



	// Слайдер
	//
	Slider: new Class.create({
		// Конструктор
		
		initialize: function(conf) {
			this.conf = conf = Object.extend({
				itemsVisible: 3,
				itemPadding: 0,
				itemBorder: 'solid 1px #fff',
				itemBorderHover: 'solid 1px red',

				buttonsBorder: 'solid 1px #fff',
				buttonsBorderHover: 'solid 1px red',
				buttonsWidth: 20,

				nextImage: '',
				prevImage: '',

				onReady: Prototype.emptyFunction


			}, conf);

			// Текущая картинка
			this.cur = 0;
			this.active = 0;

			// Большая картинка
			this.image = $(conf.image);//.absolutize().setStyle({ width: 'auto', height: 'auto', left: '0px', top: '0px' });

			// Картинки
			this.items = conf.items;

			// Флаг занятости
			this.busy = false;
			this.n = 'slider';

			// Элемент-контейнер
			this.el = $(conf.el).setStyle({
				height: this.getCellHeight() + 'px',
				position: 'relative',
				width: conf.itemsVisible * this.getCellWidth() + (conf.buttonsWidth + 2) * 2 + 'px'
			});

			// Кнопка выбора предыдущей картинкё
			this.prev = new Element('div').setStyle({
				background: (conf.prevImage ? 'url('+conf.prevImage+') no-repeat center center' : 'transparent'),
				border: conf.buttonsBorder,
				cursor: 'pointer',
				float: 'left',
				height: conf.itemHeight+'px',
				width: conf.buttonsWidth+'px'
			})
			.observe('click', this.slide.bind(this, -1))
			.observe('mouseover', (function(){ this.prev.setStyle({ border: this.conf.buttonsBorderHover }); }).bind(this))
			.observe('mouseout', (function(){ this.prev.setStyle({ border: this.conf.buttonsBorder }); }).bind(this));

			// Кнопка выбора следующей картинкиё
			this.next = new Element('div').setStyle({
				background: (conf.nextImage ? 'url('+conf.nextImage+') no-repeat center center' : 'transparent'),
				border: conf.buttonsBorder,
				cursor: 'pointer',
				float: 'left',
				height: conf.itemHeight+'px',
				width: conf.buttonsWidth+'px'
			})
			.observe('click', this.slide.bind(this, 1))
			.observe('mouseover', (function(){ this.next.setStyle({ border: this.conf.buttonsBorderHover }); }).bind(this))
			.observe('mouseout', (function(){ this.next.setStyle({ border: this.conf.buttonsBorder }); }).bind(this));

			// Табличка-слайдер (которая слайдится внутри контейнера)
			this.slider = new Element('table').setStyle({
				borderCollapse: 'collapse',
				borderSpacing: '0',
				height: this.el.getHeight()+'px',
				left: '0',
				position: 'absolute',
				top: '0',
				width: this.items.length * this.getCellWidth() + 'px'
			}).update();
			if (!this.slider.tBodies.length) this.slider.update(new Element('tbody'));

			$(this.slider.tBodies[0]).update(new Element('tr'));

			// Первый ряд
			var tr = this.getRow();

			// Ячейки с превьюшками
			for (var i = 0; i < this.items.length; i++)
				tr.insert({ bottom: new Element('td')
					.setStyle({
						cursor: 'pointer',
						height: conf.itemHeight+'px',
						width: conf.itemWidth+'px',
						padding: '0 '+conf.itemPadding+'px'
					})
					.update(new Element('img', { src: this.items[i][0] })
						.setStyle({
							border: conf.itemBorder
						//	height: conf.itemHeight+'px',
						//	width: conf.itemWidth+'px'
						})
						.observe('mousedown', this.clickHandler.bind(this, i))
						.observe('mouseover', this.mouseOverHandler.bind(this, i))
						.observe('mouseout', this.mouseOutHandler.bind(this, i))
					)
				});

			this.el
				.update(this.prev)
				.insert({ bottom: new Element('div').setStyle({
					float: 'left',
					height: this.getCellHeight() + 'px',
					overflow: 'hidden',
					position: 'relative',
					width: conf.itemsVisible * this.getCellWidth() + 'px'
				}).update(this.slider) })
				.insert({ bottom: this.next });

			// Активация
			this.activate(this.active);
		},

		// Получение ширины ячейки
		getCellWidth: function(){ return this.conf.itemWidth + 2 * this.conf.itemPadding + (this.conf.itemBorder ? 2 : 0); },
		getCellHeight: function(){ return this.conf.itemHeight + (this.conf.itemBorder ? 2 : 0); },

		// Получение слайда по индексу111111111
		getSlide: function(index) { return this.getRow().childElements()[index].firstDescendant(); },

		// Получение ряда
		getRow: function() {
			if (!this._row)
				this._row = this.slider.tBodies[0].rows[0];
			return this._row;
		},

		// Сдвиг
		slide: function(step) {
			if (step == undefined) step = 1;
			if (!this.busy && ((step > 0 && this.cur <= this.items.length - step - this.conf.itemsVisible) || (step < 0 && this.cur >= -step)))
			{
				this.busy = true;
				new Effect.Move(this.slider, {
					x: -step * this.getCellWidth(),
					duration: 0.1 * Math.abs(step),
					fps: 50,
					afterFinish: (function(){ this.busy = false; }).bind(this)
				});
				this.cur += step;
			}
		},

		// Активация картинки
		activate: function(index) {
			this.active = index;
			this.getRow().childElements().each((function(s){
				s.firstDescendant().setStyle({ border: this.conf.itemBorder });
			}).bind(this));
			this.getSlide(index).setStyle({ border: this.conf.itemBorderHover });
		},


		// События клика на ячейке
		clickHandler: function(index) {
			this.activate(index);

			this.image.src = this.items[index][1];
			
			this.image.observe('load', (function() {
				var p = this.image.up().getDimensions();
				var i = this.image.getDimensions();
				this.image.setStyle({
					left: Math.round(p.width / 2 - i.width / 2)+'px',
					top: Math.round(p.height / 2 - i.height / 2)+'px'
				});
				this.conf.onReady();
			}).bind(this));
		},

		mouseOverHandler: function(index) {
			if (this.active != index)
				this.getSlide(index).setStyle({ border: this.conf.itemBorderHover });
		},

		mouseOutHandler: function(index) {
			if (this.active != index)
				this.getSlide(index).setStyle({ border: this.conf.itemBorder });
		}
	})

}

Averi = {
	qs : new Object,

	// Куиксёрч
	//
	QuickSearch: new Class.create
	({
		// Конструктор
		initialize: function()
		{
			this.button = $('filterButton');
			this.filter = $('filter');
			this.cat = $('cat');
			this.filter_2 = $('filter_2');
			this.ajax_url = "/catalog/ajax.php";
			this.form = $('filter_form');

			if (this.button)
			{
				// Обработчик
				this.button.observe('click', (function(){ this.filter.toggle(); }).bind(this))

				// Скрытие фильтра
				this.filter.hide();

				this.form.observe('submit', (function(){this.do_search();}).bind(this));

				// Список элементов для ввода
				//$$('#filter input, #filter select').each((function(e){e.observe('change', this.filter);}).bind(this));
			}
		},

		// Обработка изменения содержимого элементов формы
		section_change: function(val)
		{
			$$('.sect').each(function(e){e.hide();})
			new Ajax.Request(this.ajax_url + "?SID=" + val, {
				method: 'get',
				onSuccess: function(transport) {
					$('filter_2').update(transport.responseText);
				}
			});
		},

		do_search: function()
		{
			$('filter_form').request({
				contentType: 'application/x-www-form-urlencoded',
				encoding: 'windows-1251',
				method: 'post',
				onComplete: function(transport){ $('search_res').update(transport.responseText); new NS.Corners('#ffefe0');}
			});			
		}
	}),

	// Слайдер
	//
	Slider: new Class.create(NS.Slider, {
		// Конструктор
		initialize: function($super, _items)
		{
			$super({
				el: 'slider',
				itemWidth: 80,
				itemHeight: 80,
				items: _items,
				itemsVisible: 3,
				itemBorder: 'solid 1px #ffefe0',
				itemBorderHover: 'solid 1px #bc311c',
				buttonsBorder: 'solid 1px #ffefe0',
				buttonsBorderHover: 'solid 1px #bc311c',
				nextImage: '/images/button_next.png',
				prevImage: '/images/button_prev.png',
				image: 'sliderImage'
			});

			//###################### Sardak Anton coded here
			// Onclick handler that opens large image
			this.image.observe('click', (function(){
					ImgShw(this.items[this.active][2],'800','600', ''); 
					return false;
			}).bind(this));
			//########################################################
		}
	})
}