mirror of
https://github.com/10h30/display-featured-image-genesis.git
synced 2026-07-17 05:23:22 +09:00
Update image uploader markup, script
This commit is contained in:
Robin Cornett
@@ -232,9 +232,10 @@ class Display_Featured_Image_Genesis {
|
||||
public function enqueue_scripts() {
|
||||
|
||||
$version = $this->common->version;
|
||||
$minify = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ? '' : '.min';
|
||||
|
||||
wp_register_script( 'displayfeaturedimage-upload', plugins_url( '/includes/js/settings-upload.js', dirname( __FILE__ ) ), array( 'jquery', 'media-upload', 'thickbox' ), $version );
|
||||
wp_register_script( 'widget_selector', plugins_url( '/includes/js/widget-selector.js', dirname( __FILE__ ) ), array( 'jquery' ), $version );
|
||||
wp_register_script( 'displayfeaturedimage-upload', plugins_url( "/includes/js/settings-upload{$minify}.js", dirname( __FILE__ ) ), array( 'jquery', 'media-upload', 'thickbox' ), $version, true );
|
||||
|
||||
$screen = get_current_screen();
|
||||
$screen_ids = array(
|
||||
@@ -246,9 +247,13 @@ class Display_Featured_Image_Genesis {
|
||||
if ( in_array( $screen->id, $screen_ids, true ) || ! empty( $screen->taxonomy ) ) {
|
||||
wp_enqueue_media();
|
||||
wp_enqueue_script( 'displayfeaturedimage-upload' );
|
||||
wp_localize_script( 'displayfeaturedimage-upload', 'objectL10n', array(
|
||||
'text' => __( 'Select Image', 'display-featured-image-genesis' ),
|
||||
) );
|
||||
wp_localize_script(
|
||||
'displayfeaturedimage-upload',
|
||||
'DisplayFeaturedImageGenesis',
|
||||
array(
|
||||
'text' => __( 'Select Image', 'display-featured-image-genesis' ),
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,70 +1,91 @@
|
||||
jQuery( document ).ready( function ( $ ) {
|
||||
;(function ( document, $, undefined ) {
|
||||
'use strict';
|
||||
|
||||
var custom_uploader,
|
||||
targetInputClass = '.upload-image-id',
|
||||
previewClass = 'upload-image-preview',
|
||||
target_input,
|
||||
preview;
|
||||
DFIG = {};
|
||||
|
||||
$( '.upload_default_image' ).click(function(e) {
|
||||
DFIG.upload = function () {
|
||||
$( '.upload-image' ).on( 'click.upload', _uploadMedia );
|
||||
$( '.delete-image' ).on( 'click.delete', _deleteMedia );
|
||||
$( '#submit' ).on( 'click.term', _termImages );
|
||||
|
||||
target_input = $(this).prev( '.upload_image_id' );
|
||||
function _uploadMedia( e ) {
|
||||
e.preventDefault();
|
||||
target_input = $( this ).prev( targetInputClass );
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
//If the uploader object has already been created, reopen the dialog
|
||||
if ( custom_uploader ) {
|
||||
custom_uploader.open();
|
||||
return;
|
||||
}
|
||||
|
||||
//Extend the wp.media object
|
||||
custom_uploader = wp.media.frames.file_frame = wp.media({
|
||||
title: ( [ objectL10n.text ] ),
|
||||
button: {
|
||||
text: ( [ objectL10n.text ] )
|
||||
},
|
||||
multiple: false,
|
||||
library: { type : 'image' }
|
||||
});
|
||||
|
||||
//When a file is selected, grab the URL and set it as the text field's value
|
||||
custom_uploader.on( 'select', function() {
|
||||
|
||||
var attachment = custom_uploader.state().get( 'selection' ).first().toJSON(),
|
||||
preview = $( target_input ).prevAll( '.upload_logo_preview' ),
|
||||
previewImage = $( '<div class="upload_logo_preview"><img width="300" src="' + attachment.url + '" /></div>' );
|
||||
$( target_input ).val( attachment.id );
|
||||
if ( preview.length ) {
|
||||
preview.remove();
|
||||
//If the uploader object has already been created, reopen the dialog
|
||||
if ( custom_uploader ) {
|
||||
custom_uploader.reset();
|
||||
}
|
||||
$( target_input ).before( previewImage );
|
||||
});
|
||||
|
||||
//Open the uploader dialog
|
||||
custom_uploader.open();
|
||||
//Extend the wp.media object
|
||||
custom_uploader = wp.media.frames.file_frame = wp.media( {
|
||||
title: ([DFIG.params.text]),
|
||||
button: {
|
||||
text: ([DFIG.params.text])
|
||||
},
|
||||
multiple: false,
|
||||
library: {type: 'image'}
|
||||
} );
|
||||
|
||||
});
|
||||
//When a file is selected, grab the URL and set it as the text field's value
|
||||
custom_uploader.on( 'select', function () {
|
||||
|
||||
$( '.delete_image' ).click( function() {
|
||||
var attachment = custom_uploader.state().get( 'selection' ).first().toJSON(),
|
||||
preview = $( target_input ).prevAll( '.' + previewClass ),
|
||||
deleteButton = $( target_input ).siblings( '.delete-image' ),
|
||||
previewImage = $( '<div />', {
|
||||
class: previewClass
|
||||
} ).append( $( '<img/>', {
|
||||
style: 'max-width:100%;',
|
||||
width: '300px',
|
||||
src: attachment.url,
|
||||
alt: ''
|
||||
} ) );
|
||||
$( target_input ).val( attachment.id );
|
||||
if ( preview.length ) {
|
||||
preview.remove();
|
||||
}
|
||||
$( target_input ).before( previewImage );
|
||||
$( deleteButton ).show();
|
||||
} );
|
||||
|
||||
target_input = $( this ).prevAll( '.upload_image_id' );
|
||||
var previewView = $( this ).prevAll( '.upload_logo_preview' );
|
||||
//Open the uploader dialog
|
||||
custom_uploader.open();
|
||||
|
||||
$( target_input ).val( '' );
|
||||
$( previewView ).remove();
|
||||
|
||||
});
|
||||
|
||||
$( '#submit' ).click( function() {
|
||||
var submitButton = $( this ).parentsUntil( '#addtag' ),
|
||||
previewView = submitButton.siblings( '.term-image-wrap' ).children( '.upload_logo_preview' ),
|
||||
clearInput = submitButton.siblings( '.term-image-wrap' ).children( '.upload_image_id' );
|
||||
|
||||
if ( $( previewView ).length && $( submitButton ).length ) {
|
||||
$( previewView ).delay( 1000 ).fadeOut( 200, function() {
|
||||
$(this).remove();
|
||||
$( clearInput ).val( '' );
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function _deleteMedia( e ) {
|
||||
e.preventDefault();
|
||||
target_input = $( this ).prevAll( targetInputClass );
|
||||
var previewView = $( this ).prevAll( '.' + previewClass );
|
||||
|
||||
$( target_input ).val( '' );
|
||||
$( previewView ).remove();
|
||||
$( this ).hide();
|
||||
}
|
||||
|
||||
function _termImages( e ) {
|
||||
e.preventDefault();
|
||||
var submitButton = $( this ).parentsUntil( '#addtag' ),
|
||||
previewView = submitButton.siblings( '.term-image-wrap' ).children( '.' + previewClass ),
|
||||
clearInput = submitButton.siblings( '.term-image-wrap' ).children( targetInputClass );
|
||||
|
||||
if ( $( previewView ).length && $( submitButton ).length ) {
|
||||
$( previewView ).delay( 1000 ).fadeOut( 200, function () {
|
||||
$( this ).remove();
|
||||
$( clearInput ).val( '' );
|
||||
} );
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
DFIG.params = typeof DisplayFeaturedImageGenesis === 'undefined' ? '' : DisplayFeaturedImageGenesis;
|
||||
if ( typeof DFIG.params !== 'undefined' ) {
|
||||
DFIG.upload();
|
||||
}
|
||||
|
||||
})( document, jQuery );
|
||||
|
||||
Vendored
+1
@@ -0,0 +1 @@
|
||||
!function(e,t,i){"use strict";var a,l,n=".upload-image-id",r="upload-image-preview",s={upload:function(){t(".upload-image").on("click.upload",function(e){e.preventDefault(),l=t(this).prev(n),a&&a.reset();(a=wp.media.frames.file_frame=wp.media({title:[s.params.text],button:{text:[s.params.text]},multiple:!1,library:{type:"image"}})).on("select",function(){var e=a.state().get("selection").first().toJSON(),i=t(l).prevAll("."+r),n=t(l).siblings(".delete-image"),s=t("<div />",{class:r}).append(t("<img/>",{style:"max-width:100%;",width:"300px",src:e.url,alt:""}));t(l).val(e.id),i.length&&i.remove(),t(l).before(s),t(n).show()}),a.open()}),t(".delete-image").on("click.delete",function(e){e.preventDefault(),l=t(this).prevAll(n);var i=t(this).prevAll("."+r);t(l).val(""),t(i).remove(),t(this).hide()}),t("#submit").on("click.term",function(e){e.preventDefault();var i=t(this).parentsUntil("#addtag"),a=i.siblings(".term-image-wrap").children("."+r),l=i.siblings(".term-image-wrap").children(n);t(a).length&&t(i).length&&t(a).delay(1e3).fadeOut(200,function(){t(this).remove(),t(l).val("")})})}};s.params="undefined"==typeof DisplayFeaturedImageGenesis?"":DisplayFeaturedImageGenesis,void 0!==s.params&&s.upload()}(document,jQuery);
|
||||
@@ -237,7 +237,7 @@ class Display_Featured_Image_Genesis_Helper extends DisplayFeaturedImageGenesisG
|
||||
$alt_text = sprintf( __( '%s featured image', 'display-featured-image-genesis' ), esc_attr( $alt ) );
|
||||
$preview = wp_get_attachment_image_src( (int) $id, 'medium' );
|
||||
|
||||
return sprintf( '<div class="upload_logo_preview"><img src="%s" alt="%s" /></div>', esc_url( $preview[0] ), esc_attr( $alt_text ) );
|
||||
return sprintf( '<div class="upload-image-preview"><img src="%s" alt="%s" /></div>', esc_url( $preview[0] ), esc_attr( $alt_text ) );
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -250,16 +250,17 @@ class Display_Featured_Image_Genesis_Helper extends DisplayFeaturedImageGenesisG
|
||||
*/
|
||||
public function render_buttons( $id, $name ) {
|
||||
$id = $id ? (int) $id : '';
|
||||
printf( '<input type="hidden" class="upload_image_id" name="%1$s" value="%2$s" />', esc_attr( $name ), esc_attr( $id ) );
|
||||
printf( '<input id="%s" type="button" class="upload_default_image button-secondary" value="%s" />',
|
||||
printf( '<input type="hidden" class="upload-image-id" name="%1$s" value="%2$s" />', esc_attr( $name ), esc_attr( $id ) );
|
||||
printf(
|
||||
'<button id="%s" class="upload-image button-secondary">%s</button>',
|
||||
esc_attr( $name ),
|
||||
esc_attr__( 'Select Image', 'display-featured-image-genesis' )
|
||||
);
|
||||
if ( ! empty( $id ) ) {
|
||||
printf( ' <input type="button" class="delete_image button-secondary" value="%s" />',
|
||||
esc_attr__( 'Delete Image', 'display-featured-image-genesis' )
|
||||
);
|
||||
}
|
||||
printf(
|
||||
' <button class="delete-image button-secondary"%s>%s</button>',
|
||||
empty( $id ) ? 'style="display:none;"' : '',
|
||||
esc_attr__( 'Delete Image', 'display-featured-image-genesis' )
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
Reference in New Issue
Block a user