{% extends "base.html" %}
{% load i18n %}
{% load static %}
{% load translations %}
{% load crispy_forms_tags %}
{% load permissions %}

{% block extra_meta %}
<link rel="canonical" href="{{ unit.get_absolute_url }}" />
{% endblock %}

{% block breadcrumbs %}
<li><a href="{{ unit.translation.subproject.project.get_absolute_url }}">{{ unit.translation.subproject.project }}</a></li>
<li><a href="{{ unit.translation.subproject.get_absolute_url }}">{{ unit.translation.subproject.name }}</a></li>
<li><a href="{{ unit.translation.get_absolute_url }}">{{ unit.translation.language }}</a></li>
<li><a href="{{ unit.translation.get_translate_url }}">{% trans "translate" %}</a></li>
{% endblock %}

{% block content %}

{% can_translate user unit.translation as user_can_translate %}
{% can_suggest user unit.translation as user_can_suggest %}
{% can_accept_suggestion user unit.translation as user_can_accept_suggestion %}
{% can_delete_suggestion user unit.translation as user_can_delete_suggestion %}
{% can_vote_suggestion user unit.translation as user_can_vote_suggestion %}
{% can_use_mt user unit.translation as user_can_use_mt %}
{% can_edit_flags user unit.translation.subproject.project as user_can_edit_flags %}
{% can_edit_priority user unit.translation.subproject.project as user_can_edit_priority %}
{% can_upload_screenshot user project as user_can_upload_screenshot %}

{% if user_can_translate %}
<a href="{% url 'zen' project=unit.translation.subproject.project.slug subproject=unit.translation.subproject.slug lang=unit.translation.language.code %}?sid={{ search_id }}" title="{% trans "Edit in Zen mode" %}" class="btn btn-default pull-right flip"><i class="fa fa-arrows-alt"></i> {% trans "Zen" %}</a>
{% endif %}

{% with unit.translation as object %}
{% include "show-lock.html" %}
{% endwith %}

{% with unit.get_comments as comments and unit.nearby as nearby %}

<div class="btn-group">
<ul class="pagination unit-navi">
<li><a id="button-first" href="{{ first_unit_url }}" title="{% trans "First" %}"><i class="fa fa-step-backward"></i></a></li>
<li><a id="button-prev" href="{{ prev_unit_url }}" title="{% trans "Previous" %}"><i class="fa fa-backward"></i></a></li>
<li>
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
{% blocktrans %}{{ filter_name }} ({{ filter_pos }} / {{ filter_count }}){% endblocktrans %}
<span class="caret"></span>
</a>
  <div class="dropdown-menu">

<div class="panel-group">
<form action="{{ unit.translation.get_translate_url }}" method="GET">
{{ search_form|crispy }}
<input type="submit" value="{% trans "Search" %}" class="btn btn-default" />
</form>
</div>

</div>
</li>
<li><a id="button-next" href="{{ next_unit_url }}" title="{% trans "Next" %}"><i class="fa fa-forward"></i></a></li>
<li><a id="button-end" href="{{ last_unit_url }}" title="{% trans "Last" %}"><i class="fa fa-step-forward"></i></a></li>
</ul>
</div>


<div class="container-fluid">
<div class="row">
<div class="col-sm-9">

