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=agVzdXNhbnINCxIGU3Ryb2tlGOJCDA" 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]23:45,24:45,25:45,26:45,26:46,27:47,27:48,27:49,27:52,28:55,28:59,28:63,29:67,29:72,29:76,30:80,30:85,30:89,30:93,31:97,31:100,31:104,32:106,34:108,34:111,35:112,35:114,36:115,36:116,37:116,37:117,37:118,38:119,38:120,39:120,39:119,39:118,39:117,39:116,39:114,39:112,39:109,38:108,38:105,38:104,38:103,38:101,38:100,38:99,38:98,38:97,38:96,38:95,38:94,38:93,38:92,38:89,38:88,38:86,38:85,37:83,37:81,36:80,36:79,36:78,35:78,35:77,34:77,33:77,33:76,|[color:#000000,width:2]41:60,42:60,43:59,45:59,47:58,51:58,54:57,58:57,62:57,65:57,68:56,71:56,74:56,76:56,78:55,|[color:#000000,width:2]45:73,46:73,47:73,48:73,51:73,54:73,58:73,63:73,68:73,74:73,79:73,84:73,89:73,93:73,95:73,97:73,98:73,|[color:#000000,width:2]67:58,67:59,68:59,70:60,71:61,73:64,75:67,76:69,78:72,79:76,82:80,83:84,85:89,86:93,87:97,87:101,87:105,87:108,87:112,87:114,87:116,87:118,87:120,87:121,86:121,86:122,85:122,84:122,83:122,82:122,81:123,80:124,79:124,77:124,76:124,75:124,73:122,72:121,71:120,68:118,67:117,66:115,65:113,64:112,64:111,63:109,62:108,61:107,61:105,60:105,60:104,60:103,60:102,61:101,62:101,62:100,63:99,64:98,66:97,67:97,70:96,72:96,75:95,77:94,79:94,81:93,83:93,84:93,85:93,86:93,87:93,88:95,90:96,92:96,95:97,98:99,100:100,103:102,106:104,109:104,111:107,114:108,116:109,118:111,119:112,121:113,122:114,123:115,124:116,125:116,126:116,127:116,127:117,128:117,|[color:#000000,width:2]114:136,115:136,115:137,115:139,116:140,117:143,118:145,119:148,119:151,120:155,120:158,122:161,123:165,123:168,125:172,127:176,127:179,129:182,130:185,131:188,132:190,134:192,135:193,135:194,135:195,135:196,135:197,135:196,134:196,133:193,|[color:#000000,width:2]137:144,138:144,140:144,143:144,147:144,151:144,156:144,162:144,167:144,171:144,176:144,180:143,184:143,187:143,189:142,191:142,191:141,|[color:#000000,width:2]159:115,159:114,159:113,160:113,161:113,162:113,163:113,163:114,163:115,164:116,166:117,167:120,168:123,170:126,170:130,171:134,171:139,172:143,172:148,172:152,173:156,173:161,173:165,173:168,173:172,173:174,173:176,172:179,172:180,172:181,172:183,172:184,172:185,172:186,171:186,171:187,171:188,170:188,169:188,168:188,167:188,166:187,165:187,164:185,|[color:#000000,width:2]179:103,179:104,180:104,180:105,181:106,182:107,183:108,183:110,184:111,185:112,186:114,186:115,187:116,186:116,185:116,184:116,184:115,184:114,184:113,183:113,182:111,181:109,|[color:#000000,width:2]180:96,181:96,181:97,182:97,182:98,183:98,183:99,183:100,184:100,185:100,185:101,186:101,186:102,187:102,187:103,187:104,188:104,189:104,189:105,190:106,190:107,191:108,191:109,192:109,192:110,193:110,193:111,194:111,|");
}
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;
}