{% extends 'editor/editor.html' %}

{% block css %}
    <link href = "{{ url('static_assets', filename='js/codemirror/lib/codemirror.css') }}"
          rel  = "stylesheet" />
    <link href = "{{ url('static_assets', filename='js/codemirror/addon/merge/merge.css') }}"
          rel  = "stylesheet" />
    
    {{ super() }}
{% endblock %}

{% block javascript %}
    {{ super() }}
    
    <script src="{{ url('static_assets', filename='js/codemirror/lib/codemirror.js') }}"></script>
    <script src="{{ url('static_assets', filename='js/codemirror/mode/markdown/markdown.js') }}"></script>
    <script src="{{ url('static_assets', filename='js/codemirror/mode/turtle/turtle.js') }}"></script>
    <script src="{{ url('static_assets', filename='js/codemirror/addon/merge/merge.js') }}"></script>
    <script src="{{ url('static_assets', filename='js/diff_match_patch_uncompressed.js') }}"></script>
    
    <script src="{{ url('static_assets', filename='js/editor/merge.js') }}" id="editor_script" data-type="{{ type }}"></script>
{% endblock %}

{% block main %}
    
    {# The form used for submitting content #}
    <form id="form_content" method="post" action=""></form>
    

    <div class="merge">
        <div class="alert">
            <p>
                <strong>Someone else has changed this page since you started
                editing it.</strong>
            </p>
            <p>
                On the left you can see the current revision with the most recent
                changes. Your last changes are shown on the right. Please use the
                central text area for reviewing your changes. You can edit it, or
                you can insert/replace lines using the editors' left/right arrows.
                <strong>Only the content in the central text area will be saved.</strong>
            </p>
        </div>
        
        <div class="three_way">
            <div>CURRENT</div>
            <div>MERGE</div>
            <div>YOUR CHANGES</div>
            
            <div>
                <textarea id="current_content" name="current_content" maxlength="10485760" disabled>{{ current_revision['content'] }}</textarea>
            </div>
            <div>
                <textarea id="content" name="content" maxlength="10485760" required form="form_content">{{ current_revision['content'] }}</textarea>
            </div>
            <div>
                <textarea id="changed_content" name="changed_content" maxlength="10485760" disabled>{{ content }}</textarea>
            </div>
        </div>
        
        {# CodeMirror 3-way editor will be created here #}
        <div id="three_way_editor"></div>
    </div>
    
    <footer>
        <div>
            Describe your changes
        </div>
        <div>
            <input type="text" name="edit_summary" value="{{ edit_summary }}" maxlength="1024" placeholder="" required form="form_content" />
        </div>
        <div class="licensing">
            By publishing changes, you irrevocably agree to release your contribution
            under the CC-BY-SA 4.0 License. You agree that a hyperlink or URL is
            sufficient attribution under the Creative Commons license.
        </div>
        <div>
            <input type="hidden" name="revision" value="{{ revision_number if revision_number is not none }}" form="form_content" />
            <input type="submit" value="Save" form="form_content" class="button button_default" />
            <a href="{{ url('node', id=node_id) }}">Cancel</a>
        </div>
    </footer>
    
{% endblock %}
