文件操作 - controls.js

文件: /storage/v12552/jimbrandstatter/public_html/wp-content/themes/Total/assets/js/customize/controls.js

编辑文件内容

/*jshint esversion: 6 */
( function( $, l10n ) {

'use strict';

if ( ! wp || ! wp.customize ) {
		console.log( 'wp or wp.customize objects not found.' );
		return;
	}

/**
	 * Custom Selects.
	 */
	const controls = [
		'totaltheme_card_select',
		'totaltheme_font_family',
		'wpex-dropdown-pages',
	];

_.each( controls, function( control ) {
		wp.customize.controlConstructor[control] = wp.customize.Control.extend( {
			ready: function() {
				addChosenSelect( this.container );
			}
		} );
	} );

/**
	 * Template Select.
	 */
	 wp.customize.controlConstructor.totaltheme_template_select = wp.customize.Control.extend( {
		ready: function() {
			const control = this;
			const container = control.container;
			const select = container.find( 'select' );
			const wrap = container.find( '.totaltheme-customize-create-template' );
			const form = wrap.find( '.totaltheme-customize-create-template__form' );
			const nameField = wrap.find( '.totaltheme-customize-create-template__name' );
			const addBtn = wrap.find( '.totaltheme-customize-create-template__add-item' );
			const saveBtn = wrap.find( '.totaltheme-customize-create-template__save' );
			const spinner = wrap.find( '.totaltheme-customize-create-template__spinner' );
			const cancelBtn = wrap.find( '.totaltheme-customize-create-template__cancel' );
			const templateType = form.data( 'wpex-template-type' );

addChosenSelect( container );

const removeForm = () => {
				form.parent().remove();
				// Mabe we should also remove events...
			};

select.on( 'change', event => {
				if ( select.val() ) {
					wrap.css( 'display', 'none' );
				} else {
					wrap.css( 'display', '' );
				}
			} );

addBtn.on( 'click', event => {
				event.preventDefault();
				addBtn.css( 'display', 'none' );
				form.addClass( 'totaltheme-customize-create-template__form--visible' );
			} );

nameField.on( 'input', event => {
				nameField.removeClass( 'totaltheme-customize-create-template__name--invalid' );
			} );

cancelBtn.on( 'click', event => {
				event.preventDefault();
				addBtn.css( 'display', '' );
				form.removeClass( 'totaltheme-customize-create-template__form--visible' );
			} );

saveBtn.on( 'click', event => {
				event.preventDefault();
				const templateName = nameField.val();
				if ( ! templateName ) {
					nameField.addClass( 'totaltheme-customize-create-template__name--invalid' );
					nameField.focus();
				} else {
					const xhr = new XMLHttpRequest();
					const data = ''
						+ 'action=totaltheme_customize_create_template'
						+ '&nonce=' + totaltheme_customize_controls_vars.nonce
						+ '&post_title=' + templateName
						+ '&type=' + templateType;
					const errorNotice = 'Something wen\'t wrong, please try again or create your template via the WP dashboard.';

xhr.onload = function() {
						spinner.removeClass( 'totaltheme-customize-create-template__spinner--visible' );
						cancelBtn.css( 'display', '' );
						if ( 4 == xhr.readyState && 200 == xhr.status ) {
							let result = this.responseText;
							if ( ! result ) {
								alert( errorNotice );
								return;
							}
							result = JSON.parse( this.responseText );
							if ( result.success && result.template_id ) {
								removeForm();
								form.removeClass( 'totaltheme-customize-create-template__form--visible' );
								container.find( 'select' ).append( $( `<option selected="selected" value="${result.template_id}">${templateName}</option>` ) );
								control.setting.set(result.template_id);
							}
						} else {
							alert( errorNotice );
							console.log( this.responseText );
						}
					};
					xhr.open( 'POST', window.ajaxurl, true );
					xhr.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8' );
					xhr.send( data );

spinner.addClass( 'totaltheme-customize-create-template__spinner--visible' );
					cancelBtn.css( 'display', 'none' );
				}

} );
		},

} );

/**
	 * Multi-Select.
	 */
	wp.customize.controlConstructor.totaltheme_multi_select = wp.customize.Control.extend( {
		ready: function() {
			const control = this;
			control.container.on( 'change', '.totaltheme-customize-multi-select__input', function( event ) {
				event.preventDefault();
				let newVal = '';
				control.container.find( '.totaltheme-customize-multi-select__input' ).each( function() {
					if ( $( this ).is( ':checked' ) ) {
						newVal += $( this ).attr( 'value' ) + ',';
					}
				} );
				control.setting.set( newVal.replace(/,+$/, "") );
			} );
		}
	} );

/**
	 * Social profiles.
	 */
	wp.customize.controlConstructor.wpex_social_profiles = wp.customize.Control.extend( {
		ready: function() {
			var control = this;
			var container = control.container;
			var sortableUl = container.find( '.totaltheme-customize-social-profiles__list' );

sortableUl.sortable();

sortableUl.on( 'sortstop', function( event, ui ) {
				control.updateValue();
			} );

$( document ).on( 'input', '.totaltheme-customize-social-profiles__item input[type="text"]', function() {
				control.updateValue();
			} );

container.on( 'click', '.totaltheme-customize-social-profiles__delete-item', function( event ) {
				var result = confirm(l10n.deleteConfirm);
				if (result) {
					$(this).parents( '.totaltheme-customize-social-profiles__item' ).remove();
					control.updateValue();
				}
				event.preventDefault();
			} );

container.find( '.totaltheme-customize-social-profiles__add-item' ).click( function( event ) {
				event.preventDefault();
				var select = container.find( '.totaltheme-customize-social-profiles__select' );
				var selectedSite = select.find( ':selected' );
				if ( selectedSite ) {
					var selectedSiteVal = selectedSite.val();
					if ( container.find( 'input[data-wpex-key="' + selectedSiteVal + '"]' ).length ) {
						alert(l10n.duplicate);
						return;
					}
					var clone = container.find( '.totaltheme-customize-social-profiles__template' ).clone();
					clone.removeClass( 'totaltheme-customize-social-profiles__template' );
					clone.addClass( 'totaltheme-customize-social-profiles__item' );
					clone.find( 'label span' ).text( selectedSite.text() );
					clone.find( 'input' ).val( '#' ).attr( 'data-wpex-key', selectedSiteVal );
					clone.appendTo( container.find( '.totaltheme-customize-social-profiles__list' ) );
					control.updateValue();
					container.find( '.totaltheme-customize-social-profiles__list' ).sortable( 'refresh' );
				}
			} );
		},
		updateValue: function() {
			var control = this;
			var newValue = {};
			var valCount = 0;
			control.container.find( '.totaltheme-customize-social-profiles__item input[type="text"]' ).each( function( index, el ) {
				var $this = $( this );
				var val = $this.val();
				if ( val ) {
					valCount++;
					newValue[$this.attr( 'data-wpex-key' )] = val;
				}
			} );
			if ( valCount == 0 ) {
				control.setting.set( '' );
			} else {
				control.setting.set( JSON.stringify( newValue ) );
			}
		}
	} );

/**
	 * Textarea.
	 */
	wp.customize.controlConstructor.wpex_textarea = wp.customize.Control.extend( {
		ready: function() {
			var container = this.container;
			var decode = function( text ) {
				var map = {
					'&amp;': '&',
					'&#038;': "&",
					'&lt;': '<',
					'&gt;': '>',
					'&quot;': '"',
					'&#039;': "'",
					'&#8217;': "’",
					'&#8216;': "‘",
					'&#8211;': "–",
					'&#8212;': "—",
					'&#8230;': "…",
					'&#8221;': '”'
				};
				return text.replace(/\&[\w\d\#]{2,5}\;/g, function(m) { return map[m]; });
			};
			container.find( '.totaltheme-customize-textarea-toolbar button' ).on( 'click', function( event ) {
				var data = $( this ).data( 'wpex-insert' );
				if ( data ) {
					var textBox = container.find( '.totaltheme-customize-textarea' );
					var textBoxVal = textBox.val();
					if ( textBoxVal ) {
						textBox.val( textBoxVal + '\n' + decode( data ) );
					} else {
						textBox.val( decode( data ) );
					}
					textBox.trigger( 'change' );
				}
				event.preventDefault();
			} );
		}
	} );

/**
	 * Icon Selects.
	 */
	wp.customize.controlConstructor.wpex_ticon_select = wp.customize.Control.extend( {
		ready: function() {
			const control = this;
			const $selectButton = control.container.find( '.totaltheme-customize-icon-select__button' );
			const $modal = control.container.find( '.totaltheme-customize-icon-select-modal' );
			const $preview = control.container.find( '.totaltheme-customize-icon-select__preview' );
			const $searchform = control.container.find( '.totaltheme-customize-icon-select-modal__search' );
			const $svg = $preview.find( '.totaltheme-customize-icon-select__svg' );

const openModal = () => {
				$modal.addClass( 'totaltheme-customize-icon-select-modal--open' );
				$searchform.val('').focus();
			};

const closeModal = () => {
				$modal.removeClass( 'totaltheme-customize-icon-select-modal--open' );
				$modal.find( '.totaltheme-customize-icon-select-modal__choices a' ).each( function() {
					$( this ).css('display', '');
				} );
				$selectButton.focus();
			};

const onButtonClick = ( event ) => {
				openModal();
				event.preventDefault();
			};

const onCloseClick = ( event ) => {
				closeModal();
				event.preventDefault();
			};

const onModalClick = ( event ) => {
				if ( ! event.target.closest( '.totaltheme-customize-icon-select-modal__frame' ) ) {
					closeModal();
				}
			};

const onRemove = ( event ) => {
				$preview.addClass( 'totaltheme-customize-icon-select__preview--empty' );
				$svg.html( '' );
				$selectButton.focus();
				control.setting.set( '' );
			};

const onSearch = () => {
				const value = $searchform.val().toLowerCase();
				const $icons = $modal.find( '.totaltheme-customize-icon-select-modal__choices a' );
				$icons.filter( function() {
					$( this ).toggle( $( this ).attr( 'data-value' ).toLowerCase().indexOf( value ) > -1 );
				} );
			};

const onKeydown = ( event ) => {
				if ( event.key == "Escape" ) {
					event.preventDefault();
					event.stopPropagation();
					closeModal();
				}
			};

control.container.on( 'click', '.totaltheme-customize-icon-select__remove', onRemove );
			$selectButton.on( 'click', onButtonClick );

$modal.click( onModalClick );
			$modal.on( 'click', '.totaltheme-customize-icon-select-modal__choices a', onIconClick );
			$modal.on( 'click', '.totaltheme-customize-icon-select-modal__close', onCloseClick );
			$modal.on( 'keydown', onKeydown );
			$searchform.on( 'input', onSearch );
		}
	} );

/**
	 * Icon Selects.
	 */
	wp.customize.controlConstructor.totaltheme_toggle = wp.customize.Control.extend( {
		ready: function() {
			this.container.find( 'input[type="checkbox"]' ).change( function() {
				$( this ).closest( '.totaltheme-customize-toggle-control' ).toggleClass( 'totaltheme-customize-toggle-control--checked', this.checked);
			} );
		}
	} );

/**
	 * Custom Columns.
	 */
	wp.customize.controlConstructor['wpex-columns'] = wp.customize.Control.extend( {
		ready: function() {
			var control = this;
			control.container.find( '.totaltheme-customize-columns__select' ).change( function( e ) {
				control.updateValue();
			} );
			control.container.find( '.totaltheme-customize-columns__toggle' ).on( 'click', function() {
				control.container.find( '.totaltheme-customize-columns__extra' ).toggleClass( 'totaltheme-customize-columns__hidden' );
				if ( 'false' === $( this ).attr( 'aria-expanded' ) ) {
					$( this ).attr( 'aria-expanded', 'true' );
					control.container.find( '.totaltheme-customize-columns__extra:first select' ).focus();
				} else {
					$( this ).attr( 'aria-expanded', 'false' );
				}
				return false;
			} );
		},
		updateValue: function() {
			var control = this;
			var newValue = {};
			var valCount = 0;
			control.container.find( '.totaltheme-customize-columns__select' ).each( function( index, el ) {
				var $this = $( this );
				var val = $this.children( 'option:selected' ).val();
				if ( val ) {
					valCount++;
					newValue[ $this.attr( 'data-name' ) ] = val;
				}
			} );
			if ( 0 === valCount ) {
				newValue = '';
			} else if ( 1 === valCount ) {
				newValue = newValue['d'];
			}
			control.setting.set( newValue );
		}
	} );

/**
	 * Top/Right/Bottom/Left.
	 */
	wp.customize.controlConstructor.totaltheme_trbl = wp.customize.Control.extend( {
		ready: function() {
			const control = this;
			const controlEl = control.container.find( '.totaltheme-customize-trbl' );
			const shorthand = controlEl.attr( 'data-wpex-shorthand' );
			const $inputs = control.container.find( '.totaltheme-customize-trbl__input' );
			const selectedUnit = 'px';
			control.container.on( 'input', '.totaltheme-customize-trbl__input', function() {
				let newVal = '';
				let firstValue = null;
				let allSame = true;
				let allEmpty = true;
				let valArray = [];
				let parsedArray = [];
				$inputs.each( function( index, el ) {
					let $this = $( this );
					let val = $this.val();
					if ( '' !== val ) {
						allEmpty = false;
					}
					if ( 0 === index ) {
						firstValue = val;
					}
					if ( firstValue !== val ) {
						allSame = false;
					}
					if ( 'true' === shorthand ) {
						val = val || '0px';
						if ( ! isNaN( val ) ) {
							val = val + selectedUnit;
						}
						valArray.push( val );
					} else {
						if ( val ) {
							if ( ! isNaN( val ) ) {
								val = val + selectedUnit;
							}
							parsedArray.push( $this.attr( 'data-name' ) + ':' + val );
							valArray.push( val );
						}
					}
				} );
				if ( allEmpty ) {
					newVal = '';
				} else if ( allSame ) {
					if ( ! isNaN( firstValue ) ) {
						firstValue = firstValue + selectedUnit;
					}
					newVal = firstValue;
				} else {
					if ( 4 === valArray.length && ( valArray[0] == valArray[2] && valArray[1] == valArray[3] ) ) {
						newVal = valArray[0] + ' ' + valArray[1];
					} else {
						newVal = ( 'true' === shorthand ) ? valArray.join(' ') : parsedArray.join('|');
					}
				}
				control.setting.set( newVal );
			} );
		}
	} );

/**
	 * Length Unit.
	 */
	wp.customize.controlConstructor.totaltheme_length_unit = wp.customize.Control.extend( {
		ready: function() {
			const control = this;

control.container.on( 'input', '.totaltheme-customize-length-unit__input', function() {
				control.updateValue( $( this ) );
			} );

control.container.on( 'focus', '.totaltheme-customize-length-unit__input', function() {
				control.container.find( '.totaltheme-customize-length-unit' ).addClass( 'totaltheme-customize-length-unit--focused' );
			} );

control.container.on( 'blur', '.totaltheme-customize-length-unit__input', function() {
				control.container.find( '.totaltheme-customize-length-unit' ).removeClass( 'totaltheme-customize-length-unit--focused' );
			} );

control.container.on( 'change', '.totaltheme-customize-length-unit__select', function() {
				const $this        = $( this );
				const selectedUnit = $this.find( 'option:selected' ).val();
				const input        = control.container.find( '.totaltheme-customize-length-unit__input' );
				if ( selectedUnit !== $this.find( 'option' ).first().val() ) {
					input.attr( 'placeholder', '' );
				} else {
					input.attr( 'placeholder', input.attr( 'data-placeholder' ) );
				}
				if ( 'func' === selectedUnit || 'var' === selectedUnit || 'calc' === selectedUnit || 'clamp' === selectedUnit ) {
					input.attr( 'type', 'text' );
					input.attr( 'inputmode', 'text' );
				} else {
					input.attr( 'type', 'number' );
					input.attr( 'inputmode', 'numeric' );
				}
				control.updateValue( input );
				/*
				input.val( '' );
				control.setting.set( '' );
				*/
			} );
		},
		updateValue: function( input ) {
			const control = this;
			let val = input.val();
			if ( val ) {
				let selectedUnit = control.container.find( '.totaltheme-customize-length-unit__select option:selected' ).val();
				if ( 'num' === selectedUnit ) {
					selectedUnit = '';
				}
				switch( selectedUnit ) {
					case 'func':
						// no tweaks here.
						break;
					case 'var':
						if ( ! val.includes( 'var(' ) ) {
							val = 'var(' + val.trim() + ')';
						}
						break;
					default:
						val = parseFloat( val );
						val = ! isNaN( val ) ? val + selectedUnit : '';
						break;
				}
			} else {
				control.updatePlaceholder();
			}
			control.setting.set( String( val.trim() ) );
		},
		updatePlaceholder: function() {
			const control = this;
			const input = control.container.find( '.totaltheme-customize-length-unit__input' );
			if ( control.container.find( '.totaltheme-customize-length-unit__select option:selected' ).val() !== control.container.find( '.totaltheme-customize-length-unit__select option' ).first().val() ) {
				input.attr( 'placeholder', '' );
			} else {
				input.attr( 'placeholder', input.attr( 'data-placeholder' ) );
			}
		}
	} );

/**
	 * Responsive Fields.
	 */
	wp.customize.controlConstructor.totaltheme_responsive_input = wp.customize.Control.extend( {
		ready: function() {
			const control = this;
			control.container.find( '.totaltheme-customize-responsive-field__input' ).on( 'input', function( e ) {
				control.updateValue();
			} );
		},
		updateValue: function() {
			const control = this;
			var newValue = {};
			var valCount = 0;
			control.container.find( '.totaltheme-customize-responsive-field__input' ).each( function( index, el ) {
				const $this = $( this );
				const val = $this.val();
				if ( val ) {
					valCount++;
					newValue[$this.attr( 'data-name' )] = val;
				}
			} );
			if ( valCount == 0 ) {
				control.setting.set('');
			} else {
				control.setting.set( JSON.stringify( newValue ) );
			}
		}
	} );

/**
	 * SVG Select.
	 */
	wp.customize.controlConstructor.wpex_svg_select = wp.customize.Control.extend( {
		ready: function() {
			const control = this;
			control.container.on( 'change', '.totaltheme-customize-svg-select select', function() {
				const $this       = $( this );
				const selected    = $this.find( 'option:selected' ).val();
				control.container.find( '.totaltheme-customize-svg-select-icon' ).each( function() {
					let icon = $( this );
					if ( ! selected ) {
						if ( icon.hasClass( 'totaltheme-customize-svg-select-icon--default' ) ) {
							icon.removeClass( 'totaltheme-customize-svg-select-icon--hidden' );
						} else {
							icon.addClass( 'totaltheme-customize-svg-select-icon--hidden' );
						}
					} else {
						if ( icon.attr( 'data-wpex-value' ) == selected ) {
							icon.removeClass( 'totaltheme-customize-svg-select-icon--hidden' );
						} else {
							icon.addClass( 'totaltheme-customize-svg-select-icon--hidden' );
						}
					}
				} );
			} );
		},
	} );

/**
	 * Blocks Control.
	 */
	wp.customize.controlConstructor.totaltheme_blocks = wp.customize.Control.extend( {
		ready: function() {
			const control    = this;
			const container  = control.container;
			const sortableUl = container.find( '.totaltheme-customize-blocks__list' );

sortableUl.sortable( {
				placeholder: 'totaltheme-customize-blocks__sortable-placeholder'
			} );

sortableUl.on( 'sortstop', function( event, ui ) {
				control.updateValue();
			} );

container.on( 'click', '.totaltheme-customize-blocks__delete-item', function( event ) {
				const result = confirm(l10n.deleteConfirm);
				if ( result ) {
					$( this ).parents( '.totaltheme-customize-blocks__item' ).remove();
					control.updateValue();
				}
				event.preventDefault();
			} );

container.find( '.totaltheme-customize-blocks__add-button' ).click( function( event ) {
				event.preventDefault();
				const select = container.find( '.totaltheme-customize-blocks__select' );
				const selectedBlock = select.find( ':selected' );
				if ( selectedBlock ) {
					const selectedSiteVal = selectedBlock.val();
					if ( ! selectedSiteVal ) {
						return;
					}
					if ( container.find( '.totaltheme-customize-blocks__item[data-wpex-key="' + selectedSiteVal + '"]' ).length ) {
						alert(l10n.duplicate);
						return;
					}
					const clone = container.find( '.totaltheme-customize-blocks__template' ).clone();
					clone.removeClass( 'totaltheme-customize-blocks__template' );
					clone.addClass( 'totaltheme-customize-blocks__item' ).attr( 'data-wpex-key', selectedSiteVal );
					clone.find( '.totaltheme-customize-blocks__item-name' ).text( selectedBlock.text() );
					clone.appendTo( container.find( '.totaltheme-customize-blocks__list' ) );
					control.updateValue();
					container.find( '.totaltheme-customize-blocks__list' ).sortable( 'refresh' );
				}
			} );
		},
		updateValue: function() {
			const control = this;
			let newValue = '';
			control.container.find( '.totaltheme-customize-blocks__item' ).each( function( index, el ) {
				newValue += $( this ).attr( 'data-wpex-key' ) + ',';
			} );
			if ( newValue.trim() ) {
				control.container.find( '.totaltheme-customize-blocks' ).addClass( 'totaltheme-customize-blocks--has-blocks' );
				control.setting.set( newValue.replace(/,+$/, '') );
			} else {
				control.container.find( '.totaltheme-customize-blocks' ).removeClass( 'totaltheme-customize-blocks--has-blocks' );
				control.setting.set( '' );
			}
		}
	} );

} ( jQuery, totaltheme_customize_controls_vars ) );

文件操作 - controls.js

文件: /storage/v12552/jimbrandstatter/public_html/wp-content/themes/Total/assets/js/customize/controls.js

编辑文件内容

修改文件时间

删除文件