<form action="{{ this_unit_url }}" method="post" class="translation-form translator">
<div class="panel {% if unit.translation.is_template %}panel-warning{% else %}panel-primary{% endif %}">

  <div class="panel-heading"><span class="pull-right flip">
  <i class="fa fa-keyboard-o html-tooltip" data-toggle="tooltip" data-placement="bottom"
    data-title="{% trans "Keyboard shortcuts available:"%}<br />
    {% trans "Ctrl+Enter - Save" %}<br />
    {% trans "Ctrl+Shift+Enter - Unmark review needed flag and save" %}<br />
    {% trans "Alt+PageUp/PageDown/Home/End - Translation units navigation"%}<br />
    {% trans "Alt+E - Focus translation editor"%}<br />
    {% trans "Alt+C - Focus comment editor"%}<br />
    {% trans "Alt+M - Shows machine translation tab"%}<br />
    {% trans "Alt+N - Shows nearby strings tab"%}<br />
    {% trans "Alt+S - Shows search tab"%}<br />
    {% trans "Alt+V - Copies source string"%}<br />
    {% trans "Alt+F - Toggle review needed flag"%}<br />
    "></i>
  </span><h4 class="panel-title">{% if unit.translation.is_template %}{% trans "Editing source string" %}{% else %}{% trans "Translate" %}{% endif %}</h4></div>
  <div class="panel-body">
    {% csrf_token %}
    {% if antispam %}<div id="s_content">{{ antispam|crispy }}</div>{% endif %}

    <!-- secondary -->
    {% if secondary %}
    {% for secondary_unit in secondary %}
    <div class="form-group">
    <label>{{ secondary_unit.translation.language }}</label>
    {% if user.profile.hide_source_secondary %}
    {% format_translation secondary_unit.target secondary_unit.translation.language search_match=search_query num_plurals=unit.translation.language.nplurals unit=unit %}
    {% else %}
    {% format_translation secondary_unit.target secondary_unit.translation.language %}
    {% endif %}
    </div>
    {% endfor %}
    {% endif %}

    <!-- source change -->
    {% if unit.previous_source and unit.fuzzy %}
    <div class="form-group">
    <label>{% trans "Source change" %}</label>
    {% format_translation unit.source unit.translation.subproject.project.source_language diff=unit.previous_source num_plurals=unit.translation.language.nplurals %}
    </div>
    {% endif %}

    {% if unit.translation.is_template %}
    <!-- editing template -->
    <div class="form-group">
    <label>{% trans "Context" %}</label>
    {% format_translation unit.context unit.translation.subproject.project.source_language search_match=search_query num_plurals=unit.translation.language.nplurals %}
    </div>
    {% else %}

    {% if unit.comment %}
    <!-- comment -->
    <div class="form-group">
    <label>{% trans "Source string comment" %}</label>
    {% format_translation unit.comment unit.translation.subproject.project.source_language %}
    </div>
    {% endif %}

    {% if not user.profile.hide_source_secondary or not secondary %}
    <!-- source -->
    <div class="form-group">
    {% if unit.context %}
    <div class="pull-right flip">
    <label>{% trans "Context:" %}</label>
    {{ unit.context }}
    </div>
    {% endif %}
    <label>{% trans "Source" %}</label>
    {% with unit.translation.subproject.get_editable_template as edit_template %}
    {% if edit_template %}
    {% can_translate user edit_template as user_can_edit_template %}
    {% if user_can_edit_template %}
    <a title="{% trans "Edit source string" %}"href="{{ edit_template.get_translate_url }}?checksum={{ unit.checksum }}"><i class="fa fa-pencil"></i></a>
    {% endif %}
    {% endif %}
    {% endwith %}
    {% format_translation unit.source unit.translation.subproject.project.source_language search_match=search_query num_plurals=unit.translation.language.nplurals unit=unit %}
    </div>
    {% endif %}
    {% endif %}

    <!-- edit form -->
    {{ form|crispy }}
  </div>
  <div class="panel-footer">
    {% if user_can_translate %}
    <input class="btn btn-default" type="submit" value="{% trans "Save" %}" name="save" tabindex="150" {% if locked %}disabled="disabled"{% endif %} />
    {% elif not user.is_authenticated %}
    {% url 'login' as login_url %}
    {% with unit.translation.get_translate_url as translate_url %}
    {% blocktrans %}<a href="{{ login_url }}?next={{ translate_url }}">Log in</a> for saving translations.{% endblocktrans %}
    {% endwith %}
    {% endif %}

    {% if user_can_suggest %}
    <input class="btn btn-default" type="submit" value="{% trans "Suggest" %}" name="suggest" tabindex="151" {% if project_locked %}disabled="disabled"{% endif %} />
    {% else %}
    {% trans "No privileges for adding suggestions!" %}
    {% endif %}

    {% if user_can_translate %}
    <div class="pull-right flip hidden-xs">
    {% trans "Commit message:" %}
    <input type="text" name="commit_message" class="tooltip-control"
        data-toggle="tooltip" data-placement="bottom"
        placeholder="{% trans "Additional text to include in the commit message." %}"
        tabindex="152"
        value="{{ unit.translation.commit_message }}"
        title="{% trans "You can leave this empty in most cases as Weblate generates basic commit messages automatically." %}"
    />
    </div>
    {% endif %}
  </div>
</div>
</form>

