<!-- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> -->
<?php require '../public/system/headers/headers.php';?>
<?php echo $this->headLink()->appendStylesheet($this->websiteUrl . 'system/css/seotoaster.css'); ?>
<?php echo $this->headLink()->appendStylesheet($this->websiteUrl . 'system/js/thickbox/thickbox.css'); ?>
<?php $this->headScript()->appendFile($this->websiteUrl .'system/js/jquery/jquery.js'); ?>
<?php $this->headScript()->appendFile($this->websiteUrl . 'system/js/thickbox/thickbox.js'); ?>
<?php $this->headScript()->appendFile($this->websiteUrl .'system/js/page/page.js'); ?>
<?php $this->headScript()->appendFile($this->websiteUrl . 'system/js/swfupload/swfupload.js'); ?>
<?php $this->headScript()->appendFile($this->websiteUrl . 'system/js/swfupload/swfupload.queue.js'); ?>
<?php $this->headScript()->appendFile($this->websiteUrl . 'system/js/swfupload/fileprogress.js'); ?>
<?php $this->headScript()->appendFile($this->websiteUrl . 'system/js/swfupload/handlers.js'); ?>
<?php echo $this->headScript(); ?>
<script type="text/javascript">
	function replaceAll(txt, replace, with_this) {
		return txt.replace(new RegExp(replace, 'g'),with_this);
	}

    $(document).ready(function(){

        initObjectSWFUpload('<?php echo $this->websiteUrl?>','pageuploadpic');
        var websiteUrl = $('#website_url').val();
        var mainMenuRad = $('#selectmenu-1');
        var statMenuRad = $('#selectmenu-2');
        var noMenuRad = $('#selectmenu-0');
        mainMenuRad.attr('checked', 'checked');


        function hideBlock()
        {
            $('#lbl-is-category').hide();
            $('#pageiscategory').hide();
            $('#or-span').hide();
            $('#pageselectcategory').hide();
        }

        function showBlock()
        {
            $('#lbl-is-category').show();
            $('#pageiscategory').show();
            $('#or-span').show();
            $('#pageselectcategory').show();
        }

        /*click on no menu*/
        $('#selectmenu-0').click(function(){hideBlock()});

        /*click on main menu*/
		$('#selectmenu-1').click(function(){showBlock()});

        /*click on static menu*/
        $('#selectmenu-2').click(function(){hideBlock()});

        $('#pageiscategory').click(function(){
            var isCat = true;
            $('#pageselectcategory').toggle();
            var checked = $(this).attr('checked');
            var selectedOption = $('#pageselectcategory option:selected').val();
            if(!checked && selectedOption == -1) {
                isCat = false;
            }
            if(isCat) {
				$('#or-span').toggle();
            }
            else {
                mainMenuRad.attr('checked', 'checked');
				$('#or-span').show();
            }
        });

        $('#pageselectcategory').change(function(){
            var isCat = true;
            var selectedOption = $('#pageselectcategory option:selected').val();
            if(selectedOption == -1) {
                isCat = false;
            }
            if(isCat) {

            }
            else {
                mainMenuRad.attr('checked', 'checked');
                mainMenuRad.show();
				statMenuRad.show();
				noMenuRad.show();

                $('#or-span').show();
                $('#lbl-mainmenu').show();
                $('#lbl-staticmenu').show();
				$('#lbl-nomenu').show();
            }
        })

        //filling all fields by the data as in h1 field
        $('#pageh1').keyup(function()
        {
			var str  = ($('#pageh1').val()+'').toLowerCase();
			var url = replaceAll(str, "'", "");
			$('#pageurl').val(url);
			$('#h1image').val(str);

            $('#pagetitle').val($('#pageh1').val());

            $('#pagenavname').val($('#pageh1').val());
        });

		$('#pageurl').keyup(function(){
			var str = $('#pageurl').val();
			var url = replaceAll(str, "'", "");
			$('#pageurl').val(url);
		});

        $("#category-exists").show();
        $("#category-exists").click(function(){
            hidePageMessages();
        });


		$("#page-exists").fadeOut(24000, function () {
            $(this).hide();
		});

		$("#page-exists").click(function(){
			$("#page-exists").hide();
		});

		/*  $("#page-exists").show();
		$("#page-exists").fade({duration: 7})
		 */


		$("#url-exists").show();
        $("#url-exists").click(function(){
            hidePageMessages();
        });

        $("#errors-list").show();
        $("#errors-list").click(function(){
            hidePageMessages();
        });

    });
    function initObjectSWFUpload(urlWebsite, buttonId)
    {
        var swfu;
        var settings = {
            flash_url : ""+urlWebsite+"system/js/swfupload/swfupload.swf",
            upload_url: ""+urlWebsite+"sys/backend_swfuploader/uploadpage/",

            file_size_limit : "3 MB",
            file_types : "*.gif;*.png;*.jpg",
            file_types_description : "Web Image Files",
            file_upload_limit : 10,
            file_queue_limit : 0,

            custom_settings : {
                progressTarget : "UploadProgress",
                cancelButtonId : "btnCancel"
            },
            debug: false,

            // Button settings
            button_placeholder_id: buttonId,
            button_image_url: ""+urlWebsite+"system/js/swfupload/bg-select-image.png",
            button_width: "163",
            button_height: "37",
            button_cursor: SWFUpload.CURSOR.HAND,
            button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,
            // The event handler functions are defined in handlers.js
            file_queued_handler : fileQueued,
            file_queue_error_handler : fileQueueError,
            file_dialog_complete_handler : fileDialogComplete,
            upload_start_handler : uploadStart,
            upload_progress_handler : uploadProgress,
            upload_error_handler : uploadError,
            upload_success_handler : uploadSuccess,
            upload_complete_handler : uploadComplete,
            queue_complete_handler : queueComplete	// Queue plugin event
        };
        swfu = new SWFUpload(settings);
    }
    function uploadSuccess(file, serverData, responseReceived)
    {
        var websiteUrl = $('#website_url').val();
        var fileName = serverData;
		//alert(fileName);
        if(fileName.length < 15 && fileName!='')
        {

            var str = '<img id="image-place" width="100" height="100" alt = "'+fileName+'" src="<?php echo $this->websiteUrl?>tmp/'+fileName+'"/>';//uploaded files
            document.getElementById('pageupdateimage').style.backgroundColor = '#FFFFFF';
            document.getElementById('image_name').value = fileName;
            document.getElementById('pageupdateimage').innerHTML = str;
            document.getElementById('image_path').value = 'tmp/'+fileName;
		}
    }
