function showSimple(id) {
	var element = document.getElementById(id);
	if( element ){
		element.style.display = 'block';
	}
}


function hideSimple(id) {
	var element = document.getElementById(id);
	if( element ){
		element.style.display = 'none';
	}
}

function toggleView(id){
	var element = document.getElementById(id);
	if( element ){
		if(element.style.display == 'block')
			element.style.display = 'none';
		else
			element.style.display == 'block'
	}
}


/* block view */
function blockView2(id) {
	var boxHeight = document.body.scrollHeight;
	var width = screen.width - 16;
	var rHeight = truebody().scrollTop+180;
	var bg = document.getElementById('bgBox');
	var inside = document.getElementById('insideBox');
	var element = document.getElementById(id);
	
	bg.style.display = 'block';
	bg.style.height = boxHeight+'px';
	bg.style.width = width+'px';
	
	inside.style.display = 'block';
	inside.style.width = width+'px';
	
	elementLeft = width/2 - 300;
	element.style.display = 'block';
	element.style.left = elementLeft+"px";
	element.style.top = "180px";
}

function blockView(id){
	winwidth = parseInt(screen.width / 2.0);
	winheight = parseInt(screen.height / 2.0);
	
	
}

function blockHide(id){
	hideSimple(id);
	hideSimple('bgBox');
	hideSimple('insideBox');
	hideSimple('ie-tos-bg');
}


/* template function */
var activeTabID = 1;
function tabChange(id){
	var nextID = "tabContent-"+ id;
	var nowID = "tabContent-"+ activeTabID;
	var nextMenu = document.getElementById("tabMenu-"+id);
	var nowMenu = document.getElementById("tabMenu-"+activeTabID);
	
	nextMenu.className = "activeTab";
	nowMenu.className = ""; 
	
	if(id != activeTabID){
		showSimple(nextID);
		hideSimple(nowID);
		activeTabID = id;
	}
}

/* template function */
var activeTabID = 1;
function tabChange(id){
	var nextID = "tabContent-"+ id;
	var nowID = "tabContent-"+ activeTabID;
	var nextMenu = document.getElementById("tabMenu-"+id);
	var nowMenu = document.getElementById("tabMenu-"+activeTabID);
	
	nextMenu.className = "activeTab";
	nowMenu.className = ""; 
	
	if(id != activeTabID){
		showSimple(nextID);
		hideSimple(nowID);
		activeTabID = id;
	}
}

function addTemplateUser(onChecked,num,themeid,name,image,price){
	var templateBox = document.getElementById('orderNowTemplate');
	var templateItemName = "orderNowTemplate-item-"+num;
	var templateEtalase = document.getElementById('templateEtalaseItem-'+num);

	if(onChecked == true){

		templateTotal = Cookie.get('templateTotal')==false ? 0:Cookie.get('templateTotal');
		if(parseInt(templateTotal) == 2){
			alert('Maaf anda hanya dapat memilih 2 template saja');
			$('checkboxItem-'+num).checked = false;
			return false;
		}
		var newDiv = document.createElement('div');
		var HTML = '<img src="'+image+'"/>';
		HTML += '<div>'+name+'</div>';
		if(price != 'Rp. 0,-'){
			HTML += '<div>Harga <strong>'+price+'</strong></div>';
		}
		HTML += '<p class="center"><input type="button" class="button" onclick="removeTemplate(\''+num+'\')" value="Hapus Template" /></p>';
		HTML += '<input type="hidden" name="templateids[]" value="'+themeid+'" />';
			
		newDiv.setAttribute("id",templateItemName);
		newDiv.className = "orderNowTemplate-item";
		newDiv.innerHTML = HTML;
		templateBox.appendChild(newDiv); 
		
		templateEtalase.style.opacity = '0.4';
		templateEtalase.style.filter = 'alpha(opacity=40)';
		Cookie.set('template_'+themeid, themeid, {duration: 1/24, path: '/'});
		Cookie.set('templateTotal', parseInt(templateTotal) + 1, {duration: 1/24, path: '/'});
	} else {
		removeTemplate(num);
	}
}

function removeTemplate(divNum){
		var d = document.getElementById('orderNowTemplate');
		var divName = "orderNowTemplate-item-"+divNum;
		var olddiv = document.getElementById(divName);
		d.removeChild(olddiv);
		
		var c = document.getElementById('checkboxItem-'+divNum);
		if( c ){
			c.checked = false;
		}
		
		var templateEtalase = document.getElementById('templateEtalaseItem-'+divNum);
		templateEtalase.style.opacity = '0.99';
		templateEtalase.style.filter = 'alpha(opacity=99)';
		
		Cookie.remove('template_'+divNum, {path: '/'});
		templateTotal = Cookie.get('templateTotal')==false ? 0:Cookie.get('templateTotal');
		if(parseInt(templateTotal) > 0){
			Cookie.set('templateTotal', parseInt(templateTotal) - 1, {duration: 1/24, path: '/'});
		}
}

function addCustomTemplate(onChecked){
	if(onChecked == true){
		showSimple('orderNowCustomTemplate');
		document.getElementById('custom-template-field').disabled = false;
		Cookie.set('template_custom', 'Y', {duration: 1/24, path: '/'});
	} else {
		hideSimple('orderNowCustomTemplate');
		document.getElementById('custom-template-field').disabled = true;
		Cookie.remove('template_custom', {path: '/'});
	}
}

function removeCustomTemplate(){
	var d = document.getElementById('checkBoxCustomTemplate');
	if( d ){
		d.checked = false;
	}
	hideSimple('orderNowCustomTemplate');
	document.getElementById('custom-template-field').disabled = true;
	Cookie.remove('template_custom', {path: '/'});
}

function check_choosen_theme(themes){
	themes.forEach(function(item, index){
		if( Cookie.get('template_'+item) ){
			if( item != 'custom' ){
				var templateEtalase = document.getElementById('templateEtalaseItem-'+item);
				var checkbox = document.getElementById('checkboxItem-'+item);
				var templateitem = document.getElementById('orderNowTemplate-item-'+item);
				if( templateitem ){
					checkbox.checked = true;
					templateEtalase.style.opacity = '0.4';
					templateEtalase.style.filter = 'alpha(opacity=40)';
				}
			} else {
				var customcbox = document.getElementById('checkBoxCustomTemplate');
				var ctemplateitem = document.getElementById('custom-template-field');
				if( ctemplateitem.disabled == false ){
					customcbox.checked = true;
				}
			}
		}
	});
}

function store_template_to_cookie(themes){
	themes.forEach(function(item, index){
		templateTotal = Cookie.get('templateTotal')==false ? 0:Cookie.get('templateTotal');
		Cookie.set('template_'+item, item, {duration: 1/24, path: '/'});
		Cookie.set('templateTotal', parseInt(templateTotal) + 1, {duration: 1/24, path: '/'});
	});
}

function reset_template_cookie(){
	Cookie.remove('templateTotal', {path: '/'});
}