var clipboard = (function () {

	var exports = {
		format: "irssi",
		importing: false,
		visible: false,
		
		bind: function () {
			import_ascii.addEventListener("change", exports.setFormat("ascii"))
			import_irssi.addEventListener("change", exports.setFormat("irssi"))
			import_mirc.addEventListener("change", exports.setFormat("mirc"))
			import_button.addEventListener("click", exports.import_text)
			import_html.addEventListener("click", exports.import_html)
			export_button.addEventListener("click", exports.export_data)
			import_textarea.addEventListener("focus", exports.focus)
			import_textarea.addEventListener("blur", exports.blur)
			import_textarea.addEventListener('paste', exports.paste)
			import_irssi.setAttribute("checked", true)
		},
		setFormat: function (name) {
			return function () {
				clipboard.format = name
				if (! clipboard.importing) { clipboard.export_data() }
			}
		},
		show: function () { import_rapper.style.display = "block"; clipboard.visible = true },
		hide: function () { import_rapper.style.display = "none"; clipboard.visible = false },
		focus: function () {
			if (! clipboard.importing) {
				import_textarea.focus()
				import_textarea.select()
			}
		},
		blur: function () {
		},

		import_mode: function () {
			focus()
			clipboard.importing = true
			import_buttons.style.display = "inline-block"
			export_button.style.display = format_group.style.display = "none"
			import_textarea.value = ""
		},
		export_mode: function () {
			focus()
			clipboard.importing = false
			import_buttons.style.display = "none"
			export_button.style.display = format_group.style.display = "inline-block"
			clipboard.export_data()
		},

		paste: function (e) {
			toArray(e.clipboardData.items).forEach(function(item,i){
				console.log(item.kind, item.type)
				if (item.kind == 'file' && item.type.match('image/')) {
					var blob = item.getAsFile();
					window.URL = window.URL || window.webkitURL;
					var blobUrl = window.URL.createObjectURL(blob);

					var img = document.createElement('img');
					img.onerror = function(){
						// error!
						console.log("error! bad image!")
					}
					img.onload = function(){
						// load!
						//document.body.appendChild(img);
						// handle importing an image?
						console.log("image import not supported")
					}
					img.src = blobUrl;
				}
				// this can be text/plain or text/html..
				else if (item.kind == 'string' && item.type.match('text/plain') && e.clipboardData.items.length > 1) {
					return
				}
				else if (item.kind == 'string') {
					item.getAsString(function(text){
						import_textarea.value = text
					})
				}
				else {
					console.error("unknown type!", item.type)
				}
			})
			
		},
		
		import_html: function () {
			var alphabet = {}
			toArray("ABCDEFGHIJKLMNOP").forEach(function(c,i){ alphabet[c] = i })
			
			var rapper = document.createElement("div")
			rapper.innerHTML = import_textarea.value
			var lines = rapper.innerText.split("\n")
			var width = lines.reduce(function(a,b){ return Math.max(a, b.length) })
			var height = lines.length
			zz = rapper.children
			var y = 0;
			toArray(rapper.children).forEach(function(span){
				if (span.nodeName !== "SPAN") { return }
				var x = 0;
				var row = canvas.aa[y++]
				if (! row) return
				toArray(span.childNodes).forEach(function(el){
				console.log(el)
					if (x >= row.length) return;
					var line, colorcode = el.nodeName;
					if (colorcode === "SPAN") {
						colorcode = "F" + css_lookup[el.style.color]
						line = el.innerText
					}
					else if (colorcode === "#text") {
						colorcode = "FA"
						line = el.nodeValue
					}
					else {
						line = el.innerText
					}
					if (colorcode[0] !== "F") { return }
					if (colorcode.length == 2) { colorcode += "BB" }
					
					console.log(x, line)
					for (var i = 0; i < line.length; i++, x++) {
						var lex = row[x]
						if (! lex) return
						lex.char = line[i]
						lex.fg = alphabet[ colorcode[1] ]
						lex.bg = alphabet[ colorcode[3] ]
						lex.opacity = 1
						lex.build()
					}
				})
			})
		},
		
		import_text: function () {
			var data = import_textarea.value
			lines = data.split("\n")
			var width = lines.reduce(function(a,b){ return Math.max(a, b.length) })
			var height = lines.length
			if (width > 200) {
				return alert("input too wide")
			}
			if (height > 200) {
				return alert("input too tall")
			}
			canvas.clear()
			lines.forEach(function(line, y){
				var row = canvas.aa[y]
				if (! row) return
				for (var x = 0; x < line.length; x++) {
					var lex = row[x]
					if (! lex) return
					lex.char = line[x]
					lex.fg = brush.bg
					lex.opacity = 1
					lex.build()
				}
			})
			// TODO: some notion of a "selected" region which cuts/clones the underlying region
			
// 			var pasted_region = new Matrix (width, height, function(x,y){
// 				var lex = new Lex (x,y)
// 				lex.char = lines[y][x] || " "
// 				lex.build()
// 				return lex
// 			})
		},
		export_data: function () {
			var output
			switch (clipboard.format) {
				case 'ascii':
					output = canvas.ascii()
					break
				case 'mirc':
					output = canvas.mirc()
					break
				case 'irssi':
					output = canvas.irssi()
					break
			}
			import_textarea.value = output
			clipboard.focus()
			return output
		},

	}
	
	exports.bind()
	
	return exports
	
})()