{% load i18n %}
{% load thumbnail %}
{% load absstatic %}
{% load absurl %}
{% load analytics %}
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="{{LANGUAGE_CODE}}" lang="{{LANGUAGE_CODE}}">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
		<meta http-equiv="Pragma" content="no-cache" />
		<meta http-equiv="Cache" content="no store" />
		<meta http-equiv="Expires" content="-1" />
		<title>Ligne de Temps - IRI - Metadata Player</title>
		<script type="text/javascript">
			{% if tag_titles %}
				tag_string= '{{ tag_titles }}';
				tag_titles_array=tag_string.split(",");
			{% endif %}
		</script>
	</head>
	<body id="init_embed_popup">
		<div style="float:left; width:550px;" id="wrapper_{{player_id}}">
		
		<div>
			<div id="{{ player_id }}_embed" class="iri_player_embed"></div>
			<script type="text/javascript" src='{% absstatic "ldt/metadataplayer/LdtPlayer-core.js" %}'></script>
			<script type="text/javascript">
			
			if (typeof jQuery == "undefined") {
				jQuery = IriSP.jQuery;
			}
				var metadatas = {metadata: {url: '{{json_url}}'}};
				var metadata_key = "metadata";
			
			IriSP.libFiles.defaultDir = '{% absstatic "ldt/js/" %}';
			IriSP.libFiles.locations.jwPlayerSWF = '{% absstatic "ldt/swf/player.swf" %}';
			IriSP.libFiles.locations.recordMicSwf = '{% absstatic "ldt/swf/record_mic.swf" %}';
			IriSP.libFiles.locations.zeroClipboardSwf = '{% absstatic "ldt/swf/ZeroClipboard10.swf" %}';
			IriSP.libFiles.locations.cssjQueryUI = '{% absstatic "ldt/css/jq-css/themes/base/jquery-ui.css" %}';
			IriSP.language = '{{LANGUAGE_CODE}}';
			
			IriSP.widgetsDir = '{% absstatic "ldt/metadataplayer" %}';
			var _metadata = {
			    url: metadatas[metadata_key].url + '?callback=?',
			    format: 'ldt'
			};
			var _config = {
			    width: '{{ player_width }}',
			    container: '{{ player_id }}_embed',
			    css: '{% absstatic "ldt/metadataplayer/LdtPlayer-core.css" %}',
			    default_options: {
			        metadata: _metadata
			    },
			    widgets: [
			        {
			        	type: "AutoPlayer",
			            {% if external_url %}
			                    video: "{{ external_url }}",
			            {% else %}
			                    streamer: function(_url) {
			                        var _matches = _url.match(/^[^\/]+\/\/[^\/]+\/[^\/]+\//);
			                        if (_matches) {
			                            return _matches[0];
			                        } else {
			                            return _url;
			                        }
			                    },
			            {% endif %}
			            height: '{{ player_height }}',
			            autostart: {% if autostart %} true {% else %} false {% endif %}
			        }  {% if polemic == 'all' or polemic == 'tweet' %},
			        {
			            type: "Polemic",
			            {% if polemic == 'all' %}
			            	annotation_type: false,
			            {% endif %}
			            {% if polemic == 'tweet' %}
		            		annotation_type: "tweet",
		           		{% endif %}
			            defaultcolor: "#{{ polemic_defaultColor }}",
						foundcolor: "#{{ polemic_foundColor }}",
						
						polemics : [
							            {
							                "name" : "OK",
							                "keywords" : [ "++" ],
							                "color" : "#{{ polemic_okColor }}"
							            },
							            {
							                "name" : "KO",
							                "keywords" : [ "--" ],
							                "color" : "#{{ polemic_koColor }}"
							            },
							            {
							                "name" : "REF",
							                "keywords" : [ "==", "http://" ],
							                "color" : "#{{ polemic_refColor }}"  
							            },
							            {
							                "name" : "Q",
							                "keywords" : [ "?" ],
							                "color" : "#{{ polemic_qColor }}"
							            }
							        ]
			        }
			    {% endif %}
			    {% if sparkline %}
			        ,{
			            type: "Sparkline",
			            lineColor: "#{{ sparkline_lineColor }}",
						fillColor: "#{{ sparkline_fillColor }}",
			        }
			    {% endif %}
			        ,{
			            type: "Slider"
			        }
			        
			        {% if annotations_list %},{
			            type: "AnnotationsList",
			            container: "AnnotationsList_ext",
			            ajax_url: "{% absurl segment_api_empty resource_name='segments' api_name='1.0' %}{% templatetag openvariable %}media{% templatetag closevariable %}/{% templatetag openvariable %}begin{% templatetag closevariable %}/{% templatetag openvariable %}end{% templatetag closevariable %}",
			            ajax_granularity : 300000,
			            default_thumbnail : '{% absstatic "ldt/css/imgs/video_sequence.png" %}',
			            show_audio: true,
			            rtmp_streamer: "rtmp://media.iri.centrepompidou.fr/ddc_micro_record/"
			        }{% endif %},{
			            type: "Controller"
			        }
			        {% if segments %},{
			            type: "Segments",
			            annotation_type: ["chap","dÃ©coupage"]
			        }
			        {% endif %}
			        {% if annotation %},{
			            type: "Annotation",
			            start_minimized: true,
			            site_name : "Lignes de Temps",
			            annotation_type: ["chap","dÃ©coupage"]
			        }
			        {% endif %}
			        {% if tweet %},{
			            type: "Tweet",
			            hide_timeout: 5000
			        }
			        {% endif %}
			        
			        {% if createannotation %},{
			            type: "CreateAnnotation",
			            api_endpoint_template: "{% absurl api_dispatch_list resource_name='annotations' api_name='1.0' %}",
			            api_method: "PUT",
			            after_send_timeout: 8000,
			            {% if tag_titles %}
			           		tag_titles : tag_titles_array,
			           	{% else %}
			            	tag_titles : false,
			           	{% endif %}
			            show_mic_record: {% if show_mic_record %}true{% else %}false{% endif %},
			            close_after_send: false,
			            slice_annotation_type: ["chap","dÃ©coupage"],
			            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"
			        }{% endif %}
			        {% if slideshare %},{
			            type: "Slideshare",
			            container: "Slideshare_ext",
			            embed_width: 400,
			            embed_height: 334,
			            annotation_type: "slide"
			        }
			        {% endif %},{
			            type: "Mediafragment"
			        }
			        {% if social %},{
			            type: "Social",
			            container: "Social_ext",
			            show_url: {% if show_url %}true{% else %}false{% endif %},
			            show_twitter: {% if show_twitter %}true{% else %}false{% endif %},
			            show_fb: {% if show_fb %}true{% else %}false{% endif %},
			            show_gplus: {% if show_gplus %}true{% else %}false{% endif %},
			            show_mail: {% if show_mail %}true{% else %}false{% endif %},
			            url: document.location.href.replace(/#.*$/,""),
			            text: document.title
			        }
			       {% endif %}
			       
			       {% if tagcloud %},{
						type: "Tagcloud"
					}
			       {% endif %}
			    ]
			};
			
			_myPlayer = new IriSP.Metadataplayer(_config);
			</script>
			</div>
		</div>
		{% if social %}
		<div id="Social_ext" class="Ldt-TraceMe Ldt-Widget" style="float:right; width:400px; height:24px;" widget-type="Social">
		</div>
		{% endif %}
		{% if slideshare %}
        <div id="Slideshare_ext" class="ext_widget Ldt-TraceMe Ldt-Widget" style="float:left; width:400px;" widget-type="Slideshare">
   		 </div>
        {% endif %}
		{% if annotations_list %}
        <div style="float:left; width:400px;" id="AnnotationsList_ext"></div>
        {% endif %}
        
{% analytics %}
	</body>
</html>

