
/*
 * Copyright (C) 2010/2011 Im-At-Home BV
 * All Rights Reserved
 * No copying, duplication or replication of code permitted without
 * express permission of Im-At-Home BV
 * 
 */

App.UI = {
		
	hasInit : false,
	inviteTrigger : 0,
	
	__preinit : function(){
		
		if (this.hasInit) return;
		this.hasInit = true;
		
		$('*').bind('page-refresh', function(object, data) { App.UI.Tiny.__setup(data); });
		$('*').bind('load-tiny', function(object, data) { App.UI.Tiny.loadTiny(data); });
		$('*').bind('create-tab', function(object, data){ App.UI.Tabs.__createTab(data); });
		$('*').bind('tab-options', function(object, data){ App.UI.Tabs.__tabOptions(data); });
		
		$('*').bind('do-start', function(object, data){ App.WorkFlow.__triggerDialog(data); });
		$('#subchoice li').live('click', function(oEvent){ App.doStart.__init(oEvent); });
		
		
		$('*').bind('do-invite', function(object, data){ App.WorkFlow.acceptInvitation(data); });		
		$('*').bind('do-login', function(object, data){ App.WorkFlow.__triggerDialog(data); });
		
		
		$('dt.accordeon').live('click', function(oEvent) { App.UI.accordeon(oEvent, 'standard'); });
		$('dt.accordeon_d').live('click', function(oEvent) { App.UI.accordeon(oEvent, 'dynamic'); });
		$('.panel_menu .icon').live('click', function(oEvent) { App.UI.panelActions(oEvent); });
		$('.viw_options .option').live('click', function(oEvent) { App.UI.changeOption(oEvent); });
		
		$('[data-component="dataswitcher"]').live('click', function(oEvent) { App.UI.changeDatasource(oEvent); });
		
		$('[data-tab]').live('click', function(oEvent) { App.UI.Tabs.handleClick(oEvent, 'load'); });
		$('.tabmenu li .close').live('click', function(oEvent) { App.UI.Tabs.handleClick(oEvent, 'close'); });
		
		$('.dialogbox .button[data-buttontype="cancel"]').live('click', function(oEvent){ App.UI.DialogManager.closeByObject(oEvent.currentTarget); });
		$('.datepicker').live('click', function(oEvent) { oEvent.target.previousSibling.currentValue = oEvent.target.previousSibling.value; });
		
		$('.row_column input.chkall').live('click', function(oEvent){ App.UI.checkUncheck(oEvent); });
		
		$('[data-detail]').live('click', function(oEvent){ App.UI.__viewDetails(oEvent); });
		
		$('#changelang .languages li').live('click', function(oEvent){ App.UI.changeLanguage(oEvent); });
		
	},
	
	accordeon : function(oEvent, mode) {
		
		if (oEvent == null) return;
				
		if (($(oEvent.target).hasClass('pagenav')==true) || ($(oEvent.target).attr('data-event')!=null) || ($(oEvent.target).attr('data-url')!=null)) {
			oEvent.preventDefault();
			return;
		}
				
		var oElement = oEvent.currentTarget;
		var acc = $(oElement).parent('dl');
		
		if(mode == 'dynamic') {
			if($(oElement).parents('section').attr('id') == 'authorize'){
				$('dt', acc).removeClass('selected');
			}
			$('dd', acc).slideUp(100);
		}
		
		if($(oElement).next('dd').is(':visible')) {
			if(($(oElement).parents('section').attr('id') == 'authorize') || ($(oElement).parents('section').attr('id') == 'criteria')){
				$(oElement).removeClass('selected');
			}
			$(oElement).next('dd').slideUp(100);
		} else {
			if(($(oElement).parents('section').attr('id') == 'authorize') || ($(oElement).parents('section').attr('id') == 'criteria')){
				$(oElement).addClass('selected');
			}
			$(oElement).next('dd').slideDown(100).css({'display':'block'});
		}
		
	},
	
	panelActions : function(oEvent){
		var oElement = oEvent.currentTarget;
		var name = oElement.className;
		name = name.replace('icon ','');
		var container = $(oElement).parents('.c_panel');
		switch(name) {
			case 'show':{
				$('.content', container).slideUp('fast', function(){
					$(oElement).removeClass('show').addClass('hide');
				});
				break;
			}
			case 'hide':{
				$('.content',container).slideDown('fast', function(){
					$(oElement).removeClass('hide').addClass('show');
				});
				break;
			}
			case 'close':{
				$(container).slideUp('fast', function(){ $(container).remove(); });
				break;
			}
			
			case 'dialog':{
//				$('*').triggerHandler('page-refresh', null);
				setTimeout(function(){ App.DialogBox.__closeWindow(); return true; }, '3000');
			}
		}
		
	},
	
	changeOption : function(oEvent) {
		
		if (oEvent==null) return;

		var parent = $(oEvent.currentTarget).parents('.viw_options');
		var target = $(parent).data('target');

		if ((target == 'undefined') || (target == null)) return;
		
		var option = $(oEvent.currentTarget).data('id');
		if ((option == 'undefined') || (option == null)) return;

		var currentOption = $('#' + target + ' .view.selected');

		if (!($(currentOption).hasClass(option))) {
			$('.option', parent).removeClass('selected');
			$(oEvent.currentTarget).addClass('selected');
			$('#' + target + ' .view.selected').removeClass('selected');
			$('#' + target + ' .view.'+option).addClass('selected');			
			var oData = { 'object': parent, 'param': option };
			$('*').triggerHandler('view-refresh', oData);			
		}		
		
	},
	
	backto : function(oEvent, oArgs){
		if((oArgs.url == null) || (oArgs.url == 'undefined')) return;
		App.Core.Nav.changeMenu(oArgs.url);
	},
	
	refresh : function() {
		// does nothing !!
	},
	
	checkUncheck : function(oEvent) {
		
		var sEl = $(oEvent.currentTarget);
		var parent = $(sEl).parents('dl');
		($(sEl).is(':checked')) ? $('input:checkbox', parent).attr('checked', true) : $('input:checkbox', parent).attr('checked', false);
		
	},
	
	changeDatasource : function(oEvent) {
		
		if (oEvent==null) return;
		if ($(oEvent.currentTarget).hasClass('selected')) return;
		
		$(oEvent.currentTarget).parent().children('[data-component="dataswitcher"].selected').removeClass('selected');		
		$(oEvent.currentTarget).addClass('selected');
		
		var target = $(oEvent.currentTarget).attr('data-target');
		if ((target == 'undefined') || (target == null)) return;
		
		var datasource = $(oEvent.currentTarget).attr('data-datasource');
		if ((datasource == 'undefined') || (datasource == null)) return;
		
		$(target).attr('data-datasource', datasource);
		
		var classType = $(target).attr('data-component');
		if ((classType == 'undefined') || (classType == null)) return;
		
		switch (classType) {
			case 'repeater': {
				App.UI.Repeater.refresh();
				break;
			}
			case 'list': {
				App.UI.List.refresh();
				break;
			}
			default: {
				// dont do anything yet ;)
				break;
			}
		}		
		
	},
	
	testEmail : function(oEvent){
		var oRequest = { actions: [{action: 'testEmail'}],jw:App.Core.Security.code };
		App.Core.Application.appHandler(oEvent, oRequest);
	},
	
	_attrObject : function(attr){
		var bValid = false;		
		if(typeof attr == 'string'){						
			for (_oData in eval('('+ attr +')')) if(typeof _oData != 'function')  bValid = true;							
			if(bValid) return eval('('+ attr +')');
			else return console.info('No functions allowed');			
		}
	},
	
	__viewDetails : function(oEvent) {
		
		var url = (oEvent.currentTarget != null) ? $(oEvent.currentTarget).attr('data-url') : oEvent.data_url;		
		if((url == null) || (url == 'undefined')) {			
			var attr = $(oEvent.currentTarget).attr('data-detail');				
			oData = this._attrObject(attr);			
			if(oData != null) {
				$('*').triggerHandler('create-tab', oData);
				$('*').triggerHandler('event-track', {'category': oData.category, 'event':'view', 'info':oData.id});
			} 			
		} else {
			App.Core.Nav.mainMenu(oEvent);
		}
		
	},
	
	switchSideView :function(data){
				
		switch(data.side){
			
			case 'jobs':{
				App.Jobs.switchSide(data.id);
				break;
			}
			
		}
	},
	
	changeLanguage : function(oEvent){
		var target = oEvent.currentTarget;
		var oData = {};
		oData.lang = $('img', target).attr('alt');
		
		if(oData.lang != ''){
			var oRequest = {actions: [{action: 'changeLanguage',data: oData}],jw: App.Core.Security.code};
			$('*').triggerHandler('handle-app', oRequest);
		}
		
	}
	
	
};

