ru-se.com

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs

editor.js (4013B)


      1 wp.customize.controlConstructor['kirki-editor'] = wp.customize.Control.extend({
      2 
      3 	// When we're finished loading continue processing
      4 	ready: function() {
      5 
      6 		'use strict';
      7 
      8 		var control       = this,
      9 		    element       = control.container.find( 'textarea' ),
     10 		    toggler       = control.container.find( '.toggle-editor' ),
     11 		    editorWrapper = jQuery( '#kirki_editor_pane' ),
     12 		    wpEditorArea  = jQuery( '#kirki_editor_pane textarea.wp-editor-area' ),
     13 		    setChange,
     14 		    content;
     15 
     16 		jQuery( window ).on('load', function() {
     17 
     18 			var editor  = tinyMCE.get( 'kirki-editor' );
     19 
     20 			// Add the button text
     21 			toggler.html( window.kirki.l10n[ control.params.kirkiConfig ]['open-editor'] );
     22 
     23 			toggler.on( 'click', function() {
     24 
     25 				// Toggle the editor.
     26 				control.toggleEditor();
     27 
     28 				// Change button.
     29 				control.changeButton();
     30 
     31 				// Add the content to the editor.
     32 				control.setEditorContent( editor );
     33 
     34 				// Modify the preview-area height.
     35 				control.previewHeight();
     36 
     37 			});
     38 
     39 			// Update the option from the editor contents on change.
     40 			if ( editor ) {
     41 
     42 				editor.onChange.add( function( ed, e ) {
     43 
     44 					ed.save();
     45 					content = editor.getContent();
     46 					clearTimeout( setChange );
     47 					setChange = setTimeout( function() {
     48 						element.val( content ).trigger( 'change' );
     49 						wp.customize.instance( control.getEditorWrapperSetting() ).set( content );
     50 					}, 500 );
     51 
     52 				});
     53 
     54 			}
     55 
     56 			// Handle text mode.
     57 			wpEditorArea.on( 'change keyup paste', function() {
     58 				wp.customize.instance( control.getEditorWrapperSetting() ).set( jQuery( this ).val() );
     59 			});
     60 
     61 		});
     62 
     63 	},
     64 
     65 	/**
     66 	 * Modify the button text and classes.
     67 	 */
     68 	changeButton: function() {
     69 
     70 		'use strict';
     71 
     72 		var control       = this,
     73 			editorWrapper = jQuery( '#kirki_editor_pane' );
     74 
     75 		// Reset all editor buttons.
     76 		// Necessary if we have multiple editor fields.
     77 		jQuery( '.customize-control-kirki-editor .toggle-editor' ).html( window.kirki.l10n[ control.params.kirkiConfig ]['switch-editor'] );
     78 
     79 		// Change the button text & color.
     80 		if ( false !== control.getEditorWrapperSetting() ) {
     81 			jQuery( '.customize-control-kirki-editor .toggle-editor' ).html( window.kirki.l10n[ control.params.kirkiConfig ]['switch-editor'] );
     82 			jQuery( '#customize-control-' + control.getEditorWrapperSetting() + ' .toggle-editor' ).html( window.kirki.l10n[ control.params.kirkiConfig ]['close-editor'] );
     83 		} else {
     84 			jQuery( '.customize-control-kirki-editor .toggle-editor' ).html( window.kirki.l10n[ control.params.kirkiConfig ]['open-editor'] );
     85 		}
     86 
     87 	},
     88 
     89 	/**
     90 	 * Toggle the editor.
     91 	 */
     92 	toggleEditor: function() {
     93 
     94 		'use strict';
     95 
     96 		var control = this,
     97 		    editorWrapper = jQuery( '#kirki_editor_pane' );
     98 
     99 		if ( ! control.getEditorWrapperSetting() || control.id !== control.getEditorWrapperSetting() ) {
    100 			editorWrapper.removeClass();
    101 			editorWrapper.addClass( control.id );
    102 		} else {
    103 			editorWrapper.removeClass();
    104 			editorWrapper.addClass( 'hide' );
    105 		}
    106 
    107 	},
    108 
    109 	/**
    110 	 * Set the content.
    111 	 */
    112 	setEditorContent: function( editor ) {
    113 
    114 		'use strict';
    115 
    116 		var control = this,
    117 		    editorWrapper = jQuery( '#kirki_editor_pane' );
    118 
    119 		editor.setContent( control.setting._value );
    120 
    121 	},
    122 
    123 	/**
    124 	 * Gets the setting from the editor wrapper class.
    125 	 */
    126 	getEditorWrapperSetting: function() {
    127 
    128 		'use strict';
    129 
    130 		if ( jQuery( '#kirki_editor_pane' ).hasClass( 'hide' ) ) {
    131 			return false;
    132 		}
    133 
    134 		if ( jQuery( '#kirki_editor_pane' ).attr( 'class' ) ) {
    135 			return jQuery( '#kirki_editor_pane' ).attr( 'class' );
    136 		} else {
    137 			return false;
    138 		}
    139 
    140 	},
    141 
    142 	/**
    143 	 * Modifies the height of the preview area.
    144 	 */
    145 	previewHeight: function() {
    146 		if ( jQuery( '#kirki_editor_pane' ).hasClass( 'hide' ) ) {
    147 			if ( jQuery( '#customize-preview' ).hasClass( 'is-kirki-editor-open' ) ) {
    148 				jQuery( '#customize-preview' ).removeClass( 'is-kirki-editor-open' );
    149 			}
    150 		} else {
    151 			if ( ! jQuery( '#customize-preview' ).hasClass( 'is-kirki-editor-open' ) ) {
    152 				jQuery( '#customize-preview' ).addClass( 'is-kirki-editor-open' );
    153 			}
    154 		}
    155 	}
    156 
    157 });