﻿// JavaScript for TextOnImage (toi.js)
// Author:  hightman@twomice.net
// Date:    2007/03/23
// Version: 1.0.0
//
// public functions:
//
// TOI_Update()
// TOI_Init()
// auto bind??, only support IE?
// 
// Should recount the maxX, maxY ... after window.onresize??

// Check the browser version (only IE support OK)
if (navigator.appVersion.indexOf('MSIE') == -1)
{
	alert('您的浏览器不是 IE, 页面显示可能会不正常!');
}

// Global Variables
var TOI_inited = false;
var TOI_ondrag = false;
var TOI_xmax, TOI_ymax, TOI_xmin, TOI_ymin;
var TOI_img, TOI_txt, TOI_tab;
var TOI_isrc;

// FORM, select color & color change?
function TOI_setColor(n)
{
	var input = null;
	var img = null;
	switch (n)
	{
		case 1 :
			img = document.getElementById('BtnColor0');
			input = document.dform.color0;
			break;
		case 2 :
			img = document.getElementById('BtnColor1');
			input = document.dform.color1;
			break;
		case 3 :
			img = document.getElementById('BtnFcolor0');
			input = document.dform.fcolor0;
			break;
		case 4 :
			img = document.getElementById('BtnFcolor1');
			input = document.dform.fcolor1;
			break;
	}
	if (!input || !img) return;
	var url = '/img/getcolor.htm?color=' + input.value;
	var val = showModalDialog(url, window, 'status:no;dialogWidth:400px;dialogHeight:330px;help:no');
	if (val && val != input.value) 
	{
		input.value = val;
		img.style.backgroundColor = val;

		// update the preview?? (only: 1 & 3)
		if (n == 1 || n == 3)
		{
			TOI_update();
		}
	}
}

// Init the current data. (from the form)
function TOI_init()
{
	if (TOI_inited == true) return;
	// init the vaiables
	TOI_img = document.getElementById('backImage');
	TOI_txt = document.getElementById('demoText');
	TOI_tab = document.getElementById('demoTab');
	TOI_isrc = new Image();
	TOI_isrc.src = TOI_img.src;
	TOI_inited = true;

	// Drag event bind
	TOI_tab.onmousedown = function(ev)
	{  
		var cx = toi_get_offset(this, 'offsetLeft');
		var cy = toi_get_offset(this, 'offsetTop');

		if (typeof ev == 'undefined')
		{		
			this.X = event.clientX - cx;
			this.Y = event.clientY - cy;
			this.setCapture();
		}
		else
		{
			this.X = ev.pageX - cx;
			this.Y = ev.pageY - cy;
		}
		TOI_ondrag = true;
	};
	
	TOI_tab.onmouseup = function(ev)
	{
		TOI_ondrag = false;
		if (typeof ev == 'undefined')	
			this.releaseCapture();
	};
	
	TOI_tab.onmousemove = function(ev)
	{
		var dx, dy;
		if (!TOI_ondrag) return;
		if (typeof ev == 'undefined')
		{
			dx = event.clientX - this.X;
			dy = event.clientY - this.Y;
		}
		else
		{
			dx = ev.pageX - this.X;
			dy = ev.pageY - this.Y;
		}

		if (dx > TOI_xmax) dx = TOI_xmax;
		if (dx < TOI_xmin) dx = TOI_xmin;
		if (dy > TOI_ymax) dy = TOI_ymax;
		if (dy < TOI_ymin) dy = TOI_ymin;

		TOI_tab.style.pixelLeft = dx;
		TOI_tab.style.pixelTop = dy;

		document.dform.xpos.value = dx - TOI_xmin;
		document.dform.ypos.value = dy - TOI_ymin
	};

	// update the preview
	TOI_update();
}

