form.php
362 lines
| 1 | <?php |
| 2 | /** |
| 3 | * @package Freemius |
| 4 | * @copyright Copyright (c) 2015, Freemius, Inc. |
| 5 | * @license http://opensource.org/licenses/gpl-2.0.php GNU Public License |
| 6 | * @since 1.1.2 |
| 7 | */ |
| 8 | |
| 9 | if ( ! defined( 'ABSPATH' ) ) { |
| 10 | exit; |
| 11 | } |
| 12 | |
| 13 | /** |
| 14 | * @var array $VARS |
| 15 | */ |
| 16 | $slug = $VARS['slug']; |
| 17 | $fs = freemius( $slug ); |
| 18 | |
| 19 | $confirmation_message = $fs->apply_filters( 'uninstall_confirmation_message', '' ); |
| 20 | |
| 21 | $reasons = $VARS['reasons']; |
| 22 | |
| 23 | $reasons_list_items_html = ''; |
| 24 | |
| 25 | foreach ( $reasons as $reason ) { |
| 26 | $list_item_classes = 'reason' . ( ! empty( $reason['input_type'] ) ? ' has-input' : '' ); |
| 27 | |
| 28 | if ( isset( $reason['internal_message'] ) && ! empty( $reason['internal_message'] ) ) { |
| 29 | $list_item_classes .= ' has-internal-message'; |
| 30 | $reason_internal_message = $reason['internal_message']; |
| 31 | } else { |
| 32 | $reason_internal_message = ''; |
| 33 | } |
| 34 | |
| 35 | $reason_list_item_html = <<< HTML |
| 36 | <li class="{$list_item_classes}" |
| 37 | data-input-type="{$reason['input_type']}" |
| 38 | data-input-placeholder="{$reason['input_placeholder']}"> |
| 39 | <label> |
| 40 | <span> |
| 41 | <input type="radio" name="selected-reason" value="{$reason['id']}"/> |
| 42 | </span> |
| 43 | <span>{$reason['text']}</span> |
| 44 | </label> |
| 45 | <div class="internal-message">{$reason_internal_message}</div> |
| 46 | </li> |
| 47 | HTML; |
| 48 | |
| 49 | $reasons_list_items_html .= $reason_list_item_html; |
| 50 | } |
| 51 | |
| 52 | $is_anonymous = ( ! $fs->is_registered() ); |
| 53 | if ( $is_anonymous ) { |
| 54 | $anonymous_feedback_checkbox_html = |
| 55 | '<label class="anonymous-feedback-label"><input type="checkbox" class="anonymous-feedback-checkbox"> ' |
| 56 | . __fs( 'anonymous-feedback', $slug ) |
| 57 | . '</label>'; |
| 58 | } else { |
| 59 | $anonymous_feedback_checkbox_html = ''; |
| 60 | } |
| 61 | |
| 62 | fs_enqueue_local_style( 'dialog-boxes', '/admin/dialog-boxes.css' ); |
| 63 | ?> |
| 64 | <script type="text/javascript"> |
| 65 | (function ($) { |
| 66 | var reasonsHtml = <?php echo json_encode( $reasons_list_items_html ); ?>, |
| 67 | modalHtml = |
| 68 | '<div class="fs-modal fs-modal-deactivation-feedback<?php echo empty( $confirmation_message ) ? ' no-confirmation-message' : ''; ?>">' |
| 69 | + ' <div class="fs-modal-dialog">' |
| 70 | + ' <div class="fs-modal-header">' |
| 71 | + ' <h4><?php _efs('quick-feedback' , $slug) ?></h4>' |
| 72 | + ' </div>' |
| 73 | + ' <div class="fs-modal-body">' |
| 74 | + ' <div class="fs-modal-panel" data-panel-id="confirm"><p><?php echo $confirmation_message; ?></p></div>' |
| 75 | + ' <div class="fs-modal-panel active" data-panel-id="reasons"><h3><strong><?php printf( __fs( 'deactivation-share-reason' , $slug ) ); ?>:</strong></h3><ul id="reasons-list">' + reasonsHtml + '</ul></div>' |
| 76 | + ' </div>' |
| 77 | + ' <div class="fs-modal-footer">' |
| 78 | + ' <?php echo $anonymous_feedback_checkbox_html ?>' |
| 79 | + ' <a href="#" class="button button-secondary button-deactivate"></a>' |
| 80 | + ' <a href="#" class="button button-primary button-close"><?php _efs( 'cancel' , $slug ) ?></a>' |
| 81 | + ' </div>' |
| 82 | + ' </div>' |
| 83 | + '</div>', |
| 84 | $modal = $(modalHtml), |
| 85 | $deactivateLink = $('#the-list .deactivate > [data-slug=<?php echo $VARS['slug']; ?>].fs-slug').prev(), |
| 86 | $anonymousFeedback = $modal.find( '.anonymous-feedback-label' ), |
| 87 | isAnonymous = <?php echo ( $is_anonymous ? 'true' : 'false' ); ?>, |
| 88 | selectedReasonID = false, |
| 89 | otherReasonID = <?php echo Freemius::REASON_OTHER; ?>, |
| 90 | dontShareDataReasonID = <?php echo Freemius::REASON_DONT_LIKE_TO_SHARE_MY_INFORMATION; ?>; |
| 91 | |
| 92 | $modal.appendTo($('body')); |
| 93 | |
| 94 | registerEventHandlers(); |
| 95 | |
| 96 | function registerEventHandlers() { |
| 97 | $deactivateLink.click(function (evt) { |
| 98 | evt.preventDefault(); |
| 99 | |
| 100 | showModal(); |
| 101 | }); |
| 102 | |
| 103 | $modal.on('input propertychange', '.reason-input input', function () { |
| 104 | if (!isOtherReasonSelected()) { |
| 105 | return; |
| 106 | } |
| 107 | |
| 108 | var reason = $(this).val().trim(); |
| 109 | |
| 110 | /** |
| 111 | * If reason is not empty, remove the error-message class of the message container |
| 112 | * to change the message color back to default. |
| 113 | */ |
| 114 | if (reason.length > 0) { |
| 115 | $('.message').removeClass('error-message'); |
| 116 | enableDeactivateButton(); |
| 117 | } |
| 118 | }); |
| 119 | |
| 120 | $modal.on('blur', '.reason-input input', function () { |
| 121 | var $userReason = $(this); |
| 122 | |
| 123 | setTimeout(function () { |
| 124 | if (!isOtherReasonSelected()) { |
| 125 | return; |
| 126 | } |
| 127 | |
| 128 | /** |
| 129 | * If reason is empty, add the error-message class to the message container |
| 130 | * to change the message color to red. |
| 131 | */ |
| 132 | if (0 === $userReason.val().trim().length) { |
| 133 | $('.message').addClass('error-message'); |
| 134 | disableDeactivateButton(); |
| 135 | } |
| 136 | }, 150); |
| 137 | }); |
| 138 | |
| 139 | $modal.on('click', '.fs-modal-footer .button', function (evt) { |
| 140 | evt.preventDefault(); |
| 141 | |
| 142 | if ($(this).hasClass('disabled')) { |
| 143 | return; |
| 144 | } |
| 145 | |
| 146 | var _parent = $(this).parents('.fs-modal:first'); |
| 147 | var _this = $(this); |
| 148 | |
| 149 | if (_this.hasClass('allow-deactivate')) { |
| 150 | var $radio = $('input[type="radio"]:checked'); |
| 151 | |
| 152 | if (0 === $radio.length) { |
| 153 | // If no selected reason, just deactivate the plugin. |
| 154 | window.location.href = $deactivateLink.attr('href'); |
| 155 | return; |
| 156 | } |
| 157 | |
| 158 | var $selected_reason = $radio.parents('li:first'), |
| 159 | $input = $selected_reason.find('textarea, input[type="text"]'), |
| 160 | userReason = ( 0 !== $input.length ) ? $input.val().trim() : ''; |
| 161 | |
| 162 | if (isOtherReasonSelected() && ( '' === userReason )) { |
| 163 | return; |
| 164 | } |
| 165 | |
| 166 | $.ajax({ |
| 167 | url : ajaxurl, |
| 168 | method : 'POST', |
| 169 | data : { |
| 170 | 'action' : '<?php echo $fs->get_action_tag( 'submit_uninstall_reason' ) ?>', |
| 171 | 'slug' : '<?php echo $slug ?>', |
| 172 | 'reason_id' : $radio.val(), |
| 173 | 'reason_info' : userReason, |
| 174 | 'is_anonymous': isAnonymousFeedback() |
| 175 | }, |
| 176 | beforeSend: function () { |
| 177 | _parent.find('.fs-modal-footer .button').addClass('disabled'); |
| 178 | _parent.find('.fs-modal-footer .button-secondary').text('Processing...'); |
| 179 | }, |
| 180 | complete : function () { |
| 181 | // Do not show the dialog box, deactivate the plugin. |
| 182 | window.location.href = $deactivateLink.attr('href'); |
| 183 | } |
| 184 | }); |
| 185 | } else if (_this.hasClass('button-deactivate')) { |
| 186 | // Change the Deactivate button's text and show the reasons panel. |
| 187 | _parent.find('.button-deactivate').addClass('allow-deactivate'); |
| 188 | |
| 189 | showPanel('reasons'); |
| 190 | } |
| 191 | }); |
| 192 | |
| 193 | $modal.on('click', 'input[type="radio"]', function () { |
| 194 | var $selectedReasonOption = $(this); |
| 195 | |
| 196 | // If the selection has not changed, do not proceed. |
| 197 | if (selectedReasonID === $selectedReasonOption.val()) |
| 198 | return; |
| 199 | |
| 200 | selectedReasonID = $selectedReasonOption.val(); |
| 201 | |
| 202 | if ( isAnonymous ) { |
| 203 | if ( isReasonSelected( dontShareDataReasonID ) ) { |
| 204 | $anonymousFeedback.hide(); |
| 205 | } else { |
| 206 | $anonymousFeedback.show(); |
| 207 | } |
| 208 | } |
| 209 | |
| 210 | var _parent = $(this).parents('li:first'); |
| 211 | |
| 212 | $modal.find('.reason-input').remove(); |
| 213 | $modal.find( '.internal-message' ).hide(); |
| 214 | $modal.find('.button-deactivate').text('<?php printf( __fs( 'deactivation-modal-button-submit' , $slug ) ); ?>'); |
| 215 | |
| 216 | enableDeactivateButton(); |
| 217 | |
| 218 | if ( _parent.hasClass( 'has-internal-message' ) ) { |
| 219 | _parent.find( '.internal-message' ).show(); |
| 220 | } |
| 221 | |
| 222 | if (_parent.hasClass('has-input')) { |
| 223 | var inputType = _parent.data('input-type'), |
| 224 | inputPlaceholder = _parent.data('input-placeholder'), |
| 225 | reasonInputHtml = '<div class="reason-input"><span class="message"></span>' + ( ( 'textfield' === inputType ) ? '<input type="text" />' : '<textarea rows="5"></textarea>' ) + '</div>'; |
| 226 | |
| 227 | _parent.append($(reasonInputHtml)); |
| 228 | _parent.find('input, textarea').attr('placeholder', inputPlaceholder).focus(); |
| 229 | |
| 230 | if (isOtherReasonSelected()) { |
| 231 | showMessage('<?php printf( __fs( 'ask-for-reason-message' , $slug ) ); ?>'); |
| 232 | disableDeactivateButton(); |
| 233 | } |
| 234 | } |
| 235 | }); |
| 236 | |
| 237 | // If the user has clicked outside the window, cancel it. |
| 238 | $modal.on('click', function (evt) { |
| 239 | var $target = $(evt.target); |
| 240 | |
| 241 | // If the user has clicked anywhere in the modal dialog, just return. |
| 242 | if ($target.hasClass('fs-modal-body') || $target.hasClass('fs-modal-footer')) { |
| 243 | return; |
| 244 | } |
| 245 | |
| 246 | // If the user has not clicked the close button and the clicked element is inside the modal dialog, just return. |
| 247 | if (!$target.hasClass('button-close') && ( $target.parents('.fs-modal-body').length > 0 || $target.parents('.fs-modal-footer').length > 0 )) { |
| 248 | return; |
| 249 | } |
| 250 | |
| 251 | closeModal(); |
| 252 | return false; |
| 253 | }); |
| 254 | } |
| 255 | |
| 256 | function isAnonymousFeedback() { |
| 257 | if ( ! isAnonymous ) { |
| 258 | return false; |
| 259 | } |
| 260 | |
| 261 | return ( isReasonSelected( dontShareDataReasonID ) || $anonymousFeedback.find( 'input' ).prop( 'checked' ) ); |
| 262 | } |
| 263 | |
| 264 | function isReasonSelected( reasonID ) { |
| 265 | // Get the selected radio input element. |
| 266 | var $selectedReasonOption = $modal.find('input[type="radio"]:checked'); |
| 267 | |
| 268 | return ( reasonID == $selectedReasonOption.val() ); |
| 269 | } |
| 270 | |
| 271 | function isOtherReasonSelected() { |
| 272 | return isReasonSelected( otherReasonID ); |
| 273 | } |
| 274 | |
| 275 | function showModal() { |
| 276 | resetModal(); |
| 277 | |
| 278 | // Display the dialog box. |
| 279 | $modal.addClass('active'); |
| 280 | |
| 281 | $('body').addClass('has-fs-modal'); |
| 282 | } |
| 283 | |
| 284 | function closeModal() { |
| 285 | $modal.removeClass('active'); |
| 286 | |
| 287 | $('body').removeClass('has-fs-modal'); |
| 288 | } |
| 289 | |
| 290 | function resetModal() { |
| 291 | selectedReasonID = false; |
| 292 | |
| 293 | enableDeactivateButton(); |
| 294 | |
| 295 | // Uncheck all radio buttons. |
| 296 | $modal.find('input[type="radio"]').prop('checked', false); |
| 297 | |
| 298 | // Remove all input fields ( textfield, textarea ). |
| 299 | $modal.find('.reason-input').remove(); |
| 300 | |
| 301 | $modal.find('.message').hide(); |
| 302 | |
| 303 | if ( isAnonymous ) { |
| 304 | $anonymousFeedback.find( 'input' ).prop( 'checked', false ); |
| 305 | |
| 306 | // Hide, since by default there is no selected reason. |
| 307 | $anonymousFeedback.hide(); |
| 308 | } |
| 309 | |
| 310 | var $deactivateButton = $modal.find('.button-deactivate'); |
| 311 | |
| 312 | /* |
| 313 | * If the modal dialog has no confirmation message, that is, it has only one panel, then ensure |
| 314 | * that clicking the deactivate button will actually deactivate the plugin. |
| 315 | */ |
| 316 | if ($modal.hasClass('no-confirmation-message')) { |
| 317 | $deactivateButton.addClass('allow-deactivate'); |
| 318 | |
| 319 | showPanel('reasons'); |
| 320 | } else { |
| 321 | $deactivateButton.removeClass('allow-deactivate'); |
| 322 | |
| 323 | showPanel('confirm'); |
| 324 | } |
| 325 | } |
| 326 | |
| 327 | function showMessage(message) { |
| 328 | $modal.find('.message').text(message).show(); |
| 329 | } |
| 330 | |
| 331 | function enableDeactivateButton() { |
| 332 | $modal.find('.button-deactivate').removeClass('disabled'); |
| 333 | } |
| 334 | |
| 335 | function disableDeactivateButton() { |
| 336 | $modal.find('.button-deactivate').addClass('disabled'); |
| 337 | } |
| 338 | |
| 339 | function showPanel(panelType) { |
| 340 | $modal.find('.fs-modal-panel').removeClass('active '); |
| 341 | $modal.find('[data-panel-id="' + panelType + '"]').addClass('active'); |
| 342 | |
| 343 | updateButtonLabels(); |
| 344 | } |
| 345 | |
| 346 | function updateButtonLabels() { |
| 347 | var $deactivateButton = $modal.find('.button-deactivate'); |
| 348 | |
| 349 | // Reset the deactivate button's text. |
| 350 | if ('confirm' === getCurrentPanel()) { |
| 351 | $deactivateButton.text('<?php printf( __fs( 'deactivation-modal-button-confirm' , $slug ) ); ?>'); |
| 352 | } else { |
| 353 | $deactivateButton.text('<?php printf( __fs( 'skip-deactivate' , $slug ) ); ?>'); |
| 354 | } |
| 355 | } |
| 356 | |
| 357 | function getCurrentPanel() { |
| 358 | return $modal.find('.fs-modal-panel.active').attr('data-panel-id'); |
| 359 | } |
| 360 | })(jQuery); |
| 361 | </script> |
| 362 |