var instructor_writer = function (editor, handler, count) {

	this.count = count || 3;

	this.handler = handler;

	this.bound = $(editor).width() / this.count;

	this.editor = editor;

	this.isshow = false;

	this.init();

}

instructor_writer.prototype.init = function () {

	if (this.container)

		return;

	var that = this;

	var dom = this.container = document.createElement("div");

	this.container.style.zIndex = 10000000;

	this.container.style.position = "absolute";

	this.container.style.display = "none";

	this.container.id = "writer";

	this.container.className = "write-div";

	for (var i = 0; i < this.count; i++) {

		this.container.appendChild(this.createDrawAbleCanvas());

	}

	window.addEventListener("unload", function () {

		dom.parentNode.removeChild(dom);

		window.top.document.removeEventListener("click", docClick);

	});



	window.docClick = function (e) {

		if (e.srcElement.parentNode != dom && that.editor != e.srcElement && e.srcElement.parentNode != that.editor && e.srcElement != that.handler) { //不是canvas

			that.hide();

			that.onHide&&that.onHide();

		}

	}



	window.addEventListener("click", docClick);

	window.top.document.addEventListener("click", docClick);

	window.top.document.body.appendChild(this.container);

	this.bound = $(this.container).height();

}

instructor_writer.prototype.show = function () { 

	if (!$(this.editor).is(":visible"))

		return;

	var ofs = recursionIframe(window);

	this.container.style.left = ofs.left + $(this.editor).offset().left + "px";

	this.container.style.top = ofs.top - this.bound + $(this.editor).offset().top + "px";

	this.container.style.display = "";

	this.isshow = true;

}

instructor_writer.prototype.hide = function () {

	this.container.style.display = "none";

	this.isshow = false;

}

// instructor_writer.prototype.getWriteBackground = function () {

// var cvs = document.createElement("canvas");

// cvs.width = cvs.height = this.bound;

// var g = cvs.getContext("2d"),

// W = cvs.width,

// H = cvs.height;

// g.fillStyle = "white";

// g.fillRect(0, 0, W, H);

// g.strokeStyle = "red";

// g.lineWidth = 2;

// g.rect(1, 1, W - 2, H - 2);

// g.stroke();

// g.lineWidth = 1;

// g.setLineDash([5, 5]);

// g.moveTo(0, 0);

// g.lineTo(W, H);

// g.moveTo(0, H);

// g.lineTo(W, 0);

// g.moveTo(0, H / 2);

// g.lineTo(W, H / 2);

// g.moveTo(W / 2, 0);

// g.lineTo(W / 2, H);

// g.stroke();

// return cvs.toDataURL("image/png");

// };

instructor_writer.prototype.createDrawAbleCanvas = function () {

	var this_ = this;

	var canvas = document.createElement("canvas");

	// var url = this.getWriteBackground();

	// canvas.style.backgroundImage = 'URL(' + url + ')';

	// canvas.style.backgroundRepeat = "no-repeat";

	canvas.width = "239";

	canvas.height = "204";

	var context = canvas.getContext("2d");

	context.lineWidth = 6;

	/*在鼠标移动时划线     */

	function onMouseMove(event) {

		var canvas_ = this;

		var p = toCanvasCoord(canvas_, event.clientX, event.clientY);

		context.lineTo(p.x, p.y);

		context.stroke();

	}



	function onMouseDown(event) {

		var nodes = this.parentNode.children;

		for (var i = 0; i < nodes.length; i++) {

			if (nodes[i] != this)

				onMouseUp.call(nodes[i], event);

		}

		var canvas_ = this;

		canvas_.drawing = true;

		canvas_.ismouseup = false;

		if (canvas.timeoutid) {

			clearTimeout(canvas.timeoutid);

		}

		canvas_.getContext("2d").beginPath();

		var p = toCanvasCoord(canvas_, event.clientX, event.clientY);

		canvas_.getContext("2d").moveTo(p.x, p.y);

		canvas_.addEventListener("mousemove", onMouseMove, false);

	}



	function onMouseUp(event) {

		var canvas_ = this;

		if (canvas_.ismouseup)

			return;

		canvas_.removeEventListener("mousemove", onMouseMove, false);

		var timeoutid = setTimeout(function () {

				if (canvas_.drawing) {

					canvas_.insertImg(canvas);

					canvas_.getContext("2d").clearRect(0, 0, canvas.width, canvas.height);

					canvas_.timeoutid = null;

					canvas_.drawing = false;

				} else {}

			}, 1000);

		canvas_.timeoutid = timeoutid;

		canvas_.ismouseup = true;

	}



	function toCanvasCoord(canvas, x, y) {

		var point = {};

		var coord = canvas.getBoundingClientRect();

		point.x = x - coord.left;

		point.y = y - coord.top;

		return point;

	}

	function createImage(src) {

		var img = new Image();

		$(img).addClass('item');

		img.src = src;

		return img;

	}

	canvas.insertImg = function (canvas) {

		var img = createImage(canvas.toDataURL("image/png"));

		img.setAttribute("editMode", "handWrite");

		$(this_.editor).append(img);

		addDivDragStart();

	};

	/*添加mousedown监听事件，在用户鼠标按下后开始画线，并注册mousemove事件*/

	canvas.addEventListener("mousedown", onMouseDown, false);



	/*在鼠标按键松开后，注销鼠标移动事件    */

	canvas.addEventListener("mouseup", onMouseUp, false);

	// canvas.addEventListener("mouseleave", onMouseUp, false);

	canvas.addEventListener("mouseenter", function () {

		this.ismouseenter = true;

	}, false);

	canvas.addEventListener("mouseout", function () {

		this.ismouseenter = false;

	}, false);

	document.addEventListener("mouseup", function () {

		if (!canvas.ismouseenter) {

			onMouseUp.call(canvas);

		}

	}, false);

	return canvas;

};

var recursionIframe = function (win) {



	if (!win) {

		win = this.wins;

	}



	function getTop(e) {

		var offset = e.offsetTop;

		if (e.offsetParent != null)

			offset += getTop(e.offsetParent);

		return offset;

	}



	function getLeft(e) {

		var offset = e.offsetLeft;

		if (e.offsetParent != null)

			offset += getLeft(e.offsetParent);

		return offset;

	}



	if (win.parent == top && win.parent == win) {

		// var xy = this.getAbsPoint(win);



		return {

			"left": 0,

			"top": 0

		};

	}

	var winPar = win.parent; // .opener

	var iframeArr = winPar.document.getElementsByTagName('IFRAME');

	var targetIframe;

	for (var i = 0; i < iframeArr.length; i++) {

		var iframeElem = iframeArr[i];

		if (iframeElem.contentWindow == win) {

			targetIframe = iframeElem;

			break;

		}

	}

	// alert(targetIframe==null)

	//	var xy = this.getAbsPoint(targetIframe);

	var xy = {

		left: getLeft(targetIframe),

		top: getTop(targetIframe)

	}



	if (winPar.parent != winPar) {

		var xy2 = this.recursionIframe(winPar);

		xy.left += xy2.left;

		xy.top += xy2.top;

	}



	return xy

}