admin.js
1 week ago
admin.min.js
1 week ago
beacon-clicked.js
1 week ago
beacon-clicked.min.js
1 week ago
contextual-info.js
1 week ago
contextual-info.min.js
1 week ago
dashboard.js
1 week ago
duplicate-methods.js
1 week ago
duplicate-methods.min.js
1 week ago
new-rules-table-popup.js
1 week ago
onboarding.js
1 week ago
rules-settings.js
1 week ago
shipping-method-block-checkout.js
1 week ago
shipping-method-block-checkout.min.js
1 week ago
contextual-info.js
96 lines
| 1 | /** |
| 2 | * Displays contextual info after input element. |
| 3 | * |
| 4 | * @package Contextual Info |
| 5 | */ |
| 6 | |
| 7 | ( function( $ ) { |
| 8 | |
| 9 | /** |
| 10 | * Contextual info jQuery plugin |
| 11 | * |
| 12 | * @param settings |
| 13 | * @returns {*} |
| 14 | */ |
| 15 | $.fn.contextualInfo = function( settings ) { |
| 16 | let config = $.extend( |
| 17 | { |
| 18 | 'id': '', |
| 19 | 'phrases_in': [], |
| 20 | 'info_html': '', |
| 21 | 'phrases_not_in': [], |
| 22 | 'is_limited_width': false, |
| 23 | }, |
| 24 | settings |
| 25 | ); |
| 26 | |
| 27 | return this.each( |
| 28 | function() { |
| 29 | let $element = $( this ); |
| 30 | createInfoHTMLElement( $element ); |
| 31 | toggleInfoElement( $element ); |
| 32 | $element.keyup( |
| 33 | function() { |
| 34 | toggleInfoElement( $element ); |
| 35 | } |
| 36 | ); |
| 37 | } |
| 38 | ); |
| 39 | |
| 40 | /** |
| 41 | * . |
| 42 | * |
| 43 | * @param $element |
| 44 | * @returns {string} |
| 45 | */ |
| 46 | function prepareInfoElementId( $element ) { |
| 47 | return $element.attr( 'id' ) + "_" + config.id; |
| 48 | } |
| 49 | |
| 50 | /** |
| 51 | * Create HTML info element. |
| 52 | * |
| 53 | * @param $element |
| 54 | */ |
| 55 | function createInfoHTMLElement( $element ) { |
| 56 | $( $element ).after( |
| 57 | function() { |
| 58 | let classes = ['description']; |
| 59 | |
| 60 | if ( config.is_limited_width ) { |
| 61 | classes.push( 'limited-width' ) |
| 62 | } |
| 63 | |
| 64 | return '<p class="' + classes.join( ' ' ) + '" id="' + prepareInfoElementId( $element ) + '" style="display: none;">' + config.info_html + "</p>"; |
| 65 | } |
| 66 | ); |
| 67 | } |
| 68 | |
| 69 | /** |
| 70 | * Toggle info element: show when element contains one or more phrases. |
| 71 | * |
| 72 | * @param $element |
| 73 | */ |
| 74 | function toggleInfoElement($element) { |
| 75 | let element_value = $element.val().toLowerCase(); |
| 76 | let show_info = false; |
| 77 | if ( config.phrases_in.length === 0 ) { |
| 78 | show_info = true; |
| 79 | } |
| 80 | $( config.phrases_in ).each( |
| 81 | function( index, value ) { |
| 82 | let phrase_value = value.toLowerCase(); |
| 83 | show_info = show_info || element_value.indexOf( phrase_value ) !== -1; |
| 84 | } |
| 85 | ); |
| 86 | $( config.phrases_not_in ).each( |
| 87 | function( index, value ) { |
| 88 | let phrase_value = value.toLowerCase(); |
| 89 | show_info = show_info && element_value.indexOf( phrase_value ) === -1; |
| 90 | } |
| 91 | ); |
| 92 | $( '#' + $element.attr( 'id' ) + "_" + config.id ).toggle( show_info ); |
| 93 | } |
| 94 | } |
| 95 | })( jQuery ); |
| 96 |