App.doStart = {
	
	
	__init : function(oEvent){
		var element = oEvent.currentTarget;
		var mode = $(element).attr('data-mode');
		
		this.__loadPage(mode);
	},
	
	__loadPage : function(mode){
		var target = $('#dostart');
		
		if($(target).hasClass(mode)) return;
		
		$(target).removeClass();
		
		$(target).load('/main/startscreen/'+ mode, function(){
			$(this).addClass(mode);
		});
	},
	
	handleChoice : function(oEvent, oArgs){
		var link = null;
		var mode = oArgs.mode;
		switch(mode){
			
			case 'free':{
				link  = '/subscriptions/purchase/2';				
				break;
			}
			
			case 'business':{
				link = '/subscriptions/purchase/15';
				break;
			}
			
		}
		
		App.UI.DialogManager.closeByObject(oEvent);	
	}
	
};

App.Mail = {
	
	itemSelected : function(oEvent, oArgs) {
		// does nothing yet...
	}
		
};


App.UI.Tiny = {
	
	hasInit : false,
		
	__preinit : function() {
		if (this.hasInit) return;
		this.hasInit = true;		
		$('*').bind('data-refresh page-refresh', function(object, data) { App.UI.Tiny.refresh(null); });	
	},
	
	
	refresh : function() {
		this.__setup(null);
	},
	
	__setup: function(data) {
		if ($('body').find('textarea.tinymce').attr('id') != null) {			
			var oArgs = {};
			oArgs.change = false;
			var oTextarea = $('body').find('textarea.tinymce');
			
			for (var i=0; i < oTextarea.length; i++ ) {				
				var isMce = $(oTextarea[i]).attr('data-init');				
				if ((isMce == null) || (isMce == 'undefined')) {
					$(oTextarea[i]).attr('data-init', 'done');
					
					oArgs.id = $(oTextarea[i]).attr('id');
					App.UI.Tiny.__executeTiny(oArgs);
				}				
			}
			
		}
	},
	
	loadTiny : function(oArgs){
		if((oArgs == null) || (oArgs == 'undefined')) return;
		
		var oParams= {};
		oParams.id = oArgs.id;
		oParams.theme = oArgs.theme;
		oParams.change = (oArgs.change != null)? oArgs.change: null;
		switch(oArgs.theme){
			case 'simple':{
				oParams.btn1 = 'bold,italic,underline,|,bullist,numlist';
				oParams.btn2 = '';
				oParams.btn3 = '';
				oParams.btn4 = '';
				oParams.plugins = 'paste';
				oParams.format = '';
				oParams.br_new = false;
				oParams.p_new = false;
				oParams.root_block = 'p';
				break;
			}
			
			case 'admin':{
				oParams.btn1 = 'bold,italic,underline,strikethrough,|,bullist,numlist,|,link,unlink,|,code';
				oParams.btn2 = 'styleselect,formatselect';
				oParams.btn3 = '';
				oParams.btn4 = '';
				oParams.plugins = 'paste';
				oParams.format = 'p,h1,h2,h3,h4,h5';
				oParams.br_new = false;
				oParams.p_new = false;
				oParams.root_block = false;
				break;
			}
			
			case 'advanced':{
				oParams.btn1 = 'save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect';
				oParams.btn2 = 'cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor';
				oParams.btn3 = 'tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen';
				oParams.btn4 = 'insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak';
				oParams.plugins = 'pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,advlist';
				oParams.format = '';
				oParams.br_new = false;
				oParams.p_new = false;
				oParams.root_block = 'p';
				break;
			}
		}
		
		App.UI.Tiny.__executeTiny(oParams);
	},
	
	__executeTiny :function(oArgs) {
				
		if((oArgs == null) || (oArgs == 'undefined')) var oArgs = {};
		
		if((oArgs.theme == null) || (oArgs.theme == 'undefined')){
			oArgs.btn1 = 'bold,italic,underline,|,bullist,numlist';
			oArgs.btn2 = '';
			oArgs.btn3 = '';
			oArgs.btn4 = '';
			oArgs.plugins = 'paste';
			oArgs.format = '';
			oArgs.br_new = false;
			oArgs.p_new = false;
			oArgs.root_block = 'p';
		}
		
		var onChange;
		if((oArgs.change == null) ||(oArgs.change == 'undefined')){
			onChange = '';
		} else {
			onChange = oArgs.change;
		}
		
		$('#'+ oArgs.id).tinymce({
			// Location of TinyMCE script
			script_url : '/js/tiny_mce/tiny_mce.js',
			
			// General options
			mode : 'none',
			theme : 'advanced',
			plugins : oArgs.plugins,
			force_br_newlines : oArgs.br_new,
			force_p_newlines : oArgs.p_new,
			forced_root_block : oArgs.root_block,
			width : '100%',
			paste_auto_cleanup_on_paste : true,
			onchange_callback : onChange,
			
			// Theme options
			
			theme_advanced_buttons1 : oArgs.btn1,
			theme_advanced_buttons2 : oArgs.btn2,
			theme_advanced_buttons3 : oArgs.btn3,
			theme_advanced_buttons4 : oArgs.btn4,
						
			theme_advanced_toolbar_location : 'top',
			theme_advanced_toolbar_align : 'left',
			theme_advanced_statusbar_location : '',
			theme_advanced_resizing : false,
			theme_advanced_blockformats : oArgs.format,

			// Example content CSS (should be your site CSS)
			content_css : '/css/tiny/editor.css',

			// Drop lists for link/image/media/template dialogs
			template_external_list_url : 'lists/template_list.js',
			external_link_list_url : 'lists/link_list.js',
			external_image_list_url : 'lists/image_list.js',
			media_external_list_url : 'lists/media_list.js',

			// Replace values for the template plugin
			template_replace_values : {
				username : 'App',
				staffid : '11115'
			}
		});
		
	}
	
};

