{% extends "base.html" %}
{% load static %}

{% block title %}{{object.name}}{% endblock %}

{% block content %}
    <img src={{object.marquee.url}} />
    <img src={{object.screenshot.url}} />
    <ul>
        <li>{{object.game_system}}</li>
        <li>{{object.publisher}}</li>
        <li>{{object.developer}}</li>
        <li>{{object.players}}</li>
        <li><a href="{{object.rom_file.url}}">Download ROM</a></li>
    </ul>
    <div id="webretro-container" style="width:800px; height:600px">
    </div>
    <script type="text/javascript" src="{% static 'js/webretro/embed/embed.js' %}"></script>
    <script>
     webretroEmbed(document.getElementById("webretro-container"), "{% static 'js/webretro/index.html' %}", {system: "{{object.game_system.retropie_slug}}", rom:"{{request.scheme}}://{{request.META.HTTP_HOST}}{{object.rom_file.url}}"});
    </script>

{% endblock %}