<?php
set_time_limit ( 3600 )
?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Content Editor</title>
<link href="jquery-ui-1.10.2/themes/vader/ui.dialog.css" rel="stylesheet" media="screen" id="dialog_ui" />
<link href="jquery-ui-1.10.2/themes/vader/jquery-ui.css" rel="stylesheet" media="screen" id="dialog_ui" />
<script src="jquery-ui-1.10.2/jquery-1.9.1.js"></script>
<script src="jquery-ui-1.10.2/jquery.form.js"></script>
<script src="jquery-ui-1.10.2/ui/jquery-ui.js"></script>
<script src="ckeditor/ckeditor.js"></script>
<script src="ckeditor/config.js"></script>
<script src="ckeditor/adapters/jquery.js"></script>
<script src="ckeditor/plugin2.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	$('#editor').ckeditor({ height: 400, width:600});
});

function placePic(){
	
	function ImageExist(url){
	   var img = new Image();
	   img.src = url;
	   return img.height != 0;
	}

	var filename = document.forms['uploader']['uploadedfile'].value;
	document.forms['uploader']['filename'].value = filename;
	var url = 'http://www.mydomain.com/external/images/cms/'+filename;
	document.getElementById('uploader').submit();
	var string = CKEDITOR.instances.editor.getData();
	var t = setInterval(function(){
								 
				var exists = ImageExist(url);
				if(exists === true){
						if(document.getElementById('loader')){
							document.getElementById('loader').parentNode.removeChild(document.getElementById('loader'));
						}
						CKEDITOR.instances.editor.setData(string + "<img src=\""+url+"\" />");
						clearInterval(t);
				}
				else{
					if(! document.getElementById("loader")){
						var loader = document.createElement("div");
						loader.setAttribute("id","loader");
						loader.setAttribute("style","position:absolute;margin:-300px auto 0px 240px;width:113px;height:63px;text-align:center;z-index:10;");
						document.getElementById('formBox').appendChild(loader);
						
						var loaderGif = document.createElement("img");
						loaderGif.setAttribute("id","loaderGif");
						loaderGif.setAttribute("style","width:113px;height:63px;text-align:center;");
						loaderGif.src = "external/images/cms/2dumbfish.gif";
						document.getElementById('loader').appendChild(loaderGif);
					}
				}
						
				},100);
}

function loadContent(){
	if(document.forms['editorform']['site'].value !== "" && document.forms['editorform']['page'].value !== ""){
		var site = document.forms['editorform']['site'].value;
		var page = document.forms['editorform']['page'].value;
		var url = site+"/"+page+".html";
		$.ajax({
			type: "GET",
			url: url,
			dataType: 'html',
			success: function (html) {
				CKEDITOR.instances.editor.setData(html);
			}
		});
	}
}
</script>
<style>
button{
  width: 93px;
  height: 28px;
  border:none;
  padding: 0 4px 8px 0;
  font-weight:bold
}
#formBox{
	width:50%;
	margin:10px auto 0px auto;
	font-family:Tahoma, Geneva, sans-serif;
	font-size:12px;
}
#field{
	position:absolute;
	top:10px;
	margin-left:300px;
	margin-bottom:20px;
}
#target{
	position:absolute;
	top:100px;
	left:100px;
	width:400px;
	height:100px;
	display:none;
}
.textField{
	padding-left: 1px;
	border-style: solid;
	border-color: black;
	border-width: 1px;
	font-family: helvetica, arial, sans serif;
	padding-left: 1px;
}
#report{
	float:left;
	margin-left:20px;
	margin-top:10px;
	font-family: helvetica, arial, sans serif;
	font-size:12px;
	color:#900;
}
</style>
</head>

<body>
<?php
if(isset($_GET['r'])){ ?><div id="report">
<?php echo $_GET['r']; ?> is changed.
</div><?php
}
?>
<div id="formBox">
<form id="uploader" name="uploader" action="editaction.php"  method="post" target="target" enctype="multipart/form-data">
<input type="hidden" name="MAX_FILE_SIZE" value="50000000" />
<input type="hidden" name="filename" value="" />
Insert image:&nbsp;<input name="uploadedfile" type="file" class="textField" onchange="placePic();return false;" />&nbsp;&nbsp;
</form>

<form name="editorform" id="editorform" method="post" action="editaction.php" >
<div id="field" >Site:&nbsp;<select name="site"  class="textField" onchange="loadContent();return false;">
	<option value=""></option>
    <option value="scubatortuga">scubatortuga</option>
	<option value="drytortugascharters">drytortugascharters</option>
	<option value="keyscombo">keyscombo</option>
	<option value="keywesttreasurehunters">keywesttreasurehunters</option>
	<option value="spearfishkeywest">spearfishkeywest</option>
</select>
Page:&nbsp;<select name="page" class="textField" onchange="loadContent();return false;">
	<option value=""></option>
    <option value="one">1</option>
	<option value="two">2</option>
	<option value="three">3</option>
	<option value="four">4</option>
</select>
</div><br />
<textarea name="editor" id="editor"></textarea><br />
<input type="submit" name="submit" value="Submit" />
</form>
</div>
<iframe name="target" id="target"></iframe>
</body>
</html>