// CJS project
// Module contains functions of editing business card in browser
//-----------------------------------------------------------------------------

var selObj = null;
var selText = null;
var in_ajax = 0;
var previous_logo = null;
var template_id = 1;
var previous_template = 0;

//-----------------------------------------------------------------------------
// Card editor handlers: changes color, font, attributes.
//-----------------------------------------------------------------------------
//
function CardColorSelected() {
	var x = document.getElementById('card_color').selectedIndex;
	var card_color = document.getElementById('card_color').options[x].value;
  
	document.getElementById('card_container').style.background = card_color;
}

//-----------------------------------------------------------------------------
//
function FontNameSelected() {
	var x = document.getElementById('font_name').selectedIndex;
	var font_name = document.getElementById('font_name').options[x].value;
	
	if (selText!=null) {
		selText.style.fontFamily = font_name;
	}
}

//-----------------------------------------------------------------------------
//
function FontSizeSelected() {
	var x = document.getElementById('font_size').selectedIndex;
	var font_size = document.getElementById('font_size').options[x].value;
  
	if (selText!=null) {
		selText.style.fontSize = font_size+'pt';
		//selText.style.width = 16 * parseInt(font_size) + 'pt';
		//selText.focus();
	}
}


//-----------------------------------------------------------------------------
//
function FontColorSelected() {
	var x = document.getElementById('font_color').selectedIndex;
	var font_color = document.getElementById('font_color').options[x].value;
  
	if (selText!=null) {
		selText.style.color = font_color;
	}
}

//-----------------------------------------------------------------------------
//
function FontAtrSelected(atr) {
	//var font_weight = document.getElementById('font_weight').value;
  
	if (selText!=null) {
		current_style = selText.style[atr]; //.fontWeight;
		if (atr=='fontWeight') {
			if (current_style != 'bold') {
				selText.style.fontWeight = 'bold';
			}
			else {
				selText.style.fontWeight = 'normal';
			}
		}
		else if (atr=='fontStyle') {
			if (current_style != 'italic') {
				selText.style.fontStyle = 'italic';
			}
			else {
				selText.style.fontStyle = 'normal';
			}
		} 
		else if (atr=='textDecoration') {
			if (current_style != 'underline') {
				selText.style.textDecoration = 'underline';
			}
			else {
				selText.style.textDecoration = 'none';
			}
		}
	}
}

//-----------------------------------------------------------------------------
//
function TextAlignSelected(align) {
	//var x = document.getElementById('text_align').selectedIndex;
	//var text_align = document.getElementById('text_align').options[x].value;
	
	if (selText!=null) {
		selText.style.textAlign = align; //text_align;
	}
}

//-----------------------------------------------------------------------------
// Drag handlers
//-----------------------------------------------------------------------------
function moveHandler(e){
	if (e == null) { e = window.event } 
    if (e.button<=1&&dragOK){
    	var delta_x = e.clientX-dragXoffset;
    	var delta_y = e.clientY-dragYoffset;
    	selObj.style.left=delta_x + 'px';
        selObj.style.top=delta_y + 'px';
        
        //selObj.innerHTML = selObj.style.left + ' : ' + selObj.style.top;
        
        return false;
    }
}

//-----------------------------------------------------------------------------
function cleanup(e) {
	document.onmousemove=null;
    document.onmouseup=null;
    selObj.style.cursor=orgCursor;
    dragOK=false;
}

//-----------------------------------------------------------------------------
function dragHandler(e){
	var htype='-moz-grabbing';
    
    if (e == null) { e = window.event; htype='move';} 
    var target = e.target != null ? e.target : e.srcElement;
    selObj=target;
    orgCursor=target.style.cursor;

    if (target.className=="card_element") {
    	selText=target;
    }

    if ((target.className=="element_container") || (target.className=="card_logotype")) {
    //if (target.className=="element_container") {
    	target.style.cursor=htype;
        dragOK=true;
        dragXoffset= e.clientX-parseInt(selObj.style.left);
        dragYoffset= e.clientY-parseInt(selObj.style.top);
        document.onmousemove=moveHandler;
        document.onmouseup=cleanup;
        return false;
    }
}

//-----------------------------------------------------------------------------
// 
//-----------------------------------------------------------------------------

//-----------------------------------------------------------------------------
function DefaultIfEmpty(data, defaultValue) {
	if (data == "") {
		return defaultValue;
	}
	else if (data == "rgb(0,0,0)") {
		return defaultValue;
	}
	else {
		return data;
	}
}

