{% extends "ldt/ldt_utils/embed/mdplayer_config_base.html" %}
{% load i18n %}
{% load front_tags %}
{% load absurl %}
{% load static %}
{% load static %}
{% load analytics %}
{% block js_import %}
    {{ block.super }}
    <script type="text/javascript" src='{% static "ldt/js/embed/v4/embed.js" %}'></script>
{% endblock %}

{% block js_declaration %}
    {{ block.super }}
{% endblock %}
{% block css_import %}
    {{ block.super }}
{% endblock %}
{% block embed_widget_config %}
    <span class="OptionsSubtitle">{% trans 'Widgets' %}</span><br>
    <div id="createannotation_block">
        <input type="checkbox" id="createannotation_checkbox" value="createannotation" onClick="put_new_code(); display_createannotation();" >
            <span class="infostooltip title" data-title="createAnnotation" data-desc="{% trans 'Displays a form to create a new annotation' %}">CreateAnnotation</span>
        </input><br>
        <div id="createannotation_options" class="embedPersonnalisationSecondLevel">
            <input type="checkbox" id="show_mic_record_checkbox" value="{% trans 'audio annotation' %}" onClick="put_new_code()" >
                <span class="infostooltip title" data-title="{% trans 'Audio annotation' %}" data-desc="{% trans 'Allows the user to record an annotation' %}">{% trans 'Audio annotation' %}</span>
            </input><br>
            <div id="createannotationSegmentsOptions">
                {% trans 'Display annotation types: (annotation types must be separated by commas, leave blank to display everything) '%} <br>
                <input type="text" id="createannotation_annotation_types" value='chap,découpage' onChange="put_new_code()"/><br>
            </div>
            <input type="radio" name="annotation_tag" id="default_tags" checked onClick="put_new_code();">{% trans 'Use most used tags  ' %}</input>
            <input type="radio" name="annotation_tag" id="set_tags" onClick="put_new_code();">
                <span class="infostooltip title" data-title="{%trans 'Set your own tags : ' %}" data-desc="{% trans 'Write your tags separeted by a comma' %}">{%trans 'Set your own tags : ' %}</span>
                <input type="text" id="tag_list" class="tags_area" onChange="put_new_code()"></input>
            </input><br>
            <input type="checkbox" id="createannotation_polemics_checkbox" value="{% trans '4 polemics buttons' %} ++/--/??/==" onClick="put_new_code()" >
                <span class="infostooltip title" data-title="{% trans '4 polemics buttons' %} ++/--/??/==" data-desc="{% trans 'Displays or removes the 4 polemics buttons' %} ++/--/??/==">{% trans '4 polemics buttons' %} ++/--/??/==</span>
            </input>
        </div>
    </div>
    <div id="segments_block">
        <input type="checkbox" id="segments_checkbox" value="segments" onClick="put_new_code(); display_segments();" >
            <span class="infostooltip title" data-title="Segments" data-desc="{% trans 'Displays segments of a media as rectangles on an horizontal line' %}">Segments</span>
        </input><br>
        <div id="segments_options" class="embedPersonnalisationSecondLevel">
            <div id="displaySegmentsOptions">
                {% trans 'Display annotation types: (annotation types must be separated by commas, leave blank to display everything) '%} <br>
                <input type="text" id="segments_annotation_types" value='chap,découpage' onChange="put_new_code()"/><br>
            </div>
        </div>
    </div>
    <div id="multisegments_block">
        <input type="checkbox" id="multisegments_checkbox" value="multisegments" onClick="put_new_code()" >
            <span class="infostooltip title" data-title="MultiSegments" data-desc="{% trans 'Displays every segment of a media as rectangles on multiple horizontal lines' %}">MultiSegments</span>
        </input><br>
    </div>
    <input type="checkbox" id="annotations_list_checkbox" value="annotationslist" onClick="put_new_code()">
        <span class="infostooltip title" data-title="Annotationlist" data-desc="{% trans 'Show a list of all annotations accross every project for this content' %}">AnnotationsList</span>
    </input><br>
    <div id='polemic_bloc'>
        <input type="checkbox" id="polemic_checkbox" value="polemic" onClick="put_new_code(); display_polemic();">
            <span class="infostooltip title" data-title="Polemic" data-desc="{% trans 'Shows the polemical timeline, i.e. tweets colored according to the polemical syntax' %}">Polemic</span>
        </input><br>
            <div id="polemic_options" class="embedPersonnalisationSecondLevel">
                <div id="displayPolemicOptions">
                    {% trans 'Polemic version:' %}<br>
                    <input type="text" id="polemic_version" value="1" onChange="put_new_code()"/><br>
                    {% trans 'Polemic max elements:' %}<br>
                    <input type="text" id="polemic_max_elements" value="50" onChange="put_new_code()"/><br>
                    {% trans 'Display annotation types: (annotation types must be separated by commas, leave blank to display everything) '%} <br>
                    <input type="text" id="polemic_annotation_types" value="tweet" onChange="put_new_code()"/><br>
                    <a id="displayPolemicColorOptions" class="AdvancedOptionsDisplay">
                        <span class="title">{% trans "Personalize tweet's color" %}</span>
                    </a>
                </div>
                <div id="polemic_color_options" class="embedPersonnalisation">
                    <div id="color_default_options">
                        <span class="title">{% trans "Default color" %} </span>
                        <input id="polemic_default_color" class="codeColor_text color {hash:true,caps:false}" onchange="put_new_code();" type="text" maxlength="8"></input>
                    </div>
                    <div id="polemics_colors">
                        <span class="title">{% trans "Polemical protocol definition:" %} </span>
                        <textarea id="polemics_list" onchange="put_new_code();">{{ polemics_list }}</textarea>
                    </div>
                    <div id="color_found_options">
                        <span class="title">{% trans "Found color" %}</span>
                        <input id="polemic_found_color" class="codeColor_text color {hash:true,caps:false}" onchange="put_new_code();" type="text" maxlength="8"></input>
                    </div>
                </div>
            </div>
    </div>
    <div>
        <input type="checkbox" id="sparkline_checkbox" value="sparkline" onClick="put_new_code(); display_sparkline();">
            <span class="infostooltip title" data-title="Sparkline" data-desc="{% trans 'Displays a curve showing the project annotation volume across time' %}">Sparkline</span>
        </input><br>
        <div id="sparkline_options" class="embedPersonnalisationSecondLevel">
            <a id="displaySparklineOptions" class="AdvancedOptionsDisplay">
                <span class="title">{% trans "personalize sparkline's color" %}</span>
            </a>
            <div id="sparkline_color_options" class="embedPersonnalisation">
                <div id="color_line_options">
                    <span class="title">{% trans 'line color' %} </span>
                    <input id="sparkline_line_color" class="codeColor_text color {hash:true,caps:false}" onchange='put_new_code();' type="text" maxlength="7"></input>
                </div>

                <div id="fill_color_options">
                        <span class="title">{% trans 'fill color' %} </span>
                        <input id="sparkline_fill_color" class="codeColor_text color {hash:true,caps:false}" onchange='put_new_code();' type="text"  maxlength="7"></input>
                </div>
            </div>
        </div>
    </div>
    <input type="checkbox" id="slideshare_checkbox" value="slideshare" onClick="put_new_code()">
        <span class="infostooltip title" data-title="Slideshare" data-desc="{% trans 'Displays a div in order to watch the slides displayed in the media' %}">Slideshare</span>
    </input><br>
    <div>
    <input type="checkbox" id="social_checkbox" value="social" onClick="put_new_code(); display_social();">
        <span class="infostooltip title" data-title="Social" data-desc="{% trans ' Adds buttons to share an URL on social networks' %}">Social</span>
    </input><br>
    <div id="social_options" class="embedPersonnalisation">
         <input type="checkbox" id="show_url_checkbox" value="show_url" checked onClick="put_new_code()"> Url </input>
         <input type="checkbox" id="show_twitter_checkbox" value="show_twitter" checked onClick="put_new_code()"> Twitter </input>
         <input type="checkbox" id="show_fb_checkbox" value="show_fb" checked onClick="put_new_code()"> Facebook </input>
         <input type="checkbox" id="show_gplus_checkbox" value="show_gplus" checked onClick="put_new_code()"> Google Plus </input>
         <input type="checkbox" id="show_mail_checkbox" value="show_mail" checked onClick="put_new_code()"> {% trans 'share with email' %} </input><br>
    </div>
    </div>
    <input type="checkbox" id="annotation_checkbox" value="annotation" onClick="put_new_code()">
        <span class="infostooltip title" data-title="Annotation" data-desc="{% trans ' Displays information relative to a single segment/annotation while it is being played' %}">Annotation</span>
    </input><br>
    <input type="checkbox" id="tweet_checkbox" value="tweet" onClick="put_new_code()">
        <span class="infostooltip title" data-title="Tweet" data-desc="{% trans 'Show the contents on a tweet when clicked (in Polemic Widget)' %}">Tweet</span>
    </input><br>
    <input type="checkbox" id="tagcloud_checkbox" value="tagcloud" onClick="put_new_code()">
            <span class="infostooltip title" data-title="Tagcloud" data-desc="{% trans 'Shows a tag cloud' %}">Tagcloud</span>
    </input><br><br>
    <span class="OptionsSubtitle">{% trans 'Other settings' %}</span><br>
    <input type="checkbox" id="autostart_checkbox" value="autostart" onClick="put_new_code()">
        <span class="infostooltip title" data-title="AutoStart" data-desc="{% trans 'The video starts automatically' %}">Autostart</span>
    </input><br>
    <input type="checkbox" id="concatenate_projects_checkbox" value="concatenate_projects" onClick="put_new_code()">
        <span>{% trans "Concatenate all projects using this content" %}</span>
    </input>
{% endblock %}
{% block content %}
    {{ block.super }}
{% endblock %}
{% analytics %}
