{% if hourly %}
    {% set numSteps = hourly | calcNumEntries %}
    {% set currentStep = 0 %}
    <table class="{{ config.tableClass }}">
        {% set hours = hourly.slice(0, numSteps) %}
        {% for hour in hours %}
            <tr {% if config.colored %}class="colored"{% endif %}
                {% if config.fade %}style="opacity: {{ currentStep | opacity(numSteps) }};"{% endif %}>
                <td class="day">{{ hour.date | formatTime }}</td>
                <td class="bright weather-icon">
                    <span class="wi weathericon wi-{{ hour.weatherType }}"></span>
                </td>
                <td class="align-right bright">
                    {{ hour.temperature | roundValue | unit("temperature") }}
                </td>
                {% if config.showUVIndex %}
                    <td class="align-right bright uv-index">
                        {% if hour.uv_index!=0 %}
                            {{ hour.uv_index }}
                            <span class="wi weathericon wi-hot"></span>
                        {% endif %}
                    </td>
                {% endif %}
                {% if config.showHumidity != "none" %}
                  <td class="align-left bright humidity-hourly">
                          {{ hour.humidity }}
                          <span class="wi wi-humidity humidity-icon"></span>
                  </td>
                {% endif %}
                {% if config.showPrecipitationAmount %}
                  {% if (not config.hideZeroes or hour.precipitationAmount>0) %}
                      <td class="align-right bright precipitation-amount">
                          {{ hour.precipitationAmount | unit("precip", hour.precipitationUnits) }}
                      </td>
                  {% endif %}
                {% endif %}
                {% if config.showPrecipitationProbability %}
                  {% if (not config.hideZeroes or hour.precipitationAmount>0) %}
                    <td class="align-right bright precipitation-prob">
                      {{ hour.precipitationProbability | unit('precip', '%') }}
                    </td>
                  {% endif %}
                {% endif %}
            </tr>
            {% set currentStep = currentStep + 1 %}
        {% endfor %}
    </table>
{% else %}
    <div class="dimmed light small">{{ "LOADING" | translate }}</div>
{% endif %}
<!-- Uncomment the line below to see the contents of the `hourly` object. -->
<!-- <div style="word-wrap:break-word" class="xsmall dimmed">{{hourly | dump}}</div> -->