summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat (limited to 'plugins/jetpack/modules/theme-tools/site-logo/js/site-logo-control.js')
-rw-r--r--plugins/jetpack/modules/theme-tools/site-logo/js/site-logo-control.js160
1 files changed, 0 insertions, 160 deletions
diff --git a/plugins/jetpack/modules/theme-tools/site-logo/js/site-logo-control.js b/plugins/jetpack/modules/theme-tools/site-logo/js/site-logo-control.js
deleted file mode 100644
index c4cce6c2..00000000
--- a/plugins/jetpack/modules/theme-tools/site-logo/js/site-logo-control.js
+++ /dev/null
@@ -1,160 +0,0 @@
-/**
- * JS for handling the Site Logo Customizer control.
- */
-( function( wp, $ ) {
- // nice shortcut
- var api = wp.customize;
- /**
- * The Customizer looks for wp.customizer.controlConstructor[type] functions
- * where type == the type member of a WP_Customize_Control
- */
- api.controlConstructor.site_logo = api.Control.extend( {
- /**
- * This method is called when the control is ready to run.
- * Do all of your setup and event binding here.
- */
- ready: function() {
- // this.container is a jQuery object of your container
-
- // grab the bits of data from the title for specifying this control
- var data = this.container.find( '.customize-control-title' ).data();
-
- // Use specific l10n data for this control where available
- this.l10n = data.l10n;
- // Grab mime type
- this.mime = data.mime;
-
- // Set up image container and button elements. Cache for re-use.
- this.$imgContainer = $( '#customize-control-site_logo .current' );
- this.$btnContainer = $( '#customize-control-site_logo .actions' );
- this.$img = $( '<img class="site-logo-thumbnail" />' ).prependTo( this.$imgContainer );
- this.$placeholder = $( '<span>' + this.l10n.placeholder + '</span>' ).prependTo(
- this.$imgContainer
- );
- this.$btnAdd = $(
- '<button type="button" class="button new">' + this.l10n.upload + '</button>'
- ).prependTo( this.$btnContainer );
- this.$btnChange = $(
- '<button type="button" class="button change">' + this.l10n.change + '</button>'
- ).prependTo( this.$btnContainer );
- this.$btnRemove = $(
- '<button type="button" class="button remove">' + this.l10n.remove + '</button>'
- ).prependTo( this.$btnContainer );
-
- // handy shortcut so we don't have to us _.bind every time we add a callback
- _.bindAll( this, 'removeImg', 'upload', 'render', 'pick' );
-
- this.$btnAdd.on( 'click', this.upload );
- this.$btnChange.on( 'click', this.upload );
- this.$btnRemove.on( 'click', this.removeImg );
-
- // Call render method whenever setting is changed.
- this.setting.bind( 'change', this.render );
- // Do initial rendering.
- this.render();
- },
- /**
- * Remember that _.bind was used to maintain `this` as the control
- * object rather than the usual jQuery way of binding to the DOM element.
- */
- upload: function( event ) {
- event.preventDefault();
-
- if ( ! this.frame ) {
- this.initFrame();
- }
-
- this.frame.open();
- },
- /**
- * Set the media frame so that it can be reused and accessed when needed.
- */
- initFrame: function() {
- this.frame = wp.media( {
- // The title of the media modal
- title: this.l10n.choose,
- // restrict to specified mime type
- library: {
- type: this.mime,
- },
- // Customize the submit button.
- button: {
- // Set the text of the button.
- text: this.l10n.set,
- },
- // Just one, thanks.
- multiple: false,
- } );
-
- // When an image is selected, run a callback.
- this.frame.on( 'select', this.pick );
- },
- /**
- * Fired when an image is selected in the media modal. Gets the selected
- * image information, and sets it within the control.
- */
- pick: function() {
- // get the attachment from the modal frame
- var attachment = this.frame
- .state()
- .get( 'selection' )
- .single();
- if ( 'image' === attachment.get( 'type' ) ) {
- // set the setting - the callback will take care of rendering
- this.setting( this.reduceMembers( attachment.toJSON() ) );
- }
- },
- /**
- * Reduces the attachment object to just the few desired members.
- * @param {object} attachment An attachment object provided by the
- * medial modal.
- * @return {object} A reduced media object.
- */
- reduceMembers: function( attachment ) {
- var desired = [ 'id', 'sizes', 'url' ],
- output = {};
- $.each( desired, function( i, key ) {
- output[ key ] = attachment[ key ];
- } );
- return output;
- },
- /**
- * Called on init and whenever a setting is changed. Shows the thumbnail
- * when there is one or the upload button when there isn't.
- */
- render: function() {
- var value = this.setting();
-
- if ( value && value.url ) {
- this.$placeholder.hide();
- if ( ! value.sizes || ! value.sizes.medium ) {
- this.$img.attr( 'src', value.url );
- } else {
- this.$img.attr( 'src', value.sizes.medium.url );
- }
- this.$img.show();
- this.$btnRemove.show();
- this.$btnChange.show();
- this.$btnAdd.hide();
- } else {
- this.$img.hide();
- this.$placeholder.show();
- this.$btnRemove.hide();
- this.$btnChange.hide();
- this.$btnAdd.show();
- }
- },
- /**
- * Called when the "Remove Image" link is clicked. Sets thes setting back
- * to its default state.
- * @param {object} event jQuery Event object from click event
- */
- removeImg: function( event ) {
- event.preventDefault();
- this.setting( {
- url: '',
- id: 0,
- } );
- },
- } );
-} )( this.wp, jQuery );