App.UI.ModuleLoader = {
	
	hasInit : false,	
		
	__preinit : function() {
		
		if (this.hasInit) return;
		this.hasInit = true;

		$('[data-component="moduleloader"] li').live('mouseover mouseout click', function(oEvent) { 
			App.UI.ModuleLoader.mouseControl_option(oEvent);
		});

	},
	
	mouseControl_option : function(oEvent) {
		if (oEvent == null) return;
		
		var parent = $(oEvent.currentTarget).parents('ul');
		
		switch (oEvent.type) {

			case 'mouseover': {
				$(oEvent.currentTarget).addClass('hover');
				break;
			}

			case 'mouseout': {
				$(oEvent.currentTarget).removeClass('hover');
				break;
			}
			
			case 'click': {
				if ($(oEvent.currentTarget).hasClass('selected')) return;
				$('li.selected', parent).removeClass('selected');
				$(oEvent.currentTarget).addClass('selected');
				var page = $(oEvent.currentTarget).attr('data-id');
				if ((page == 'undefined') || (page == null)) return;
				App.UI.ModuleLoader.__loadPage(parent, page);
				break;
			}
		
		}
		
	},
	
	__loadPage : function(target, page) {
		
		if ((target==null) || (page==null) || (page=='')) return;
		
		var wintarget = $(target).attr('data-target');
		if ((wintarget == 'undefined') || (wintarget == null)) return;
		
		$(wintarget).load(page, function() {				
			// load content - after do nothing...
			$('*').triggerHandler('page-refresh', null);
		});
		
	},

	refresh : function() {
		
		// wont do much actually....
		$('#mainbody > .inner').find('[data-component="moduleloader"]').each(function() { 
			App.UI.ModuleLoader.__create(this); 
		});						
		
	},
	
	__create : function(target) {
		if (target == null) return;
		
	}
				
};