<ul class="nav nav-pills translation-tabs">
<li class="active"><a href="#nearby" data-toggle="tab" title="{% trans "Messages placed around this one" %}">{% trans "Nearby messages" %} <span class="badge">{{ nearby.count }}</span></a></li>
{% if unit.suggestions %}
<li><a href="#suggestions" data-toggle="tab">{% trans "Suggestions" %} <span class="badge">{{ unit.suggestions.count }}</span></a></li>
{% endif %}
{% if others %}
<li><a href="#others" data-toggle="tab">{% trans "Other translations" %} <span class="badge">{{ others.count }}</span></a></li>
{% endif %}
{% if comments or perms.trans.add_comment %}
<li><a href="#comments" data-toggle="tab">{% trans "Comments" %}{% if comments %} <span class="badge">{{ comments.count }}</span>{% endif %}</a></li>
{% endif %}
{% if user_can_use_mt %}
<li><a href="#machine" data-toggle="tab" data-load="mt" title="{% trans "Machine translation suggestions" %}">{% trans "Machine translation" %}</a></li>
{% endif %}
<li><a href="#history" data-toggle="tab" data-href="{% url 'js-unit-changes' unit_id=unit.id %}" title="{% trans "List of recent changes done in Weblate" %}">{% trans "History" %}</a></li>
</ul>

<div class="tab-content">

<div class="tab-pane active" id="nearby">
<table class="table table-condensed">
<thead>
<tr><th></th><th>{% trans "Source" %}</th><th>{% trans "Translation" %}</th><th>{% trans "State" %}</th></tr>
</thead>
<tbody>
{% for item in nearby %}
<tr {% if unit.position == item.position %}class="current_translation"{% endif %}>
<td class="number"><a href="{{ item.get_absolute_url }}">{{ item.position }}</a></td>
<td><a href="{{ item.get_absolute_url }}">{% format_translation item.source unit.translation.subproject.project.source_language %}</a></td>
<td><a href="{{ item.get_absolute_url }}">{% format_translation item.target unit.translation.language %}</a></td>
<td>{% get_state_flags item %}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>

{% if unit.suggestions %}
<div class="tab-pane" id="suggestions">
<form action="{{ this_unit_url }}" method="post">
    {% csrf_token %}

{% for suggestion in unit.suggestions %}
<h5><strong>
{% if suggestion.user %}
{% blocktrans with suggestion.get_user_display as user %}{{ user }} has suggested{% endblocktrans %}
{% else %}
{% trans "Anonymous user has suggested" %}
{% endif %}
</strong></h5>
{% format_translation suggestion.target unit.translation.language %}
<p class="help-block">{% trans "Suggested change:" %}</p>
{% format_translation suggestion.target unit.translation.language unit.target %}
{% if user_can_vote_suggestion %}
<p class="help-block">
{% blocktrans count count=suggestion.get_num_votes %}{{ count }} vote{% plural %}{{ count }} votes{% endblocktrans %}
</p>
{% endif %}
<div class="pull-right flip">
{% if user_can_vote_suggestion %}
<button type="submit" class="btn btn-success btn-xs" name="upvote" value="{{ suggestion.id }}"><i class="fa fa-thumbs-up"></i> {% trans "Vote for" %}</button>
<button type="submit" class="btn btn-danger btn-xs" name="downvote" value="{{ suggestion.id }}"><i class="fa fa-thumbs-down"></i> {% trans "Vote against" %}</button>
{% endif %}
{% if user_can_accept_suggestion %}
<button type="submit" class="btn btn-success btn-xs" name="accept" value="{{ suggestion.id }}"><i class="fa fa-check"></i> {% trans "Accept" %}</button>
<button type="submit" class="btn btn-warning btn-xs" name="accept_edit" value="{{ suggestion.id }}"><i class="fa fa-pencil"></i> {% trans "Accept and edit" %}</button>
{% endif %}
{% if user_can_delete_suggestion %}
<button type="submit" class="btn btn-danger btn-xs" name="delete" value="{{ suggestion.id }}"><i class="fa fa-trash"></i> {% trans "Delete" %}</button>
{% endif %}
</div>
<div class="clearfix"></div>
{% endfor %}
</form>
</div>
{% endif %}

