Customizeable / Extendable Visitor Profile & Visitor Log (#11579)

* move setting visitor details into own classes instead of using an event

* move manipulating actions to VisitorDetails classes

* move some more parts to plugins

* update test files as order of columns changed

* implement new VisitorDetails method to provide actions

* move rendering actions to visitordetail classes

* render visitor properties in new classes

* makes it possible to attach icons to visitor log

* moves rendering of action tooltip into new visitordetails method

* adds event for extending custom action dimension fields

* small improvements

* fetch log_link_visit_action.idpageview for actions

* improve variable name

* started to improve/change visitor profile

* show devices summary in visitor profile

* also remove empty xml tags for api tests

* hide actions in visitor profile by default

* move all icons to the middle of visitor log

* small change

* move rendering referrer information to referrers plugin

* move provider logic to provider plugin

* show content interactions in visitor log

* improve look of content interactions/impressions in visitor log / profile

* hide idpageview from tests

* update changelog

* move rendering events to Events plugin

* do not hide duplicate page views in visitor log, but show them with a refresh icon instead

* show top visited pages in visitor profile

* always show visitor profile link in visitor log

Still hidden in a widget by default, as it might overlay some other content

* Show info about not shown actions

truncated due to config setting

* use bulk queries to fetch actions instead of fetching them for each visit

* small adjustments

* improve some loops to improve memory usage

* move gathering visitor profile informations to VisitorDetails classes

* update screenshots

* update test files

* move rendering of visitor profile summary to visitor details classes

* improve templates

* Makes VisitorDetailsAbstract class api and improves comments

* show visit details in visitor profile

* improve css

* reverse enumeration of visits in visitor profile

* improve css

* Show visit id in IP tooltip

* Small CSS improvements

* further adjustments

* sort devices by count

* adds UI tests for visitor log and profile

* Show bandwidth in visitor profile test

* show actions by default and add button to toggle all together

* CSS cleanup

* remove border around refresh icon

* add tooltip for refresh icon in profile

* move first/last visit before top visited pages

* Improve text shown for unique pageviews

* link urls in top visited pages

* improve sorting of device list

* improve tests

* Improve device overview in visitor profile

* only render top pages if at least one page was visited more than once

* make visitor id non bold

* hide visitor type icon in profile, and show latest visits icons in overview

* fix search engine icon in visitor details

* small improvements

* only render view if required

* show visit icons only on hover in profile

* remove from again

* test improves

* show text besides icon in profile header

* improve tests

* Removes unused CSS and JS

* Reformats CSS

* Removes invisible paper clip

* Removes unused profile images from Live plugin

* raise test timeouts

* Improve UI tests splitting for travis

* show device type in profile header if no resolution is available

* prevent text overlapping

* no retries

* fix test

* change summary order

* fix position of export icon

* fixes tooltip text

* improve pages overview

* visitor details order

* action tooltip order

* show only ecommerce icon if no goals where converted

* show custom variables summary in profile

* show user id in same size as headline

* link referer urls for first/last visit in profile

* make profile xml compatible

* try to improve ui test

* increase bottom marign

* increase version number

* small adjustments

* CSS Rewrite for visitor profile

* center action icons in visitor log and profile

* improve widgetized visitor profile

* small layout fix

* always populate raw referrer url for visitor details

* update expected test files

* Refactor profile summaries into additional classes

* update screenshots

* submodule update

* update piwik-icons submodule (#11904)

* update piwik-icons submodule

* fix some system tests

* update screenshots

* make device list xml compatible

* improve translation

* improve icon position

* improves spacings

* update test files

* small css improvement

* update screenshots

3 files changed, 63 insertions, 52 deletions

diff --git a/plugins/Referrers/Referrers.php b/plugins/Referrers/Referrers.php
index 9d4d03a4a1..4e18abc933 100644
--- a/plugins/Referrers/Referrers.php
+++ b/plugins/Referrers/Referrers.php
@@ -30,7 +30,6 @@ class Referrers extends \Piwik\Plugin
     {
         return array(
             'Insights.addReportToOverview'      => 'addReportToInsightsOverview',
-            'Live.getAllVisitorDetails'         => 'extendVisitorDetails',
             'Request.getRenamedModuleAndAction' => 'renameDeprecatedModuleAndAction',
             'Tracker.setTrackerCacheGeneral'    => 'setTrackerCacheGeneral'
         );
@@ -51,20 +50,6 @@ class Referrers extends \Piwik\Plugin
         }
     }
 
-    public function extendVisitorDetails(&$visitor, $details)
-    {
-        $instance = new Visitor($details);
-
-        $visitor['referrerType']             = $instance->getReferrerType();
-        $visitor['referrerTypeName']         = $instance->getReferrerTypeName();
-        $visitor['referrerName']             = $instance->getReferrerName();
-        $visitor['referrerKeyword']          = $instance->getKeyword();
-        $visitor['referrerKeywordPosition']  = $instance->getKeywordPosition();
-        $visitor['referrerUrl']              = $instance->getReferrerUrl();
-        $visitor['referrerSearchEngineUrl']  = $instance->getSearchEngineUrl();
-        $visitor['referrerSearchEngineIcon'] = $instance->getSearchEngineIcon();
-    }
-
     public function addReportToInsightsOverview(&$reports)
     {
         $reports['Referrers_getWebsites']  = array();
diff --git a/plugins/Referrers/Visitor.php b/plugins/Referrers/VisitorDetails.php
index b10b9b953d..f0021c9293 100644
--- a/plugins/Referrers/Visitor.php
+++ b/plugins/Referrers/VisitorDetails.php
@@ -2,27 +2,38 @@
 /**
  * Piwik - free/libre analytics platform
  *
- * @link http://piwik.org
+ * @link    http://piwik.org
  * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
  *
  */
 namespace Piwik\Plugins\Referrers;
 
-use Piwik\Url;
+use Piwik\Plugins\Live\VisitorDetailsAbstract;
 use Piwik\UrlHelper;
+use Piwik\View;
 
-require_once PIWIK_INCLUDE_PATH . '/plugins/Referrers/functions.php';
-
-class Visitor
+class VisitorDetails extends VisitorDetailsAbstract
 {
-    private $details = array();
+    public function extendVisitorDetails(&$visitor)
+    {
+        $visitor['referrerType']             = $this->getReferrerType();
+        $visitor['referrerTypeName']         = $this->getReferrerTypeName();
+        $visitor['referrerName']             = $this->getReferrerName();
+        $visitor['referrerKeyword']          = $this->getKeyword();
+        $visitor['referrerKeywordPosition']  = $this->getKeywordPosition();
+        $visitor['referrerUrl']              = $this->getReferrerUrl();
+        $visitor['referrerSearchEngineUrl']  = $this->getSearchEngineUrl();
+        $visitor['referrerSearchEngineIcon'] = $this->getSearchEngineIcon();
+    }
 
-    public function __construct($details)
+    public function renderVisitorDetails($visitorDetails)
     {
-        $this->details = $details;
+        $view            = new View('@Referrers/_visitorDetails.twig');
+        $view->visitInfo = $visitorDetails;
+        return [[ 10, $view->render() ]];
     }
 
-    public function getReferrerType()
+    protected function getReferrerType()
     {
         try {
             $referrerType = getReferrerTypeFromShortName($this->details['referer_type']);
@@ -33,15 +44,15 @@ class Visitor
         return $referrerType;
     }
 
-    public function getReferrerTypeName()
+    protected function getReferrerTypeName()
     {
         return getReferrerTypeLabel($this->details['referer_type']);
     }
 
-    public function getKeyword()
+    protected function getKeyword()
     {
         $keyword = $this->details['referer_keyword'];
-        
+
         if ($this->getReferrerType() == 'search') {
             $keyword = API::getCleanKeyword($keyword);
         }
@@ -49,27 +60,8 @@ class Visitor
         return urldecode($keyword);
     }
 
-    public function getReferrerUrl()
+    protected function getReferrerUrl()
     {
-        if ($this->getReferrerType() == 'search') {
-            if ($this->details['referer_keyword'] == API::LABEL_KEYWORD_NOT_DEFINED) {
-
-                return 'http://piwik.org/faq/general/#faq_144';
-
-            } // Case URL is google.XX/url.... then we rewrite to the search result page url
-            elseif ($this->getReferrerName() == 'Google'
-                && strpos($this->details['referer_url'], '/url')
-            ) {
-                $refUrl = @parse_url($this->details['referer_url']);
-                if (isset($refUrl['host'])) {
-                    $url = SearchEngine::getInstance()->getBackLinkFromUrlAndKeyword('http://google.com', $this->getKeyword());
-                    $url = str_replace('google.com', $refUrl['host'], $url);
-
-                    return $url;
-                }
-            }
-        }
-
         if (UrlHelper::isLookLikeUrl($this->details['referer_url'])) {
             return $this->details['referer_url'];
         }
@@ -77,7 +69,7 @@ class Visitor
         return null;
     }
 
-    public function getKeywordPosition()
+    protected function getKeywordPosition()
     {
         if ($this->getReferrerType() == 'search'
             && strpos($this->getReferrerName(), 'Google') !== false
@@ -98,12 +90,12 @@ class Visitor
         return null;
     }
 
-    public function getReferrerName()
+    protected function getReferrerName()
     {
         return urldecode($this->details['referer_name']);
     }
 
-    public function getSearchEngineUrl()
+    protected function getSearchEngineUrl()
     {
         if ($this->getReferrerType() == 'search'
             && !empty($this->details['referer_name'])
@@ -115,7 +107,7 @@ class Visitor
         return null;
     }
 
-    public function getSearchEngineIcon()
+    protected function getSearchEngineIcon()
     {
         $searchEngineUrl = $this->getSearchEngineUrl();
 
@@ -126,5 +118,4 @@ class Visitor
 
         return null;
     }
-
 }
\ No newline at end of file
diff --git a/plugins/Referrers/templates/_visitorDetails.twig b/plugins/Referrers/templates/_visitorDetails.twig
new file mode 100644
index 0000000000..e3b03a2aba
--- /dev/null
+++ b/plugins/Referrers/templates/_visitorDetails.twig
@@ -0,0 +1,35 @@
+<div class="visitorReferrer {{ visitInfo.getColumn('referrerType') }}">
+    {% if visitInfo.getColumn('referrerType') == 'website' %}
+        <span>{{ 'Referrers_ColumnWebsite'|translate }}:</span>
+        <a href="{{ visitInfo.getColumn('referrerUrl') }}" rel="noreferrer" target="_blank" class="visitorLogTooltip" title="{{ visitInfo.getColumn('referrerUrl') }}"
+           style="text-decoration:underline;">
+            {{ visitInfo.getColumn('referrerName') }}
+        </a>
+    {% endif %}
+    {% if visitInfo.getColumn('referrerType') == 'campaign' %}
+        <span>{{ 'Referrers_ColumnCampaign'|translate }}: {{ visitInfo.getColumn('referrerName') }}
+            {% if visitInfo.getColumn('referrerKeyword') is not empty %} - {{ visitInfo.getColumn('referrerKeyword') }}{% endif %}</span>
+    {% endif %}
+    {% if visitInfo.getColumn('referrerType') == 'search' %}
+        {%- set keywordNotDefined = 'General_NotDefined'|translate('General_ColumnKeyword'|translate) -%}
+        {%- set showKeyword = visitInfo.getColumn('referrerKeyword') is not empty and visitInfo.getColumn('referrerKeyword') != keywordNotDefined -%}
+        {% 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>
+        {%- if showKeyword %}<span>, {{ 'Referrers_Keywords'|translate }}:</span>
+            <a href="{{ visitInfo.getColumn('referrerUrl') }}" rel="noreferrer" target="_blank" style="text-decoration:underline;">
+                "{{ visitInfo.getColumn('referrerKeyword') }}"</a>
+        {% endif %}
+        {% set keyword %}{{ visitInfo.getColumn('referrerKeyword') }}{% endset %}
+        {% set searchName %}{{ visitInfo.getColumn('referrerName') }}{% endset %}
+        {% set position %}#{{ visitInfo.getColumn('referrerKeywordPosition') }}{% endset %}
+        {% if visitInfo.getColumn('referrerKeywordPosition') %}
+            <span title='{{ 'Live_KeywordRankedOnSearchResultForThisVisitor'|translate(keyword,position,searchName) }}' class='visitorRank visitorLogTooltip'>
+                            <span class='hash'>#</span>
+                {{ visitInfo.getColumn('referrerKeywordPosition') }}
+                        </span>
+        {% endif %}
+    {% endif %}
+    {% if visitInfo.getColumn('referrerType') == 'direct' %}{{ 'Referrers_DirectEntry'|translate }}{% endif %}
+</div>