</script>

<?php if(isset($this->redirect) && $this->redirect!="") {   ?>
<script type="text/javascript">
	var tmpredirect = '<?php echo $this->redirect;?>';
	parent.tb_remove();
	top.location = tmpredirect;
</script>
<?php  } ?>

<div id="seotoaster" class="page">
	<!-- Start Errors -->
	<?php if($this->pageExists==true) {  ?>
	<div id="page-exists" class="errors" style="background-color:green;top:12%;"><strong>For your information, a page with a similar navigation label already exists.<br/> This can be confusing to your website visitors.<br/> Please think twice about this.</strong></div>
<?php } ?>


<?php if($this->categoryExists || $this->urlExists || $this->errorElements) {?>
	<div id="page-errors" class="errors"  style="cursor:pointer;" onclick="hidePageMessages();">
		<ul>
	<?php if($this->categoryExists==true) {  ?>
			<li id="category-exists" style="display:none;"><strong>Category with such navigation name already exists.</strong></li>
	<?php } ?>

	<?php if($this->urlExists==true) {  ?>
			<li id="url-exists" style="display:none;"><strong>Page with such a URL is already exist.<br/> Please enter another URL.</strong></li>
	<?php } ?>

	<?php if(isset($this->errorElements)) {  ?>
					<?php echo $this->errorElements;?>
				<?php } ?>
		</ul>
	</div>
<?php }?>
	<!-- End Errors -->
	<div id="template-list-div" style="overflow:none;height:588px;widht:500px;display:none;"></div>
	<div id="fa-list-div" style="display:none;"></div>
	<div id="admineditwhat" style="top: -2px;">Add page</div>
	<div class="close_window" onclick="parent.tb_remove();"></div>
	<p id="show-template-list-link-container" ><a id="show-template-list-link" title="Click here to change template" href="javascript: void(0);">Select template</a></p>
	<p id="show-fa-list-link-container"><a id="show-fa-list-link" onclick="showFaLink();" title="Click here to select featured areas" href="#">Not yet.</a></p>
	<div id="pageuploadpic"></div>

	<!--
		<span style="position: absolute; font-size: 13px; font-weight: bold; color: rgb(255, 255, 255); left: 467px; top: 81px;" id="lbl-mainmenu">Main menu</span>
		<span style="position: absolute; font-size: 13px; font-weight: bold; color: rgb(255, 255, 255); top: 81px; left: 571px;" id="lbl-staticmenu">Static menu</span>
		<span style="position: absolute; font-size: 13px; font-weight: bold; color: rgb(255, 255, 255); left: 683px; top: 81px;" id="lbl-nomenu">No menu</span>
		<span style="position: absolute; font-size: 13px; font-weight: bold; color: rgb(255, 255, 255); left: 467px; top: 116px;" id="lbl-is-category">This is a new category</span>
		<span style="position: absolute; font-size: 13px; font-weight: bold; color: rgb(255, 255, 255); left: 655px; top: 116px;" id="or-span"> OR</span>
	-->
    <span style="position: absolute; font-size: 13px; font-weight: bold; color: #fff; left: 501px; top: 81px;" id="lbl-mainmenu">{%Main menu%}</span>
    <span style="position: absolute; font-size: 13px; font-weight: bold; color: #fff; top: 81px; left: 612px;" id="lbl-staticmenu">{%Static menu%}</span>
    <span style="position: absolute; font-size: 13px; font-weight: bold; color: #fff; left: 724px; top: 81px;" id="lbl-nomenu">{%No menu%}</span>
    <span style="position: absolute; font-size: 13px; font-weight: bold; color: #fff; left: 484px; top: 116px;" id="lbl-is-category">{%This is a new category%}</span>
    <span style="position: absolute; font-size: 13px; font-weight: bold; color: #fff; left: 690px; top: 116px;" id="or-span"> {%OR%}</span>

