/**
 * @author Sulaeman, sulaeman.nowhere@gmail.com
 */

FeelInc.ui.Guru = function() {

	return {
	
	_currND: 0,
	_extArg: {},
	
	build: function(){
		FeelInc.ui.Default.init();
		if ($('#top-keywords')[0] != null) {
			var _getGuruList = FeelInc.ui.Guru.getGuruList.bind(FeelInc.ui.Guru);
			$('#top-submit').click(function(){_getGuruList()});
			$('#top-keywords').keypress(function(e){
				if(e.keyCode == 13) {
					_getGuruList();
					try {e.preventDefault();} catch(e) {e.returnValue = false;}
					return false;
				}
				return true;
			});
		}
		if ($('#peserta_selector')[0] != null) FeelInc.ui.Guru.generateSelector();
		
	},
	
	generateSelector: function(){
		$('#peserta_selector').empty();
		var _generateKabupaten = FeelInc.ui.Guru.generateKabupaten.bind(this);
		var _generateInstansi = FeelInc.ui.Guru.generateInstansi.bind(this);
		$.post(_doc_root_path+"/page/pembagian", {get: 'selectorplpg', tahun: 0, kab: 0, inst: 1, kabid: 0, jp: 0, instid: 0, mp: 0, jpid: 0}, function(response){
				_generateInstansi(response);
				$.post(_doc_root_path+"/page/pembagian", {get: 'selectorplpg', tahun: 0, kab: 1, inst: 0, kabid: 0, jp: 0, instid: 0, mp: 0, jpid: 0}, function(response){
					_generateKabupaten(response);
			});
		});		
		this.getGuruList();
	},
	
	generateKabupaten: function(response){
		response = FeelInc.decode(response);
		var _generateLokasi = FeelInc.ui.Guru.generateLokasi.bind(this);
		$('#kab_list').remove();
		var _setExtArg = this.setExtArg.bind(this);
		var dllist = $('<dl id="kab_list"/>').append($('<span>Daerah</span>')).appendTo($('#peserta_selector'));
		for (var i = 0; i < response.kab.length; ++i) {
			if (_kab == response.kab[i].unid) this.setExtArg({'kab': response.kab[i].unid});
			dditem = $('<dd class="selector_item"/>');
			a = $('<a id="'+response.kab[i].unid+'" href="javascript:void(0);" class="'+((_kab == response.kab[i].unid) ? ' selected' : '')+'"><span>'+response.kab[i].name+'</span></a>');
			dllist.append(dditem.append(a));
			a.click(function(){
				_setExtArg({'kab': $(this)[0].id});
				$('#kab_list dd.selector_item').each(function(){
					$(this.childNodes).removeClass('selected');
				});
				$(this).addClass('selected');
				FeelInc.ui.Guru.getGuruList();
				_setExtArg({'lokasi': ''});
				$('#lokasi_list').remove();
				if($(this)[0].id !=0){
					$.post(_doc_root_path+"/page/pembagian",{get: 'selectorplpg', kab:$(this)[0].id, lokasi: 1}, function(response){
						_generateLokasi(response);
					});
				}else{
					$('#lokasi_list').remove();
				}

			});
		}
	},
	
	generateInstansi: function(response){
		response = FeelInc.decode(response);
		$('#inst_list').remove();
		$('#pmp_list').remove();
		var _setExtArg = this.setExtArg.bind(this);
		var dllist = $('<dl id="inst_list"/>').append($('<span>Instansi</span>')).appendTo($('#peserta_selector'));
		for (var i = 0; i < response.inst.length; ++i) {
			if (_inst == response.inst[i].unid) this.setExtArg({'inst': response.inst[i].unid});
			dditem = $('<dd class="selector_item"/>');
			a = $('<a id="'+response.inst[i].unid+'" href="javascript:void(0);" class="'+((_inst == response.inst[i].unid) ? ' selected' : '')+'"><span>'+response.inst[i].name+'</span></a>');
			a.click(function(){
				_setExtArg({'inst': $(this)[0].id});
				$('#inst_list dd.selector_item').each(function(){
					$(this.childNodes).removeClass('selected');
				});

				$(this).addClass('selected');
	
				FeelInc.ui.Guru.getGuruList();
			});
			dllist.append(dditem.append(a));
		}
	},

	generateLokasi: function(response){
		$('#lokasi_list').remove();	
		response = FeelInc.decode(response);
		var _setExtArg = this.setExtArg.bind(this);
		var dllist = $('<dl id="lokasi_list"/>').append($('<span>Lokasi</span>')).appendTo($('#peserta_selector'));
		for (var i = 0; i < response.lokasi.length; ++i) {
			if (_inst == response.lokasi[i].unid) this.setExtArg({'lokasi': response.lokasi[i].unid});
			dditem = $('<dd class="selector_item"/>');
			a = $('<a id="'+response.lokasi[i].unid+'" href="javascript:void(0);" class="'+((_lokasi == response.lokasi[i].unid) ? ' selected' : '')+'"><span>'+response.lokasi[i].name+'</span></a>');
			a.click(function(){
				_setExtArg({'lokasi': $(this)[0].id});
				$('#lokasi_list dd.selector_item').each(function(){
					$(this.childNodes).removeClass('selected');
				});

				$(this).addClass('selected');
	
				FeelInc.ui.Guru.getGuruList();
			});
			dllist.append(dditem.append(a));
		}
	},
	
	getGuruList: function(i){
		$('div.tool-tip').each(function(){$(this).remove();});
		var _loading = FeelInc.loading('peserta_content');
		var _storeGuruList = FeelInc.ui.Guru.storeGuruList.bind(this);
		$.post(_doc_root_path+"/page/pembagian", $.extend({get: 'alllist', start: ((i != null) ? (i*10) : 0), limit: 10, search: $('#top-keywords')[0].value}, this._extArg), function(response){_storeGuruList(response);_loading.remove();});
	},
	
	storeGuruList: function(response){
		
		$('#peserta_list').empty();
		
		var i = 0;
		var dd, a, div;
		
		response = FeelInc.decode(response);
		
		$('#pesertandata').text(response.n);
		
		if (response.n > 0) {
			var _getGuruDetail = this.getGuruDetail.bind(this);
			for (i = 0; i < response.list.length; ++i) {
				dd = $('<dd id="item_'+response.list[i].unid+'"/>');
			
				a = $('<a href="javascript:void(0);" title="Klik Untuk Lihat Tempat Pembagian"/>').bind('click', {dataplpg: response.list[i]}, function(e){
					_getGuruDetail(e.data);
				});
				div = $('<div class="data_container"/>');
				a.append(div.html(
					'ID Anda : '+response.list[i].unid+'&nbsp;<font color="#ff0000">|</font>&nbsp;'+
					response.list[i].kode+'&nbsp;<font color="#ff0000">|</font>&nbsp;'+
					response.list[i].nama+'&nbsp;<font color="#ff0000">|</font>&nbsp;'+
					response.list[i].sekolah+'&nbsp;<font color="#ff0000">|</font>&nbsp;'+
					response.list[i].kabupaten+'&nbsp;<font color="#ff0000">|</font>&nbsp;'+
					'No. Kursi : '+response.list[i].no_label+'&nbsp;<font color="#ff0000">|</font>&nbsp;'+
					'PKL. '+response.list[i].waktu
				));
				$('#peserta_list').append(dd.append(a));
				dd.append($('<div id="detail_'+response.list[i].kode+'" class="guru_detail" style="display:none;"/>'));
				new FeelInc.ui.Tips.init(a);
			};
			
		} else {
			$('#peserta_list').html('Maaf, Tidak ada data guru yang bisa ditampilkan.');
		}
		
		if (response.n != this._currND) {
			this.buildPaging(response.n);
		} else if ($('#pagepesertanav_top').html() == '') {
			this.buildPaging(response.n);
		}
		if (response.n != this._currND) this._currND = response.n;
		
	},
	
	getGuruDetail: function(data){
		if($("#detail_"+data.dataplpg.kode).html() == '') {
			var _storeGuruDetail = this.storeGuruDetail.bind(this);
			_storeGuruDetail(data.dataplpg);
		} else {
			if($("#detail_"+data.dataplpg.kode).css('display') == 'none') {
				$("#detail_"+data.dataplpg.kode).slideDown("slow");
			} else $("#detail_"+data.dataplpg.kode).slideUp("slow");
		}
	},
	
	storeGuruDetail: function(response){
		//response = FeelInc.decode(response);
		var table = $('<table cellpadding="0" cellspacing="0"/>');
		var tr = $('<tr/>').appendTo(table);
		var leftContainer = $('<td class="left_container"/>').appendTo(tr);
		var rightContainer = $('<td class="right_container"/>').appendTo(tr);
		//leftContainer.append($('<div class="photo"><div><span/><img src="'+response.pic+'"/></div></div>'));
		rightContainer.append($('<span class="item"><div class="title">Universitas Pembagian</div><label>&nbsp;:&nbsp;</label><div class="value">'+response.lokasi+'</div></span>'));
		rightContainer.append($('<span class="item"><div class="title">Lokasi Pembagian</div><label>&nbsp;:&nbsp;</label><div class="value">'+response.tempat+'</div></span>'));
		rightContainer.append($('<span class="item"><div class="title">Alamat</div><label>&nbsp;:&nbsp;</label><div class="value">'+response.alamat+'</div></span>'));
		rightContainer.append($('<span class="item"><div class="title">Tanggal</div><label>&nbsp;:&nbsp;</label><div class="value">'+response.tanggal+'</div></span>'));
		rightContainer.append($('<span class="item"><div class="title">Pukul</div><label>&nbsp;:&nbsp;</label><div class="value">'+response.waktu+'</div></span>'));
		rightContainer.append($('<span class="item"><div class="title">No. Kursi</div><label>&nbsp;:&nbsp;</label><div class="value">'+response.no_label+'</div></span>'));
		if (response.action != null) rightContainer.append($('<span class="item"><div class="title">&nbsp;</div><label>&nbsp;</label><div class="value">'+response.action+'</div></span>'));
		
		$("#detail_"+response.kode).append(table).slideDown("slow");
	},

	buildPaging: function(n){
		var _getGuruList = this.getGuruList.bind(this);
		$('#pagepesertanav_top').pagination(n, {link_to: 'javascript:void(0);', current_page: 0,num_edge_entries: 2, num_display_entries: 8, prev_text: 'Sebelumnya', next_text: 'Selanjutnya', items_per_page:10, callback:_getGuruList});
	},
	
	getExtArg: function(){
		return this._extArg;
	},
	
	setExtArg: function(opt){
		$.extend(this._extArg, opt);
	}
	
	};
	
}();