{% if others %}
<div class="tab-pane" id="others">
<table class="table table-condensed">
    <thead>
    <tr><th>{% trans "Component" %}</th><th>{% trans "Translation" %}</th><th>{% trans "State" %}</th><th></th></tr>
    </thead>
    <tbody>
    {% for item in others %}
    <tr>
    <td>{{ item.translation.subproject }}</td>
    <td><a href="{{ item.get_absolute_url }}">{% format_translation item.target item.translation.language unit.target %}</a></td>
    <td>{% get_state_flags item %}</td>
    <td>
    {% if user_can_translate %}
    <a class="mergebutton small-button btn btn-default" href="{{ unit.translation.get_translate_url}}?sid={{ search_id }}&amp;offset={{ offset }}&amp;checksum={{ unit.checksum }}&amp;merge={{ item.id }}" title="{% trans "Use this translation for all components" %}">{% trans "Use this translation" %}</a>
    {% endif %}
    </td>
    </tr>
    {% endfor %}
    </tbody>
    </table>
</div>
{% endif %}

<div class="tab-pane" id="history">
<p>{% trans "Loading…" %}</p>
</div>

{% if user_can_use_mt %}
<div class="tab-pane" id="machine">
<i id="mt-loading" class="fa fa-spinner fa-spin pull-right flip" style="display:none;"></i>
<table class="table table-compact table-striped">
<thead>
<tr>
<th>{% trans "Translation" %}</th>
<th>{% trans "Source" %}</th>
<th>{% trans "Service" %}</th>
<th></th>
<tr>
</thead>
<tbody id="machine-translations">
</tbody>
</table>
<ul id="mt-errors">
</ul>
</div>
{% endif %}

{% if comments or perms.trans.add_comment %}
<div class="tab-pane" id="comments">

{% if comments %}
  {% with this_unit_url as next_url %}
    {% include "list-comments.html" %}
  {% endwith %}
{% endif %}

{% if perms.trans.add_comment %}
<form method="post" action="{% url 'comment' pk=unit.id %}">
{% csrf_token %}
<input type="hidden" name="next" value="{{ this_unit_url }}#comments" />
<div class="panel panel-primary">
<div class="panel-heading"><h4 class="panel-title">{% trans "New comment" %}</h4></div>
  <div class="panel-body">
  <p class="help-block">{% trans "You can share comments about this string with other translators and developers." %}</p>
{{ comment_form|crispy }}
</div>
<div class="panel-footer">
<input type="submit" value="{% trans "Save" %}" class="btn btn-default" />
</div>
</div>
</form>
{% endif %}

</div>
{% endif %}


</div>

</div>

<div class="col-sm-3 small">

{% with unit.active_checks as checks %}
{% if checks or unit.suggestions or others%}
<div class="panel panel-danger">
  <div class="panel-heading"><h4 class="panel-title">{% trans "Things to check" %}</h4></div>
  <div class="panel-body">
  {% if unit.suggestions %}
  <div class="alert alert-warning check"><a href="#suggestions" data-toggle="tab" class="alert-link">{% trans "Suggestions" %}</a> <span class="badge pull-right flip">{{ unit.suggestions.count }}</span></div>
  {% endif %}
  {% if others %}
  <div class="alert alert-warning check"><a href="#others" data-toggle="tab" class="alert-link">{% trans "Other translations" %}</a> <span class="badge pull-right flip">{{ others.count }}</span></div>
  {% endif %}
  {% show_checks unit.translation.subproject.project checks user %}
  {% if comments %}
  <div class="alert alert-info check"><a href="#comments" data-toggle="tab" class="alert-link">{% trans "Comments" %}</a> <span class="badge pull-right flip">{{ comments.count }}</span></div>
  {% endif %}
  </div>
</div>
{% endif %}
{% endwith %}

<div class="panel panel-primary">
  <div class="panel-heading">
  <h4 class="panel-title">
    <a class="pull-right flip" title="{% trans "Manage glossary" %}" href="{% url 'show_dictionary' project=unit.translation.subproject.project.slug lang=unit.translation.language.code %}"><i class="fa fa-pencil-square-o"></i></a>
    {% trans "Glossary" %}
  </h4>
  </div>
  <div class="panel-body">
