refs #4877 lots of ui tweaks, fixes and general improvements

17 files changed, 55 insertions, 101 deletions

diff --git a/LEGALNOTICE b/LEGALNOTICE
index 60f4b9565d..e95df84651 100644
--- a/LEGALNOTICE
+++ b/LEGALNOTICE
@@ -239,6 +239,14 @@ THIRD-PARTY CONTENT
 	Link: https://www.iconfinder.com/icons/17022/colors_draw_paint_icon
 	License: Free for commercial use
 
+	Name: plugins/Feedback/angularjs/ratefeature/thumbs-down.png
+	Link: https://www.iconfinder.com/icons/216428/down_thumbs_icon
+	License: Creative Commons (Attribution-Share Alike 3.0 Unported)
+
+	Name: plugins/Feedback/angularjs/ratefeature/thumbs-up.png
+	Link: https://www.iconfinder.com/icons/216429/thumbs_up_icon
+	License: Creative Commons (Attribution-Share Alike 3.0 Unported)
+
 	Name: plugins/CorePluginsAdmin/images/plugins.png
 	Link: http://findicons.com/icon/94051/tools_wizard?id=396912
 	License: GNU/GPL
diff --git a/lang/en.json b/lang/en.json
index 4b3ff4324f..2af69d0e66 100644
--- a/lang/en.json
+++ b/lang/en.json
@@ -947,9 +947,10 @@
         "MessageSent": "Your message was sent to the Piwik team.",
         "ThankYou": "Thank you for helping us to make Piwik better!",
         "RateFeatureTitle": "Do you like the '%s' feature? Please rate and leave a comment",
-        "RateFeatureThankYouTitle": "Thank you for rating the '%s' feature!",
+        "RateFeatureThankYouTitle": "Thank you for rating '%s'!",
         "RateFeatureLeaveMessageLike": "We are glad you like it! Please let us know what you like the most or if you miss a feature.",
-        "RateFeatureLeaveMessageDislike": "We are sorry to hear! Please let us know what you don't like or which feature you miss so we can improve.",
+        "RateFeatureLeaveMessageDislike": "We are sorry to hear you don't like it! Please let us know what we can improve.",
+        "RateFeatureSendFeedbackInformation": "Your Piwik will send us an email containing your email address to let us get in contact with you in case there are questions.",
         "ThePiwikTeam": "The Piwik Team",
         "ExceptionBodyLength": "Message must be at least %s characters long.",
         "ExceptionNoUrls": "The message cannot contain a URL, to avoid spam messages.",
diff --git a/plugins/Actions/javascripts/actionsDataTable.js b/plugins/Actions/javascripts/actionsDataTable.js
index 32bbbdb6b2..a8e5ff85dd 100644
--- a/plugins/Actions/javascripts/actionsDataTable.js
+++ b/plugins/Actions/javascripts/actionsDataTable.js
@@ -85,7 +85,6 @@
             }
 
             self.handleColumnDocumentation(domElem);
-            self.handleReportDocumentation(domElem);
             self.handleRelatedReports(domElem);
             self.handleTriggeredEvents(domElem);
             self.handleCellTooltips(domElem);
diff --git a/plugins/CoreAdminHome/templates/trackingCodeGenerator.twig b/plugins/CoreAdminHome/templates/trackingCodeGenerator.twig
index fe8c04997a..10ac52386a 100644
--- a/plugins/CoreAdminHome/templates/trackingCodeGenerator.twig
+++ b/plugins/CoreAdminHome/templates/trackingCodeGenerator.twig
@@ -9,7 +9,9 @@
 {% block content %}
 <div id="js-tracking-generator-data" data-currencies="{{ currencySymbols|json_encode }}"></div>
 
-<h2>{{ 'CoreAdminHome_JavaScriptTracking'|translate }}</h2>
+<h2 piwik-enriched-headline
+    feature-name="{{ 'CoreAdminHome_TrackingCode'|translate }}"
+    help-url="http://piwik.org/docs/tracking-api/">{{ 'CoreAdminHome_JavaScriptTracking'|translate }}</h2>
 
 <div id="js-code-options" class="adminTable">
 
