{% spaceless %}
{% load i18n %}
{% load thumbnail %}
<div>
<div id="{{ player_id }}_embed" class="iri_player_embed">
</div>
<script type="text/javascript" src="{{WEB_URL}}{{LDT_MEDIA_PREFIX}}metadataplayer/LdtPlayer-core.js"></script>
<script type="text/javascript">
  
IriSP.libFiles.defaultDir = "{{WEB_URL}}{{LDT_MEDIA_PREFIX}}js/";
IriSP.libFiles.locations.jwPlayerSWF = "{{WEB_URL}}{{LDT_MEDIA_PREFIX}}swf/player.swf";
IriSP.libFiles.locations.zeroClipboardSwf = "{{WEB_URL}}{{LDT_MEDIA_PREFIX}}swf/ZeroClipboard10.swf";
IriSP.libFiles.locations.cssjQueryUI = "{{WEB_URL}}{{LDT_MEDIA_PREFIX}}css/jq-css/themes/base/jquery-ui.css"
IriSP.language = '{{LANGUAGE_CODE}}';

IriSP.widgetsDir = "{{WEB_URL}}{{LDT_MEDIA_PREFIX}}metadataplayer";
var _metadata = {
    url: '{{ json_url }}',
    format: 'ldt'
};
var _config = {
    width: '{{ player_width }}',
    container: '{{ player_id }}_embed',
    css: '{{WEB_URL}}{{LDT_MEDIA_PREFIX}}metadataplayer/LdtPlayer-core.css',
    default_options: {
        metadata: _metadata
    },
    widgets: [
        {
    {% if external_url %}
            type: "AutoPlayer",
            video: "{{ external_url }}",
    {% else %}
            type: "JwpPlayer",
            live: true,
    {% endif %}
            height: 300,
            autostart: true
        },
        {
            type: "Polemic"
        },{
            type: "Sparkline"
        },{
            type: "Slider"
        },{
            type: "AnnotationsList",
            container: "AnnotationsList_ext",
            ajax_url: "{% url segment_api_empty %}{% templatetag openvariable %}media{% templatetag closevariable %}/{% templatetag openvariable %}begin{% templatetag closevariable %}/{% templatetag openvariable %}end{% templatetag closevariable %}",
            ajax_granularity : 300000,
            default_thumbnail : "{{WEB_URL}}{{LDT_MEDIA_PREFIX}}css/imgs/video_sequence.png"
        },{
            type: "Controller"
        },{
            type: "Segments",
            annotation_type: ["chap","découpage"]
        },{
            type: "Slice",
            start_visible : false,
            live_update : true
        },{
            type: "Arrow",
            base_height: 3
        },{
            type: "Annotation",
            start_minimized: true,
            site_name : "Lignes de Temps",
            annotation_type: ["chap","découpage"]
        },{
            type: "Tweet",
            hide_timeout: 5000
        },{
            type: "CreateAnnotation",
            api_endpoint_template: "{% url annotation_api_empty %}{% templatetag openvariable %}id{% templatetag closevariable %}.json",
            api_method: "PUT",
            after_send_timeout: 8000,
            close_after_send: false,
            tag_titles: ["#amateur", "#digital-humanities"],
            creator_name: '{{request.user.username}}',
            creator_avatar: '{% thumbnail request.user.get_profile.image "48x48" format="PNG" crop="center" as im %}{{WEB_URL}}{{ im.url }}{% endthumbnail %}' || "https://si0.twimg.com/sticky/default_profile_images/default_profile_1_normal.png"
        },{
            type: "Slideshare",
            container: "Slideshare_ext",
            embed_width: 400,
            embed_height: 334,
            annotation_type: "slide"
        },{
            type: "Mediafragment"
        },{
            type: "Social",
            container: "Social_ext",
            url: document.location.href.replace(/#.*$/,""),
            text: document.title
        }
    ]
};

_myPlayer = new IriSP.Metadataplayer(_config);
</script>
</div>
{% endspaceless %}
