extends ../../../views/withjs

block title
    title #{title} - Prototype

block extrajs
    script(src="/static/js/prototypetools.min.js")
    block configjs
    block mainjs
    script document.getElementById('music').volume = 0.5;

block extrahead
    link(rel="stylesheet" href="/static/css/prototype.css")

block content
    #main-div.panel-group(style={'margin-top':'10px', 'margin-bottom':'10px'})
        block description
        #alert-placeholder

        block fullscreen
            button#full.btn.btn-primary(style={'margin-right': '10px', 'margin-bottom': '10px'}) Fullscreen
        button#reset.btn.btn-primary(style={'margin-right': '10px', 'margin-bottom':'10px'}) Reset camera

        button#undo.btn.btn-default(style={'margin-right': '10px', 'margin-bottom': '10px'})
            span.glyphicon.glyphicon-triangle-left('aria-hidden'="true")

        button#redo.btn.btn-default(style={'margin-right': '10px', 'margin-bottom':'10px'})
            span.glyphicon.glyphicon-triangle-right('aria-hidden'="true")

        input#fullarrow(type="checkbox", style={'margin-right': '10px', 'margin-bottom': '10px'})
        label(for="fullarrow" style={'margin-right':'10px'}) Full arrow

        input#collisions(type="checkbox", style={'margin-right': '10px', 'margin-bottom': '10px'}, checked)
        label(for="collisions" style={'margin-right':'10px'}) Collisions

        input#showarrows(type="checkbox", style={'margin-right': '10px', 'margin-bottom': '10px'}, checked)
        label(for="showarrows" style={'margin-right':'10px'}) Show arrows

        input#recommendation(type="checkbox", style={'margin-right': '10px', 'margin-bottom': '10px'})
        label(for="recommendation" style={'margin-right':'10px'}) Fixed prev

        audio#music(controls, volume=0.5)
            source(src="/static/data/music/bobomb.ogg")
            source(src="/static/data/music/bobomb.mp3")

        #container(style={'padding': '0px', 'margin': '0px'}, tabindex="1")