{% extends "page.html" %}

{% block styles %}
    {{ super() }}
    {% asset 'markdown_view/markdown_view_css' %}
    {% asset 'markdown_view/katex_css' %}
{% endblock %}

{%- block page %}
<script>
    const start = {{ start_index }};
    const end = {{ end_index }};
</script>

{% if start_index is none and end_index is none %}
    <form method="post" id="highlight-form" class="hidden">
        {{ h.csrf_input() }}
        <label for="highlight">highlight:</label>
        <input type="text" name="highlight" id="highlight" placeholder='Enter markdown text to highlight...'
            maxlength='3000' minlength='10'>
        <input type="submit">
    </form>
{% endif %}
<div id="markdown_content" data-page-url="{{resource.get('url') }}">
</div>
{% endblock -%}

{%- block scripts %}
{% asset 'markdown_view/purify' %}
{% asset 'markdown_view/marked' %}
{% asset 'markdown_view/marked_tables' %}
{% asset 'markdown_view/katex' %}
{% asset 'markdown_view/katex_autorender' %}
{% asset 'markdown_view/markdown_view' %}
{% endblock -%}