{# some users view thousands of pages which can crash the browser viewing Live! #}
{% set maxPagesDisplayedByVisitor=100 %}

<ul id='visitsLive'>
    {% for visitor in visitors %}
        <li id="{{ visitor.idVisit }}" class="visit">
            <div style="display:none;" class="idvisit">{{ visitor.idVisit }}</div>
            <div title="{{ visitor.actionDetails|length }} {{ 'General_Actions'|translate }}" class="datetime">
                <span style="display:none;" class="serverTimestamp">{{ visitor.serverTimestamp|raw }}</span>
                {% set year = visitor.serverTimestamp|date('Y') %}
                {{ visitor.serverDatePretty|replace({(year): ' '}) }} - {{ visitor.serverTimePretty }} {% if visitor.visitDuration > 0 %}<em>({{ visitor.visitDurationPretty|raw }})</em>{% endif %}
                {% if visitor.visitorId|default(false) is not empty %}
                  &nbsp;  <a class="visits-live-launch-visitor-profile rightLink" title="{{ 'Live_ViewVisitorProfile'|translate }} {% if visitor.userId is not empty %}{{ visitor.userId|raw }}{% endif %}" data-visitor-id="{{ visitor.visitorId }}">
                        {% if visitor.userId is not empty %}<br/>{% endif %}
                        <img src="plugins/Live/images/visitorProfileLaunch.png"/>
                        {{ visitor.userId|default('')|raw }}
                    </a>
                {% endif %}
                <br />

                {% if visitor.countryFlag is defined %}&nbsp;<img src="{{ visitor.countryFlag }}" title="{{ visitor.location }}, {{ 'Provider_ColumnProvider'|translate }} {% if visitor.providerName is defined %}{{ visitor.providerName }}{% endif %}"/>{% endif %}
                {% if visitor.browserIcon is defined %}&nbsp;<img src="{{ visitor.browserIcon }}" title="{{ visitor.browser }}{% if visitor.plugins is defined %}, {{ 'General_Plugins'|translate }}: {{ visitor.plugins }}{% endif %}"/>{% endif %}
                {% if visitor.operatingSystemIcon is defined %}&nbsp;<img src="{{ visitor.operatingSystemIcon }}" title="{{ visitor.operatingSystem }}{% if visitor.resolution is defined %}, {{ visitor.resolution }}{% endif %}"/>{% endif %}
                &nbsp;
                {% if visitor.visitConverted %}
                <span title="{{ 'General_VisitConvertedNGoals'|translate(visitor.goalConversions) }}" class='visitorRank'>
                    <img src="{{ visitor.visitConvertedIcon }}" />
                    <span class='hash'>#</span>
                    {{ visitor.goalConversions }}
                    {% if visitor.visitEcommerceStatusIcon %}

                        <img src="{{ visitor.visitEcommerceStatusIcon }}" title="{{ visitor.visitEcommerceStatus }}"/>
                    {% endif %}
                </span>
                {% endif %}
                {% if visitor.visitorTypeIcon %}
                    <img src="{{ visitor.visitorTypeIcon }}" title="{{ 'General_ReturningVisitor'|translate }}"/>
                {% endif %}

                {% if visitor.visitIp %} <span title="{% if visitor.visitorId is not empty %}{{ 'General_VisitorID'|translate }}: {{ visitor.visitorId }}{% endif %}">
                    IP: {{ visitor.visitIp }}</span>
                {% endif %}
            <!--<div class="settings"></div>-->
            <span class="referrer">
                {% if visitor.referrerType is defined and visitor.referrerType != 'direct' %}
                    {{ 'General_FromReferrer'|translate }}
                    {% if visitor.referrerUrl is not empty %}
                        <a href="{{ visitor.referrerUrl }}" rel="noreferrer"  target="_blank">
                    {% endif %}
                    {% if visitor.searchEngineIcon is defined %}
                        <img src="{{ visitor.searchEngineIcon }}" />
                    {% endif %}
                    {{ visitor.referrerName }}
                    {% if visitor.referrerUrl is not empty %}
                        </a>
                    {% endif %}
                    {% if visitor.referrerKeyword is not empty %} - "{{ visitor.referrerKeyword }}"{% endif %}
                    {% set keyword %}{{ visitor.referrerKeyword }}{% endset %}
                    {% set searchName %}{{ visitor.referrerName }}{% endset %}
                    {% set position %}#{{ visitor.referrerKeywordPosition}}{% endset %}
                    {% if visitor.referrerKeywordPosition is not empty %}
                        <span title='{{ 'Live_KeywordRankedOnSearchResultForThisVisitor'|translate(keyword,position,searchName) }}' class='visitorRank'>
                            <span class='hash'>#</span> {{ visitor.referrerKeywordPosition }}
                        </span>
                    {% endif %}
                {% elseif visitor.referrerType is defined %}
                    {{ 'Referrers_DirectEntry'|translate }}
                {% endif %}
            </span></div>
            <div id="{{ visitor.idVisit }}_actions" class="settings">
                <span class="pagesTitle" title="{{ visitor.actionDetails|length }} {{ 'General_Actions'|translate }}">{{ 'General_Actions'|translate }}:</span>&nbsp;
                {% set col = 0 %}
                {% for action in visitor.actionDetails %}
                    {% if loop.index <= maxPagesDisplayedByVisitor %}
                        {% if action.type == 'ecommerceOrder' or action.type == 'ecommerceAbandonedCart' %}
                            {% set title %}
                                {%- if action.type == 'ecommerceOrder' %}
                                    {{- 'Goals_EcommerceOrder'|translate -}}
                                {% else %}
                                    {{- 'Goals_AbandonedCart'|translate -}}
                                {% endif %}
                                {{- "\n - " -}}
                                {%- if action.type == 'ecommerceOrder' -%}
                                    {{- 'General_ColumnRevenue'|translate -}}:
                                  {%- else -%}
                                    {%- set revenueLeft -%}
                                        {{- 'General_ColumnRevenue'|translate -}}
                                    {%- endset -%}
                                    {{- 'Goals_LeftInCart'|translate(revenueLeft) -}}:
                                {%- endif %} {{ action.revenue|money(idSite)|raw -}}

                                {{- "\n - " -}}{{- action.serverTimePretty -}}
                                {{- "\n" -}}
                                {% if action.itemDetails is not empty -%}
                                    {% for product in action.itemDetails -%}
                                        {{- "\n# " -}}{{ product.itemSKU }}{% if product.itemName is not empty %}: {{ product.itemName }}{% endif %}{% if product.itemCategory is not empty %} ({{ product.itemCategory }}){% endif %}, {{ 'General_Quantity'|translate }}: {{ product.quantity }}, {{ 'General_Price'|translate }}: {{ product.price|money(idSite)|raw }}
                                    {%- endfor %}
                                {%- endif %}
                            {% endset %}
                            <span title="{{- title -}}">
						        <img class='iconPadding' src="{{ action.icon }}"/>
                                {% if action.type == 'ecommerceOrder' %}
                                    {{ 'General_ColumnRevenue'|translate }}: {{ action.revenue|money(idSite)|raw }}
                                {% endif %}
                            </span>
                        {% else %}
                            {% set col = col + 1 %}
                            {% if col >= 9 %}
                                {% set col = 0 %}
                            {% endif %}
                            <a href="{{ action.url }}" target="_blank">
                                {% if action.type == 'action' %}
{# white spacing matters as Chrome tooltip display whitespaces #}
{% set title %}
{% if action.pageTitle is not empty %}{{ action.pageTitle|rawSafeDecoded }}{% endif %}

{{ action.serverTimePretty }}
{% if action.timeSpentPretty is defined %}{{ 'General_TimeOnPage'|translate }}: {{ action.timeSpentPretty|raw }}{% endif %}
{%- endset %}
                                    <img src="plugins/Live/images/file{{ col }}.png" title="{{- title -}}"/>
                                {% elseif action.type == 'outlink' or action.type == 'download' %}
                                    <img class='iconPadding' src="{{ action.icon }}"
                                         title="{{ action.url }} - {{ action.serverTimePretty }}"/>
                                {% elseif action.type == 'search' %}
                                    <img class='iconPadding' src="{{ action.icon }}"
                                         title="{{ 'Actions_SubmenuSitesearch'|translate }}: {{ action.siteSearchKeyword }} - {{ action.serverTimePretty }}"/>
                                {% elseif action.eventCategory|default(false) is not empty %}
                                    <img  class="iconPadding" src='{{ action.icon }}'
                                        title="{{ 'Events_Event'|translate }} {{ action.eventCategory }} - {{ action.eventAction }} {% if action.eventName is defined %}- {{ action.eventName }}{% endif %} {% if action.eventValue is defined %}- {{ action.eventValue }}{% endif %}"/>
                                {% else %}
                                    <img class='iconPadding' src="{{ action.icon }}"
                                         title="{{ action.goalName }} - {% if action.revenue > 0 %}{{ 'General_ColumnRevenue'|translate }}: {{ action.revenue|money(idSite)|raw }} - {% endif %} {{ action.serverTimePretty }}"/>
                                {% endif %}
                            </a>
                        {% endif %}
                    {% endif %}
                {% endfor %}
                {% if visitor.actionDetails|length > maxPagesDisplayedByVisitor %}
                    <em>({{ 'Live_MorePagesNotDisplayed'|translate }})</em>
                {% endif %}
            </div>
        </li>
    {% endfor %}
</ul>
<script type="text/javascript">
$('#visitsLive').on('click', '.visits-live-launch-visitor-profile', function (e) {
    e.preventDefault();
    broadcast.propagateNewPopoverParameter('visitorProfile', $(this).attr('data-visitor-id'));
    return false;
});
</script>