New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve realtime visitor log widget #12659

Merged
merged 4 commits into from May 2, 2018
File filter...
Filter file types
Jump to file or symbol
Failed to load files and symbols.
+67 −81
Diff settings

Always

Just for now

Copy path View file
@@ -86,11 +86,8 @@ public function getLastVisitsStart()
$view = new View('@Live/getLastVisitsStart');
$view->idSite = (int) $this->idSite;
$api = new Request("method=Live.getLastVisitsDetails&idSite={$this->idSite}&filter_limit=10&format=php&serialize=0&disable_generic_filters=1");
$api = new Request("method=Live.getLastVisitsDetails&idSite={$this->idSite}&filter_limit=10&format=original&serialize=0&disable_generic_filters=1");
$visitors = $api->process();
if (!empty($visitors['result']) && $visitors['result'] === 'error' && !empty($visitors['message'])) {
throw new \Exception($visitors['message']);
}
$view->visitors = $visitors;
return $this->render($view);
@@ -108,10 +108,28 @@
return;
}

var items = $('li', $(data));
var items = $('li.visit', $(data));
for (var i = items.length; i--;) {
this._parseItem(items[i]);
}

this._initTooltips();
},

/**
* Initializes the icon tooltips
*/
_initTooltips: function() {
$('li.visit').tooltip({
items: '.visitorLogIconWithDetails',
track: true,
show: false,
hide: false,
content: function() {
return $('<ul>').html($('ul', $(this)).html());
},
tooltipClass: 'small'
});
},

