extends template_70s

block append style
    link(rel='stylesheet' data-name='vs/editor/editor.main' href=asset('monaco/package/min/vs/editor/editor.main.css'))

block content
    .container#home
        if needsAccessKey
            .inner
                h2 Snippet
                h3 #{snippet.slug}
                p This snippet is protected by an access key. Please enter it to view:
                form(method='get')
                    .form-group
                        input.form-control(name='accessKey' placeholder='abc123' style="margin-right: 10px")
                        button View
        else if needsConfirm
            .inner
                h2 Snippet
                h3 #{snippet.slug}
                p This snippet is single-access only. Once you view it, it will be permanently deleted. Continue?
                form(method='get')
                    if accessKey
                        input(name='accessKey' type='hidden' value=accessKey)
                        input(name='confirmSingleAccess' type='hidden' value='yes')
                    button Continue
        else
            .inner(style='width: 100%')
                h2 Snippet
                h3 #{snippet.slug}
                #monaco-container(style="width: 100%; height: 100%")

block append script
    script.
        var require = { paths: { vs: "#{asset('monaco/package/min/vs')}" }}
    script(src=asset('monaco/package/min/vs/loader.js'))
    script(src=asset('monaco/package/min/vs/editor/editor.main.nls.js'))
    script(src=asset('monaco/package/min/vs/editor/editor.main.js'))
    script.
        var editor = monaco.editor.create(document.querySelector('#monaco-container'), {
            theme: 'vs-dark',
            value: !{JSON.stringify(snippet.body)},
            language: !{JSON.stringify(snippet.syntax)},
        })