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

{% block title %}{{block.super}} > {{datasheet.title}}{% endblock %}

{% block css_import %}
{{block.super}}
        <link rel="stylesheet" type="text/css" href="{% static 'hdalab/css/additionnal_renkan.css' %}" />
        <link rel="stylesheet" type="text/css" href="{% static 'renkanmanager/lib/renkan/css/renkan.css' %}" />
        <style type="text/css">
        .rnk-wrapper, .rnk-container{
            width: 100%;
        }
        .rnk-container{
            height: 100%;
            width: 100%;
        }
        .rnk-wrapper{
            height: 100%;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
        }
        </style>
{% endblock %}

{% block js_import %}
{{block.super}}
        <script src="{% static 'renkanmanager/lib/jquery.mousewheel.min.js' %}"></script>
        <script src="{% static 'renkanmanager/lib/underscore-min.js' %}"></script>
        <script src="{% static 'renkanmanager/lib/backbone.js' %}"></script>
        <script src="{% static 'renkanmanager/lib/backbone-relational.js' %}"></script>
        <script src="{% static 'renkanmanager/lib/paper.js' %}"></script>
        <script type="text/javascript">
            var require = {
                baseUrl: "{% static 'renkanmanager/lib/' %}"
            };
        </script>
        <script src="{% static 'renkanmanager/lib/require.js' %}"></script>
        <script src="{% static 'renkanmanager/lib/renkan/renkan.js' %}"></script>
        <script type="text/javascript">
        
            function startRenkan(){
                var _renkan = new Rkns.Renkan({
                    static_url : "{% static 'renkanmanager/lib/renkan/' %}",
                    editor_mode: false,
                    show_bins: false,
                    language: "fr"
                });
                Rkns.jsonIO(_renkan, {
                    url: "{% url 'renkan_get_put' %}" + window.location.search
                });
            };
        </script>
{% endblock %}

{% block main_content %}
<div class="rnk-wrapper">
  <div class="rnk-container">
    <div id="renkan"></div>
  </div>
</div>    
{% endblock %}