show token_auth only on click

1 files changed, 59 insertions, 0 deletions

diff --git a/plugins/CoreHome/angularjs/common/directives/show-sensitive-data.js b/plugins/CoreHome/angularjs/common/directives/show-sensitive-data.js
new file mode 100644
index 0000000000..1744f9e622
--- /dev/null
+++ b/plugins/CoreHome/angularjs/common/directives/show-sensitive-data.js
@@ -0,0 +1,59 @@
+/*!
+ * Piwik - free/libre analytics platform
+ *
+ * @link http://piwik.org
+ * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+ */
+
+/**
+ * Handles visibility of sensitive data. By default data will be shown replaced with stars (*)
+ * On click on the element the full data will be shown
+ *
+ * Configuration attributes:
+ * data-show-characters          number of characters to show in clear text (defaults to 6)
+ * data-click-element-selector   selector for element that will show the full data on click (defaults to element)
+ *
+ * Example:
+ * <div piwik-show-sensitive-date="some text"></div>
+ */
+(function () {
+    angular.module('piwikApp.directive').directive('piwikShowSensitiveData', piwikShowSensitiveData);
+
+    function piwikShowSensitiveData(){
+        return {
+            restrict: 'A',
+            link: function(scope, element, attr) {
+
+                var sensitiveData = attr.piwikShowSensitiveData || attr.text();
+                var showCharacters = attr.showCharacters || 6;
+                var clickElement = attr.clickElementSelector || element;
+
+                var protectedData = '';
+                if (showCharacters > 0) {
+                    protectedData += sensitiveData.substr(0, showCharacters);
+                }
+                protectedData += sensitiveData.substr(showCharacters).replace(/./g, '*');
+                element.html(protectedData);
+
+                function onClickHandler(event) {
+                    element.html(sensitiveData);
+                    $(clickElement).css({
+                        cursor: ''
+                    });
+                    $(clickElement).tooltip("destroy");
+                }
+
+                $(clickElement).tooltip({
+                    content: _pk_translate('CoreHome_ClickToSeeFullInformation'),
+                    items: '*',
+                    track: true
+                });
+
+                $(clickElement).one('click', onClickHandler);
+                $(clickElement).css({
+                    cursor: 'pointer'
+                })
+            }
+        };
+    }
+})();