<form action="{% url 'show_dictionary' project=unit.translation.subproject.project.slug lang=unit.translation.language.code %}" method="POST">
{% csrf_token %}
<input type="hidden" name="next" value="{{ this_unit_url }}" />
    <table class="table table-condensed table-striped">
        <thead>
        <tr>
        <th>{% trans "Source" %}</th>
        <th>{% trans "Translation" %}</th>
        <th></th>
        </tr>
        </thead>
        <tbody>
    {% for item in glossary %}
        <tr>
        <td>{{ item.source }}</td>
        <td class="target">{% format_translation item.target unit.translation.language simple=True %}</td>
        <td>
        {% if user_can_translate or user_can_suggest %}
        <a class="copydict btn btn-default btn-xs" title="{% trans "Copy word to translation" %}">{% trans "Copy" %}</a>
        {% endif %}
        </td>
        </tr>
    {% empty %}
        <tr>
        <td colspan="3">
    {% trans "No related strings were found in the glossary." %}
        </td>
        </tr>
    {% endfor %}
        </tbody>
        <tfoot>
        <tr class="form-inline">
        <td>{{ addword_form.source }}</td>
        <td>{{ addword_form.target }}</td>
        <td>
        <input type="submit" class="btn btn-default btn-xs" title="{% trans "Add word to glossary" %}" value="{% trans "Add" %}" />
        <td>
        </tfoot>
    </table>
</form>
  </div>
</div>

<div class="panel panel-primary">
  <div class="panel-heading">
  <h4 class="panel-title">
    {% doc_url 'user/translating' 'source-context' as strings_doc_url %}
    <a class="pull-right flip" href="{{ strings_doc_url }}"><i class="fa fa-question-circle" aria-hidden="true"></i></a>
  {% trans "Source information" %}
  </h4>
  </div>
  <div class="panel-body">
  <table class="table table-striped table-condensed">
    {% if unit.source_info.screenshot or user_can_upload_screenshot %}
    <tr>
    <th>
    {% if user_can_upload_screenshot %} <a class="button smallbutton pull-right flip" href="{% url 'review_source' project=unit.translation.subproject.project.slug subproject=unit.translation.subproject.slug  %}?checksum={{ unit.checksum }}"><i class="fa fa-pencil"></i></a>{% endif %}
    {% trans "Screenshot context" %}
    </th>
    </tr>
    <tr>
    <td>
    {% if unit.source_info.screenshot %}
    <a href="{{ unit.source_info.screenshot.url }}" class="thumbnail"><img class="img-responsive" src="{{ unit.source_info.screenshot.url }}" /></a>
    {% else %}
    {% trans "No screenshot currently associated!" %}
    {% endif %}
    </td>
    </tr>
    {% endif %}
    {% if unit.context %}
    <tr>
    <th>{% trans "Context" %}</th>
    </tr>
    <tr>
    <td>{% format_translation unit.context unit.translation.subproject.project.source_language search_match=search_query simple=True %}</td>
    </tr>
    {% endif %}
    {% if unit.all_flags or user_can_edit_flags %}
    <tr>
    <th>
    {% if user_can_edit_flags %} <a class="button smallbutton pull-right flip" href="{% url 'review_source' project=unit.translation.subproject.project.slug subproject=unit.translation.subproject.slug  %}?checksum={{ unit.checksum }}"><i class="fa fa-pencil"></i></a>{% endif %}
    {% trans "Flags" %}
    </th>
    </tr>
    <tr>
    <td>
    {% if unit.all_flags %}
    {{ unit.all_flags|join:", " }}
    {% else %}
    {% trans "No flags currently set!" %}
    {% endif %}
    </td>
    </tr>
    {% endif %}
    {% include "unit-details.html" %}
    <tr>
    <th>
    {% if user_can_edit_priority %} <a class="button smallbutton pull-right flip" href="{% url 'review_source' project=unit.translation.subproject.project.slug subproject=unit.translation.subproject.slug  %}?checksum={{ unit.checksum }}"><i class="fa fa-pencil"></i></a>{% endif %}
    {% trans "String priority" %}
    </th>
    </tr>
    <tr>
    <td>
    {{ unit.source_info.get_priority_display }}
    </td>
    </tr>
    {% with unit.active_source_checks as checks %}
    {% if checks %}
    <tr>
    <th>{% trans "Failing checks" %}</th>
    </tr>
    <tr>
    <td>{% show_checks unit.translation.subproject.project checks user %}</td>
    </tr>
    {% endif %}
    {% endwith %}
  </table>
  </div>
</div>

</div>

</div>
</div>

<a href="{% url 'js-translate' unit_id=unit.id %}" class="hidden" id="js-translate"></a>
<a href="{% url 'js-mt-services' %}" class="hidden" id="js-mt-services"></a>

<a href="{% url 'js-lock' project=unit.translation.subproject.project.slug subproject=unit.translation.subproject.slug lang=unit.translation.language.code %}" class="hidden" id="js-lock" {% if update_lock %}data-autostart="1"{% endif %}></a>

{% endwith %}

{% endblock %}