// Update the preview
function TOI_update()
{
	var form = document.dform;
	if (form.submit.disabled == true)
		//return false;
	form.submit.disabled = false;

	// get the default value
	var text = form.text.value;
	text = text.replace(/ /g, '&nbsp;');
	text = text.replace(/\n/g, '<br>');
	TOI_txt.innerHTML = text;

	// generate the style
	TOI_txt.style.fontSize = form.size0.value + 'px';
	TOI_txt.style.color = form.color0.value;

	// generate the filter: glow or shadow
	var filter = '';
	if (form.filter.value == 'shadow')
	{
		filter  = 'dropshadow(color=' + form.fcolor0.value + ', offx=' + form.fdist.value;
		filter += ',offy=' + form.fdist.value + ', positive=1)';
	}
	else if (form.filter.value == 'border')
	{
		filter  = 'glow(color=' + form.fcolor0.value + ', strength=' + form.fdist.value + ')';
	}
	else
	{
		filter = 'none';
	}
	TOI_txt.style.filter = filter;

	// reset the image & tab show
	if (TOI_tab.style.display == 'none')
	{	
		TOI_tab.style.display = '';
		TOI_img.src = (form.ifile.value == '' ? TOI_isrc.src : form.ifile.value);
		
		//if (form.bsave) form.bcopy.disabled = true;
		//if (form.bcopy) form.bcopy.disabled = true;
		//if (form.bmms) form.bmms.disabled = true;
	}

	// count the posX & posY
	var ix = toi_get_offset(TOI_img, 'offsetLeft');
	var iy = toi_get_offset(TOI_img, 'offsetTop');
	var iw = TOI_img.offsetWidth;
	var ih = TOI_img.offsetHeight;
	var tw = TOI_tab.offsetWidth;
	var th = TOI_tab.offsetHeight;
	
	TOI_xmin = ix;
	TOI_ymin = iy;
	TOI_xmax = ix + iw - tw;
	TOI_ymax = iy + ih - th;
	
	var xpos = parseInt(form.xpos.value);
	var ypos = parseInt(form.ypos.value);	
	if (xpos == -1) xpos = parseInt((iw - tw) / 2);
	if (ypos == -1) ypos = parseInt((ih - th) / 2);

	TOI_tab.style.pixelLeft = xpos + ix;
	TOI_tab.style.pixelTop = ypos + iy;
}

// TOI_submit
function TOI_submit()
{
	TOI_img.src = '/img/wait2.gif';
	TOI_img.title = '图片生成中,请稍候...';
	TOI_tab.style.display = 'none';
	document.dform.submit.disabled = true;
	document.dform.submit.value = '请稍候...';
	/*
    var url = 'http://520qqq.com/qq/MakeImg.php';
    var pars = '?ifile='+$('ifile').value;
	alert($('ifile').value);
	pars = pars+"&time=" + new Date().getTime();
 
	var myAjax = new Ajax.Request(   
								url,                     
								{method: 'post',
								parameters: pars, 
								onComplete: ShowResponseImg
								}  
	); 
	// AutoWith();
	*/
}

// TOI_callback, 参与判断成功与否
function TOI_callback(type, msg)
{
	//document.dform.submit.disabled = false;
	document.dform.submit.value = '生成图片!';
	// update the image source
	if (type == 'ok')
	{
		TOI_img.src = msg;
		document.getElementById('BtnCopy').disabled = false;
		document.getElementById('BtnSave').disabled = false;
		document.getElementById('BtnMms').disabled = false;
        document.getElementById('temurl').value = "http://520qqq.com/"+msg;

	}
	else
	{

		TOI_img.src = TOI_isrc.src;
		TOI_img.width = TOI_isrc.width;
		TOI_img.height = TOI_isrc.height;
		TOI_update();
	}
}

// Reset the form
function TOI_reset()
{
	document.dform.reset();	
	document.dform.submit.disabled = false;
	document.dform.submit.value = '生成图片!';
	document.getElementById('BtnCopy').disabled = true;
	document.getElementById('BtnSave').disabled = true;
	document.getElementById('BtnMms').disabled = true;
	
	TOI_img.src = TOI_isrc.src;
	TOI_img.width = TOI_isrc.width;
	TOI_img.height = TOI_isrc.height;
	TOI_update();
}

