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

{% block head_extra %}
    <script type="text/javascript" src="{% static 'js/webretro/embed/embed.js' %}"></script>
{% endblock %}

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

{% block content %}
    <a href="{% url "games:game_list" %}">Back to list</a>
    <p>
    <img src={{object.marquee.url}} />
    </p>

    <dl>
        <dt>Name</dt>
        <dd>{{object.name}}</dt>

        <dt>Publisher</dt>
        <dd>{{object.publisher}}</dd>

        <dt>Dveloper</dt>
        <dd>{{object.developer}}</dd>

        <dt>Players</dt>
        <dd>{{object.players}}</dd>

        <dt>ROM File</dt>
        <dd><a href="{{object.rom_file.url}}">Download</a></dd>
    </dl>

    <div id="webretro-container" style="width:800px; height:600px"></div>
    <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 %}