diff --git a/plugins/CoreHome/angularjs/enrichedheadline/enrichedheadline-directive.js b/plugins/CoreHome/angularjs/enrichedheadline/enrichedheadline-directive.js
index 2444de9682..f282e9eac5 100644
--- a/plugins/CoreHome/angularjs/enrichedheadline/enrichedheadline-directive.js
+++ b/plugins/CoreHome/angularjs/enrichedheadline/enrichedheadline-directive.js
@@ -51,7 +51,9 @@ angular.module('piwikApp').directive('piwikEnrichedHeadline', function($document
                 }
 
                 if (helpNode && helpNode.length) {
-                    scope.inlineHelp = helpNode.html();
+                    if ($.trim(helpNode.text())) {
+                        scope.inlineHelp = $.trim(helpNode.html());
+                    }
                     helpNode.remove();
                 }
 
diff --git a/plugins/CoreHome/angularjs/enrichedheadline/enrichedheadline.less b/plugins/CoreHome/angularjs/enrichedheadline/enrichedheadline.less
index 52fa7d0074..6a4ab6137c 100644
--- a/plugins/CoreHome/angularjs/enrichedheadline/enrichedheadline.less
+++ b/plugins/CoreHome/angularjs/enrichedheadline/enrichedheadline.less
@@ -3,6 +3,8 @@
 }
 
 .enrichedHeadline {
+  min-height: 22px;
+
   .inlineHelp {
     display:block;
     background: #F7F7F7;
@@ -33,7 +35,7 @@
   .helpIcon {
     cursor: pointer;
     display:inline-block;
-    margin: 4px 0 0 4px;
+    margin: 0px 0px -1px 4px;
     width: 16px;
     opacity: 0.3;
     height: 16px;
diff --git a/plugins/CoreHome/angularjs/enrichedheadline/help.png b/plugins/CoreHome/angularjs/enrichedheadline/help.png
index b18fa0aa61..c5174cdf63 100644
--- a/plugins/CoreHome/angularjs/enrichedheadline/help.png
+++ b/plugins/CoreHome/angularjs/enrichedheadline/help.png
diff --git a/plugins/CoreHome/javascripts/dataTable.js b/plugins/CoreHome/javascripts/dataTable.js
index 0c7cc5f104..60e88c6232 100644
--- a/plugins/CoreHome/javascripts/dataTable.js
+++ b/plugins/CoreHome/javascripts/dataTable.js
@@ -284,7 +284,6 @@ $.extend(DataTable.prototype, UIControl.prototype, {
         self.handleSubDataTable(domElem);
         self.handleConfigurationBox(domElem);
         self.handleColumnDocumentation(domElem);
-        self.handleReportDocumentation(domElem);
         self.handleRowActions(domElem);
 		self.handleCellTooltips(domElem);
         self.handleRelatedReports(domElem);
@@ -1401,86 +1400,6 @@ $.extend(DataTable.prototype, UIControl.prototype, {
         });
     },
 
-    // documentation for report
-    handleReportDocumentation: function (domElem) {
-
-        // don't display report documentation in dashboard
-        if ($('#dashboard').size() > 0
-            // or in Widgetize screen
-            || $('.widgetContent').size() > 0
-            // or in Widget export
-            || $('.widget').size() > 0
-            ) {
-            return;
-        }
-
-        var prev = domElem.prev();
-        if (prev && prev.length && prev.attr('piwik-enriched-headline') === '') {
-            // help is covered by piwik-enriched-headline
-            return;
-        }
-
-        domElem = $(domElem);
-        var doc = domElem.find('.reportDocumentation');
-
-        var h2 = this._findReportHeader(domElem);
-        if (doc.size() == 0 || doc.children().size() == 0) // if we can't find the element, or the element is empty
-        {
-            if (h2 && h2.size() > 0) {
-                h2.find('a.reportDocumentationIcon').addClass('hidden');
-            }
-            return;
-        }
-
-        var icon = $('<a href="#"></a>');
-        var docShown = false;
-
-        icon.click(function () {
-            if (docShown) {
-                doc.stop(true, true).fadeOut(250);
-            }
-            else {
-                var widthOrientation = domElem.find('table, canvas, object').eq(0);
-                if (widthOrientation.size() > 0) {
-                    var width = Math.min(widthOrientation.width(), doc.parent().innerWidth());
-                    doc.css('width', (width - 2) + 'px');
-                }
-                doc.stop(true, true).fadeIn(250);
-            }
-            docShown = !docShown;
-            return false;
-        });
-
-        icon.addClass('reportDocumentationIcon');
-        if (h2 && h2.size() > 0) {
-            // handle previously added icon
-            var existingIcon = h2.find('a.reportDocumentationIcon');
-            if (existingIcon.size() > 0) {
-                existingIcon.replaceWith(icon);
-            }
-            else {
-                // add icon
-                h2.append('&nbsp;&nbsp;&nbsp;');
-                h2.append(icon);
-
-                h2.hover(function () {
-                        $(this).find('a.reportDocumentationIcon').show();
-                    },
-                    function () {
-                        $(this).find('a.reportDocumentationIcon').hide();
-                    })
-                    .click(
-                    function () {
-                        $(this).find('a.reportDocumentationIcon').click();
-                    })
-                    .css('cursor', 'pointer');
-            }
-        }
-        else {
-            //domElem.prepend(icon);
-        }
-    },
-
     handleRowActions: function (domElem) {
         this.doHandleRowActions(domElem.find('table > tbody > tr'));
     },
diff --git a/plugins/Feedback/API.php b/plugins/Feedback/API.php
index 96ae313d6d..3378e96a14 100644
--- a/plugins/Feedback/API.php
+++ b/plugins/Feedback/API.php
@@ -22,6 +22,14 @@ use Piwik\Version;
  */
 class API extends \Piwik\Plugin\API
 {
+    /**
+     * Sends feedback for a specific feature to the Piwik team or alternatively to the email address configured in the
+     * config: "feedback_email_address".
+     *
+     * @param string   $featureName  The name of a feature you want to give feedback to.
+     * @param bool|int $like         Whether you like the feature or not
+     * @param string   $message      A message containing the actual feedback
+     */
     public function sendFeedbackForFeature($featureName, $like, $message)
     {
         Piwik::checkUserIsNotAnonymous();
@@ -63,6 +71,10 @@ class API extends \Piwik\Plugin\API
 
     private function findTranslationKeyForFeatureName($featureName)
     {
+        if (empty($GLOBALS['Piwik_translations'])) {
+            return;
+        }
+
         foreach ($GLOBALS['Piwik_translations'] as $key => $translations) {
             $possibleKey = array_search($featureName, $translations);
             if (!empty($possibleKey)) {
diff --git a/plugins/Feedback/Feedback.php b/plugins/Feedback/Feedback.php
index 6d6969f548..9164d943d3 100644
--- a/plugins/Feedback/Feedback.php
+++ b/plugins/Feedback/Feedback.php
@@ -67,5 +67,7 @@ class Feedback extends \Piwik\Plugin
         $translationKeys[] = 'Feedback_RateFeatureLeaveMessageLike';
         $translationKeys[] = 'Feedback_RateFeatureLeaveMessageDislike';
         $translationKeys[] = 'Feedback_SendFeedback';
+        $translationKeys[] = 'Feedback_RateFeatureSendFeedbackInformation';
+        $translationKeys[] = 'General_Ok';
     }
 }
diff --git a/plugins/Feedback/angularjs/ratefeature/ratefeature-controller.js b/plugins/Feedback/angularjs/ratefeature/ratefeature-controller.js
index b68602fad7..7a65474906 100644
--- a/plugins/Feedback/angularjs/ratefeature/ratefeature-controller.js
+++ b/plugins/Feedback/angularjs/ratefeature/ratefeature-controller.js
@@ -17,6 +17,7 @@ angular.module('piwikApp').controller('RateFeatureController', function($scope,
 
     $scope.sendFeedback = function (message) {
         rateFeatureModel.sendFeedbackForFeature($scope.title, $scope.like, message);
-        alert($filter('translate')('Feedback_ThankYou'));
+        $scope.ratingDone = true;
+        // alert($filter('translate')('Feedback_ThankYou'));
     };
 });
diff --git a/plugins/Feedback/angularjs/ratefeature/ratefeature.html b/plugins/Feedback/angularjs/ratefeature/ratefeature.html
index bdfec8e301..66b2add7e5 100644
--- a/plugins/Feedback/angularjs/ratefeature/ratefeature.html
+++ b/plugins/Feedback/angularjs/ratefeature/ratefeature.html
@@ -14,9 +14,8 @@
              src="plugins/Feedback/angularjs/ratefeature/thumbs-down.png"/>
     </div>
 
-    <div class="ratefeatureDialog" piwik-dialog="view.showFeedbackForm" yes="sendFeedback(view.feedbackMessage)">
-        <h1>{{ 'Feedback_RateFeatureThankYouTitle'|translate:title }}</h1>
-
+    <div class="ui-confirm ratefeatureDialog" piwik-dialog="view.showFeedbackForm" yes="sendFeedback(view.feedbackMessage)">
+        <h2>{{ 'Feedback_RateFeatureThankYouTitle'|translate:title }}</h2>
         <p ng-if="like">{{ 'Feedback_RateFeatureLeaveMessageLike'|translate }}</p>
         <p ng-if="!like">{{ 'Feedback_RateFeatureLeaveMessageDislike'|translate }}</p>
         <br />
@@ -25,7 +24,15 @@
             <textarea ng-model="view.feedbackMessage"></textarea>
         </div>
 
-        <input type="button" value="{{ 'Feedback_SendFeedback'|translate }}" role="yes"/>
+        <input type="button"
+               title="{{ 'Feedback_RateFeatureSendFeedbackInformation'|translate }}"
+               value="{{ 'Feedback_SendFeedback'|translate }}" role="yes"/>
+    </div>
+
+    <div class="ui-confirm ratefeatureDialog" piwik-dialog="ratingDone" yes="">
+        <h2>{{ 'Feedback_ThankYou'|translate:title }}</h2>
+
+        <input type="button" value="{{ 'General_Ok'|translate }}" role="yes"/>
     </div>
 
 </div>
\ No newline at end of file
diff --git a/plugins/Feedback/angularjs/ratefeature/ratefeature.less b/plugins/Feedback/angularjs/ratefeature/ratefeature.less
index 4c55214456..83abd8970b 100644
--- a/plugins/Feedback/angularjs/ratefeature/ratefeature.less
+++ b/plugins/Feedback/angularjs/ratefeature/ratefeature.less
@@ -1,9 +1,8 @@
 .ratefeatureDialog {
-  .messageContainer {
-    text-align: center;
-  }
+  text-align: center;
 
   textarea {
+    margin-top: 5px;
     width: 100%;
     height: 80px;
   }
@@ -20,8 +19,8 @@
   .dislike-icon,
   .like-icon {
     opacity: 0.2;
-    width:24px;
-    height:24px;
+    width: 22px;
+    height: 22px;
     cursor: pointer;
 
     &:hover {
diff --git a/plugins/Live/templates/indexVisitorLog.twig b/plugins/Live/templates/indexVisitorLog.twig
index f19ac34eea..c856fa72e8 100644
--- a/plugins/Live/templates/indexVisitorLog.twig
+++ b/plugins/Live/templates/indexVisitorLog.twig
@@ -1,3 +1,3 @@
-<h2>{% if filterEcommerce %}{{ 'Goals_EcommerceLog'|translate }}{% else %}{{ 'Live_VisitorLog'|translate }}{% endif %}</h2>
+<h2 piwik-enriched-headline>{% if filterEcommerce %}{{ 'Goals_EcommerceLog'|translate }}{% else %}{{ 'Live_VisitorLog'|translate }}{% endif %}</h2>
 
 {{ visitorLog|raw }}
diff --git a/plugins/SegmentEditor/templates/_segmentSelector.twig b/plugins/SegmentEditor/templates/_segmentSelector.twig
index f83e738867..fd73dafa50 100644
--- a/plugins/SegmentEditor/templates/_segmentSelector.twig
+++ b/plugins/SegmentEditor/templates/_segmentSelector.twig
@@ -131,7 +131,7 @@
             <h3>{{ 'General_Name'|translate }}: <span  class="segmentName"></span> <a class="editSegmentName" href="#">{{ 'General_Edit'|translate|lower }}</a></h3>
         </div>
         <div class="segment-footer">
-            <div piwik-rate-feature title="'Segment Editor'" style="display:inline-block;float: left;margin-top: 2px;margin-right: 10px;"></div>
+            <div piwik-rate-feature title="Segment Editor" style="display:inline-block;float: left;margin-top: 2px;margin-right: 10px;"></div>
             <span class="segmentFooterNote">The Segment Editor was <a class='crowdfundingLink' href='http://crowdfunding.piwik.org/custom-segments-editor/' target='_blank'>crowdfunded</a> with the awesome support of 80 companies and Piwik users worldwide!</span>
             <a class="delete" href="#">{{ 'General_Delete'|translate }}</a>
             <a class="close" href="#">{{ 'General_Close'|translate }}</a>
diff --git a/plugins/SitesManager/templates/index.twig b/plugins/SitesManager/templates/index.twig
index dcf73012b3..19f788b3cc 100644
--- a/plugins/SitesManager/templates/index.twig
+++ b/plugins/SitesManager/templates/index.twig
@@ -104,7 +104,7 @@
         });
     </script>
 
-    <h2 piwik-enriched-headline>{{ 'SitesManager_WebsitesManagement'|translate }}</h2>
+    <h2 piwik-enriched-headline help-url="http://piwik.org/docs/manage-websites/">{{ 'SitesManager_WebsitesManagement'|translate }}</h2>
     <p>{{ 'SitesManager_MainDescription'|translate }}
         {{ 'SitesManager_YouCurrentlyHaveAccessToNWebsites'|translate("<strong>" ~ adminSitesCount ~ "</strong>")|raw }}
         {% if isSuperUser %}
diff --git a/plugins/UsersManager/templates/index.twig b/plugins/UsersManager/templates/index.twig
index 45fdeeeb40..4573cd42d5 100644
--- a/plugins/UsersManager/templates/index.twig
+++ b/plugins/UsersManager/templates/index.twig
@@ -89,7 +89,7 @@
 <div class="ui-confirm" id="confirm">
     <h2>{{ 'UsersManager_ChangeAllConfirm'|translate("<span id='login'></span>")|raw }}</h2>
     <input role="yes" type="button" value="{{ 'General_Yes'|translate }}"/>
-    <input role="no" type="button" value="{{ 'General_No'|translate }}"/>
+    <input role="no" type="button#" value="{{ 'General_No'|translate }}"/>
 </div>
 
 {% if userIsSuperUser %}