// Update the background image
function TOI_upimg()
{
	var form = document.dform;
	var isrc = form.ifile.value;
	var pos = isrc.lastIndexOf('.');
	var img = new Image();

	// on load
	img.onload = function () {
		var width = img.width;
		var height = img.height;
		img.onload = '';
		if (width > 1000 || height > 1000)
		{
			// => 480*360
			var ratio1 = 320/width;
			var ratio2 = 240/height;
			if (ratio1 > ratio2)
			{
				width = parseInt(ratio2 * width);
				height = 240;
			}
			else
			{
				width = 320;
				height = parseInt(ratio1 * height);
			}			
			alert('注意：图片过大, 系统自动进行了一些调整');
		}
		
		TOI_img.src = img.src;
		TOI_img.width = width;
		TOI_img.height = height;
		form.xpos.value = '-1';
		form.ypos.value = '-1';
		if (form.title.value == '')
		{
			var pos2 = isrc.lastIndexOf('\\');
			form.title.value = isrc.substring(pos2+1,pos);
		}
		TOI_update();
		delete img;
	};

	// on error
	img.onerror = function () {
		img.onerror = '';
		alert('注意：您刚刚试图上载的一个文件似乎不是合法图片');
		delete img;
	};

	// store the source address
	img.src = isrc;
}

// get object's offset
function toi_get_offset(o, n)
{
	var w = 0;
	do { w = w + o[n]; } while (o = o.offsetParent);
	return w;
}

// Bind the init function after page loaded.
if (typeof window.attachEvent != 'undefined')
{
	window.attachEvent('onload', TOI_init);
	window.attachEvent('onresize', TOI_update);
}
else if (typeof window.addEventListener != 'undefined')
{
	window.addEventListener('load', TOI_init, false);
	window.addEventListener('resize', TOI_update, false);
}
else
{
	window.onload = function() { TOI_init(); }
	window.onresize = function() { TOI_update(); }
}


function CopyImage(img)
{
	if (img.tagName != 'IMG') return;
	if (typeof img.contentEditable == 'undefined') return;
	if (!document.body.createControlRange) return;
	var ctrl = document.body.createControlRange();
	img.contentEditable = true;
	ctrl.addElement(img);
	ctrl.execCommand('Copy');
	img.contentEditable = false;
	alert('复制完成，到QQ对话框里按Ctrl-V就可以啦！');
}
// 保存到本地
function SaveImage(img)
{
	var win = document.getElementById('genFrm').contentWindow;
	if (img.tagName != 'IMG') return;
	win.location.href = img.src;
	setTimeout(function() { win.document.execCommand("SaveAs"); }, 100);
}
// 发送到手机
function MmsImage(img)
{
	//mmslink
	//var mlink = 'http://code.5k3g.com/tl/picDIY/SendPic.aspx?uid=11616&fileurl=';
	//mlink += encodeURIComponent(img.src) + '&uid=11616&style=4';
	//window.open(mlink, '_blank');
	//alert('把鼠标移到图片上就显示发送到手机按钮!点确定后发送!');
    window.open("http://app.sms888.net/web/apps/diynew.php?uid=5230&url="+encodeURIComponent(img.src),"","width=800,height=520");
}

function ShowResponseImg(originalRequest) 
{     
	alert(originalRequest.responseText);
	TOI_callback('ok', originalRequest.responseText);
	return true;
} 

/*
function AutoWith()
{
	var form = document.dform;
	var isrc = form.ifile.value;
	var img = new Image();
	img.src=isrc;

	var width = img.width;
	var height = img.height;

		if (width > 600 || height > 400)
		{
			// => 480*360
			var ratio1 = 320/width;
			var ratio2 = 240/height;
			if (ratio1 > ratio2)
			{
				width = parseInt(ratio2 * width);
				height = 240;
			}
			else
			{
				width = 320;
				height = parseInt(ratio1 * height);
			}			
			//alert('注意：图片过大, 系统自动进行了一些调整');
		}
		
		//TOI_img.src = img.src;
		alert(width);
		$('backImage').width = width;
		$('backImage').height = height;
}
*/
function MM_preloadImages() { //v3.0 
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); 
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) 
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} 
} 
function MM_reloadPage(init) { //reloads the window if Nav4 resized 
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) { 
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }} 
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload(); 
} 
MM_reloadPage(true); 

function MM_findObj(n, d) { //v4.01 
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { 
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} 
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; 
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); 
if(!x && d.getElementById) x=d.getElementById(n); return x; 
} 

function MM_showHideLayers() { //v6.0 
var i,p,v,obj,args=MM_showHideLayers.arguments; 
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2]; 
if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; } 
obj.visibility=v; 
//event.clientY <310 ? obj.pixelTop=document.body.scrollTop+event.clientY :obj.pixelTop=document.body.scrollTop+event.clientY -310; 
obj.pixelTop=event.clientY;
obj.pixelLeft=event.clientX;
} 
}