var soundOn = true;
var loadedTinyMCE = false;
var tinyMCE;

// Close page menu
var closePageMenu = function(){
	if (!$('pageMenuContainer')) {
		return false;
	}

	var t = $('menumenuul');
	var b = t.getParent().getParent();

	t.setStyle('overflow', 'hidden');
	var morph = new Fx.Morph(t);
	morph.start({
		width: 0,
		height: 0
	});
	var morph = new Fx.Morph(b);
	morph.start({
		width: mtbw,
		height: mtbh,
		opacity: 1
	});
	b.setStyles({
		'-webkit-transform': 'rotate(0deg)',
		'-moz-transform': 'rotate(0deg)'
	});

	$$('.cama-tool-menu').setStyle('opacity',1);
	
	(function(){
		if ($('pageMenuContainer')) $('pageMenuContainer').destroy();
	}).delay(500);
}

fileBrowserCallBack = function(field_name, url, type, win) {
	var connector = "../../filemanager/browser.html?Connector=connectors/php/connector.php";
	var enableAutoTypeSelection = true;
	
	var cType;
	tinyfck_field = field_name;
	tinyfck = win;
	
	switch (type) {
		case "image":
			cType = "Image";
			break;
		case "flash":
			cType = "Flash";
			break;
		case "file":
			cType = "File";
			break;
		case "media":
			cType = "Media";
			break;
	}
	
	if (enableAutoTypeSelection && cType) {
		connector += "?Type=" + cType;
	}
	
	window.open(connector, "tinyfck", "modal,width=600,height=400");
}

loadTinyMCE = function(){
	tinyMCE_GZ.init({
		themes : "advanced",
		plugins : "advimage,advlink,autosave,contextmenu,emotions,inlinepopups,media,paste,safari,searchreplace,style,table",
		languages : "nb",
		disk_cache : true
	}, function() {
	tinyMCE.init({
		language: "nb",
		theme : "advanced",
		plugins : "advimage,advlink,autosave,contextmenu,emotions,inlinepopups,media,paste,safari,searchreplace,style,table",
		theme_advanced_buttons1: "formatselect,fontselect,fontsizeselect",
		theme_advanced_buttons2: "bold,italic,underline,strikethrough,|,forecolorpicker,backcolor,styleprops,|,justifyleft,justifycenter,justifyright,justifyfull,|,bullist,numlist,|,outdent,indent,blockquote",
		theme_advanced_buttons3: "removeformat,cleanup,code,|,pastetext,pasteword,|,search,|,undo,redo,|,link,unlink,anchor,|,hr,charmap,emotions,image,media",
		theme_advanced_buttons4: "tablecontrols,|,visualaid",
		theme_advanced_toolbar_location : "external",
		theme_advanced_toolbar_align : "left",
		theme_advanced_statusbar_location : "bottom",
		theme_advanced_resizing : true,
		theme_advanced_resize_horizontal: false,
		extended_valid_elements: "a[name|href|target|title|onclick|rel]",
		theme_advanced_blockformats : "p,address,pre,h1,h2,h3,h4,h5,h6,dt,dd",
		paste_block_drop: true,
		button_tile_map : true,
		content_css : rtaStylesheet,
		file_browser_callback : "fileBrowserCallBack"
	});
	});
}

waitForTinyMCE = function(elementId, show){
	tinyMCE.execCommand('mceAddControl', true, elementId);
	//tinyMCE.activeEditor.execCommand('mceFocus', true);
	
	//alert('loaded');

	if (Browser.Engine.webkit) {
		$(elementId+'_external').setStyle('top', '-126px !important');
	} else {
		$(elementId+'_external').setStyle('top', '-106px');
	}
	$(elementId+'_external').setStyle('z-index', 1000);
	$(elementId+'_external').setStyle('background-color', 'rgba(255,255,255,0.75)');
	$(elementId+'_external').setStyle('padding', '5px');
	$(elementId+'_external').setStyle('-webkit-border-radius', '5px');
	$(elementId+'_external').setStyle('-moz-border-radius', '5px');
	$(elementId+'_external').setStyle('-webkit-box-shadow', 'rgba(0, 0, 0, .9) 2px 2px 10px');
	$(elementId+'_external').setStyle('-moz-box-shadow', 'rgba(0, 0, 0, .9) 2px 2px 10px');
	if (show) {
		$(elementId+'_external').setStyle('display', 'block');
	}
}