<?php echo $this->pageForm; ?>
	<p id="headertext">{%Page header H1 tag:%}</p>
	<p id="titletext">{%Display in browser title as:%}</p>
	<p id="urltext">{%Page URL in address bar:%}</p>
	<p id="navigationtext">{%Display in navigation as:%}</p>
	<p id="metadesctext">{%Meta description:%}</p>
	<p id="metakeytext">{%Meta keywords:%}</p>
	<p id="teasertext">{%Page Teaser text:%}</p>
	<p id="navigationblocktext">{%NAVIGATION%}</p>
	<p id="settingstext">{%SETTINGS%}</p>
	<p id="imageteasertext">{%IMAGE TEASER FOR THIS PAGE%}</p>
	<p id="currenttemplatetext">{%Current Template:%}</p>
	<p id="pageisfeaturedtext">{%Page is featured:%}</p>
	<p id="pagenotfoundtext">{%Use as 404 page not found:%}</p>
	<p id="noimagetext">{%No image Yet%}</p>



    <!--NECESSARY FOR SWF UPLOAD!!!!!!-->
    <input disabled="disabled" id="btnCancel" value="Cancel All Uploads" onclick="swfu.cancelQueue();" style="margin-left: 2px; font-size: 8pt; height: 29px; display:none;" type="button">
    <div class="fieldset flash" style="display:none;" id="UploadProgress"></div>
    <div class="fieldset flash" style="display:none;" id="divStatus"></div>
    <div id ="swfbackground">&nbsp;</div>
    <div  id="pageupdateimage" style="border: 1px solid #fff;">
<?php if($this->pageForm->old_image_name->getValue()) { ?>
        <img id="image-place" width="100" height="100" src="<?php echo $this->websiteUrl;?>tmp/<?php echo $this->pageForm->image_name->getValue(); ?>" alt=""/>
<?php } ?>
    </div>
	<input type="hidden" id="hid-main-wsurl" name="hid-main-wsurl" value="<?php echo $this->websiteUrl; ?>" />
</div>