/**
@@ -135,7 +153,7 @@
$(item).fadeIn(this.options.fadeInSpeed);
}
// remove rows if there are more than the maximum
$('li:gt(' + (this.options.maxRows - 1) + ')', this.element).remove();
$('li.visit:gt(' + (this.options.maxRows - 1) + ')', this.element).remove();
},

/**
@@ -154,6 +172,8 @@

var self = this;

this._initTooltips();

this.updateInterval = window.setTimeout(function() { self._update(); }, this.currentInterval);
},

@@ -370,6 +370,29 @@ a.visitor-log-visitor-profile-link {
background-image: url('plugins/Live/images/visitorlog-hover.png');
}

#widgetLivewidget {
.visitorLogIcons {
display: inline;
}

.visitorLogIconWithDetails.flag {
display: inline;
}

.visitorDetails {
display: inline-block;
}

.visitorLogIconWithDetails {
margin-right: 5px;
}

.visitorType {
display: inline-block;
float: left;
margin-right: 15px;
}
}

@media only screen and (max-width: 600px) {
.own-visitor-column {
@@ -1,90 +1,36 @@
{# 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">
<ul id="visitsLive">
{% for visitor in visitors.getRows() %}
<li id="{{ visitor.getColumn('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>
<div title="{{ visitor.getColumn('actionDetails')|length }} {{ 'General_Actions'|translate }}" class="datetime">
<span style="display:none;" class="serverTimestamp">{{ visitor.getColumn('serverTimestamp')|raw }}</span>
{{ postEvent('Live.visitorLogWidgetViewBeforeVisitInfo', visitor) }}
{% set year = visitor.serverTimestamp|date('Y') %}
<span class="realTimeWidget_datetime">{{ visitor.serverDatePretty|replace({(year): ' '}) }} - {{ visitor.serverTimePretty }} {% if visitor.visitDuration > 0 %}({{ visitor.visitDurationPretty|raw }}){% endif %}</span>
{% 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 %}
{% set year = visitor.getColumn('serverTimestamp')|date('Y') %}
<span class="realTimeWidget_datetime">{{ visitor.getColumn('serverDatePretty')|replace({(year): ' '}) }} - {{ visitor.getColumn('serverTimePretty') }} {% if visitor.getColumn('visitDuration') > 0 %}({{ visitor.getColumn('visitDurationPretty')|raw }}){% endif %}</span>
{% if visitor.getColumn('visitorId')|default(false) is not empty %}
&nbsp; <a class="visits-live-launch-visitor-profile rightLink" title="{{ 'Live_ViewVisitorProfile'|translate }} {% if visitor.getColumn('userId') is not empty %}{{ visitor.getColumn('userId')|raw }}{% endif %}" data-visitor-id="{{ visitor.getColumn('visitorId') }}">
{% if visitor.getColumn('userId') is not empty %}<br/>{% endif %}
<img src="plugins/Live/images/visitorProfileLaunch.png"/>
{{ visitor.userId|default('')|raw }}
{{ visitor.getColumn('userId')|default('')|raw }}
</a>
{% endif %}
<br />

{% if visitor.countryFlag is defined %}&nbsp;<img height="16px" src="{{ visitor.countryFlag }}" title="{{ visitor.location|e('html_attr') }}, {{ 'Provider_ColumnProvider'|translate }} {% if visitor.providerName is defined %}{{ visitor.providerName }}{% endif %}"/>{% endif %}
{% if visitor.browserIcon is defined %}&nbsp;<img width="16px" height="16px" src="{{ visitor.browserIcon }}" title="{{ visitor.browser|e('html_attr') }}{% if visitor.plugins is defined %}, {{ 'General_Plugins'|translate }}: {{ visitor.plugins }}{% endif %}"/>{% endif %}
{% if visitor.operatingSystemIcon is defined %}&nbsp;<img width="16px" height="16px" 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 %}
{{ postEvent('Live.renderVisitorIcons', visitor) }}

<img src="{{ visitor.visitEcommerceStatusIcon }}" title="{{ visitor.visitEcommerceStatus|e('html_attr') }}"/>
{% 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 rel="noreferrer" target="_blank"
href="{{ visitor.referrerUrl|e('html_attr') }}">
{% 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|e('html_attr') }}_actions" class="settings">
<span class="referrer">
{% include "@Referrers/_visitorDetails.twig" with {'visitInfo': visitor} %}
</span>
</div>
<div id="{{ visitor.getColumn('idVisit')|e('html_attr') }}_actions" class="settings">
<span class="pagesTitle"
title="{{ visitor.actionDetails|length }} {{ 'General_Actions'|translate }}"
title="{{ visitor.getColumn('actionDetails')|length }} {{ 'General_Actions'|translate }}"
>{{ 'General_Actions'|translate }}:</span>&nbsp;
{% set col = 0 %}
{% for action in visitor.actionDetails %}
{% for action in visitor.getColumn('actionDetails') %}
{% if loop.index <= maxPagesDisplayedByVisitor %}

{% if action.type == 'ecommerceOrder' or action.type == 'ecommerceAbandonedCart' %}
@@ -159,7 +105,7 @@
{% endif %}
{% endfor %}

{% if visitor.actionDetails|length > maxPagesDisplayedByVisitor %}
{% if visitor.getColumn('actionDetails')|length > maxPagesDisplayedByVisitor %}
({{ 'Live_MorePagesNotDisplayed'|translate }})
{% endif %}
</div>
@@ -16,7 +16,7 @@
{% if visitInfo.getColumn('referrerSearchEngineIcon') %}
<img width="16" src="{{ visitInfo.getColumn('referrerSearchEngineIcon') }}" alt="{{ visitInfo.getColumn('referrerName') }}"/>
{% endif %}
<span {% if not showKeyword %}title="{{ keywordNotDefined }}" class="visitorLogTooltip"{% endif %}>{{ visitInfo.getColumn('referrerName') }}</span>
<span>{{ visitInfo.getColumn('referrerName') }}</span>
{%- if showKeyword %}<span>, {{ 'Referrers_Keywords'|translate }}:</span>
<a href="{{ visitInfo.getColumn('referrerUrl') }}" rel="noreferrer" target="_blank" style="text-decoration:underline;">
"{{ visitInfo.getColumn('referrerKeyword') }}"</a>
ProTip! Use n and p to navigate between commits in a pull request.