{% spaceless %}
{% load i18n %}
{% load thumbnail %}
<div>
<div id="{{ player_id }}_embed" class="iri_player_embed">
</div>
<script type="text/javascript">
  /* Redefine a few variables */  
  IriSP.jwplayer_swf_path = "{{WEB_URL}}{{LDT_MEDIA_PREFIX}}swf/player.swf";
  IriSP.libdir = "{{WEB_URL}}{{LDT_MEDIA_PREFIX}}js/";
  
  IriSP.paths["imgs"] = "{{WEB_URL}}{{LDT_MEDIA_PREFIX}}css/imgs";
  IriSP.default_templates_vars["img_dir"] = IriSP.paths.imgs;
  
  IriSP.widgetsDefaults["createAnnotationWidget"] = {};
  IriSP.widgetsDefaults["createAnnotationWidget"].cinecast_version = false;
  
  IriSP.widgetsDefaults["AnnotationsListWidget"] = {};
  IriSP.widgetsDefaults["AnnotationsListWidget"].platform_url = "{{WEB_URL}}{% url segment_api iri_id='{content}' begin='{begin}' end='{end}' %}";
  IriSP.widgetsDefaults["createAnnotationWidget"].keywords = ["#amateur", "#digital-humanities"];
  
  IriSP.platform_url = "{{WEB_URL}}{{BASE_URL}}";
  IriSP.user = {name: '{{request.user.username}}',
		  		avatar: '{% thumbnail request.user.get_profile.image "48x48" format="PNG" crop="center" as im %}{{WEB_URL}}{{ im.url }}{% endthumbnail %}',
				};
  
	  
    var config = {            
        gui:{
            width:{{ player_width }},             
            container:'{{ player_id }}_embed',
            css:'{{WEB_URL}}{{LDT_MEDIA_PREFIX}}css/LdtPlayer.css',
            widgets: [
            {type: "PolemicWidget",
             width: {{ player_width }}, /* required for this widget */
             height: 50,
             metadata:{
              format:'cinelab',
              src:'{{ json_url }}',
              type:'json'},
             requires: [{
							type: "TooltipWidget",
							width: 180,
							heigh: 160,
							metadata : {
								format:'cinelab',
								src:'polemic_fr.json',
								type:'empty'
							}
						 }]
            },
            {type: "SparklineWidget",
             width: {{ player_width }}, /* required for this widget */
             height: 50,
             metadata:{
              format:'cinelab',
              src:'{{ json_url }}',
              type:'json'}
            },
            {type: "SliderWidget",
             metadata:{
              format:'cinelab',
              src:'{{ json_url }}',
              type:'json'}
            },
            {type: "AnnotationsListWidget",
             container: "annot_media",             
             metadata:{
              format:'cinelab',
              src:'{{ json_url }}',
              type:'json'}
            },
            {type: "PlayerWidget", // please note that type refers directly to the constructor of the widget.
             mode: "radio",
             metadata:{
              format:'cinelab',
              src:'{{ json_url }}',
              type:'json'}
            },
            {type: "SegmentsWidget",
             metadata:{
              format:'cinelab',
              src:'{{ json_url }}',
              type:'json'},
             requires: [{
              type: "TooltipWidget",
              width: 180,
              heigh: 160,
              metadata : {
                type:'empty'
              }
             }],
            },
            {type: "SliceWidget", // please note that type refers directly to the constructor of the widget.
             mode: "radio",
             metadata:{
              format:'cinelab',
              src:'{{ json_url }}',
              type:'json'}
            },            
            {type: "ArrowWidget",
             metadata:{
              format:'cinelab',
              src:'{{ json_url }}',
              type:'json'}
            },


            {type: "AnnotationsWidget",
             metadata:{
              format:'cinelab',
              src:'{{ json_url }}',
              type:'json'}
            },
            {type: "TweetsWidget",
             metadata:{
              format:'cinelab',
              src:'{{ json_url }}',
              type:'json'}
            },
            {type: "createAnnotationWidget",
             metadata:{
              format:'cinelab',
              src:'{{ json_url }}',
              type:'json'}
            }      
            ]
        },
      {% if external_url %}
      player:{
    	  type:{% if "youtube.com" in external_url %}'youtube'{% else %}'dailymotion'{% endif %}, // player type
          height: 300, 
          width: {{ player_width }}, 
          video: '{{ external_url }}'
      },
      {% else %}
      player:{
          type:'jwplayer', // player type
          live: true, 
          height: 300, 
          width: {{ player_width }}, 
          provider: "rtmp" 
      },
      {% endif %}
      modules: [
               { type: "MediaFragment",
                  metadata:{
                 format:'cinelab',
                 src:'{{ json_url }}',
                 type:'json'}
            }]

    };

    IriSP.initPlayer(config, "{{ json_url }}");
</script>
</div>
{% endspaceless %}
