row-list-control.js (8202B)
1 (function ($) { 2 var $preview; 3 4 function showPreview($item) { 5 $preview = jQuery('#ope_section_preview'); 6 if (!$preview.length) { 7 jQuery('body').append('<div id="ope_section_preview"></div>'); 8 $preview = jQuery('#ope_section_preview'); 9 } 10 var bounds = $item[0].getBoundingClientRect(); 11 var scrollTop = 0; 12 var scrollLeft = 0; 13 $preview.css({ 14 left: (parseInt(bounds.right) + 10 + scrollLeft) + "px", 15 top: Math.max(10, (parseInt(bounds.top) + scrollTop)) + "px", 16 'background-image': 'url("' + $item.data('preview') + '")' 17 }); 18 $preview.show(); 19 20 if ($preview.offset().top + $preview.height() + 10 > window.innerHeight) { 21 $preview.css({ 22 top: window.innerHeight - ($preview.height() + 10) 23 }) 24 } 25 } 26 27 function hidePreview() { 28 $preview = jQuery('#ope_section_preview'); 29 $preview.hide(); 30 } 31 32 function selectItem(id, $list, selectionType) { 33 var $currentItem = $list.find('li[data-id="' + id + '"]'); 34 var response = false 35 switch (selectionType) { 36 case 'toggle': 37 $currentItem.toggleClass('already-in-page'); 38 response = $currentItem.hasClass('already-in-page'); 39 break; 40 41 case 'check': 42 $currentItem.addClass('already-in-page'); 43 response = true; 44 break; 45 46 case 'multiple': 47 response = true; 48 break; 49 50 default: // radio 51 $currentItem.addClass('already-in-page'); 52 $currentItem.siblings().removeClass('already-in-page'); 53 response = true; 54 break; 55 } 56 57 return response; 58 59 } 60 61 wp.customize.controlConstructor["mod_changer"] = wp.customize.Control.extend({ 62 ready: function () { 63 64 'use strict'; 65 var control = this; 66 67 this.container.on('mouseover.mod_changer', '[data-apply="mod_changer"] .item-preview', function (event) { 68 event.preventDefault(); 69 showPreview($(this)); 70 }); 71 72 this.container.on('mouseout.mod_changer', '[data-apply="mod_changer"] .item-preview', function (event) { 73 event.preventDefault(); 74 hidePreview($(this)); 75 }); 76 77 this.container.on('click.mod_changer', '[data-apply="mod_changer"] .available-item-hover-button', function (event) { 78 event.preventDefault(); 79 event.stopPropagation(); 80 var setting = $(this).data('setting-link'), 81 itemId = $(this).data('id'), 82 $list = $(this).closest('[data-type="row-list-control"]'), 83 selectionType = $list.attr('data-selection') || "radio"; 84 85 86 if ($list.is('[data-apply="mod_changer"]')) { 87 88 var selected = selectItem(itemId, $list, selectionType); 89 90 if (selectionType === "radio") { 91 wp.customize(setting).set(itemId); 92 } else { 93 $list.trigger('cp.item.click', [itemId, selected]); 94 } 95 } 96 }); 97 } 98 }); 99 100 wp.customize.controlConstructor["presets_changer"] = wp.customize.Control.extend({ 101 102 ready: function () { 103 104 'use strict'; 105 var control = this; 106 107 108 this.container.on('mouseover.presets_changer', '[data-apply="presets_changer"] .item-preview', function (event) { 109 event.preventDefault(); 110 showPreview($(this)); 111 }); 112 113 this.container.on('mouseout.presets_changer', '[data-apply="presets_changer"] .item-preview', function (event) { 114 event.preventDefault(); 115 hidePreview($(this)); 116 }); 117 118 this.container.on('click.presets_changer', '[data-apply="presets_changer"] .available-item-hover-button', function (event) { 119 event.preventDefault(); 120 event.stopPropagation(); 121 122 if ($(this).is('[data-pro-only="true"]')) { 123 var image = $(this).closest('li').find('[data-preview]').attr('data-preview'); 124 var imageHTML = image ? '<img class="pro-popup-preview-image" src="' + image + '">' : ''; 125 126 CP_Customizer.popUpInfo( window.CP_Customizer.translateCompanionString('This item requires PRO theme'), 127 '<div class="pro-popup-preview-container">' + 128 ' ' + imageHTML + 129 ' <h3>' + window.CP_Customizer.translateCompanionString("This item is available only in the PRO version") + '</h3>' + 130 ' <p>' + window.CP_Customizer.translateCompanionString("Please upgrade to the PRO version to use this item and many others.") + '</p>' + 131 ' <br/>' + 132 ' <a href="https://extendthemes.com/go/materialis-upgrade" class="button button-orange" target="_blank">' + 133 '' + window.CP_Customizer.translateCompanionString("Upgrade to PRO") + '</a> ' + 134 '</div>' 135 ); 136 137 return; 138 } 139 140 var setting = $(this).data('setting-link'), 141 itemId = $(this).data('id'), 142 $list = $(this).closest('[data-type="row-list-control"]'), 143 selectionType = $list.attr('data-selection') || "radio"; 144 145 var varName = $(this).closest('li').data('varname'); 146 var presetsValues = window[varName][itemId]; 147 148 if (window.CP_Customizer) { 149 CP_Customizer.showLoader(); 150 CP_Customizer.setMultipleMods(presetsValues, 'postMessage', function () { 151 CP_Customizer.preview.refresh(); 152 }); 153 return; 154 } 155 156 _.each(presetsValues, function (value, name) { 157 var control = wp.customize.settings.controls[name]; 158 if (control) { 159 var type = control.type; 160 161 if (type == "radio-html") { 162 jQuery(wp.customize.control(name).container.find('input[value="' + value + '"]')).prop('checked', true); 163 wp.customize.instance(name).set(value); 164 } else { 165 if (type == "kirki-spacing") { 166 for (var prop in value) { 167 if (value.hasOwnProperty(prop)) { 168 jQuery(wp.customize.control(name).container.find('.' + prop + ' input')).prop('value', value[prop]); 169 } 170 } 171 wp.customize.instance(name).set(value); 172 } else { 173 if (type && type.match('kirki')) { 174 kirkiSetSettingValue(name, value); 175 } else { 176 wp.customize.instance(name).set(value); 177 } 178 } 179 } 180 } else { 181 if (!wp.customize.settings(name)) { 182 183 wp.customize.create(name, name, {}, { 184 type: 'theme_mod', 185 transport: 'postMessage', 186 previewer: wp.customize.previewer 187 }); 188 189 wp.customize.instance(name).set(value); 190 } 191 } 192 }); 193 }); 194 } 195 }); 196 })(jQuery);