(function ($) {
var self = mm.bnr = mm.extend({
	
/* ===============================	 */
	
	firstTimelag:  500,
	slideInterval: 10000,
	slideSpeed:    300,
	bnrPath:       '/uploads/img/banner/',
	badgePath:     '/uploads/img/badge/',
	
/* ===============================	 */
	
	init: function () {
		var bnr = $('div.frm-bnr');
		if (!bnr.length)
			return;
		
		this.items(bnr);
	},
	
/* ===============================	 */
	
	items: function (bnr) {
		var xml     = '/uploads/xml/pickup-items.xml';
		var data    = [];
		this.badges = [];
		
		$.ajax({
			url      : xml,
			type     : 'GET',
			dataType : 'xml',
			cache    : false,
			success  : this.bind(function (_ajax, r) {
				r = $(r);
				this.each(r.find('pickup item'), function (i, item) {
					item = $(item);
					data[i] = {
						id:     item.attr('id'),
						badge:  item.attr('badge'),
						url:    item.find('url').text(),
						target: item.find('target').text(),
						img:    this.bnrPath + item.find('img').text(),
						alt:    item.find('alt').text()
					};
				});
				
				this.each(r.find('badges item'), function (i, item) {
					item = $(item);
					this.badges[item.attr('id')] = {
						id:  item.attr('id'),
						url: this.badgePath + item.find('url').text(),
						alt: item.find('alt').text()
					}
				});
				
				this.config(bnr, data);
			})
		});
	},
	
	config: function (bnr, _data) {
		var xml  = '/uploads/xml/pickup.xml';
		
		$.ajax({
			url      : xml,
			type     : 'GET',
			dataType : 'xml',
			cache    : false,
			success  : this.bind(function (_ajax, r) {
				r = $(r);
				
				this.autoscroll = parseInt(r.find('slidebnr page[id="' + _page + '"]').attr('autoscroll'));
				var ids = this.map(r.find('slidebnr page[id="' + _page + '"] ids').text().split(','), function (id) {
					return parseInt(id);
				});
				this.data = this.map(ids, function (id) {
					return _data[id-1];
				});
				
				this.render(bnr);
			})
		});
	},
	
	render: function (bnr) {
		var el = $([
			'<div class="ctrl">',
			'<ul>',
			'<li class="prev"><a href="#">prev</a></li>',
			'<li class="next"><a href="#">next</a></li>',
			'</ul>',
			'<ol class="num' + this.data.length + '"></ol>',
			'</div>'
		].join(''));
		
		var ul = $('<ul class="scroll"></ul>');
		var ol = el.find('ol');
		
		bnr.append(ul);
		bnr.append(el);
		
		this.each(this.data, function (i, _data) {
			ol.append('<li' + ((i == 0) ? ' class="on"' : '') + '></li>');
			
			if (i == 0)
				ul.append([
					'<li>',
					'<a href="' + _data.url + '" target="' + (_data.target || '') + '">',
					(_data.badge ? '<p><img class="png" src="' + this.badges[_data.badge].url + '" alt="' + this.badges[_data.badge].alt + '" /></p>' : ''),
					'<img src="' + _data.img + '" alt="' + _data.alt + '" />',
					'</a>',
					'</li>'
				].join(''));
		});
		
		this.scroll(bnr, ul, ol);
		
		if (this.autoscroll)
			this.initSetTimeout();
	},
	
	scroll: function (bnr, ul, ol) {
		var count = this.data.length;
		var max   = (count-1) * this.move * -1;
		var min   = 0;
		var move  = 215;
		var now   = 0;
		var left  = 0;
		var lock  = false;
		
		var prev  = bnr.find('li.prev a');
		var next  = bnr.find('li.next a');
		
		next.click(this.bind(function () {
			if (lock)
				return false;
			lock = true;
			
			if (this.autoscroll) {
				clearTimeout(this.timeoutTimer);
				clearInterval(this.intervalTimer);
			}
			
			now++;
			
			if (now >= this.data.length)
				now = 0;
			
			var _data = this.data[now];
			ul.append([
				'<li>',
				'<a href="' + _data.url + '" target="' + (_data.target || '') + '">',
				(_data.badge ? '<p><img class="png" src="' + this.badges[_data.badge].url + '" alt="' + this.badges[_data.badge].alt + '" /></p>' : ''),
				'<img src="' + _data.img + '" alt="' + _data.alt + '" />',
				'</a>',
				'</li>'
			].join(''));
			
			ul.animate({left: '-=' + move}, this.slideSpeed, this.bind(function () {
				left = parseInt(ul.css('left'));
				ol.find('li').removeClass('on').eq(now).addClass('on');
				ul.css({left: 0}).find('li:first').remove();
				
				lock = false;
				
				if (this.autoscroll)
					this.initSetTimeout();
			}));
			
			return false;
		}));
		
		prev.click(this.bind(function () {
			if (lock)
				return false;
			lock = true;
			
			if (this.autoscroll) {
				clearTimeout(this.timeoutTimer);
				clearInterval(this.intervalTimer);
			}
			
			now--;
			
			if (now < 0)
				now = this.data.length -1;
			
			var _data = this.data[now];
			ul.css({left: -215}).prepend([
				'<li>',
				'<a href="' + _data.url + '" target="' + (_data.target || '') + '">',
				(_data.badge ? '<p><img class="png" src="' + this.badges[_data.badge].url + '" alt="' + this.badges[_data.badge].alt + '" /></p>' : ''),
				'<img src="' + _data.img + '" alt="' + _data.alt + '" />',
				'</a>',
				'</li>'
			].join(''));
			
			ul.animate({left: '+=' + move}, this.slideSpeed, this.bind(function () {
				left = parseInt(ul.css('left'));
				ol.find('li').removeClass('on').eq(now).addClass('on');
				ul.find('li:last').remove();
				
				lock = false;
				
				if (this.autoscroll)
					this.initSetTimeout();
			}));
			
			return false;
		}));
	},
	
/* ===============================	 */
	
	initSetTimeout: function () {
		this.timeoutTimer = setTimeout(this.bind(function () {
			this.initSetTimer();
		}), this.firstTimelag);
	},
	
/* ===============================	 */
	
	initSetTimer: function () {
		this.intervalTimer = setInterval(this.bind(function () {
			$('div.frm-bnr ul li.next a').click();
		}), this.slideInterval);
	}
});

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

$(function () {
	mm.bnr.init();
});
})(jQuery);

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