/*
---

name: Abacus.Element

description: Element natives

requires: [Array, Function, Element, Element.Style, Element.Event, Element.Dimensions, JSON, Swiff]

provides: [Abacus.Element]

...
*/

(function($){

	Element.implement({
		parseClass: function(name){
			var classname = this.get('class') || '';
			var regex = new RegExp("^.*(\{.*\}).*$", "gi");
			var obj = classname.match(regex) ? JSON.decode(classname.replace(regex, "$1")) : {};
			if (name) return obj[name] || false;
			else return obj;
		},
		parseURL: function(){
			var href = this.get('href');
			if (href && href.contains('?')){
				var queryString = href.split("?")[1];
				var obj = {};
				Array.each(queryString.split("&"), function(pair){
					var parts = pair.split("=");
					obj[parts[0]] = parts[1];
				});
				return obj;
			} else {
				return {};
			}
		},
		toObject: function(){
			var obj = {};
			this.getElements('input, select, textarea').each(function(el){
				var value;
				if (el.get('tag') == 'textarea'){
					value = el.get('value');
				} else {
					var type = el.type;
					if (!el.name || el.disabled || type == 'submit' || type == 'reset' || type == 'file' || type == 'image') return;
					value = (el.get('tag') == 'select') ? el.getSelected().map(function(opt){
						// IE
						return document.id(opt).get('value');
					}) : ((type == 'radio' || type == 'checkbox') && !el.checked) ? null : el.get('value');
				}
				Array.from(value).each(function(val){
					if (typeof val != 'undefined'){
						if (obj[el.name]) obj[el.name] += ',' + val;
						else obj[el.name] = val;
					}
				});
			});
			return obj;
		}
	});

	Element.implement({
		makeTabbed: function (blocks, tabs) {
			var blocks = this.getElements(blocks);
			var tabs = this.getElements(tabs).setProperty('tabindex', 0);
			var selectTab = function () {
				tabs.removeClass('selected');
				blocks.removeClass('selected');
				this.getParent().addClass('selected');
			};
			tabs.addEvents({
				'click': selectTab,
				'focus': selectTab
			});
		},
		makePlaceholder: function(){
			var text = this.parseClass('text');
			var form = this.getParent('form');
			this.addEvents({
				'focus': function(){
					if (this.get('value') == text) {
						this.set('value', '');
					}
					this.removeClass('placeholder-on');
				},
				'blur': function(){
					if (this.get('value') == '' || this.get('value') == text) {
						this.set('value', text);
						this.addClass('placeholder-on');
					}
				}
			});
			if (form){
				form.addEvent('submit', function(){
					if (this.get('value') == text) this.set('value','');
				}.bind(this));
			}
			if (this.get('value') == ''){
				this.set('value', text);
			}
		},
		makeAllClickable: function(action){
			var link = this.getElement('A');
			var href = link.getProperty('href');
			this.addEvents({
				'mouseenter': function(){
					this.addClass('hover');
				},
				'mouseleave': function(){
					this.removeClass('hover');
				},
				'click': function(){
					action ? action.attempt(href, this) : window.location = href;
				}
			});
			var self = this;
			link.addEvent('click', function(evt){
				evt.stop();
				this.blur();
				self.fireEvent('click');
			});
			return this;
		},
		makeExpandable: function(number){
			var type = this.parseClass('typeid') || 'default';
			var more = Abacus.Lang.core.more[type];
			var less = Abacus.Lang.core.less[type];

			var toggleContent = function(){
				var text = (this.getParent('.collapsed') ? less : more);
				this.set('html', text);
				this.getParent().toggleClass('collapsed');
			}
			if (this.get('tag') == 'ul'){
				this.getElements('LI').each(function(item, i){
					if (i < number){
						item.addClass('always');
					} else if (i == number){
						new Element('span').addClass('more').setProperty('tabindex','0').set('html', more).inject(this, 'after');
					}
				}, this);
				if (this.getNext('span.more')){
					this.getNext('SPAN.more').addEvents({
						'click': toggleContent,
						'keydown': function(evt){
							if(evt.code == '13'){
								toggleContent.call(this);
							}
						}
					});
					this.getParent().addClass('collapsed');
				}
			} else {
				new Element('span').addClass('more').setProperty('tabindex','0').set('html', 'hide').inject(this, 'top');
				var toggle = this.getFirst();
				var toggleContent = function(){
					this.set('html', this.getParent().hasClass('hidden') ? 'hide' : 'show');
					this.getParent().toggleClass('hidden');  
				}
				toggle.addEvents({
					'click': toggleContent,
					'keydown': function(evt){
						if(evt.code == '13'){
							toggleContent.call(this);
						}
					}
				});
			}
			return this;
		}
	});
	
	Element.implement({
		makeVideoBlock: function(){
			this.set('html', '<div></div>');
			var options = this.parseClass();
			new Swiff(options.player, {
				container: this.getElement('div'),
				params: {
					wmode: 'transparent',
					quality: 'best',
					scale: 'exactfit',
					allowFullScreen: 'true',
					salign: 'TL'
				},
				vars: {
					videoFile: options.src,
					beginOnFirstFrame: 'true'
				}
			});
		},
		makeAudioBlock: function(){
			this.empty();
			var options = this.parseClass();
			new Swiff(options.player, {
				container: this,
				width: options.width,
				height: options.height,
				params: {
					wmode: 'opaque'
				},
				vars: {
					theme_colour: options.colour,
					file_name: options.name,
					file_src: options.src
				}
			});
		}
	});

	Element.implement({
		wrapWith: function(html){
			var item = new Element('div', {
				html: html
			});
			item.getFirst().wraps(this);
			item.destroy();
			return this;
		}
	});
	
	Window.implement({
		lockViewport: function(){
			if (!document.body.hasClass('scrolllock-enabled')){
				this.store('scrolllock-scrolled', window.getScroll().y);
				document.body.setStyle('overflow', 'hidden').addClass('scrolllock-enabled');
			}
		},
		unlockViewport: function(){
			if (document.body.hasClass('scrolllock-enabled')){
				window.scrollTo(0, this.retrieve('scrolllock-scrolled'));
				this.eliminate('scrolllock-scrolled');
				document.body.setStyle('overflow', null).removeClass('scrolllock-enabled');
			}
		}
	});

})(document.id);