String.prototype.random = function(length) {
	var chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
	var randomstring = ''
	for (var i=0; i<length; i++) {
		var rnum = Math.floor(Math.random() * chars.length);
		randomstring += chars.substring(rnum,rnum+1);
	}
	return randomstring;
}

$(document).ready(function () {
	$('.button-search').button({icons:{primary:'ui-icon-search'}, text:false});
	$('.button-merger').button({icons:{primary:'ui-icon-arrowreturnthick-1-e'}, text:false});
	$('.button-mergel').button({icons:{primary:'ui-icon-arrowreturnthick-1-w'}, text:false});
	$('.button-swap').button({icons:{primary:'ui-icon-transferthick-e-w'}, text:false});
	$('.button-clear').button({icons:{primary:'ui-icon-circle-close'}, text:false});
	$('.button-download').button({icons:{primary:'ui-icon-disk'}, text:false});
	$('.button-upload').button({icons:{primary:'ui-icon-folder-open'}, text:false});
	$('.button-share').button({icons:{primary:'ui-icon-triangle-1-s'}, text:true});
	$('.button-download-diff').button({icons:{primary:'ui-icon-script'}, text:false});
	
	$('#share').live({
		mouseenter: function () { $('#share-menu').fadeIn(500); },
		mouseleave: function () {
			if (hover_timeout) clearTimeout(hover_timeout);
			hover_timeout = setTimeout(function(){$('#share-menu').hide();}, 100);
		}
	});
	$('#share-menu').live({
		mouseenter: function () { if (hover_timeout) clearTimeout(hover_timeout); },
		mouseleave: function () { 
			if (hover_timeout) clearTimeout(hover_timeout);
			hover_timeout = setTimeout(function(){$('#share-menu').hide();}, 100);
		}
	});
	var hover_timeout = null;

	$('#lhs-upload, #rhs-upload').button({icons:{primary:'ui-icon-folder-open'}, text:false}).upload({
		upload: function(target, evt) {
			var files = evt.target.files;
			var side = target.attr('id').split('-')[0];
			var sides = [side];
			if (files.length > 1) {
				if (side == 'lhs') sides.push('rhs');
				else sides.push('lhs');
			}
			// html5 file upload to browser
			function load_file(side, file) {
				var reader = new FileReader();
				reader.onprogress = function (evt) { }
				reader.onload = function (evt) {
					$('#compare').mergely(side, evt.target.result);
					document.body.style.cursor = 'default';
				}
				reader.onerror = function (evt) {
					alert( evt.target.error.name );
				}
				try {
					reader.readAsText(file, "UTF-8");
				}
				catch (e) {
					alert(e);
					document.body.style.cursor = 'default';
				}
			}
			if (files.length >= 1) load_file(sides[0], files[0]);
			if (files.length >= 2) load_file(sides[1], files[1]);
		}
	});

	$('#compare').mergely({
		readonly: key == '4qsmsDyb',
		linewrapping: false,
		height: function(h) {
			return h - 100;
		},
		loaded: function() {
			$('.toolbar, .title').fadeIn('fast');
			$('button').css({'visibility':'visible'});
		},
		resized: function() {
			var lhsx = $('#compare-editor-lhs .CodeMirror-gutter').offset().left + $('#compare-editor-lhs .CodeMirror-gutter').width() + 1;
			var rhsx = $('#compare-editor-rhs .CodeMirror-gutter').offset().left + $('#compare-editor-rhs .CodeMirror-gutter').width() + 1 - $('#lhs-toolbar').width();
			$('#lhs-toolbar, #title-lhs').css({'position':'relative', 'left':lhsx});
			$('#rhs-toolbar, #title-rhs').css({'position':'relative', 'left':rhsx});
			$('#title-rhs').css({'left':rhsx});
		},
		cmsettings: {
			mode: 'text/plain'
		},
        _debug: ''
	});
	if (key.length == 8) {
        $.when(
            $.ajax({
                type: 'GET', async: true, dataType: 'text',
                data: { 'key':key, 'name': 'lhs' },
                url: '/ajax/handle_get.php',
                success: function (response) {
                    $('#compare').mergely('lhs', response);
                },
                error: function(xhr, ajaxOptions, thrownError){
                }
            }),
            $.ajax({
                type: 'GET', async: true, dataType: 'text',
                data: { 'key':key, 'name': 'rhs' },
                url: '/ajax/handle_get.php',
                success: function (response) {
                    $('#compare').mergely('rhs', response);
                },
                error: function(xhr, ajaxOptions, thrownError){
                }
            })
        ).done(function() {
            var anchor = window.location.hash.substring(1);
            if (anchor) {
                // if an anchor has been provided, then parse the anchor in the
                // form of: 'lhs' or 'rhs', followed by a line, e.g: lhs100.
                var m = anchor.match(/([lr]hs)([0-9]+)/);
                if (m.length == 3) {
                    console.log(m);
                    $('#compare').mergely('scrollTo', m[1], parseInt(m[2],10));
                }
            }
        });
	}
	else {
		if (newbie) {
			$('#compare').mergely('lhs', 'the quick brown fox jumped over\nthe hairy cat\n');
			$('#compare').mergely('rhs', 'the quick brown fox jumped over\nthe lazy dog\n');
		}
	}
	$('#lhs-search, #rhs-search').click(function(){
		var side = $(this).attr('id').split('-')[0];
		var text = $('#' + side + '-search-text').val();
		$('#compare').mergely('search', side, text);
		return false;
	});
	$('#lhs-search-text, #rhs-search-text').keydown(function (ev) {
		var id = $(this).attr('id').split('-')[0];
		if (ev.which === $.ui.keyCode.ENTER) { $('#' + id + '-search').click(); return false; }
		return true;
	});
	$('#lhs-clear, #rhs-clear').click(function(){
		var side = $(this).attr('id').split('-')[0];
		$('#compare').mergely('clear', side);
		return false;
	});
	$('#lhs-swap, #rhs-swap').click(function(){
		$('#compare').mergely('swap');
		return false;
	});
	$('#lhs-merge, #rhs-merge').click(function(){
		var side = $(this).attr('id').split('-')[0];
		// clicking rhs-merge means 'merge left'
		if (side == 'rhs') side = 'lhs';
		else side = 'rhs';
		$('#compare').mergely('merge', side);
		return false;
	});
	$('#save, #fork').click(function(){
		var fork = $(this).attr('id') == 'fork';
		if (key == '') key = ''.random(8);
		var count = 0;
		function post_save(side, text) {
			$.ajax({
				type: 'POST', async: true, dataType: 'text',
				url: '/ajax/handle_file.php',
				data: { 'key': key,  'name': side, 'content': text },
				success: function (nkey) {
					++count;
					if (count == 2) {
						var url = '/ajax/handle_save.php?key=' + key;
						if (fork) url += '&nkey=' + ''.random(8);
						$.ajax({
							type: 'GET', async: false, dataType: 'text',
							url: url,
							success: function (nkey) {
								// redirect
								if (nkey.length) window.location.href = '/' + $.trim(nkey) + '/';
							},
							error: function(xhr, ajaxOptions, thrownError){
							}
						});
					}
				},
				error: function(xhr, ajaxOptions, thrownError){
					alert(thrownError);
				}
			});
		}
		function call_save() {
			var lhs = $('#compare').mergely('get', 'lhs');
			var rhs = $('#compare').mergely('get', 'rhs');
			post_save('lhs', lhs);
			post_save('rhs', rhs);
		}
		
		if ($(this).attr('id') == 'save') {
			$( '#dialog-confirm' ).dialog({
				resizable: false, height:210, modal: true,
				buttons: {
					"Save for Sharing": function() {
						$( this ).dialog( "close" );
						call_save();
					},
					Cancel: function() {
						$( this ).dialog( "close" );
					}
				}
			});
		}
		else {
			call_save();
		}
		return false;
	});
	
	$('#lhs-download, #rhs-download').click(function(){
		var side = $(this).attr('id').split('-')[0];
		var content = $('#compare').mergely('get', side);

		var MIME_TYPE = 'text/plain';
		console.log('downloading...');
		var windowURL = window.webkitURL || window.URL;
		var BlobBuilder = window.BlobBuilder || window.WebKitBlobBuilder || window.MozBlobBuilder;		
		var bb = new BlobBuilder();
		bb.append(content);
		var a = document.createElement('a');
		a.download = side + '.txt';
		a.target = '_blank';
		a.href = windowURL.createObjectURL(bb.getBlob(MIME_TYPE));
		a.textContent = 'Download ready';
		a.dataset.downloadurl = [MIME_TYPE, a.download, a.href].join(':');
		a.draggable = true;
		a = $(a);
		window.open(a.attr('href'), '_blank');
		windowURL.revokeObjectURL()
		return false;
	});
	$('#lhs-download-diff, #rhs-download-diff').click(function(){
		var text = $('#compare').mergely('diff');
		if (key == '') key = ''.random(8);
		$.post('/ajax/handle_download.php', { 'key': key, 'content': text }, function(response) {
			window.location = response;
		});
		return false;
	});
	
	var dlg = $('#dialog-settings').css('visibility','visible').hide();
    var f = $.farbtastic('#picker');
	var sd = $('<span style="display:none" class="mergely ch d lhs">C</span>');
	var sa = $('<span style="display:none" class="mergely a rhs start end">C</span>');
	var sc = $('<span style="display:none" class="mergely c rhs start end">C</span>');
	$('body').append(sd);
	$('body').append(sa);
	$('body').append(sc);
	var conf = {
		'c-border': {id: '#c-border', defaultColor: '#cccccc', getColor: function() { return sc.css('border-top-color'); } },
		'a-border': {id: '#a-border', defaultColor: '#4ba3fa', getColor: function() { return sa.css('border-top-color'); }, setColor: function(color) { $('#'+this.id).val(color) }},
		'd-border': {id: '#d-border', defaultColor: '#ff7f7f', getColor: function() { return sd.css('border-top-color'); }, setColor: function(color) { $('#'+this.id).val(color) }},
		'a-bg': 	{id: '#a-bg', 	  defaultColor: '#ddeeff', getColor: function() { return sa.css('background-color'); }, setColor: function(color) { $('#'+this.id).val(color) }},
		'd-bg': 	{id: '#d-bg', 	  defaultColor: '#f9e9e9', getColor: function() { return sd.css('background-color'); }, setColor: function(color) { $('#'+this.id).val(color) }},
	};
	
	$.each(conf, function(key, item){ $(item.id).val(item.getColor()); });
	
	$('#settings').click(function(){
		dlg.dialog({
			height: 330, width: 450, modal: true,
			buttons: {
				Apply: function() {
					var cborder = $('#c-border').val();
					var aborder = $('#a-border').val();
					var dborder = $('#d-border').val();
					var abg = $('#a-bg').val();
					var dbg = $('#d-bg').val();
					var cbg = $('#c-bg').val();
					var text =
						'.mergely.a.rhs.start { border-top: 1px solid ' + aborder + ' }\n\
						.mergely.a.lhs.start.end,\n\
						.mergely.a.rhs.end { border-bottom: 1px solid ' + aborder + ' }\n\
						.mergely.a.rhs { background-color: ' + abg + ' }\n\
						.mergely.d.lhs { background-color: ' + dbg + ' }\n\
						.mergely.d.lhs.end,\n\
						.mergely.d.rhs.start.end { border-bottom: 1px solid ' + dborder + '; }\n\
						.mergely.d.lhs.start { border-top: 1px solid ' + dborder + '; }\n\
						.mergely.c.lhs,\n\
						.mergely.c.rhs { background-color: ' + cbg + '; }\n\
						.mergely.c.lhs.start,\n\
						.mergely.c.rhs.start { border-top: 1px solid ' + cborder + '; }\n\
						.mergely.c.lhs.end,\n\
						.mergely.c.rhs.end { border-bottom: 1px solid ' + cborder + '; }\n\
						.mergely.ch.a.rhs { background-color: ' + abg + '; }\n\
						.mergely.ch.d.lhs { background-color: ' + dbg + ';  text-decoration: line-through; color: #888; }\n'
					$('<style type="text/css">' + text + '</style>').appendTo('head');
					
					$('#compare').mergely('options', {fgcolor:{a:aborder,c:cborder,d:dborder}});
					$('#compare').mergely('update');
				},
				Reset: function() {
					$.each(conf, function(key){
						var id = '#'+key;
						f.linkTo($(id).get(0));
						f.setColor(conf[key].defaultColor);
					});
				},
				Close: function() {
					$(this).dialog('close');
				}
			}
		}); 
	});
    $('.colorwell').each(function(){ f.linkTo(this); }).focus(function(){
		var tthis = $(this);
		f.linkTo(this);
		var item = conf[tthis.attr('id')];
		f.setColor(item.getColor());
	});
	
});