Add Ace Editor to Anchor Post and Page Area

AnchorCMS ACE Editor

<style type="text/css" media="screen">
    #editor { 
        position: relative;
        height: 400px;
    }
  </style>
	<div id="editor"></div>
	<fieldset class="main">
		<div class="wrap">	
			<?php echo Form::textarea('html', Input::previous('html', $article->html), array(
				'placeholder' => __('posts.content_explain'),
				'id' => 'p-editor',
			)); ?>

			<?// php echo $editor; ?>
		</div>
	</fieldset>
	<script src="http://rawgithub.com/ajaxorg/ace-builds/master/src-noconflict/ace.js" type="text/javascript" charset="utf-8"></script>
	<script>
	$( document ).ready(function() {
    var editor = ace.edit("editor");
		var textarea = $('textarea[id="p-editor"]').hide();
    		editor.getSession().setMode("ace/mode/html");
    		editor.getSession().setUseWrapMode(true);
    		editor.setShowPrintMargin(false);
		editor.getSession().setValue(textarea.val());
		editor.getSession().on('change', function(){
  	textarea.val(editor.getSession().getValue());
});
	});
</script>

Original

  <fieldset class="main">
		<div class="wrap">
			<?php echo Form::textarea('html', Input::previous('html', $article->html), array(
				'placeholder' => __('posts.content_explain')
			)); ?>

			<?php echo $editor; ?>
		</div>
	</fieldset>