<!DOCTYPE html>
<html lang="zh-cn">
<head>
	<title>模板编辑</title>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="renderer" content="webkit">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="shortcut icon" href="{{ url('images/favicon.png') }}" type="image/png">
    <link rel="stylesheet" href="{{ asset('data/assets/js/aceEditor/public/css/main.css') }}">
    <link rel="stylesheet" href="{{ asset('data/assets/js/aceEditor/public/css/ui.easytree.css') }}">
	<script type="text/javascript">
    	var HOME_URL = "{{ url('/') }}";
	</script>
</head>
<!--[if lt IE 10]>
<body>
    <div class="noie">
        您现在使用的是旧版本的 IE 浏览器，为了您能更好及完整体验该系统的所有功能，请尽快升级您的浏览器！
    </div>
<![endif]-->

<body class="filemanager-body">
<style type="text/css">
	#ace-editor {
		margin: 0;
		position: absolute;
		top: 5px;
		bottom: 30px;
		left: 0;
		right: 0;
	}
</style>

<div id="wrap-main">
	<div id="conent-main" class="file-wrap">
		<div id="main-container">
			<pre id="ace-editor" data-url="{{ $data['url'] }}">{{ $data['content'] }}</pre>
		</div>
	</div>
</div>

<script src="{{ asset('data/assets/js/aceEditor/public/js/jquery-1.11.1.min.js') }}"></script>
<script src="{{ asset('data/assets/js/aceEditor/public/js/require.js') }}"></script>
<script src="{{ asset('data/assets/js/aceEditor/ace.js') }}"></script>
<script src="{{ asset('data/assets/js/aceEditor/ext-modelist.js') }}"></script>
<script src="{{ asset('data/assets/js/aceEditor/ext-language_tools.js') }}"></script>

<script>
$(function(){
    var editor = ace.edit("ace-editor");
    editor.setTheme("ace/theme/monokai");
    editor.setShowPrintMargin(false);
    editor.setFontSize(16);
    editor.getSession().setUseWrapMode(true);
    editor.setOptions({
        enableBasicAutocompletion: true,
        enableSnippets: true,
        enableLiveAutocompletion: true
    });
    (function (){
	        var modelist = ace.require("ace/ext/modelist");
	        var filePath = '{{ $data['name'] }}';
	        var mode = modelist.getModeForPath(filePath).mode;
	        editor.session.setMode(mode);
	}());
	editor.commands.addCommand({
		name: 'saveFile',
		bindKey: {
			win: 'Ctrl-S',
			mac: 'Command-S',
			sender: 'editor|cli'
		},
		exec: function(env, args, request) {
			$('#f-save-btn', parent.document.body).click();
		}
	});
	$('#f-save-btn', parent.document.body).on('click', function() {
		var load = "<img src='{{ asset('data/assets/js/aceEditor/public/img/loading-1.gif') }}'>";
		$('.save-status', parent.document.body).html(load).show();
		$.ajax({
			url: $('#ace-editor').data('url'),
			type: 'PUT',
			data: {
				content: editor.getValue()
			},
			success: function( response ) {
				if (response.status == 'success'){
					$('.save-status', parent.document.body).addClass('save-success').html('保存成功');
				}else{
				    $('.save-status', parent.document.body).addClass('save-error').html('保存失败');
				}
				$('.save-status', parent.document.body).fadeOut(1600, function() {
					$(this).empty();
				});
			}
		});
	});		
});
</script>

</body>
</html>
