From ed5c44dcc8ec43f3f7afc3ae824861fdf532669d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Furkan=20Ba=C5=9Faran?= Date: Thu, 5 Nov 2020 17:01:27 +0300 Subject: [PATCH 1/2] [feedback-ui-fixes] ui fixes. - decoded encoded strings before render. - added length check for target pages. --- .../public/javascripts/countly.views.js | 30 +++++++++++-------- .../frontend/public/stylesheets/main.css | 2 ++ 2 files changed, 20 insertions(+), 12 deletions(-) diff --git a/plugins/star-rating/frontend/public/javascripts/countly.views.js b/plugins/star-rating/frontend/public/javascripts/countly.views.js index 8f77136fc95..52632ecedab 100644 --- a/plugins/star-rating/frontend/public/javascripts/countly.views.js +++ b/plugins/star-rating/frontend/public/javascripts/countly.views.js @@ -965,7 +965,7 @@ window.starView = countlyView.extend({ } row.target_pages.forEach(function(page) { if (row.target_pages.indexOf(page) < 5) { - target_pages += "
" + page + "
"; + target_pages += "" + (page.length < 20 ? page : (page.substr(0, 20) + "...")) + ""; } else if (row.target_pages.indexOf(page) === 5) { target_pages += "
And " + (row.target_pages.length - 5) + " more...
"; @@ -1160,6 +1160,11 @@ window.starView = countlyView.extend({ "display": "block" }); }, + decode: function(string) { + var div = document.createElement("div"); + div.innerHTML = string; + return typeof div.textContent !== 'undefined' ? div.textContent : div.innerText; + }, renderCommon: function(isRefresh) { var self = this; new ClipboardJS('.copy-widget-id'); @@ -1746,12 +1751,12 @@ window.starView = countlyView.extend({ } }); var renderFeedbackWidgetModal = function(isCreate) { - $("#feedback-popup-header-text").val(isCreate ? "" : self.feedbackWidget.popup_header_text); - $("#feedback-popup-comment-text").val(isCreate ? "" : self.feedbackWidget.popup_comment_callout); - $("#feedback-popup-email-text").val(isCreate ? "" : self.feedbackWidget.popup_email_callout); - $("#feedback-popup-button-text").val(isCreate ? "" : self.feedbackWidget.popup_button_callout); - $("#feedback-popup-thanks-text").val(isCreate ? "" : self.feedbackWidget.popup_thanks_message); - $("#feedback-trigger-text").val(isCreate ? "" : self.feedbackWidget.trigger_button_text); + $("#feedback-popup-header-text").val(isCreate ? "" : self.decode(self.feedbackWidget.popup_header_text)); + $("#feedback-popup-comment-text").val(isCreate ? "" : self.decode(self.feedbackWidget.popup_comment_callout)); + $("#feedback-popup-email-text").val(isCreate ? "" : self.decode(self.feedbackWidget.popup_email_callout)); + $("#feedback-popup-button-text").val(isCreate ? "" : self.decode(self.feedbackWidget.popup_button_callout)); + $("#feedback-popup-thanks-text").val(isCreate ? "" : self.decode(self.feedbackWidget.popup_thanks_message)); + $("#feedback-trigger-text").val(isCreate ? "" : self.decode(self.feedbackWidget.trigger_button_text)); $("#counter-for-feedback-popup-header-text").html($("#feedback-popup-header-text").val().length + "/45"); $("#counter-for-feedback-popup-comment-text").html($("#feedback-popup-comment-text").val().length + "/25"); @@ -1766,13 +1771,14 @@ window.starView = countlyView.extend({ // add related place and size class to sticker preview $("#feedback-sticker-on-window").removeClass().addClass(self.feedbackWidget.trigger_position + '-' + self.feedbackWidget.trigger_size); - $("#question-area").html(self.feedbackWidget.popup_header_text); - $("#countly-feedback-comment-title").html(self.feedbackWidget.popup_comment_callout); - $("#countly-feedback-email-title").html(self.feedbackWidget.popup_email_callout); - $("#feedback-submit-button").html(self.feedbackWidget.popup_button_callout); - $(".success-emotions-area > #question-area").html(self.feedbackWidget.popup_thanks_message); + $("#question-area").html(self.decode(self.feedbackWidget.popup_header_text)); + $("#countly-feedback-comment-title").html(self.decode(self.feedbackWidget.popup_comment_callout)); + $("#countly-feedback-email-title").html(self.decode(self.feedbackWidget.popup_email_callout)); + $("#feedback-submit-button").html(self.decode(self.feedbackWidget.popup_button_callout)); + $(".success-emotions-area > #question-area").html(self.decode(self.feedbackWidget.popup_thanks_message)); var reducedTriggerText = self.feedbackWidget.trigger_button_text.length > 10 ? self.feedbackWidget.trigger_button_text.substr(0, 10) + '...' : self.feedbackWidget.trigger_button_text; + reducedTriggerText = self.decode(reducedTriggerText); $('#feedback-sticker-on-window').html(' ' + reducedTriggerText); $(".device-box:lt(3)").each(function(index, element) { diff --git a/plugins/star-rating/frontend/public/stylesheets/main.css b/plugins/star-rating/frontend/public/stylesheets/main.css index 2dda9bcbeae..9ec6b308a98 100644 --- a/plugins/star-rating/frontend/public/stylesheets/main.css +++ b/plugins/star-rating/frontend/public/stylesheets/main.css @@ -124,6 +124,8 @@ .routename-star .feedback-widget-target-page-item { margin-bottom: 3px; font-size: 11px; + cursor: pointer; + display: block; } .routename-star .pickpanel { From f12e6898b6ace60980bd38081a0915fee294f93f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Furkan=20Ba=C5=9Faran?= Date: Thu, 5 Nov 2020 17:21:10 +0300 Subject: [PATCH 2/2] [feedback-ui-fixes] review changes. - removed decode calls from .html() usages. --- .../frontend/public/javascripts/countly.views.js | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/plugins/star-rating/frontend/public/javascripts/countly.views.js b/plugins/star-rating/frontend/public/javascripts/countly.views.js index 52632ecedab..41811cfc926 100644 --- a/plugins/star-rating/frontend/public/javascripts/countly.views.js +++ b/plugins/star-rating/frontend/public/javascripts/countly.views.js @@ -1771,14 +1771,13 @@ window.starView = countlyView.extend({ // add related place and size class to sticker preview $("#feedback-sticker-on-window").removeClass().addClass(self.feedbackWidget.trigger_position + '-' + self.feedbackWidget.trigger_size); - $("#question-area").html(self.decode(self.feedbackWidget.popup_header_text)); - $("#countly-feedback-comment-title").html(self.decode(self.feedbackWidget.popup_comment_callout)); - $("#countly-feedback-email-title").html(self.decode(self.feedbackWidget.popup_email_callout)); - $("#feedback-submit-button").html(self.decode(self.feedbackWidget.popup_button_callout)); - $(".success-emotions-area > #question-area").html(self.decode(self.feedbackWidget.popup_thanks_message)); + $("#question-area").html(self.feedbackWidget.popup_header_text); + $("#countly-feedback-comment-title").html(self.feedbackWidget.popup_comment_callout); + $("#countly-feedback-email-title").html(self.feedbackWidget.popup_email_callout); + $("#feedback-submit-button").html(self.feedbackWidget.popup_button_callout); + $(".success-emotions-area > #question-area").html(self.feedbackWidget.popup_thanks_message); var reducedTriggerText = self.feedbackWidget.trigger_button_text.length > 10 ? self.feedbackWidget.trigger_button_text.substr(0, 10) + '...' : self.feedbackWidget.trigger_button_text; - reducedTriggerText = self.decode(reducedTriggerText); $('#feedback-sticker-on-window').html(' ' + reducedTriggerText); $(".device-box:lt(3)").each(function(index, element) {