diff --git a/css/_variables.scss b/css/_variables.scss index d5b3005f6..b471f9a02 100644 --- a/css/_variables.scss +++ b/css/_variables.scss @@ -61,15 +61,4 @@ $defaultWatermarkLink: '../images/watermark.png'; */ $tooltipsZ: 901; $toolbarZ: 900; -$overlayZ: 800; - -/** - * Font Colors TODO: Change colors when general dialogs are implemented. - */ -$defaultFontColor: #777; -$defaultLightFontColor: #F1F1F1; -$defaultDarkFontColor: #000; -$buttonFontColor: #777; -$buttonHoverFontColor: #287ade; -$linkFontColor: #489afe; -$linkHoverFontColor: #287ade; +$overlayZ: 800; \ No newline at end of file diff --git a/css/modals/_dialog.scss b/css/modals/_dialog.scss index c3cea92ca..babc330a3 100644 --- a/css/modals/_dialog.scss +++ b/css/modals/_dialog.scss @@ -3,7 +3,11 @@ height: auto; p { - color: $defaultDarkFontColor; + color: $defaultDarkColor; + } + textarea { + background: none; + border: 1px solid $inputBorderColor; } .aui-dialog2-content:last-child { border-bottom-right-radius: 5px; @@ -14,24 +18,34 @@ border-top-left-radius: 5px; } .aui-dialog2-footer{ + border-top: 0; + border-radius: 0; padding-top: 0; + background: none; + border: none; + height: auto; + margin-top: 10px; } .aui-button { - height: 36px; - padding-top: 12px; + height: 28px; + font-size: 12px; + padding: 3px 6px 3px 6px; border: none; - background-color: transparent!important; - border-left: solid 1px #e4e4e4; - font-weight: 700; &_close { - color: $defaultFontColor; + font-weight: 400 !important; + color: $buttonBackground; + background: none !important; + + :hover { + text-decoration: underline; + } } &_submit { - color: $linkFontColor; - &:hover { - color: $linkHoverFontColor; - } + font-weight: 700 !important; + color: $defaultColor; + background: $buttonBackground; + border-radius: 3px; } } } \ No newline at end of file diff --git a/css/modals/feedback/_feedback.scss b/css/modals/feedback/_feedback.scss index 50cf92324..7de96adeb 100644 --- a/css/modals/feedback/_feedback.scss +++ b/css/modals/feedback/_feedback.scss @@ -58,6 +58,12 @@ &__content { text-align: center; + + textarea { + text-align: left; + min-height: 80px; + width: 100%; + } } &__footer { @@ -99,11 +105,4 @@ } } - &__details { - text-align: left; - textarea { - min-height: 100px; - width: 100%; - } - } } diff --git a/modules/UI/UI.js b/modules/UI/UI.js index 22802db3d..eae77ddb8 100644 --- a/modules/UI/UI.js +++ b/modules/UI/UI.js @@ -1072,6 +1072,9 @@ UI.updateDTMFSupport = function (isDTMFSupported) { UI.requestFeedback = function () { if (Feedback.isVisible()) return Promise.reject(UIErrors.FEEDBACK_REQUEST_IN_PROGRESS); + // Feedback has been submitted already. + else if (Feedback.isSubmitted()) + return Promise.resolve(); else return new Promise(function (resolve, reject) { if (Feedback.isEnabled()) { diff --git a/modules/UI/feedback/Feedback.js b/modules/UI/feedback/Feedback.js index eb51dd166..8fbc29e85 100644 --- a/modules/UI/feedback/Feedback.js +++ b/modules/UI/feedback/Feedback.js @@ -87,6 +87,16 @@ var Feedback = { return $(".feedback").is(":visible"); }, + /** + * Indicates if the feedback is submitted. + * + * @return {boolean} {true} to indicate if the feedback is submitted, + * {false} - otherwise + */ + isSubmitted: function() { + return Feedback.window.submitted; + }, + /** * Opens the feedback window. */ @@ -96,10 +106,23 @@ var Feedback = { JitsiMeetJS.analytics.sendEvent('feedback.open'); }, + /** + * Returns the feedback score. + * + * @returns {*} + */ getFeedbackScore: function() { - return Feedback.window.feedbackScore; - } + return Feedback.window.feedbackScore; + }, + /** + * Returns the feedback free text. + * + * @returns {null|*|message} + */ + getFeedbackText: function() { + return Feedback.window.feedbackText; + } }; module.exports = Feedback; \ No newline at end of file diff --git a/modules/UI/feedback/FeedbackWindow.js b/modules/UI/feedback/FeedbackWindow.js index 6a2b1882f..79aa87f72 100644 --- a/modules/UI/feedback/FeedbackWindow.js +++ b/modules/UI/feedback/FeedbackWindow.js @@ -18,30 +18,6 @@ let toggleStars = function(starCount) { }); }; -/** - * Constructs the html for the detailed feedback window. - * - * @returns {string} the contructed html string - */ -let constructDetailedFeedbackHtml = function() { - - return ` -
-
-

${APP.translation.translateString("dialog.sorryFeedback")}

-

- -
-
- - `; -}; - /** * Constructs the html for the rated feedback window. * @@ -86,7 +62,14 @@ let createRateFeedbackHTML = function (Feedback) {

 

${ feedbackHelp }

+ + `; }; @@ -106,15 +89,6 @@ let onLoadRateFunction = function (Feedback) { }; el.onclick = function(){ Feedback.feedbackScore = index + 1; - - // If the feedback is less than 3 stars we're going to - // ask the user for more information. - if (Feedback.feedbackScore > 3) { - APP.conference.sendFeedback(Feedback.feedbackScore, ""); - Feedback.hide(); - } else { - Feedback.setState('detailed_feedback'); - } }; }); @@ -122,14 +96,10 @@ let onLoadRateFunction = function (Feedback) { if (Feedback.feedbackScore > 0) { toggleStars(Feedback.feedbackScore - 1); } -}; -/** - * Callback for Detailed Feedback - * - * @param Feedback - */ -let onLoadDetailedFunction = function(Feedback) { + if (Feedback.feedbackText && Feedback.feedbackText.length > 0) + $('#feedbackTextArea').text(Feedback.feedbackText); + let submitBtn = Feedback.$el.find('#dialog-submit-button'); let closeBtn = Feedback.$el.find('#dialog-close-button'); @@ -157,16 +127,14 @@ export default class Dialog { constructor(options) { this.feedbackScore = -1; + this.feedbackText = null; + this.submitted = false; this.onCloseCallback = null; this.states = { rate_feedback: { getHtml: createRateFeedbackHTML, onLoad: onLoadRateFunction - }, - detailed_feedback: { - getHtml: constructDetailedFeedbackHtml, - onLoad: onLoadDetailedFunction } }; this.state = options.state || 'rate_feedback'; @@ -215,11 +183,15 @@ export default class Dialog { let self = this; if (message && message.length > 0) { - APP.conference.sendFeedback( - self.feedbackScore, - message); + self.feedbackText = message; } + + APP.conference.sendFeedback(self.feedbackScore, + self.feedbackText); + + // TO DO: make sendFeedback return true or false. + self.submitted = true; + this.hide(); } - }