if (typeof susan == 'undefined') susan = {};

susan.setupMyCanvas = function() {
	var headTag = document.getElementsByTagName('head')[0];
	var sketchScript = document.createElement('script');
	sketchScript.src = "http://susan.appspot.com/javascripts/sketch.js";
	headTag.appendChild(sketchScript);
	/*
	var libSketch = document.createElement('div');
	libSketch.style.overflow = 'hidden';
	libSketch.style.height = '0px';
	libSketch.innerHTML = '<script src="http://susan.appspot.com/javascripts/sketch.js"></script>';
	//if (navigator.userAgent.match(/.*MSIE.+/)) {
	//	libSketch.innerHTML = '<script src="susan/javascripts/excanvas.js"></script>' + libSketch.innerHTML;
	//}
	if (scriptTag) {
		scriptTag.parentNode.insertBefore(libSketch, scriptTag);
	}
	else {
		document.body.appendChild(libSketch);
	}
	*/

	var scriptTag;
	var scriptTags = document.getElementsByTagName('script');
	for (var i = 0; i < scriptTags.length; i++) {
		if (scriptTags[i].src.match(/http:\/\/susan.appspot.com\/load_canvas(.*)/)) {
			if (RegExp.$1 == '') {
				scriptTag = scriptTags[i];
				break;
			}
		}
	}
	var canvas = document.createElement('div');
	var canvasId = 'canvas' + Math.floor(Math.random() * 10000);
	canvas.innerHTML = '<a href="http://susan.appspot.com/show?key=agVzdXNhbnIOCxIGU3Ryb2tlGOWcCQw" style="border:none">' +
		'<canvas id="' + canvasId + '" height="200" width="200" style="border:1px solid black"></canvas></a>';
	if (scriptTag) {
		scriptTag.parentNode.insertBefore(canvas, scriptTag);
	}
	else {
		document.body.appendChild(canvas);
	}
	if (navigator.userAgent.match(/.*MSIE.*/)) {
		var excanvasScript = document.createElement('script');
		excanvasScript.src = "susan/javascripts/excanvas.js";
		headTag.appendChild(excanvasScript);
	}
	susan.initializeMyCanvas(canvasId, "|[color:#000000,width:2]87:29,88:29,88:30,88:31,89:31,89:32,89:33,89:34,89:35,89:36,89:37,87:38,86:40,84:41,83:42,81:42,80:43,79:43,77:44,76:45,74:45,72:46,71:47,68:48,66:50,63:50,63:51,61:51,61:52,61:53,59:54,59:55,59:56,59:59,59:60,59:62,59:63,59:64,60:66,61:67,62:68,64:69,66:69,67:69,68:70,69:70,70:70,73:71,74:72,75:72,76:72,77:72,78:72,|[color:#000000,width:2]89:30,89:31,90:33,91:34,92:37,93:38,93:39,94:40,95:41,96:43,98:45,100:46,101:46,102:47,103:48,104:48,105:49,106:50,108:51,109:51,110:52,111:53,112:54,113:54,113:55,114:56,115:57,115:58,116:59,116:60,116:63,116:64,116:66,116:67,114:70,112:71,109:73,106:74,106:75,103:75,102:76,101:76,98:76,96:76,93:76,91:76,|[color:#000000,width:2]65:69,64:69,63:69,62:69,59:70,57:71,56:72,53:74,52:75,51:76,50:78,48:79,47:82,46:85,44:87,43:90,43:93,43:95,43:96,43:98,43:100,45:103,46:104,49:104,52:105,54:106,57:108,58:108,62:108,65:109,69:109,73:109,76:109,80:109,91:112,93:112,98:112,102:112,106:112,109:112,113:112,114:112,116:112,119:112,120:112,123:112,124:112,124:110,125:109,127:109,128:107,129:106,130:105,132:104,132:103,132:100,132:99,132:98,132:96,132:95,132:93,130:92,130:91,130:90,128:89,127:88,127:87,125:84,125:83,123:82,122:81,121:81,119:79,119:78,117:78,116:78,116:76,114:76,113:76,113:74,111:74,110:74,|[color:#000000,width:2]45:104,45:105,45:106,43:108,40:111,39:114,32:119,31:120,30:123,27:125,26:128,26:131,24:133,24:135,24:137,24:138,25:139,26:140,27:140,29:140,32:141,33:141,36:142,40:142,43:142,49:143,53:143,59:144,63:144,69:144,74:145,78:145,82:145,85:145,89:145,92:145,96:145,98:145,104:145,110:145,116:145,121:146,127:146,131:146,134:146,136:146,139:146,140:146,141:146,143:146,145:146,146:146,147:146,148:146,149:146,150:144,151:143,154:142,155:141,156:141,156:139,157:138,157:137,157:135,158:134,158:131,158:130,158:128,158:126,158:124,158:123,156:122,155:119,154:118,153:116,150:114,149:113,146:111,145:109,144:108,143:108,143:106,141:106,141:104,138:103,137:102,136:102,|[color:#000000,width:2]26:138,26:139,24:141,23:142,23:145,21:148,21:150,19:151,19:154,19:156,19:157,19:160,19:162,19:163,19:166,19:167,19:169,20:171,21:172,22:173,24:174,29:176,33:176,37:176,46:179,52:179,62:182,74:184,82:184,90:185,99:185,105:185,111:186,115:186,121:186,125:186,130:186,134:186,138:186,141:186,145:186,146:186,150:186,153:186,155:186,156:184,157:184,159:182,161:181,162:181,163:179,164:178,166:177,167:176,168:175,169:174,170:173,170:171,171:170,171:169,171:168,172:167,172:166,173:165,173:163,173:162,173:161,173:160,173:158,173:156,173:155,173:154,173:153,171:152,171:151,169:150,169:148,167:147,166:146,165:145,164:145,161:143,160:142,160:141,158:141,157:141,157:139,|");
}
susan.initializeMyCanvas = function(canvasId, strokes) {
	// TODO: the first condition is for IE, though it does not work
	if (!document.getElementById(canvasId) || typeof susan.initializeCanvas == 'undefined') {
		setTimeout(function(){susan.initializeMyCanvas(canvasId, strokes)}, 100);
	}
	else {
		susan.initializeCanvas(canvasId, strokes);
	}
}

if (window.attachEvent) {
	window.attachEvent('onload', susan.setupMyCanvas);
}
else if (window.addEventListener) {
	window.addEventListener('load', susan.setupMyCanvas, true);
}
else {
	window['onload'] = susan.setupMyCanvas;
}