// Canvas gear
drawGear = function(canvas) {
	if (canvas.getContext) {
		var c = canvas.getContext("2d");

		var r = 6; // radius
		var t = 8; // teeth
		
		var tSize = 360.0/(t*2.0); // teeth size in degrees
		var offset = -tSize/2.0; // start offset position in degrees

		c.fillStyle = 'orange';
		
		// Draw teeth
		for (i = 0; i < t; i++) {
			c.beginPath();
			c.arc(r,r,r, (Math.PI/180)*(tSize*(i*2)+offset), (Math.PI/180)*(tSize*(i*2+1)+offset), false);
			c.lineTo(r,r);
			c.fill();
			c.closePath();
		}

		// Center filling
		c.beginPath();
		c.arc(r,r,4, (Math.PI/180)*0, (Math.PI/180)*360, false);
		c.fill();
		c.closePath();

		// Center clipping
		c.globalCompositeOperation = 'destination-out';
		c.beginPath();
		c.arc(r,r,2, (Math.PI/180)*0, (Math.PI/180)*360, false);
		c.fill();
		c.closePath();

		c.save();
	}
}

// Canvas plus
drawPlus = function(canvas) {
	if (canvas.getContext) {
		var c = canvas.getContext("2d");

		c.strokeStyle = 'orange';
		c.lineWidth = 2;

		c.beginPath();
		c.moveTo(6,1);
		c.lineTo(6,11);
		c.moveTo(1,6);
		c.lineTo(11,6);
		c.stroke();
		c.closePath();

		c.save();
	}
}

// Canvas X
drawX = function(canvas) {
	if (canvas.getContext) {
		var c = canvas.getContext("2d");

		c.strokeStyle = 'orange';
		c.lineWidth = 2;

		c.beginPath();
		c.moveTo(1,1);
		c.lineTo(11,11);
		c.moveTo(11,1);
		c.lineTo(1,11);
		c.stroke();
		c.closePath();

		c.save();
	}
}

// Canvas Up
drawUp = function(canvas) {
	if (canvas.getContext) {
		var c = canvas.getContext("2d");

		c.fillStyle = 'orange';

		c.beginPath();
		c.moveTo(6,1);
		c.lineTo(1,11);
//		c.moveTo(11,1);
		c.lineTo(11,11);
		c.fill();
		c.closePath();

		c.save();
	}
}

// Canvas Down
drawDown = function(canvas) {
	if (canvas.getContext) {
		var c = canvas.getContext("2d");

		c.fillStyle = 'orange';

		c.beginPath();
		c.moveTo(1,1);
		c.lineTo(6,11);
//		c.moveTo(11,1);
		c.lineTo(11,1);
		c.fill();
		c.closePath();

		c.save();
	}
}

