{% extends 'layouts/layout_dog.html' %}

{% block page_body %}
    <link rel="stylesheet" href="{{ url_for('static', filename='dist/css/dog_assessment.bundle.css') }}">
    
    {% set assessment = model.assessments[0] %}

    <form id="{{ model.ID_FORM_FILTERS }}" class="{{ model.FLAG_FILTER }} {{ model.FLAG_ROW }} {{ model.FLAG_CARD }}">
        {{ model.form_filters.hidden_tag() }}
        <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}">
            <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_ROW }}">
                <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_COLUMN }} {{ model.FLAG_FILTER }} {{ model.FLAG_SEARCH }}">
                    {{ model.form_filters.search.label }}
                    {{ model.form_filters.search() }}
                    {% for error in model.form_filters.search.errors %}
                        <p class="error">{{ error }}</p>
                    {% endfor %}
                </div>
                <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_COLUMN }} {{ model.FLAG_FILTER }} {{ model.ATTR_ID_ASSESSMENT }}">
                    {{ model.form_filters.id_assessment.label }}
                    {{ model.form_filters.id_assessment() }}
                    {% for error in model.form_filters.id_assessment.errors %}
                        <p class="error">{{ error }}</p>
                    {% endfor %}
                </div>
                <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_COLUMN }} {{ model.FLAG_FILTER }} {{ model.ATTR_ID_WEATHER }}">
                    {{ model.form_filters.id_weather.label }}
                    {{ model.form_filters.id_weather() }}
                    {% for error in model.form_filters.id_weather.errors %}
                        <p class="error">{{ error }}</p>
                    {% endfor %}
                </div>
                <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_COLUMN }} {{ model.FLAG_FILTER }} {{ model.ATTR_ID_LIGHTING_LEVEL }}">
                    {{ model.form_filters.id_lighting_level.label }}
                    {{ model.form_filters.id_lighting_level() }}
                    {% for error in model.form_filters.id_lighting_level.errors %}
                        <p class="error">{{ error }}</p>
                    {% endfor %}
                </div>
                <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_COLUMN }} {{ model.FLAG_FILTER }} {{ model.ATTR_ID_LOCATION }}">
                    {{ model.form_filters.id_location.label }}
                    {{ model.form_filters.id_location() }}
                    {% for error in model.form_filters.id_location.errors %}
                        <p class="error">{{ error }}</p>
                    {% endfor %}
                </div>
                <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_COLUMN }} {{ model.FLAG_FILTER }} {{ model.FLAG_USER_HANDLER }}">
                    {{ model.form_filters.id_user_handler.label }}
                    {{ model.form_filters.id_user_handler() }}
                    {% for error in model.form_filters.id_user_handler.errors %}
                        <p class="error">{{ error }}</p>
                    {% endfor %}
                </div>
                <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_COLUMN }} {{ model.FLAG_FILTER }} {{ model.FLAG_ACTIVE_ONLY }}" {{ model.ATTR_VALUE_PREVIOUS }}="{{ model.form_filters.active_only.data }}">
                    {{ model.form_filters.active_only.label }}
                    {{ model.form_filters.active_only() }}
                    {% for error in model.form_filters.active_only.errors %}
                        <p class="error">{{ error }}</p>
                    {% endfor %}
                    {% set class_name = model.FLAG_FILTER + ' ' + model.FLAG_ACTIVE_ONLY + ' ' + model.FLAG_CHECKBOX %}
                    {% include 'components/common/buttons/_icon_checkbox.html' %}
                </div>
            </div>
        </div>
    </form>

    <div class="{{ model.FLAG_SAVE }} {{ model.FLAG_CANCEL }} {{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}">
        <div class="{{ model.FLAG_ROW }}">
            <div class="{{ model.FLAG_COLUMN }}">
                <div class="{{ model.FLAG_CONTAINER_INPUT }}">
                    {% set block_id = 'button_save' %}
                    {% include 'components/common/buttons/_buttons_save_cancel.html' %}
                </div>
            </div>
            <div class="{{ model.FLAG_COLUMN }}">
                <div class="{{ model.FLAG_CONTAINER_INPUT }}">
                    {% set block_id = 'button_cancel' %}
                    {% include 'components/common/buttons/_buttons_save_cancel.html' %}
                </div>
            </div>
        </div>
    </div>

    <form id="{{ model.ID_FORM_ASSESSMENT }}" class="{{ model.FLAG_ROW }} {{ model.FLAG_CARD }}">
        <table id="{{ model.ID_TABLE_ASSESSMENT }}" class="{{ model.FLAG_TABLE_MAIN }} {{ model.FLAG_ROW }} {{ model.FLAG_CARD }} {{ model.FLAG_ASSESSMENT }}">
            <thead>
                <tr class="{{ model.FLAG_ASSESSMENT }}">
                    <th class="{{ model.FLAG_WEATHER }} {{ model.FLAG_DDL_PREVIEW }}">Weather</th>
                    <th class="{{ model.FLAG_LIGHTING_LEVEL }} {{ model.FLAG_DDL_PREVIEW }}">Lighting Level</th>
                    <th class="{{ model.FLAG_TEMPERATURE_CELCIUS }}">Temperature (&deg;C)</th>
                    <th class="{{ model.FLAG_LOCATION }} {{ model.FLAG_DDL_PREVIEW }}">Location</th>
                    <th class="{{ model.FLAG_USER_HANDLER }}">Handler</th>
                    <th class="{{ model.FLAG_NOTES }}">Notes</th>
                </tr>
            </thead>
            <tbody>
                {% set is_blank_row = (assessment.id_assessment < 1) %}
                <tr class="{{ model.FLAG_ASSESSMENT }}" {{ model.ATTR_ID_ASSESSMENT }}="{{ assessment.id_assessment }}">
                    {% set weather_preview = assessment.weather %}
                    <td class="{{ model.FLAG_WEATHER }} {{ model.FLAG_DDL_PREVIEW }}">
                        {% include 'components/dog/_preview_DDL_weather.html' %}
                    </td>
                    {% set lighting_level_preview = assessment.lighting_level %}
                    <td class="{{ model.FLAG_LIGHTING_LEVEL }} {{ model.FLAG_DDL_PREVIEW }}">
                        {% include 'components/dog/_preview_DDL_lighting_level.html' %}
                    </td>
                    <td class="{{ model.FLAG_TEMPERATURE_CELCIUS }}">
                        <input type="number" min="-273" step="0.1" 
                            class="{{ model.FLAG_TEMPERATURE_CELCIUS }}" 
                            {{ model.ATTR_VALUE_CURRENT }}="{{ assessment.temperature_celcius }}" 
                            {{ model.ATTR_VALUE_PREVIOUS }}="{{ assessment.temperature_celcius }}"
                            value="{{ assessment.temperature_celcius }}" />
                    </td>
                    {% set location_preview = assessment.location %}
                    <td class="{{ model.FLAG_LOCATION }} {{ model.FLAG_DDL_PREVIEW }}">
                        {% include 'components/dog/_preview_DDL_location.html' %}
                    </td>
                    {% set user_preview = assessment.user_handler %}
                    {% set attribute_text = model.FLAG_USER_HANDLER %}
                    <td class="{{ model.FLAG_USER_HANDLER }} {{ model.FLAG_DDL_PREVIEW }}">
                        {% include 'components/dog/_preview_DDL_user.html' %}
                    </td>
                    {% set notes = assessment.notes %}
                    {% include 'components/dog/_td_notes.html' %}
                </tr>
            </tbody>
        </table>
    </form>

    <form id="{{ model.ID_FORM_DISTRACTIONS }}" class="{{ model.FLAG_ROW }} {{ model.FLAG_CARD }}">
        <h2>Distractions</h2>
        <table id="{{ model.ID_TABLE_DISTRACTIONS}}" class="{{ model.FLAG_TABLE_MAIN }} {{ model.FLAG_ROW }} {{ model.FLAG_CARD }} {{ model.FLAG_DISTRACTION }}">
            <thead>
                <tr class="{{ model.FLAG_DISTRACTION }}">
                    <th class="{{ model.FLAG_DISTRACTION_TYPE }} {{ model.FLAG_DDL_PREVIEW }}">Distraction Type</th>
                    <th class="{{ model.FLAG_DISTRACTION_INTENSITY_LEVEL_EMOTIONAL }} {{ model.FLAG_DDL_PREVIEW }}">Intensity Level Emotional</th>
                    <th class="{{ model.FLAG_DISTRACTION_INTENSITY_LEVEL_SCENT }} {{ model.FLAG_DDL_PREVIEW }}">Intensity Level Scent</th>
                    <th class="{{ model.FLAG_DISTRACTION_INTENSITY_LEVEL_SIGHT }} {{ model.FLAG_DDL_PREVIEW }}">Intensity Level Sight</th>
                    <th class="{{ model.FLAG_DISTRACTION_INTENSITY_LEVEL_SOUND }} {{ model.FLAG_DDL_PREVIEW }}">Intensity Level Sound</th>
                    <th class="{{ model.FLAG_DISTRACTION_INTENSITY_LEVEL_TOUCH }} {{ model.FLAG_DDL_PREVIEW }}">Intensity Level Touch</th>
                    <th class="{{ model.FLAG_QUANTITY }}">Quantity</th>
                    <th class="{{ model.FLAG_PROXIMITY_METRES }} {{ model.FLAG_DDL_PREVIEW }}">Proximity (m)</th>
                    <th class="{{ model.FLAG_NOTES }}">Notes</th>
                    <th class="{{ model.FLAG_ACTIVE }}">
                        {% set class_name = model.FLAG_ACTIVE %}
                        {% set attribute_text = '' %}
                        {% include 'components/common/buttons/_icon_add.html' %}
                    </th>
                </tr>
            </thead>
            <tbody>
                {% set is_blank_row = False %}
                {% for distraction in assessment.distractions %}
                    {% include 'components/dog/_row_distraction.html' %}
                {% endfor %}

                {% set is_blank_row = True %}
                {% include 'components/dog/_row_distraction.html' %}
            </tbody>
        </table>
    </form>

    <form id="{{ model.ID_FORM_ASSESSMENT_COMMAND_MODALITY_LINKS }}" class="{{ model.FLAG_ROW }} {{ model.FLAG_CARD }}">
        <h2>Commands and Responses</h2>
        <table id="{{ model.ID_TABLE_ASSESSMENT_COMMAND_MODALITY_LINKS }}" class="{{ model.FLAG_TABLE_MAIN }} {{ model.FLAG_ROW }} {{ model.FLAG_CARD }} {{ model.FLAG_ASSESSMENT_COMMAND_MODALITY_LINK }}">
            <thead>
                <tr class="{{ model.FLAG_ASSESSMENT_COMMAND_MODALITY_LINK }}">
                    <th class="{{ model.FLAG_COMMAND_CATEGORY }} {{ model.FLAG_DDL_PREVIEW }}" rowspan="2">Command Category</th>
                    <th class="{{ model.FLAG_COMMAND }} {{ model.FLAG_DDL_PREVIEW }}" rowspan="2">Command</th>
                    <th class="{{ model.FLAG_COMMAND_MODALITY }} {{ model.FLAG_DDL_PREVIEW }}" rowspan="2">Command Modality</th>
                    <th class="{{ model.FLAG_BRIBE }} {{ model.FLAG_DDL_PREVIEW }}" rowspan="2">Bribe</th>
                    <th class="{{ model.FLAG_DISTANCE_FROM_HANDLER_METRES }} {{ model.FLAG_DDL_PREVIEW }}" rowspan="2">Distance From Handler</th>
                    <th class="{{ model.FLAG_IS_IN_SIGHT_OF_HANDLER }}" colspan="3" rowspan="1">In Range Of Handler?</th>
                    <th class="{{ model.FLAG_IS_ON_LEAD }} {{ model.FLAG_DDL_PREVIEW }}" rowspan="2">On Lead?</th>
                    <th class="{{ model.FLAG_TRIAL_COUNT }} {{ model.FLAG_DDL_PREVIEW }}" rowspan="2">Trial Count</th>
                    <th class="{{ model.FLAG_NOTES }}" rowspan="2">Notes</th>
                    <th class="{{ model.FLAG_ASSESSMENT_RESPONSE }}" rowspan="2">Responses</th>
                    <th class="{{ model.FLAG_ACTIVE }}" rowspan="2">
                        {% set class_name = model.FLAG_ACTIVE %}
                        {% set attribute_text = '' %}
                        {% include 'components/common/buttons/_icon_add.html' %}
                    </th>
                </tr>
                <tr class="{{ model.FLAG_ASSESSMENT_COMMAND_MODALITY_LINK }}">
                    <th class="{{ model.FLAG_IS_IN_HEARING_RANGE_OF_HANDLER }} {{ model.FLAG_DDL_PREVIEW }}" rowspan="1">Sound</th>
                    <th class="{{ model.FLAG_IS_IN_SCENT_RANGE_OF_HANDLER }} {{ model.FLAG_DDL_PREVIEW }}" rowspan="1">Scent</th>
                    <th class="{{ model.FLAG_IS_IN_SIGHT_OF_HANDLER }} {{ model.FLAG_DDL_PREVIEW }}" rowspan="1">Sight</th>
                </tr>
            </thead>
            <tbody>
                {% set is_blank_row = False %}
                {% for link in assessment.assessment_command_modality_links %}
                    {% include 'components/dog/_row_assessment_command_modality_link.html' %}
                {% endfor %}

                {% set is_blank_row = True %}
                {% include 'components/dog/_row_assessment_command_modality_link.html' %}
            </tbody>
        </table>
    </form>
    
    {% include 'components/common/temporary/_overlay_confirm.html' %}
    {% include 'components/common/temporary/_overlay_error.html' %}

    <div id="{{ model.ID_CONTAINER_TEMPLATE_ELEMENTS }}">
        <!-- Active column -->
        <!-- Delete -->
        {% set class_name = '' %}
        {% include 'components/common/buttons/_icon_trash.html' %}
        <!-- Undelete -->
        {% set class_name = model.FLAG_ACTIVE %}
        {% set attribute_text = '' %}
        {% include 'components/common/buttons/_icon_add.html' %}
    </div>

    <script>
        var assessments = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.assessments) | tojson | safe }};
        var assessment = assessments[{{ assessment.id_assessment }}];
        var filterBribes = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.filter_bribes) | tojson | safe }};
        var filterCommandCategories = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.filter_command_categories) | tojson | safe }};
        var filterCommandModalities = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.filter_command_modalities) | tojson | safe }};
        var filterCommands = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.filter_commands) | tojson | safe }};
        var filterDistractionIntensityLevels = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.filter_distraction_intensity_levels) | tojson | safe }};
        var filterDistractionTypes = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.filter_distraction_types) | tojson | safe }};
        var filterLightingLevels = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.filter_lighting_levels) | tojson | safe }};
        var filterLocations = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.filter_locations) | tojson | safe }};
        var filterObedienceLevels = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.filter_obedience_levels) | tojson | safe }};
        var filterResponseQualityMetrics = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.filter_response_quality_metrics) | tojson | safe }};
        var filterUserHandlers = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.filter_user_handlers) | tojson | safe }};
        var filterWeathers = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.filter_weathers) | tojson | safe }};
        var flagCommandModality = "{{ model.FLAG_COMMAND_MODALITY }}";
        var flagDistanceFromHandlerMetres = "{{ model.FLAG_DISTANCE_FROM_HANDLER_METRES }}";
        var flagDistractionIntensityLevelEmotional = "{{ model.FLAG_DISTRACTION_INTENSITY_LEVEL_EMOTIONAL }}";
        var flagDistractionIntensityLevelScent = "{{ model.FLAG_DISTRACTION_INTENSITY_LEVEL_SCENT }}";
        var flagDistractionIntensityLevelSight = "{{ model.FLAG_DISTRACTION_INTENSITY_LEVEL_SIGHT }}";
        var flagDistractionIntensityLevelSound = "{{ model.FLAG_DISTRACTION_INTENSITY_LEVEL_SOUND }}";
        var flagDistractionIntensityLevelTouch = "{{ model.FLAG_DISTRACTION_INTENSITY_LEVEL_TOUCH }}";
        var flagDistractionType = "{{ model.FLAG_DISTRACTION_TYPE }}";
        var flagIsInHearingRangeOfHandler = "{{ model.FLAG_IS_IN_HEARING_RANGE_OF_HANDLER }}";
        var flagIsInScentRangeOfHandler = "{{ model.FLAG_IS_IN_SCENT_RANGE_OF_HANDLER }}";
        var flagIsInSightOfHandler = "{{ model.FLAG_IS_IN_SIGHT_OF_HANDLER }}";
        var flagIsOnLead = "{{ model.FLAG_IS_ON_LEAD }}";
        var flagProximityMetres = "{{ model.FLAG_PROXIMITY_METRES }}";
        var flagTemperatureCelcius = "{{ model.FLAG_TEMPERATURE_CELCIUS }}";
        var flagTrialCount = "{{ model.FLAG_TRIAL_COUNT }}";
        var flagUserHandler = "{{ model.FLAG_USER_HANDLER }}";
        var flagValueMeasured = "{{ model.FLAG_VALUE_MEASURED }}";
        var idFormAssessment = "#{{ model.ID_FORM_ASSESSMENT }}";
        var idFormAssessmentCommandModalityLinks = "#{{ model.ID_FORM_ASSESSMENT_COMMAND_MODALITY_LINKS }}";
        var idFormDistractions = "#{{ model.ID_FORM_DISTRACTIONS }}";
        var idTableAssessment = "#{{ model.ID_TABLE_ASSESSMENT }}";
        var idTableAssessmentCommandModalityLinks = "#{{ model.ID_TABLE_ASSESSMENT_COMMAND_MODALITY_LINKS }}";
        var idTableAssessmentResponses = "#{{ model.ID_TABLE_ASSESSMENT_RESPONSES }}";
        var idTableDistractions = "#{{ model.ID_TABLE_DISTRACTIONS }}";
    </script>
{% endblock %}