App.UI.Tabs = {
	
	counter : 1,
		
	handleClick : function(oEvent, type) {
		var oElement = oEvent.currentTarget;
		switch(type){
			case 'load':{
				this.__loadTab(oElement);
				break;
			}
			case 'close':{
				this.__closeTab(oElement);
				break;
			}
		}
		
	},
	
	__loadTab: function(oElement){
		var oEl = $(oElement).attr('data-tab');
		var parent = oElement.parentNode;
		var container = $(parent).parent();
		
		$(parent).children('li').each(function() {
			var rel = $(this).attr('data-tab');
			var mode = ($(this).attr('data-mode') != null) ? $(this).attr('data-mode') : null;
			
			if(rel === oEl) {
				if(!$(this).hasClass('selected')) {
					$(this).addClass('selected');
					$('#'+ rel, container).addClass('selected');
					if(mode != null) $('*').triggerHandler('tab-options', {'mode':mode, 'element':oElement });
					
					var seoref = $(this).attr('data-seo');
					
					if ((seoref != null) && (seoref != 'undefined')) {
						var seoUrl = App.Core.Nav.createSEOUrl(seoref);			
						if (seoUrl.accept) { 
							App.Core.Nav.seoAbort = true;
							window.location.hash = seoUrl.hash;
						}
					}
					
				}
			} else {
				if($(this).hasClass('selected')) {
					$(this).removeClass('selected');
					$('#'+ rel, container).removeClass('selected');
				}
			}
		});
		
	},
	
	__closeTab : function(oEvent){
		var oElement = $(oEvent).parents('li');
		var elId = $(oElement).attr('data-tab');
		var mode = (($(oElement).attr('data-mode') != null) || ($(oElement).attr('data-mode') != 'undefined')) ? $(oElement).attr('data-mode') : null ;
		
		if($(oElement).hasClass('selected')){
			var defId = $(oElement).parent().find('li:first-child').attr('data-tab');
			$(oElement).parent().find('li:first-child').addClass('selected');
			$('#'+ defId).addClass('selected');
		}
		
		var oData = {};
		oData.mode = mode;
		
		if((mode != null) && ($(oElement).hasClass('selected'))) {
			$('*').triggerHandler('tab-options', oData);
		} 
		$(oElement).remove();
		$('#'+ elId).remove();
		
	},
	
	__createTab : function(data){
		
		if(data.mode == 'jobs') $('#jobfilter').hide();
		if(((data.referer != null) || (data.referer != 'undefined')) && (data.referer == 'search')) $('*').triggerHandler('reset-search', null);
		
	 	var parent = $('#'+ data.target);
		var tabs = $('#'+ data.target +' > .tabmenu li');
		
		for (var i = 0; i < tabs.length; i++) if($(tabs[i]).attr('data-tab') == 'dt_'+ data.id) return this.__loadTab(tabs[i]);
		
		var oTab , oDetail;
		var id = ((data.id != null) || (data.id != 'undefined')) ? data.id : '0'+ this.counter++ ;
		
		var seoroot = $(parent).attr('data-seoroot');
		var seoref = null;
		
		oTab = '<li data-tab="dt_'+ id +'" data-mode="'+ data.mode +'"';
		
		if ((seoroot != 'undefined') || (seoroot != null)) {
			seoref = seoroot + '/' + id;
			oTab += ' data-seo="' + seoref + '"';
		}
		
		oTab += '>';		
		oTab += '<span>'+ data.title +'<span class="icon close"></span></span></li>';
		
		oDetail = '<section id="dt_'+ id +'" class="tab"></section>';
		
		$('#'+ data.target +' > .tabmenu li.selected').removeClass('selected');
		$('#'+ data.target +' > .tab.selected').removeClass('selected');
		$('#'+ data.target +' > .tabmenu').append(oTab);
		
		$(parent).append(oDetail);
		
		$('.tabmenu li[data-tab="dt_'+ data.id +'"]', parent).addClass('selected');
				
		if (seoref != null) {
			var seoUrl = App.Core.Nav.createSEOUrl(seoref);			
			if (seoUrl.accept) { 
				App.Core.Nav.seoAbort = true;
				window.location.hash = seoUrl.hash;
			}
		}
		
		$('#dt_'+ id).load(data.page, function(){
			
			if((data.refresh != null) && (data.refresh == true)) {
				$('*').triggerHandler('page-refresh', null);								
			}
			
			if (data.mode != null) {
				data.id = id;
				$('*').triggerHandler('tab-options', data);
			}
						
		}).addClass('selected');
		
	},
	
	__tabOptions : function(data){
		if(data.mode == null) return;
		
		switch(data.mode){
			
			case 'jobs':{
				if(!$('#jobfilter').is(':visible')) $('#jobfilter').show();
				break;
			}
			
		}
	}
	
};


