Auto-column switching for the dashboard (js based), see #18198
git-svn-id: https://develop.svn.wordpress.org/trunk@18667 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrew Ozz
parent
59f69e6ea3
commit
13c777eb39
|
|
@ -98,6 +98,9 @@ if ( is_admin_bar_showing() )
|
|||
if ( is_rtl() )
|
||||
$admin_body_class .= ' rtl';
|
||||
|
||||
if ( get_user_setting('responsive') )
|
||||
$admin_body_class .= ' responsive';
|
||||
|
||||
$admin_body_class .= ' branch-' . str_replace( array( '.', ',' ), '-', floatval( $wp_version ) );
|
||||
$admin_body_class .= ' version-' . str_replace( '.', '-', preg_replace( '/^([.0-9]+).*/', '$1', $wp_version ) );
|
||||
$admin_body_class .= ' admin-color-' . sanitize_html_class( get_user_option( 'admin_color' ), 'fresh' );
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -117,7 +117,7 @@ TABLE OF CONTENTS:
|
|||
position: relative;
|
||||
}
|
||||
|
||||
.wide-window .responsive .inner-sidebar {
|
||||
.wide-window.responsive .inner-sidebar {
|
||||
margin-right: -870px;
|
||||
width: 100%;
|
||||
display: block;
|
||||
|
|
@ -128,7 +128,7 @@ TABLE OF CONTENTS:
|
|||
min-height: 300px;
|
||||
}
|
||||
|
||||
.wide-window .responsive .inner-sidebar #side-sortables {
|
||||
.wide-window.responsive .inner-sidebar #side-sortables {
|
||||
min-width: 280px;
|
||||
max-width: 480px;
|
||||
width: auto;
|
||||
|
|
@ -251,12 +251,7 @@ body {
|
|||
font-family: sans-serif;
|
||||
font-size: 12px;
|
||||
line-height: 1.4em;
|
||||
min-width: 950px; /* to do, responsive admin */
|
||||
}
|
||||
|
||||
body.post-php,
|
||||
body.index-php {
|
||||
min-width: 560px;
|
||||
min-width: 600px; /* to do, responsive admin */
|
||||
}
|
||||
|
||||
td,
|
||||
|
|
@ -2106,8 +2101,11 @@ body.admin-bar #adminmenu {
|
|||
float: left;
|
||||
}
|
||||
|
||||
.postbox-container .meta-box-sortables {
|
||||
min-height: 300px;
|
||||
#postbox-container-1 .meta-box-sortables:first-child,
|
||||
#postbox-container-2 .meta-box-sortables:first-child,
|
||||
#postbox-container-3 .meta-box-sortables:first-child,
|
||||
#postbox-container-4 .meta-box-sortables:first-child {
|
||||
min-height: 200px;
|
||||
}
|
||||
|
||||
.postbox .hndle {
|
||||
|
|
|
|||
|
|
@ -193,7 +193,7 @@ if ( 'post' == $post_type ) {
|
|||
require_once('./admin-header.php');
|
||||
?>
|
||||
|
||||
<div class="wrap<?php if ( $screen_layout_columns == 'auto' ) echo ' responsive'; ?>">
|
||||
<div class="wrap">
|
||||
<?php screen_icon(); ?>
|
||||
<h2><?php echo esc_html( $title ); ?><?php if ( isset( $post_new_file ) ) : ?> <a href="<?php echo esc_url( $post_new_file ) ?>" class="add-new-h2"><?php echo esc_html($post_type_object->labels->add_new); ?></a><?php endif; ?></h2>
|
||||
<?php if ( $notice ) : ?>
|
||||
|
|
|
|||
|
|
@ -52,7 +52,7 @@ include (ABSPATH . 'wp-admin/admin-header.php');
|
|||
$today = current_time('mysql', 1);
|
||||
?>
|
||||
|
||||
<div class="wrap<?php if ( $screen_layout_columns == 'auto' ) echo ' responsive'; ?>">
|
||||
<div class="wrap">
|
||||
<?php screen_icon(); ?>
|
||||
<h2><?php echo esc_html( $title ); ?></h2>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
var showNotice, adminMenu, columns, validateForm, screenMeta;
|
||||
var showNotice, adminMenu, columns, validateForm, screenMeta, autofold_menu;
|
||||
(function($){
|
||||
// sidebar admin menu
|
||||
adminMenu = {
|
||||
|
|
@ -346,6 +346,19 @@ $(document).ready( function() {
|
|||
});
|
||||
}
|
||||
|
||||
// auto-fold the menu when screen is under 800px
|
||||
$(window).bind('resize.autofold', function(){
|
||||
if ( getUserSetting('mfold') == 'f' )
|
||||
return;
|
||||
|
||||
var w = $(window).width();
|
||||
|
||||
if ( w <= 800 ) // fold admin menu
|
||||
$(document.body).addClass('folded');
|
||||
else
|
||||
$(document.body).removeClass('folded');
|
||||
|
||||
}).triggerHandler('resize');
|
||||
});
|
||||
|
||||
// internal use
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -1,4 +1,4 @@
|
|||
var postboxes, wp_auto_columns, wpAutoColumns = false;
|
||||
var postboxes;
|
||||
|
||||
(function($) {
|
||||
postboxes = {
|
||||
|
|
@ -40,31 +40,24 @@ var postboxes, wp_auto_columns, wpAutoColumns = false;
|
|||
}
|
||||
postboxes.save_state(page);
|
||||
} );
|
||||
|
||||
$('.columns-prefs input[type="radio"]').click(function(){
|
||||
var num = $(this).val(), i, el, ps = $('#poststuff'), wrap = $('.wrap');
|
||||
var num = $(this).val(), ps = $('#poststuff');
|
||||
|
||||
if ( num == 'auto' ) {
|
||||
wrap.addClass('responsive');
|
||||
setUserSetting('responsive', '1');
|
||||
$(document.body).addClass('responsive');
|
||||
$(window).bind('resize.responsive', function(){ postboxes.auto_columns(); });
|
||||
|
||||
if ( ps.length ) {
|
||||
if ( ps.length )
|
||||
wrap.removeClass('columns-1').removeClass('columns-2');
|
||||
ps.addClass('has-right-sidebar')
|
||||
|
||||
if ( !$('#side-info-column #side-sortables').length )
|
||||
$('#side-info-column').append( $('#side-sortables') );
|
||||
|
||||
if ( typeof(wp_auto_columns) == 'function' ) {
|
||||
wpAutoColumns = true;
|
||||
wp_auto_columns();
|
||||
}
|
||||
} else {
|
||||
$('#normal-sortables').append( $('#side-sortables, #column3-sortables, #column4-sortables').children('.postbox') );
|
||||
$('#postbox-container-2, #postbox-container-3, #postbox-container-4').hide();
|
||||
$('#postbox-container-1').css('width', '100%');
|
||||
}
|
||||
postboxes.auto_columns();
|
||||
|
||||
} else {
|
||||
wrap.removeClass('responsive');
|
||||
num = parseInt(num, 10);
|
||||
deleteUserSetting('responsive');
|
||||
$(document.body).removeClass('responsive');
|
||||
|
||||
if ( ps.length ) { // write pages
|
||||
|
||||
|
|
@ -74,6 +67,7 @@ var postboxes, wp_auto_columns, wpAutoColumns = false;
|
|||
|
||||
if ( !$('#side-info-column #side-sortables').length )
|
||||
$('#side-info-column').append( $('#side-sortables') );
|
||||
|
||||
} else if ( num == 1 ) {
|
||||
wrap.removeClass('columns-2').addClass('columns-1');
|
||||
ps.removeClass('has-right-sidebar');
|
||||
|
|
@ -81,43 +75,11 @@ var postboxes, wp_auto_columns, wpAutoColumns = false;
|
|||
}
|
||||
|
||||
} else { // dashboard
|
||||
|
||||
for ( i = 4; ( i > num && i > 1 ); i-- ) {
|
||||
el = $('#' + colname(i) + '-sortables');
|
||||
$('#' + colname(i-1) + '-sortables').append(el.children('.postbox'));
|
||||
el.parent().hide();
|
||||
}
|
||||
|
||||
for ( i = 1; i <= num; i++ ) {
|
||||
el = $('#' + colname(i) + '-sortables');
|
||||
if ( el.parent().is(':hidden') )
|
||||
el.addClass('temp-border').parent().show();
|
||||
}
|
||||
|
||||
$('.postbox-container:visible').css('width', 100/num + '%');
|
||||
postboxes._dash_columns(num);
|
||||
}
|
||||
}
|
||||
postboxes.save_order(page);
|
||||
});
|
||||
|
||||
function colname(n) {
|
||||
switch (n) {
|
||||
case 1:
|
||||
return 'normal';
|
||||
break
|
||||
case 2:
|
||||
return 'side';
|
||||
break
|
||||
case 3:
|
||||
return 'column3';
|
||||
break
|
||||
case 4:
|
||||
return 'column4';
|
||||
break
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
init : function(page, args) {
|
||||
|
|
@ -177,30 +139,13 @@ var postboxes, wp_auto_columns, wpAutoColumns = false;
|
|||
} );
|
||||
$.post( ajaxurl, postVars );
|
||||
},
|
||||
|
||||
auto_columns : function() { // responsive admin
|
||||
var pb, dw;
|
||||
|
||||
/* Callbacks */
|
||||
pbshow : false,
|
||||
|
||||
pbhide : false
|
||||
};
|
||||
|
||||
$(document).ready(function(){
|
||||
|
||||
// responsive admin
|
||||
wpAutoColumns = $('#wp_auto_columns').prop('checked');
|
||||
|
||||
wp_auto_columns = function() {
|
||||
var w = $(window).width(), pb, dw, num = 1;
|
||||
|
||||
if ( !wpAutoColumns )
|
||||
if ( !$(document.body).hasClass('responsive') )
|
||||
return;
|
||||
|
||||
if ( w <= 680 )
|
||||
$(document.body).addClass('folded');
|
||||
|
||||
if ( w > 680 && getUserSetting('mfold') != 'f' )
|
||||
$(document.body).removeClass('folded');
|
||||
|
||||
if ( adminpage == 'post-php' ) {
|
||||
pb = $('#post-body').width();
|
||||
|
||||
|
|
@ -219,43 +164,91 @@ var postboxes, wp_auto_columns, wpAutoColumns = false;
|
|||
$(document.body).addClass('wide-window');
|
||||
}
|
||||
|
||||
} else if ( adminpage == 'index-php' ) {
|
||||
dw = $('#dashboard-widgets-wrap').width();
|
||||
|
||||
if ( dw < 700 ) {
|
||||
this._dash_columns(1)
|
||||
}
|
||||
|
||||
if ( dw >= 700 && dw < 1100 ) {
|
||||
this._dash_columns(2)
|
||||
}
|
||||
|
||||
if ( dw >= 1100 && dw < 1500 ) {
|
||||
this._dash_columns(3)
|
||||
}
|
||||
|
||||
if ( dw >= 1500 ) {
|
||||
this._dash_columns(4)
|
||||
}
|
||||
}
|
||||
/*
|
||||
else if ( adminpage == 'index-php' ) {
|
||||
dw = $('#dashboard-widgets').width();
|
||||
|
||||
if ( dw < 800 ) {
|
||||
$('#postbox-container-2').hide();
|
||||
$('#normal-sortables').after( $('#side-sortables') );
|
||||
num = 1;
|
||||
}
|
||||
},
|
||||
|
||||
if ( dw >= 800 && dw < 1200 ) {
|
||||
$('#postbox-container-2').show().append( $('#side-sortables') );
|
||||
$('#postbox-container-3').hide();
|
||||
$('#side-sortables').after( $('#column3-sortables') );
|
||||
num = 2;
|
||||
}
|
||||
_dash_columns : function(n) {
|
||||
|
||||
if ( dw >= 1200 && dw < 1600 ) {
|
||||
$('#postbox-container-3').show().append( $('#column3-sortables') );
|
||||
switch (n) {
|
||||
case 1:
|
||||
$('#postbox-container-1').append( $('#side-sortables, #column3-sortables, #column4-sortables') );
|
||||
$('#postbox-container-2, #postbox-container-3, #postbox-container-4').hide();
|
||||
break
|
||||
case 2:
|
||||
$('#postbox-container-2').append( $('#side-sortables, #column3-sortables, #column4-sortables') ).show();
|
||||
$('#postbox-container-3, #postbox-container-4').hide();
|
||||
break
|
||||
case 3:
|
||||
$('#postbox-container-2').append( $('#side-sortables') ).show();
|
||||
$('#postbox-container-3').append( $('#column3-sortables, #column4-sortables') ).show();
|
||||
$('#postbox-container-4').hide();
|
||||
$('#column3-sortables').after( $('#column4-sortables') );
|
||||
num = 3;
|
||||
}
|
||||
|
||||
if ( dw >= 1600 ) {
|
||||
$('#postbox-container-4').show().append( $('#column4-sortables') );
|
||||
num = 4;
|
||||
}
|
||||
|
||||
$('.postbox-container:visible').css('width', 100/num + '%');
|
||||
break
|
||||
case 4:
|
||||
$('#postbox-container-2').append( $('#side-sortables') ).show();
|
||||
$('#postbox-container-3').append( $('#column3-sortables') ).show();
|
||||
$('#postbox-container-4').append( $('#column4-sortables') ).show();
|
||||
break
|
||||
default:
|
||||
return;
|
||||
}
|
||||
*/
|
||||
}
|
||||
|
||||
$(window).resize(function(){ wp_auto_columns(); });
|
||||
wp_auto_columns();
|
||||
$('.postbox-container:visible').css('width', 100/n + '%');
|
||||
},
|
||||
|
||||
_colname : function(n) {
|
||||
switch (n) {
|
||||
case 1:
|
||||
return 'normal';
|
||||
break
|
||||
case 2:
|
||||
return 'side';
|
||||
break
|
||||
case 3:
|
||||
return 'column3';
|
||||
break
|
||||
case 4:
|
||||
return 'column4';
|
||||
break
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
},
|
||||
|
||||
/* Callbacks */
|
||||
pbshow : false,
|
||||
|
||||
pbhide : false
|
||||
};
|
||||
|
||||
$(document).ready(function(){
|
||||
if ( $('#wp_auto_columns').prop('checked') ) {
|
||||
setUserSetting('responsive', '1');
|
||||
$(document.body).addClass('responsive');
|
||||
}
|
||||
|
||||
if ( $(document.body).hasClass('responsive') ) {
|
||||
$(window).bind('resize.responsive', function(){ postboxes.auto_columns(); });
|
||||
postboxes.auto_columns();
|
||||
}
|
||||
});
|
||||
|
||||
}(jQuery));
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -61,7 +61,7 @@ function wp_default_scripts( &$scripts ) {
|
|||
|
||||
$scripts->add( 'utils', "/wp-admin/js/utils$suffix.js", false, '20101110' );
|
||||
|
||||
$scripts->add( 'common', "/wp-admin/js/common$suffix.js", array('jquery', 'hoverIntent', 'utils'), '20110829', 1 );
|
||||
$scripts->add( 'common', "/wp-admin/js/common$suffix.js", array('jquery', 'hoverIntent', 'utils'), '20110913', 1 );
|
||||
$scripts->add_script_data( 'common', 'commonL10n', array(
|
||||
'warnDelete' => __("You are about to permanently delete the selected items.\n 'Cancel' to stop, 'OK' to delete.")
|
||||
) );
|
||||
|
|
@ -279,7 +279,7 @@ function wp_default_scripts( &$scripts ) {
|
|||
|
||||
$scripts->add( 'xfn', "/wp-admin/js/xfn$suffix.js", array('jquery'), '20110524', 1 );
|
||||
|
||||
$scripts->add( 'postbox', "/wp-admin/js/postbox$suffix.js", array('jquery-ui-sortable'), '20110830', 1 );
|
||||
$scripts->add( 'postbox', "/wp-admin/js/postbox$suffix.js", array('jquery-ui-sortable'), '20110913', 1 );
|
||||
|
||||
$scripts->add( 'post', "/wp-admin/js/post$suffix.js", array('suggest', 'wp-lists', 'postbox'), '20110524', 1 );
|
||||
$scripts->add_script_data( 'post', 'postL10n', array(
|
||||
|
|
@ -402,7 +402,7 @@ function wp_default_styles( &$styles ) {
|
|||
// Any rtl stylesheets that don't have a .dev version for ltr
|
||||
$no_suffix = array( 'farbtastic' );
|
||||
|
||||
$styles->add( 'wp-admin', "/wp-admin/css/wp-admin$suffix.css", array(), '20110912' );
|
||||
$styles->add( 'wp-admin', "/wp-admin/css/wp-admin$suffix.css", array(), '20110913' );
|
||||
|
||||
$styles->add( 'ie', "/wp-admin/css/ie$suffix.css", array('wp-admin'), '20110902' );
|
||||
$styles->add_data( 'ie', 'conditional', 'lte IE 7' );
|
||||
|
|
|
|||
Loading…
Reference in New Issue