{{! template for the annotation creation widget }}
<div class='Ldt-createAnnotationWidget'>
    <!-- ugly div because we want to have a double border -->
    <div class='Ldt-createAnnotation-DoubleBorder'>
        <div class='Ldt-createAnnotation-screen Ldt-createAnnotation-startScreen'>
            <div style='margin-bottom: 7px; overflow: auto;'>
                <div class='Ldt-createAnnotation-Title'></div>
                <div class='Ldt-createAnnotation-TimeFrame'></div>
                {{^cinecast_version}} <div class='Ldt-createAnnotation-Minimize Ldt-TraceMe' title='Cancel'></div>
                {{/cinecast_version}}
            </div>
            <div class='Ldt-createAnnotation-Container'>
                {{#show_from_field}}
                <label>{{l10n.your_name}}&nbsp;: </label><input class='Ldt-createAnnotation-userName Ldt-TraceMe' value='{{user_name}}' />
                {{/show_from_field}}
                <textarea class='Ldt-createAnnotation-Description Ldt-TraceMe'></textarea>
                <div class='Ldt-createAnnotation-userAvatar Ldt-TraceMe'>
                    {{^user_avatar}} <img src='https://si0.twimg.com/sticky/default_profile_images/default_profile_1_normal.png'></img>
                    {{/user_avatar}}
                    {{#user_avatar}} <img src='{{ user_avatar }}'></img>
                    {{/user_avatar}}
                </div>
                <div class='Ldt-createAnnotation-profileArrow'></div>
            </div>
            <button class='Ldt-createAnnotation-submitButton Ldt-TraceMe'>{{l10n.submit}}</button>
            {{#tags.length}}
            <div class='Ldt-createAnnotation-btnblock Ldt-createAnnotation-keywords'>
                <label>{{l10n.add_keywords}} :</label>
                <ul class='Ldt-floatList'>
                {{#tags}}
                    <li><button class='Ldt-createAnnotation-keyword-button Ldt-TraceMe' tag-id='{{id}}'>{{meta.description}}</button></li>
                {{/tags}}
                </ul>
            </div>
            {{#random_tags}}
                <button class='Ldt-createAnnotation-moar-keywordz'>{{l10n.more_tags}}</button>
            {{/random_tags}}
            {{/tags.length}}
            {{#polemic_mode}}
            {{#polemics.length}}
            <div class='Ldt-createAnnotation-btnblock Ldt-createAnnotation-polemics'>
                <label>{{l10n.add_polemic_keywords}} :</label>
                <ul class='Ldt-floatList'>
                {{#polemics}}
                    <li><button class='Ldt-createAnnotation-polemic-{{className}} Ldt-createAnnotation-polemic-button Ldt-TraceMe'>{{keyword}}</button></li>
                {{/polemics}}
                </ul>
            </div>
            {{/polemics.length}}
            {{/polemic_mode}}
        </div>
        <div class='Ldt-createAnnotation-screen Ldt-createAnnotation-waitScreen' style='display: none; text-align: center'>
            <div class='Ldt-createAnnotation-spinner'></div>
            {{l10n.wait_while_processed}}
        </div>
        <div class='Ldt-createAnnotation-screen Ldt-createAnnotation-errorScreen' style='display: none; text-align: center'>
            <div class='Ldt-createAnnotation-Minimize' title='Hide'></div>
            {{l10n.error_while_contacting}}
        </div>
        <div class='Ldt-createAnnotation-screen Ldt-createAnnotation-endScreen' style='display: none'>
            <div class='Ldt-createAnnotation-Minimize' title='Hide'></div>
            {{l10n.annotation_saved}}
            <br>
            {{^disable_share}}
            {{l10n.share_annotation}}
            <div class='Ldt-createAnnotation-endScreen-linkList'>
                <a target='_blank' class='Ldt-createAnnotation-endScreen-link Ldt-createAnnotation-endScreen-TweetLink Ldt-TraceMe'></a>
                <a target='_blank' class='Ldt-createAnnotation-endScreen-link Ldt-createAnnotation-endScreen-FbLink Ldt-TraceMe'></a>
                <a target='_blank' class='Ldt-createAnnotation-endScreen-link Ldt-createAnnotation-endScreen-GplusLink Ldt-TraceMe'></a>
            </div>
            {{/disable_share}}
        </div>
        <div class='Ldt-floatClear'></div>
    </div>
</div>