Restyles the modal for attaching media to posts, take II (also some autoprefixer and imagemin). Props avryl, see #26952.
Built from https://develop.svn.wordpress.org/trunk@27403 git-svn-id: http://core.svn.wordpress.org/trunk@27250 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
parent
affd41046b
commit
7121bb490d
|
@ -628,6 +628,8 @@ span.wp-media-buttons-icon:before {
|
|||
top: 50%;
|
||||
right: 0;
|
||||
left: 0;
|
||||
-webkit-transform: translateY( -50% );
|
||||
-ms-transform: translateY( -50% );
|
||||
transform: translateY( -50% );
|
||||
font-size: 40px;
|
||||
color: #fff;
|
||||
|
|
|
@ -628,6 +628,8 @@ span.wp-media-buttons-icon:before {
|
|||
top: 50%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
-webkit-transform: translateY( -50% );
|
||||
-ms-transform: translateY( -50% );
|
||||
transform: translateY( -50% );
|
||||
font-size: 40px;
|
||||
color: #fff;
|
||||
|
|
|
@ -235,33 +235,41 @@
|
|||
.find-box {
|
||||
background-color: #fff;
|
||||
width: 600px;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
margin-right: -300px;
|
||||
position: fixed;
|
||||
top: 30px;
|
||||
bottom: 30px;
|
||||
right: 50%;
|
||||
z-index: 160000;
|
||||
}
|
||||
|
||||
.find-box-head {
|
||||
cursor: move;
|
||||
background: #fcfcfc;
|
||||
border-bottom: 1px solid #dfdfdf;
|
||||
height: 40px;
|
||||
height: 56px;
|
||||
font-size: 22px;
|
||||
font-weight: 600;
|
||||
line-height: 40px;
|
||||
line-height: 56px;
|
||||
padding: 0 16px 0 40px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.find-box-inside {
|
||||
overflow: auto;
|
||||
padding: 16px;
|
||||
background-color: #fff;
|
||||
max-height: 300px;
|
||||
position: absolute;
|
||||
top: 57px;
|
||||
bottom: 57px;
|
||||
overflow-y: scroll;
|
||||
width: 100%;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.find-box-search {
|
||||
|
@ -272,7 +280,7 @@
|
|||
float: none;
|
||||
right: 125px;
|
||||
position: absolute;
|
||||
top: 9px;
|
||||
top: 18px;
|
||||
}
|
||||
|
||||
#find-posts-input,
|
||||
|
@ -286,7 +294,8 @@
|
|||
margin: 0 0 0 4px;
|
||||
}
|
||||
|
||||
.found-radio {
|
||||
.widefat .found-radio {
|
||||
padding-left: 0;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
|
@ -315,15 +324,29 @@
|
|||
}
|
||||
|
||||
.find-box-buttons {
|
||||
padding: 6px 16px;
|
||||
padding: 14px 16px;
|
||||
background: #fcfcfc;
|
||||
border-top: 1px solid #dfdfdf;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.find-box #resize-se {
|
||||
position: absolute;
|
||||
left: 1px;
|
||||
bottom: 1px;
|
||||
@media screen and ( max-width: 660px ) {
|
||||
|
||||
.find-box {
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.find-box-inside {
|
||||
bottom: 69px;
|
||||
}
|
||||
}
|
||||
|
||||
.ui-find-overlay {
|
||||
|
|
|
@ -235,33 +235,41 @@
|
|||
.find-box {
|
||||
background-color: #fff;
|
||||
width: 600px;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
margin-left: -300px;
|
||||
position: fixed;
|
||||
top: 30px;
|
||||
bottom: 30px;
|
||||
left: 50%;
|
||||
z-index: 160000;
|
||||
}
|
||||
|
||||
.find-box-head {
|
||||
cursor: move;
|
||||
background: #fcfcfc;
|
||||
border-bottom: 1px solid #dfdfdf;
|
||||
height: 40px;
|
||||
height: 56px;
|
||||
font-size: 22px;
|
||||
font-weight: 600;
|
||||
line-height: 40px;
|
||||
line-height: 56px;
|
||||
padding: 0 40px 0 16px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.find-box-inside {
|
||||
overflow: auto;
|
||||
padding: 16px;
|
||||
background-color: #fff;
|
||||
max-height: 300px;
|
||||
position: absolute;
|
||||
top: 57px;
|
||||
bottom: 57px;
|
||||
overflow-y: scroll;
|
||||
width: 100%;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.find-box-search {
|
||||
|
@ -272,7 +280,7 @@
|
|||
float: none;
|
||||
left: 125px;
|
||||
position: absolute;
|
||||
top: 9px;
|
||||
top: 18px;
|
||||
}
|
||||
|
||||
#find-posts-input,
|
||||
|
@ -286,7 +294,8 @@
|
|||
margin: 0 4px 0 0;
|
||||
}
|
||||
|
||||
.found-radio {
|
||||
.widefat .found-radio {
|
||||
padding-right: 0;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
|
@ -315,15 +324,29 @@
|
|||
}
|
||||
|
||||
.find-box-buttons {
|
||||
padding: 6px 16px;
|
||||
padding: 14px 16px;
|
||||
background: #fcfcfc;
|
||||
border-top: 1px solid #dfdfdf;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.find-box #resize-se {
|
||||
position: absolute;
|
||||
right: 1px;
|
||||
bottom: 1px;
|
||||
@media screen and ( max-width: 660px ) {
|
||||
|
||||
.find-box {
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.find-box-inside {
|
||||
bottom: 69px;
|
||||
}
|
||||
}
|
||||
|
||||
.ui-find-overlay {
|
||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -1465,11 +1465,7 @@ function wp_ajax_find_posts() {
|
|||
|
||||
$html .= '</tbody></table>';
|
||||
|
||||
$x = new WP_Ajax_Response();
|
||||
$x->add( array(
|
||||
'data' => $html
|
||||
));
|
||||
$x->send();
|
||||
wp_send_json_success( $html );
|
||||
}
|
||||
|
||||
function wp_ajax_widgets_order() {
|
||||
|
|
|
@ -1,11 +1,10 @@
|
|||
/* global ajaxurl, wpAjax */
|
||||
/* global ajaxurl, attachMediaBoxL10n */
|
||||
|
||||
var findPosts;
|
||||
(function($){
|
||||
( function( $ ){
|
||||
findPosts = {
|
||||
open : function(af_name, af_val) {
|
||||
var st = document.documentElement.scrollTop || $(document).scrollTop(),
|
||||
overlay = $( '.ui-find-overlay' );
|
||||
open: function( af_name, af_val ) {
|
||||
var overlay = $( '.ui-find-overlay' );
|
||||
|
||||
if ( overlay.length === 0 ) {
|
||||
$( 'body' ).append( '<div class="ui-find-overlay"></div>' );
|
||||
|
@ -15,18 +14,15 @@ var findPosts;
|
|||
overlay.show();
|
||||
|
||||
if ( af_name && af_val ) {
|
||||
$('#affected').attr('name', af_name).val(af_val);
|
||||
$( '#affected' ).attr( 'name', af_name ).val( af_val );
|
||||
}
|
||||
$('#find-posts').show().draggable({
|
||||
handle: '#find-posts-head'
|
||||
});
|
||||
|
||||
$('.find-box-inside').css({
|
||||
'max-height': $( window ).height() - ( ( 30 + 40 + 1 + 16 ) * 2 ) + 'px'
|
||||
});
|
||||
$( '#find-posts' ).show();
|
||||
|
||||
$('#find-posts-input').focus().keyup(function(e){
|
||||
if (e.which == 27) { findPosts.close(); } // close on Escape
|
||||
$('#find-posts-input').focus().keyup( function( event ){
|
||||
if ( event.which == 27 ) {
|
||||
findPosts.close();
|
||||
} // close on Escape
|
||||
});
|
||||
|
||||
// Pull some results up by default
|
||||
|
@ -35,21 +31,21 @@ var findPosts;
|
|||
return false;
|
||||
},
|
||||
|
||||
close : function() {
|
||||
close: function() {
|
||||
$('#find-posts-response').html('');
|
||||
$('#find-posts').draggable('destroy').hide();
|
||||
$('#find-posts').hide();
|
||||
$( '.ui-find-overlay' ).hide();
|
||||
},
|
||||
|
||||
overlay : function() {
|
||||
overlay: function() {
|
||||
$( '.ui-find-overlay' ).on( 'click', function () {
|
||||
findPosts.close();
|
||||
});
|
||||
},
|
||||
|
||||
send : function() {
|
||||
send: function() {
|
||||
var post = {
|
||||
ps: $('#find-posts-input').val(),
|
||||
ps: $( '#find-posts-input' ).val(),
|
||||
action: 'find_posts',
|
||||
_ajax_nonce: $('#_ajax_nonce').val()
|
||||
},
|
||||
|
@ -57,73 +53,49 @@ var findPosts;
|
|||
|
||||
spinner.show();
|
||||
|
||||
$.ajax({
|
||||
type : 'POST',
|
||||
url : ajaxurl,
|
||||
data : post,
|
||||
success : function(x) { findPosts.show(x); spinner.hide(); },
|
||||
error : function(r) { findPosts.error(r); spinner.hide(); }
|
||||
$.ajax( ajaxurl, {
|
||||
type: 'POST',
|
||||
data: post,
|
||||
dataType: 'json'
|
||||
}).always( function() {
|
||||
spinner.hide();
|
||||
}).done( function( x ) {
|
||||
if ( ! x.success ) {
|
||||
$( '#find-posts-response' ).text( attachMediaBoxL10n.error );
|
||||
}
|
||||
|
||||
$( '#find-posts-response' ).html( x.data );
|
||||
}).fail( function() {
|
||||
$( '#find-posts-response' ).text( attachMediaBoxL10n.error );
|
||||
});
|
||||
},
|
||||
|
||||
show : function(x) {
|
||||
|
||||
if ( typeof(x) == 'string' ) {
|
||||
this.error({'responseText': x});
|
||||
return;
|
||||
}
|
||||
|
||||
var r = wpAjax.parseAjaxResponse(x);
|
||||
|
||||
if ( r.errors ) {
|
||||
this.error({'responseText': wpAjax.broken});
|
||||
}
|
||||
r = r.responses[0];
|
||||
$('#find-posts-response').html(r.data);
|
||||
|
||||
// Enable whole row to be clicked
|
||||
$( '.found-posts td' ).on( 'click', function () {
|
||||
$( this ).parent().find( '.found-radio input' ).prop( 'checked', true );
|
||||
});
|
||||
},
|
||||
|
||||
error : function(r) {
|
||||
var er = r.statusText;
|
||||
|
||||
if ( r.responseText ) {
|
||||
er = r.responseText.replace( /<.[^<>]*?>/g, '' );
|
||||
}
|
||||
if ( er ) {
|
||||
$('#find-posts-response').html(er);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
$(document).ready(function() {
|
||||
$('#find-posts-submit').click(function(e) {
|
||||
if ( '' === $('#find-posts-response').html() )
|
||||
e.preventDefault();
|
||||
$( document ).ready( function() {
|
||||
$( '#find-posts-submit' ).click( function( event ) {
|
||||
if ( ! $( '#find-posts-response input[type="radio"]:checked' ).length )
|
||||
event.preventDefault();
|
||||
});
|
||||
$( '#find-posts .find-box-search :input' ).keypress( function( event ) {
|
||||
if ( 13 == event.which ) {
|
||||
findPosts.send();
|
||||
return false;
|
||||
}
|
||||
} );
|
||||
});
|
||||
$( '#find-posts-search' ).click( findPosts.send );
|
||||
$( '#find-posts-close' ).click( findPosts.close );
|
||||
$('#doaction, #doaction2').click(function(e){
|
||||
$('select[name^="action"]').each(function(){
|
||||
if ( $(this).val() == 'attach' ) {
|
||||
e.preventDefault();
|
||||
$( '#doaction, #doaction2' ).click( function( event ) {
|
||||
$( 'select[name^="action"]' ).each( function() {
|
||||
if ( $(this).val() === 'attach' ) {
|
||||
event.preventDefault();
|
||||
findPosts.open();
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
$(window).resize(function() {
|
||||
$('.find-box-inside').css({
|
||||
'max-height': $( window ).height() - ( ( 30 + 40 + 1 + 16 ) * 2 ) + 'px'
|
||||
|
||||
// Enable whole row to be clicked
|
||||
$( '.find-box-inside' ).on( 'click', 'tr', function() {
|
||||
$( this ).find( '.found-radio input' ).prop( 'checked', true );
|
||||
});
|
||||
});
|
||||
})(jQuery);
|
||||
})( jQuery );
|
||||
|
|
|
@ -1 +1 @@
|
|||
var findPosts;!function(a){findPosts={open:function(b,c){var d=(document.documentElement.scrollTop||a(document).scrollTop(),a(".ui-find-overlay"));return 0===d.length&&(a("body").append('<div class="ui-find-overlay"></div>'),findPosts.overlay()),d.show(),b&&c&&a("#affected").attr("name",b).val(c),a("#find-posts").show().draggable({handle:"#find-posts-head"}),a(".find-box-inside").css({"max-height":a(window).height()-174+"px"}),a("#find-posts-input").focus().keyup(function(a){27==a.which&&findPosts.close()}),findPosts.send(),!1},close:function(){a("#find-posts-response").html(""),a("#find-posts").draggable("destroy").hide(),a(".ui-find-overlay").hide()},overlay:function(){a(".ui-find-overlay").on("click",function(){findPosts.close()})},send:function(){var b={ps:a("#find-posts-input").val(),action:"find_posts",_ajax_nonce:a("#_ajax_nonce").val()},c=a(".find-box-search .spinner");c.show(),a.ajax({type:"POST",url:ajaxurl,data:b,success:function(a){findPosts.show(a),c.hide()},error:function(a){findPosts.error(a),c.hide()}})},show:function(b){if("string"==typeof b)return void this.error({responseText:b});var c=wpAjax.parseAjaxResponse(b);c.errors&&this.error({responseText:wpAjax.broken}),c=c.responses[0],a("#find-posts-response").html(c.data),a(".found-posts td").on("click",function(){a(this).parent().find(".found-radio input").prop("checked",!0)})},error:function(b){var c=b.statusText;b.responseText&&(c=b.responseText.replace(/<.[^<>]*?>/g,"")),c&&a("#find-posts-response").html(c)}},a(document).ready(function(){a("#find-posts-submit").click(function(b){""===a("#find-posts-response").html()&&b.preventDefault()}),a("#find-posts .find-box-search :input").keypress(function(a){return 13==a.which?(findPosts.send(),!1):void 0}),a("#find-posts-search").click(findPosts.send),a("#find-posts-close").click(findPosts.close),a("#doaction, #doaction2").click(function(b){a('select[name^="action"]').each(function(){"attach"==a(this).val()&&(b.preventDefault(),findPosts.open())})})}),a(window).resize(function(){a(".find-box-inside").css({"max-height":a(window).height()-174+"px"})})}(jQuery);
|
||||
var findPosts;!function(a){findPosts={open:function(b,c){var d=a(".ui-find-overlay");return 0===d.length&&(a("body").append('<div class="ui-find-overlay"></div>'),findPosts.overlay()),d.show(),b&&c&&a("#affected").attr("name",b).val(c),a("#find-posts").show(),a("#find-posts-input").focus().keyup(function(a){27==a.which&&findPosts.close()}),findPosts.send(),!1},close:function(){a("#find-posts-response").html(""),a("#find-posts").hide(),a(".ui-find-overlay").hide()},overlay:function(){a(".ui-find-overlay").on("click",function(){findPosts.close()})},send:function(){var b={ps:a("#find-posts-input").val(),action:"find_posts",_ajax_nonce:a("#_ajax_nonce").val()},c=a(".find-box-search .spinner");c.show(),a.ajax(ajaxurl,{type:"POST",data:b,dataType:"json"}).always(function(){c.hide()}).done(function(b){b.success||a("#find-posts-response").text(attachMediaBoxL10n.error),a("#find-posts-response").html(b.data)}).fail(function(){a("#find-posts-response").text(attachMediaBoxL10n.error)})}},a(document).ready(function(){a("#find-posts-submit").click(function(b){a('#find-posts-response input[type="radio"]:checked').length||b.preventDefault()}),a("#find-posts .find-box-search :input").keypress(function(a){return 13==a.which?(findPosts.send(),!1):void 0}),a("#find-posts-search").click(findPosts.send),a("#find-posts-close").click(findPosts.close),a("#doaction, #doaction2").click(function(b){a('select[name^="action"]').each(function(){"attach"===a(this).val()&&(b.preventDefault(),findPosts.open())})}),a(".find-box-inside").on("click","tr",function(){a(this).find(".found-radio input").prop("checked",!0)})})}(jQuery);
|
|
@ -141,12 +141,8 @@ $wp_list_table->prepare_items();
|
|||
$title = __('Media Library');
|
||||
$parent_file = 'upload.php';
|
||||
|
||||
wp_enqueue_script( 'wp-ajax-response' );
|
||||
wp_enqueue_script( 'jquery-ui-draggable' );
|
||||
wp_enqueue_script( 'media' );
|
||||
|
||||
add_action( 'admin_print_footer_scripts', 'find_posts_div' );
|
||||
|
||||
add_screen_option( 'per_page', array('label' => _x( 'Media items', 'items per page (screen options)' )) );
|
||||
|
||||
get_current_screen()->add_help_tab( array(
|
||||
|
@ -240,10 +236,10 @@ if ( !empty($message) ) { ?>
|
|||
|
||||
<?php $wp_list_table->display(); ?>
|
||||
|
||||
<div id="ajax-response"></div>
|
||||
<?php find_posts_div(); ?>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div id="ajax-response"></div>
|
||||
|
||||
<?php
|
||||
include( ABSPATH . 'wp-admin/admin-footer.php' );
|
||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 440 B |
Binary file not shown.
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 290 B |
|
@ -493,7 +493,10 @@ function wp_default_scripts( &$scripts ) {
|
|||
|
||||
$scripts->add( 'list-revisions', "/wp-includes/js/wp-list-revisions$suffix.js" );
|
||||
|
||||
$scripts->add( 'media', "/wp-admin/js/media$suffix.js", array( 'jquery-ui-draggable' ), false, 1 );
|
||||
$scripts->add( 'media', "/wp-admin/js/media$suffix.js", array( 'jquery' ), false, 1 );
|
||||
did_action( 'init' ) && $scripts->localize( 'media', 'attachMediaBoxL10n', array(
|
||||
'error' => __( 'An error has occured. Please reload the page and try again.' )
|
||||
));
|
||||
|
||||
$scripts->add( 'image-edit', "/wp-admin/js/image-edit$suffix.js", array('jquery', 'json2', 'imgareaselect'), false, 1 );
|
||||
did_action( 'init' ) && $scripts->localize( 'image-edit', 'imageEditL10n', array(
|
||||
|
|
Loading…
Reference in New Issue