{% extends "iri_mashup_edit.html" %}
{% load static %}
{% load i18n %}
{% load analytics %}
{% load thumbnail %}
    {% block title %}Hashcut Media - iri{% endblock %}    


{% block content %}
<div class="content clearfix">

    <div class="left-content">
        <h2>Lire le Média</h2>
        <div class="bloc-video">
            <div class="video">
                <div class="video-wait"></div>
            </div>
            <div class="widget">
            <div class="Ldt-Slider-Container">
                <div class="Ldt-Slider"></div>
            </div>
            <div class="Ldt-Slider-Time"></div>

            <div class="Ldt-Ctrl">
                <div class="Ldt-Ctrl-Left">
                    <div title="Lecture" class="Ldt-Ctrl-button Ldt-Ctrl-Play Ldt-Ctrl-Play-PlayState"></div>
                    <div class="Ldt-Ctrl-spacer"></div>
                    <div class="Ldt-Ctrl-InOutBlock">
                        <div title="Débuter le segment ici" class="Ldt-Ctrl-button Ldt-Ctrl-SetIn"></div>
                        <div class="Ldt-Ctrl-spacer"></div>
                        <div title="Finir le segment ici" class="Ldt-Ctrl-button Ldt-Ctrl-SetOut"></div>
                        <div class="Ldt-Ctrl-spacer"></div>
                    </div>
                </div>
                <div class="Ldt-Ctrl-Right">
                   <div class="Ldt-Ctrl-spacer"></div>
                   <div class="Ldt-Ctrl-Time">
                       <div title="Temps écoulé" class="Ldt-Ctrl-Time-Elapsed">00:00</div>
                       <div class="Ldt-Ctrl-Time-Separator">/</div>
                       <div title="Temps total" class="Ldt-Ctrl-Time-Total">1:03:30</div>
                   </div>
                   <div class="Ldt-Ctrl-spacer"></div>
                   <div title="Couper le son" class="Ldt-Ctrl-button Ldt-Ctrl-Sound Ldt-Ctrl-Sound-Full"></div>
                </div>
                <div title="Changer le volume" class="Ldt-Ctrl-Volume-Control">
                   <div class="Ldt-Ctrl-Volume-Bar"></div>
                </div>
            </div>
            
        </div>
            <div class="media-segments"></div>
        </div><!-- bloc-video -->
    </div><!-- left-content -->
    
    <div class="right-content">
        <h2>Plus d’informations</h2>
        <div class="more-info-wrap">
            <table class="more-info ">
                <tbody>
                    <tr class="info-title">
                        <th>Titre :</th>
                        <td><a href="#">Titre du Média</a></td>
                    </tr>
                    <tr class="info-duration">
                        <th>Durée :</th>
                        <td></td>
                    </tr>
                    <tr class="info-description">
                        <th>Description : </th>
                        <td></td>
                    </tr>
                    <tr class="info-tags">
                        <th>Tags : </th>
                        <td></td>
                    </tr>
                </tbody>
            </table>
        </div>
        </ul>
        <h2>Hashcuts utilisant le média</h2>
        <ul class="list-video">
            
        </ul>
    </div><!-- right-content -->
</div><!-- content -->
{% endblock %}
<!-- JavaScript -->
{% block js_import %}
<script type="text/javascript" src="{% static 'hashcut/lib/jquery.min.js' %}"></script>
<script type="text/javascript" src="{% static 'hashcut/lib/jquery-ui.min.js' %}"></script>
<script type="text/javascript" src="{% static 'hashcut/js/common.js' %}"></script>
<script type="text/javascript" src="{% static 'hashcut/lib/underscore-min.js' %}"></script>
<script type="text/javascript" src="{% static 'hashcut/lib/popcorn-complete.min.js' %}"></script>
<script type="text/javascript" src="{% static 'hashcut/lib/ZeroClipboard.js' %}"></script>
<script type="text/javascript" src="{% static 'hashcut/js/hashcut.js' %}"></script>
<script type="text/javascript">
    IriSP.endpoints = {
   		content: "{% url api_dispatch_list api_name='1.0' resource_name='contents' %}",
        project: "{% url api_dispatch_list api_name='1.0' resource_name='projects' %}",
        segment: "{% url api_dispatch_list api_name='1.0' resource_name='segments' %}",
        ldt: "{% url projectjson_id id='' %}",
        hashcut_page: "{% url mashup_hashcut branding=branding ldt_id='' %}"
    };
    
    $(function() {
    	IriSP.video_url_transform = function(oldurl) {
            var newurl = oldurl.replace(/mp4:/i,'');
            newurl = newurl.replace(/ddc_player\//i,'');
            newurl = newurl.replace(/rtmp/i,'http');
            return newurl;
        };
        IriSP.mediaplayer({
            id: "{{ctt_id}}"
        });
        IriSP.social();
    });
</script>
{% endblock %}