laravel form view

@extends('admin.layout')
@section('content')
<h1 class="page-header">新增文章</h1>
@if (count($errors->all()) > 0 )
<div class="alert alert-danger" role="alert">
    @foreach ($errors->all() as $error)
    <p>{{ $error }}</p>
    @endforeach
</div>
@endif
<div class="row article">
    {{ Form::open(['route' => ['admin.article.store'], 'class' => 'form-horizontal', 'role'=> 'form', 'method' => 'post']) }}

    <div class="row">
        <h2 id="editable-title" class="margin-30" contentEditable="true">未命名文章</h2>
    </div>

    <div class="form-group">
        <div class="btn-group margin-30" role="group" aria-label="">
            <a href="javascript:void(0);" class="btn btn-default fine-uploader"></a>
            <button type="submit" class="btn btn-default" name="status" value="0"><i class="fa fa-pencil"></i> 草稿</button>
            <button type="submit" class="btn btn-default" name="status" value="1"><i class="fa fa-save"></i> 發布</button>
            <button type="button" class="btn btn-default js-toggle-preview"><i class="fa fa-indent"></i> 預覽</button>
        </div>
    </div>

    <div id="editor-area" class="row">
        <textarea id="code" name="content"></textarea>
        <div class="preview">
            <h3>文章預覽</h3>
            <div class="out well"></div>
        </div>
    </div>

    <input type="hidden" name="title" class="form-control" id="title" value="未命名文章" />
    <input type="hidden" name="html" class="form-control" id="content" value="" />

    <div class="form-group">
        <div class="col-sm-11 margin-30">
            <input type="text" name="tag" class="form-control" placeholder="文章標籤" />
        </div>
    </div>

    <div class="form-group">
        <div class="btn-group margin-30" role="group" aria-label="">
            <a href="javascript:void(0);" class="btn btn-default fine-uploader"></a>
            <button type="submit" class="btn btn-default" name="status" value="0"><i class="fa fa-pencil"></i> 草稿</button>
            <button type="submit" class="btn btn-default" name="status" value="1"><i class="fa fa-save"></i> 發布</button>
            <button type="button" class="btn btn-default js-toggle-preview"><i class="fa fa-indent"></i> 預覽</button>
        </div>
    </div>
    {{ Form::close() }}

    <div class="row preview">
        <div class="margin-30">
            <h3 class="">文章預覽</h3>
            <div class="out well"></div>
        </div>
    </div>
</div>
@stop
@section('head')
{{ HTML::style('assets/lib/editor/codemirror/lib/codemirror.css') }}
{{ HTML::style('assets/lib/editor/googlecode.css') }}
{{ HTML::style('assets/lib/fine-uploader/fine-uploader.min.css') }}
@stop
@section('bottom-js')
{{ HTML::script('assets/lib/editor/marked.js') }}
{{ HTML::script('assets/lib/editor/highlight.pack.js') }}
{{ HTML::script('assets/lib/editor/codemirror/lib/codemirror.js') }}
{{ HTML::script('assets/lib/editor/codemirror/addon/active-line.js') }}
{{ HTML::script('assets/lib/editor/codemirror/addon/matchbrackets.js') }}
{{ HTML::script('assets/lib/editor/codemirror/addon/trailingspace.js') }}
{{ HTML::script('assets/lib/editor/codemirror/addon/mode/overlay.js') }}
{{ HTML::script('assets/lib/editor/codemirror/mode/xml.js') }}
{{ HTML::script('assets/lib/editor/codemirror/mode/markdown.js') }}
{{ HTML::script('assets/lib/editor/codemirror/mode/gfm.js') }}
{{ HTML::script('assets/lib/editor/codemirror/mode/javascript.js') }}
{{ HTML::script('assets/lib/editor/rawinflate.js') }}
{{ HTML::script('assets/lib/editor/rawdeflate.js') }}
{{ HTML::script('assets/lib/fine-uploader/jquery.fine-uploader.min.js') }}
<script>
var URL = window.URL || window.webkitURL || window.mozURL || window.msURL;
    navigator.saveBlob = navigator.saveBlob || navigator.msSaveBlob || navigator.mozSaveBlob || navigator.webkitSaveBlob;
    window.saveAs = window.saveAs || window.webkitSaveAs || window.mozSaveAs || window.msSaveAs;
var languageOverrides = {
    js: 'javascript',
    html: 'xml'
};
var editor;

function update(e){
    var val = e.getValue();
    setOutput(val);
}

function setOutput(val){
  val = val.replace(/<equation>((.*?\n)*?.*?)<\/equation>/ig, function(a, b){
    return '<img src="http://latex.codecogs.com/png.latex?' + encodeURIComponent(b) + '" />';
  });
  val = marked(val);
  $(".out").html(val);
  $("#content").val(val);
}

</script>
<script type="text/template" id="qq-template">
  <div class="qq-uploader-selector qq-uploader">
    <div class="qq-upload-button-selector qq-upload-button">
        <i class="fa fa-picture-o fa-fw"></i> 圖片
    </div>
    <span class="qq-drop-processing-selector qq-drop-processing">
      <span>Processing dropped files...</span>
      <span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
    </span>
    <ul class="qq-upload-list-selector qq-upload-list qq-hide">
      <li>
        <div class="qq-progress-bar-container-selector">
          <div class="qq-progress-bar-selector qq-progress-bar"></div>
        </div>
        <span class="qq-upload-spinner-selector qq-upload-spinner"></span>
        <span class="qq-edit-filename-icon-selector qq-edit-filename-icon"></span>
        <span class="qq-upload-file-selector qq-upload-file"></span>
        <input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
        <span class="qq-upload-size-selector qq-upload-size"></span>
        <a class="qq-upload-cancel-selector qq-upload-cancel" href="#">Cancel</a>
        <a class="qq-upload-retry-selector qq-upload-retry" href="#">Retry</a>
        <a class="qq-upload-delete-selector qq-upload-delete" href="#">Delete</a>
        <span class="qq-upload-status-text-selector qq-upload-status-text"></span>
      </li>
    </ul>
  </div>
</script>
@stop
@section('ready-js')
    $('#editable-title').on('input', function() {
        console.debug( $(this).text() );
        $('#title').val($(this).text());
    });

    marked.setOptions({
      highlight: function(code, lang){
        if(languageOverrides[lang]) lang = languageOverrides[lang];
        return hljs.LANGUAGES[lang] ? hljs.highlight(lang, code).value : code;
      }
    });

    editor = CodeMirror.fromTextArea(document.getElementById('code'), {
        mode: 'gfm',
        matchBrackets: true,
        lineNumbers: true,
        lineWrapping: true,
        theme: 'default',
        viewportMargin: 20,
        showTrailingSpace: true,
        styleActiveLine: true,
        onChange: update
    });

    editor.on('change', update);

    $('.js-toggle-preview').on('click', function() {
        $('#editor-area').toggleClass('sidebar-preview');
    });

    $('.fine-uploader').fineUploader({
        request: {
            inputName: 'file',
            endpoint: '{{ URL::to('admin/util/imgUpload') }}'
        }
    }).on('complete', function(event, id, name, json, xhr) {
        editor.replaceSelection('![Alt](' + json.url + ' "title")');
        $('qq-drop-processing').addClass('qq-hide');
    });

@stop