window.addEvent('domready', function() {

	// Draw menu tool gears
	$$('.cama-tool-menuContainer canvas').each(function(el){ drawGear(el); });

	// Draw menu tool pluses
	$$('.ct-addMenuItem canvas').each(function(el){ drawPlus(el); });

	// Draw page area pluses
	$$('.addButton canvas').each(function(el){ drawPlus(el); });

	// Draw page area close
	$$('.closeButton canvas').each(function(el){ drawX(el); });

	// Draw page area up
	$$('.upButton canvas').each(function(el){ drawUp(el); });

	// Draw page area down
	$$('.downButton canvas').each(function(el){ drawDown(el); });

	// Login
	if ($('cama-login')) {
		$('cama-login').addEvent('click', function(e){
			e.stop();
			
			var t = this;
			
			var shim = new Element('div', {
				id: 'shim',
				styles: {
					width: '100%',
					height: window.getScrollSize().y+'px'
				}
			}).inject(document.body);
			
			var win = new Element('div', {
				id: 'loginWindow',
				'class': 'win',
				styles: {
					width: '400px',
					margin: '150px auto 0 auto'
				}
			}).setStyle('opacity', .0001).inject(shim);
			
			new Request.HTML({
				url: t.get('href')+'&ajax=loginForm',
				update: win,
				onFailure: function() {
					alert('Failure');
					shim.destroy();
				},
				onSuccess: function() {
					win.fade('in');
				}
			}).send();
		});
	}
	
	// Add Menu Item
	$$('.ct-addMenuItem').addEvent('click', function(e){
		e.stop();
		
		// Sound
		if (soundOn) {
			$('snd-addPage').play();
		}

		var that = this;
		
		gecko_spellcheck = false;
		
		var niHTML = '\
<span class="private"><a id="addMenuItem-label" href="#"><div id="addMenuItem-ed" contenteditable="true">Uten navn</div></a></span>\
<span class="cama-tool-menuContainer"><span class="cama-tool-menu" style="display: block-inline; opacity: .25"><span id="toolbox-label" class="a" href="#"><canvas width="12" height="12"></span></span></span>';
		var ni = new Element('li', {'class': 'private', html: niHTML});
		ni.inject(this.getParent().getParent(), 'before');
//		this.getParent().getParent().adopt(ni);
		
		drawGear(ni.getElement('canvas'));
		
		$('toolbox-label').addEvent('click', function(e){ e.stop(); });

		var ed = $('addMenuItem-ed');

		// Safari could use a span (if so, check if it tolerates zero character when editing).
		if (Browser.Engine.gecko) {
			ed.setStyles({ display: 'inline-block', 'min-width': '1px' });
		} else {
			ed.setStyles({ display: 'inline-block', 'min-width': '1px' });
		}

		ed.addEvents({
			'click': function(e) { e.stop(); return false; },
			'keydown': function(e) {
				if (e.key == "enter") {
					e.stop();
					this.blur();
				}
			},
			'blur': function(e) {
				e.stop();
				new Request({
					url: window.location.href,
					onSuccess: function(r) {
						$('toolbox-label').getParent().setStyle('opacity',1);
						$('toolbox-label').set({id: null, href: r, events: {click: toolboxMenuItemEvent}});
						$('addMenuItem-label').set({id: null, href: '?page='+r, html: ed.get('text')}).highlight();
					}
				}).send('ajax=menu&dirId='+that.get('href')+'&addItem='+this.get('text'));
			}
		});
		
		ed.focus();
	});

	// Menu Items
	var toolboxMenuItemEvent = function(e){
		e.stop();

		// Disable buttons
		if ($('pageMenuContainer')) {
			closePageMenu();
			return false;
		}
		
		var t = this;
		var tp = t.getParent();
		
		tp.setStyle('z-index', 2000);

		// Get current toolbox styles
		mtbw = tp.getStyle('width');
		mtbh = tp.getStyle('height');
		mtbr = tp.getStyle('right');

		$$('.cama-tool-menu').each(function(el){
			if (el != tp) {
				el.setStyle('opacity', .25);
			}
		});

		var container = new Element('span', {'id': 'pageMenuContainer'});
		tp.adopt(container);

		//tp.setStyle('-webkit-transform', 'skew(8deg,0deg)');

		if (/Chrome/.test(navigator.userAgent) || (/Safari/.test(navigator.userAgent) && !Browser.Platform.win)) {
			tp.setStyle('-webkit-transform', 'rotate(-16deg)');
		}

		new Request.HTML({
			url: '?ajax=menu&action=getActions&id='+t.get('href'),
			update: container,
			onFailure: function() {
				alert('Failure');
			},
			onSuccess: function() {
				document.body.addEvent('click', function(e){
					closePageMenu();
				});
			}
		}).send();
	}
	
	$$('.cama-tool-menuContainer .cama-tool-menu').addEvents({
		mouseenter: function(){
			this.getParent().getPrevious().setStyle('outline','1px dotted red');
		},
		mouseleave: function(){
			this.getParent().getPrevious().setStyle('outline','none');
		}
	});
	$$('.cama-tool-menuContainer .a').addEvent('click', toolboxMenuItemEvent);

	// Sortable menu
	/* cama-menu is not an ID anymore
	var mySortables = new Sortables('cama-menu', {
		clone: true,
		revert: { duration: 3000, transition: 'elastic:out' },
		opacity: 1
	});
	*/

	deleteSubpage = function(e){
		e.stop();

		var db = this;

		var id = this.get('href');
		if (confirm('Er du sikker?')) {
			new Request.HTML({
				url: '?ajax=deleteSubpage&id='+id,
				onFailure: function() {
					alert('Failure');
				},
				onSuccess: function() {
				
					// Sound
					if (soundOn) {
						$('snd-deletePage').play();
					}
			
					var tb = db.getParent();
					tb.setStyle('opacity',1);
					tb.set('tween', {'duration': '250'}).fade('out');

					(function(){
						$(id).style.webkitTransition = '-webkit-transform .5s ease-in, opacity .5s ease-in';
						$(id).offsetTop; // Force style recalc
						$(id).style.webkitTransformOrigin = "100% 0";
						$(id).style.webkitTransform = 'skew(-30deg, 0deg) scale(0)';
						$(id).style.opacity = '0';
						$(id).style.overflow = 'hidden';
					}).delay(250);
				
					var myFx = new Fx.Tween(id);
					(function(){ myFx.start('height', 0); }).delay(250);
					(function(){
						$(id).empty();
						$(id).destroy();
					}).delay(750);
				}
			}).send();
		}
	};

	var swapSubpages = function(s1, s2){

		// Stop if not possible
		if (!(s1 && s2))
			return false;

		// Send request to server
		new Request({url: window.location.toString(), data: 'ajax=swapSubpages&sp='+s1.get('id'), onSuccess: function(){

			// Set start styles for s1
			s1.style.zIndex = '100';
	
			// Set transitions for s1 and start transitioning.
			s1.style.webkitTransition = 'opacity .25s ease-in, top 1s ease-in, left .25s ease-in, -webkit-box-shadow .25s ease-in';
//			var currentBackgroundColor = s1.style.backgroundColor;
//			s1.style.backgroundColor = '#fff';
			s1.style.opacity = '.75';
			s1.style.top = s2.getSize().y + 'px';
			s1.style.left = '-10px';
			s1.style.webkitBoxShadow = 'rgba(0, 0, 0, .9) 2px 2px 10px';
	
			// Set transitions for s2 and start transitioning.
			s2.style.webkitTransition = 'top 1s ease-in';
			s2.style.top = '-' + s1.getSize().y + 'px';
	
			// 0.25s before complete, exclude s1's transition for "top", then reset s1's other styles
			(function(){
				s1.style.webkitTransition = 'opacity .25s ease-in, left .25s ease-in, -webkit-box-shadow .25s ease-in';
//				s1.style.backgroundColor = currentBackgroundColor;
				s1.style.opacity = '1';
				s1.style.left = '0';
				s1.style.webkitBoxShadow = 'none';
			}).delay(750);
	
			// When complete, remove all transitions, switch s1 and s2 in the DOM, then reset all previously modified styles
			(function(){
				s1.style.webkitTransition = 'none';
				s2.style.webkitTransition = 'none';
	
				s1.inject(s2, 'after');
	
				s1.setStyles({'top': '0', 'z-index': 'inherit'});
				s2.setStyles({'top': '0'});
	
				// Also add/remove "disabled" class for up and down links if necessary.
				s1.getElement('.upButton').removeClass('disabled');
				s2.getElement('.downButton').removeClass('disabled');
	
				if (s1.getNext())
					s1.getElement('.downButton').removeClass('disabled');
				else
					s1.getElement('.downButton').addClass('disabled');
	
				if (s2.getPrevious())
					s2.getElement('.upButton').removeClass('disabled');
				else
					s2.getElement('.upButton').addClass('disabled');
			}).delay(1000);
		},
		onFailure: function(){
			alert('Failure');
		}}).send();
	}

	// Toolbox
	toolboxEvents = {
		mouseenter: function(){
			this.getNext().setStyle('outline','1px dotted red');
		},
		mouseleave: function(){
			this.getNext().setStyle('outline','none');
		},
		click: function(){
			this.getNext().setStyle('outline','none');
		}
	}
	$$('.closeButton').getParent().addEvents(toolboxEvents); // Toolbox
	
	// Close button
	closeButtonEvents = {
		mouseenter: function(){
			this.getParent().getNext().fade(.75);
		},
		mouseleave: function(){
			this.getParent().getNext().fade(1);
		},
		click: deleteSubpage
	}
	$$('.closeButton').each(function(el){
		if (!el.get('disabled')) el.addEvents(closeButtonEvents);
	});

	swapSubpageUp = function(e){
		e.stop();
		swapSubpages($(this.get('href')).getPrevious(), $(this.get('href')));
	}
	$$('.upButton').addEvent('click', swapSubpageUp);

	swapSubpageDown = function(e){
		e.stop();
		swapSubpages($(this.get('href')), $(this.get('href')).getNext());
	}
	$$('.downButton').addEvent('click', swapSubpageDown);

	if ($('cama-tools-onOff')){
		$('cama-tools-onOff').addEvent('click', function(e){
			e.stop();
			
			// Sound
			if (soundOn) {
				(function(){ $('snd-tools').play(); }).delay(250);
			}
			
			var toolboxes = $$('.cama-toolbox').combine($$('.cama-tool-menu')).combine($$('.staticContainer'));

			if (camaToolsOn) {
				camaToolsOn = false;
				
				toolboxes.setStyle('opacity',0.001);
				(function(){
					toolboxes.setStyle('display','none');
					$$('.subpage').setStyle('min-height',0);
				}).delay(Browser.Engine.webkit ? 500 : 0);
				
				$('cama-tools-onOff').set('text', 'Tools on');
				new Request().get('?ajax=ToolsOff');
			} else {
				camaToolsOn = true;

				$$('.subpage').setStyle('min-height','22px');
				toolboxes.setStyle('opacity',0.001);
				$$('.cama-toolbox').setStyle('display','block');
				$$('.cama-tool-menu').setStyle('display','inline');
				$$('.plus').setStyle('display','inline-block');
				$$('.staticContainer').setStyle('display','block');
				(function(){ toolboxes.setStyle('opacity',1); }).delay(1);

				$('cama-tools-onOff').set('text', 'Tools off');
				new Request().get('?ajax=ToolsOn');
			}
		});
	}
	
	// Add subpage
	closeAddButton = function(){
		var l = $('cama-tools-addSubpage-selector');
		if (l) {
			new Fx.Morph(l.getPrevious().getParent(), {duration: 100}).start({width:tbw,height:tbh});
			(function(){
				l.removeEvents().setStyle('display','none');
				$$('.addButton').setStyle('display','inline');
				l.destroy();
			}).delay(100);
		}
	}
	$$('.addButton').addEvent('click', function(e){
		e.stop();
		
		closeAddButton();
		
		var id = this.get('href');
		
		var ab = this;
		
		// Get current toolbox size
		tbw = ab.getParent().getStyle('width');
		tbh = ab.getParent().getStyle('height');

		// Lock parent "p" width/height
		var pEl = ab.getParent();
		pEl.setStyle('width', pEl.getStyle('width'));
		pEl.setStyle('height', pEl.getStyle('height'));
		pEl.setStyle('overflow', 'hidden');
		
		// Inject update-area
		var viewEl = new Element('div', {id: 'cama-tools-addSubpage-selector'});
		viewEl.inject(pEl);
		new Request.HTML({
			url: '?ajax=addSubpage&id='+id,
			update: viewEl,
			onFailure: function() {
				alert('Failure');
			},
			onSuccess: function() {
				ab.setStyle('display', 'none');
				var morpher = new Fx.Morph(pEl, {duration: 100});
				morpher.start({
					width: $('cama-tools-addSubpage-modulesList').getStyle('width'),
					height: $('cama-tools-addSubpage-modulesList').getStyle('height')
				});

				document.body.addEvent('click', function(e){
					closeAddButton();
				});
			}
		}).send();
	});

	editSubpage = function(e){
		e.stop();
		
		eb = this;
		
		var id = eb.get('href');

		// Set cookie for editor's file browser.
		Cookie.write('EditPageID', id);

		var editArea = eb.getParent().getNext().getNext();
		editArea.set('id', 'e'+id);
		
		//alert(id);
		//alert(editArea.get('id'));
		
		//editArea.setStyle('visibility', 'hidden');
		//editArea.addClass('mceEditor');

		if (!tinyMCE) {
			//alert('Loading tinyMCE');
			new Asset.javascript('Cama/TinyMCE 3.2.5/tiny_mce_gzip.js', {onload: loadTinyMCE});
		}

		var timer = setInterval(function(){
			if (tinyMCE != null) {
				clearInterval(timer);
				waitForTinyMCE(editArea.get('id'), true);
				
				// Set up stuff after editor has been loaded
				eb.getParent().getChildren().each(function(el){
					el.setStyle('display', 'none');
				});
				var saveButton = new Element('span', {'class': 'saveButton', href: '#', text: 'Lagre'});
				saveButton.inject(eb.getParent());
				
				// Move adminLinks to the right of the editor toolbox
				eb.getParent().setStyles({'z-index':10000,margin:'-110px 0 0 415px'});

				saveButton.addEvent('click', function(e){
					e.stop();
		
					new Request({
						url: '?ajax=saveSubpage&id='+id,
						data: 'content='+escape(tinyMCE.get(editArea.get('id')).getContent()),
						onFailure: function() {
							alert('Failure');
						},
						onSuccess: function(id) {
							tinyMCE.get(editArea.get('id')).save();
							tinyMCE.get(editArea.get('id')).remove();
							
							//editArea.setStyle('visibility', 'visible');
							//editArea.removeClass('mceEditor');
							
							var ch = saveButton.getParent().getChildren();
							saveButton.destroy();
							ch.each(function(el){
								el.setStyle('display', 'inline');
							});

							// Move adminLinks back to where it was
							eb.getParent().setStyles({'z-index':100,margin:0});
						}
					}).post();
				});
			}
		}, 50);
	}

	$$('.editButton').addEvent('click', editSubpage);

});