App.UI.DatePicker = {
	
	hasInit : false,
		
	__preinit : function() {
		if (this.hasInit) return;
		this.hasInit = true;		
		
		$('*').bind('data-refresh page-refresh window-refresh', function(object, data) { App.UI.DatePicker.init(); });	
	},
	
	init : function() {
		
		$('.datepicker.editjob').datepicker(App.UI.DatePicker.config.editjob);
		$('.datepicker.past').datepicker(App.UI.DatePicker.config.past);
		$('.datepicker.def').datepicker(App.UI.DatePicker.config.def);
		$('.datepicker.present').datepicker(App.UI.DatePicker.config.present);
	},
	
	config : {
		present : {
			yearRange: '-0:+10',
			minDate : '+0y 0m 0d',
			showOn: 'button',
			buttonImage: '/images/layout/icons/calendar.png',
			buttonImageOnly: true,
			changeMonth: true,
			changeYear: true,
			dateFormat: 'dd-mm-yy',
			showWeek : true
		},
		
		editjob : {
			yearRange: '-1:+10',
			minDate : '+0y -6m 0d',
			showOn: 'button',
			buttonImage: '/images/layout/icons/calendar.png',
			buttonImageOnly: true,
			changeMonth: true,
			changeYear: true,
			dateFormat: 'dd-mm-yy',
			showWeek : true
		},
		
		past : {
			yearRange: '-61:-16',
			maxDate : '-16y 0m 0d',
			showOn: 'button',
			buttonImage: '/images/layout/icons/calendar.png',
			buttonImageOnly: true,
			changeMonth: true,
			changeYear: true,
			dateFormat: 'dd-mm-yy',
			showWeek : true
		},
		
		def : {
			yearRange: '-50:+1',
			minDate : '-50y 0m 0d',
			showOn: 'button',
			buttonImage: '/images/layout/icons/calendar.png',
			buttonImageOnly: true,
			changeMonth: true,
			changeYear: true,
			dateFormat: 'dd-mm-yy',
			showWeek : true
		}
		
	}
	
};


$(document).ready(function() {
	
	App.UI.__preinit();
	App.UI.ModuleLoader.__preinit();		
	App.UI.Tiny.__preinit();
	
	// do refreshing just incase we are only event based....

	App.UI.ModuleLoader.refresh();
	App.UI.Tiny.refresh();
	
	App.UI.DatePicker.__preinit();
	
});