//-----------------------------------------------------------------------------
// Generate Business Card Template as XML data 
function GenerateTemplate() {
	var html = '';
	
	var items = document.getElementsByName("card_item");
	var containers = document.getElementsByName("element_container");
	
	html = '<?xml version=\"1.0\" ?>\n';

	html += '<template>\n';
	
	var card_color = DefaultIfEmpty(document.getElementById('card_container').style.backgroundColor, "#FFFFFF");
	html += '  <background color="' + card_color + '" />\n';
	
	var card_logo = document.getElementById('card_logotype').src;
    var logo_left = parseInt(document.getElementById('card_logotype').style.left);
    var logo_top = parseInt(document.getElementById('card_logotype').style.top);
	html += '  <logotype src="' + card_logo + '" left="' + logo_left + '" top="' + logo_top + '" />\n';
		
	for (var i = 0; i < items.length; i++) {
		html += '  <item name="' + items[i].id + '" value="' + items[i].value
			 + '" font_name="' + DefaultIfEmpty(items[i].style.fontFamily, 'arial') 
			 + '" font_size="' + parseInt(DefaultIfEmpty(items[i].style.fontSize, '10')) 
			 + '" font_color="' + DefaultIfEmpty(items[i].style.color, "#000000") 
			 + '" font_weight="' + DefaultIfEmpty(items[i].style.fontWeight, 'normal') 
			 + '" font_italic="' + DefaultIfEmpty(items[i].style.fontStyle, 'normal')
			 + '" font_underline="' + DefaultIfEmpty(items[i].style.textDecoration, 'none')
			 + '" text_align="' + DefaultIfEmpty(items[i].style.textAlign, 'left') 
			 + '" left="' + parseInt(items[i].parentNode.style.left)
			 + '" top="' + parseInt(items[i].parentNode.style.top)
			 + '" width="' + parseInt(items[i].clientWidth)
			 + '" height="' + parseInt(items[i].clientHeight)
			 + '"'; 
		html += ' />\n';
	}
	
	html += '</template>\n';
	
	//alert(html);
	
	return html;
}

//-----------------------------------------------------------------------------
// Generate Business Card as JSON data 
function GenerateCardJSON() {
	var html = '';
	
	var items = document.getElementsByName("card_item");
	var containers = document.getElementsByName("element_container");
	
	html = '[';

	//'[{"pk": null, "model": "serializers.author", "fields": {"name": "Bill"}}]'

	for (var i = 0; i < items.length; i++) {
		html += '{"pk": null, "model": "serializers.carditem", "fields" : {"name": "' + items[i].id 
			 + '",\n"value": "' + items[i].value 
			 + '",\n "font_name": "' + DefaultIfEmpty(items[i].style.fontFamily, 'arial') 
			 + '", \n "font_size": ' + parseInt(DefaultIfEmpty(items[i].style.fontSize, '12')) 
			 //+ ', \n "font_color":' + DefaultIfEmpty(items[i].style.color, "#000000") 
			 + ', \n "font_color":' + '"#000000"'
			 + ', \n "font_weight": "' + DefaultIfEmpty(items[i].style.fontWeight, 'normal') 
			 + '", \n "text_align": "' + DefaultIfEmpty(items[i].style.textAlign, 'left')
			 + '", \n "left": ' + parseInt(items[i].parentNode.style.left)
			 + ', \n "top": ' + parseInt(items[i].parentNode.style.top)
			 + ', \n "width" :' + parseInt(items[i].clientWidth)
			 + ', \n "height": ' + parseInt(items[i].clientHeight)
			 + '\n}}';
		if (i < items.length-1) { html += ',\n'; }
	}
	
	html += ']';
	
	//alert(html);
	
	return html;
}

//-----------------------------------------------------------------------------
// Parse Business Card Template XML data
funcLoadXML = function LoadXML(data) {
	
	//alert(data);
	
	var xml = GXml.parse(data);
	
	if (xml.documentElement == null) {
		return;
	}
  	
  	var items = xml.documentElement.getElementsByTagName("item");
	
	for (var i = 0; i < items.length; i++) {
		var name = items[i].getAttribute("name");
		var value = items[i].getAttribute("value");
		
		var font_name = items[i].getAttribute("font_name");
		var font_size = items[i].getAttribute("font_size");
		var font_color = items[i].getAttribute("font_color");
		var font_weight = items[i].getAttribute("font_weight");
		var text_align = items[i].getAttribute("text_align");
		
		var width = items[i].getAttribute("width");
		var height = items[i].getAttribute("height");
		var left = items[i].getAttribute("left");
		var top = items[i].getAttribute("top");
		
		var el = document.getElementById('div_' + name);
		var field = document.getElementById(name);
		
		if (field != null) {
			field.value = value;
		
			field.style.fontFamily = font_name;
			field.style.fontSize = font_size + 'pt';
			field.style.color = font_color;
			field.style.fontWeight = font_weight;
			field.style.textAlign = text_align;
			
			el.style.width = width;
			el.style.height = height;
			el.style.left = left + 'px';
			el.style.top = top + 'px';
			}
  	}
  	
  	var items = xml.documentElement.getElementsByTagName("background");
	for (var i = 0; i < items.length; i++) {
		var card_color = items[i].getAttribute("color");
		document.getElementById('card_container').style.background = card_color;
	}
	
	var items = xml.documentElement.getElementsByTagName("logotype");
	for (var i = 0; i < items.length; i++) {
		var src = items[i].getAttribute("src");
		var left = items[i].getAttribute("left");
		var top = items[i].getAttribute("top");
		
		document.getElementById('card_logotype').src = src;
		document.getElementById('card_logotype').style.left = left + 'px';
		document.getElementById('card_logotype').style.top = top + 'px';
	}
	
 	in_ajax = 0;
}