golem
/
twentyGOLEM
9
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Responsive admin improvements for the dashboard, new/write screens and links screens, see #18198 

git-svn-id: http://svn.automattic.com/wordpress/trunk@18736 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
azaozz 2011-09-21 06:16:24 +00:00
parent 0fd3915e9f
commit ffca93b1f2
11 changed files with 112 additions and 106 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
wp-admin/admin-header.php
View File

@ -48,7 +48,6 @@ wp_enqueue_script('utils');
$admin_body_class = preg_replace('/[^a-z0-9_-]+/i', '-', $hook_suffix); $admin_body_class = preg_replace('/[^a-z0-9_-]+/i', '-', $hook_suffix);
?> ?>
<script type="text/javascript"> <script type="text/javascript">
//<![CDATA[
addLoadEvent = function(func){if(typeof jQuery!="undefined")jQuery(document).ready(func);else if(typeof wpOnload!='function'){wpOnload=func;}else{var oldonload=wpOnload;wpOnload=function(){oldonload();func();}}}; addLoadEvent = function(func){if(typeof jQuery!="undefined")jQuery(document).ready(func);else if(typeof wpOnload!='function'){wpOnload=func;}else{var oldonload=wpOnload;wpOnload=function(){oldonload();func();}}};
var userSettings = { var userSettings = {
'url': '<?php echo SITECOOKIEPATH; ?>', 'url': '<?php echo SITECOOKIEPATH; ?>',
@ -62,20 +61,6 @@ var userSettings = {
thousandsSeparator = '<?php echo addslashes( $wp_locale->number_format['thousands_sep'] ); ?>', thousandsSeparator = '<?php echo addslashes( $wp_locale->number_format['thousands_sep'] ); ?>',
decimalPoint = '<?php echo addslashes( $wp_locale->number_format['decimal_point'] ); ?>', decimalPoint = '<?php echo addslashes( $wp_locale->number_format['decimal_point'] ); ?>',
isRtl = <?php echo (int) is_rtl(); ?>; isRtl = <?php echo (int) is_rtl(); ?>;
function wp_set_width_class() {
var w = document.body.clientWidth, bc = document.body.className;
if ( w <= 680 )
document.body.className = bc.replace(/ (small|narrow|medium|wide)-window/, '') + ' small-window';
else if ( w > 680 && w <= 950 )
document.body.className = bc.replace(/ (small|narrow|medium|wide)-window/, '') + ' narrow-window';
else if ( w > 950 && w <= 1300 )
document.body.className = bc.replace(/ (small|narrow|medium|wide)-window/, '') + ' medium-window';
else
document.body.className = bc.replace(/ (small|narrow|medium|wide)-window/, '') + ' wide-window';
}
//]]>
</script> </script>
<?php <?php
@ -98,9 +83,6 @@ if ( is_admin_bar_showing() )
if ( is_rtl() ) if ( is_rtl() )
$admin_body_class .= ' 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 .= ' branch-' . str_replace( array( '.', ',' ), '-', floatval( $wp_version ) );
$admin_body_class .= ' version-' . str_replace( '.', '-', preg_replace( '/^([.0-9]+).*/', '$1', $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' ); $admin_body_class .= ' admin-color-' . sanitize_html_class( get_user_option( 'admin_color' ), 'fresh' );
@ -112,7 +94,8 @@ if ( $is_iphone ) { ?>
<body class="wp-admin no-js <?php echo apply_filters( 'admin_body_class', '' ) . " $admin_body_class"; ?>"> <body class="wp-admin no-js <?php echo apply_filters( 'admin_body_class', '' ) . " $admin_body_class"; ?>">
<script type="text/javascript"> <script type="text/javascript">
document.body.className = document.body.className.replace(/no-js/, 'js'); document.body.className = document.body.className.replace(/no-js/, 'js');
wp_set_width_class(); if ( document.body.clientWidth > 1300 )
document.body.className += ' wide-window';
</script> </script>
<div id="wpwrap"> <div id="wpwrap">

2
wp-admin/css/wp-admin.css
View File

File diff suppressed because one or more lines are too long

46
wp-admin/css/wp-admin.dev.css
View File

@ -117,22 +117,33 @@ TABLE OF CONTENTS:
position: relative; position: relative;
} }
.wide-window.responsive .inner-sidebar { .wide-window .inner-sidebar {
margin-right: -870px; margin-right: -870px;
width: 100%; width: 100%;
display: block; display: block;
} }
.inner-sidebar #side-sortables { .columns-2 .inner-sidebar,
width: 280px; .wide-window .columns-2 .inner-sidebar {
min-height: 300px; margin-right: auto;
width: 286px;
display: block;
} }
.wide-window.responsive .inner-sidebar #side-sortables { .inner-sidebar #side-sortables {
min-height: 300px;
min-width: 280px; min-width: 280px;
max-width: 480px; max-width: 480px;
width: auto; width: auto;
padding-right: 870px; }
.wide-window .inner-sidebar #side-sortables {
margin-right: 870px;
}
.columns-2 .inner-sidebar #side-sortables {
width: 280px;
padding: 0;
} }
.has-right-sidebar .inner-sidebar { .has-right-sidebar .inner-sidebar {
@ -150,13 +161,24 @@ TABLE OF CONTENTS:
margin-right: 300px; margin-right: 300px;
} }
.responsive #post-body-content { #post-body-content {
max-width: 850px; max-width: 850px;
min-width: 465px;
}
.columns-1 #post-body-content,
.columns-2 #post-body-content {
max-width: none;
} }
#side-sortables:empty { #side-sortables:empty {
border: 3px dashed #ccc; border: 3px dashed #ccc;
height: 800px; height: 500px;
}
#post-body-content #side-sortables:empty {
border: 0 none;
height: 0;
} }
/* 2 columns main area */ /* 2 columns main area */
@ -1934,11 +1956,9 @@ body.admin-bar #adminmenu {
float: left; float: left;
} }
#postbox-container-1 .meta-box-sortables:first-child, .postbox-container .meta-box-sortables:empty:first-child {
#postbox-container-2 .meta-box-sortables:first-child, border: 3px dashed #CCCCCC;
#postbox-container-3 .meta-box-sortables:first-child, height: 300px;
#postbox-container-4 .meta-box-sortables:first-child {
min-height: 200px;
} }
.postbox .hndle { .postbox .hndle {

16
wp-admin/edit-form-advanced.php
View File

@ -160,7 +160,7 @@ do_action('do_meta_boxes', $post_type, 'normal', $post);
do_action('do_meta_boxes', $post_type, 'advanced', $post); do_action('do_meta_boxes', $post_type, 'advanced', $post);
do_action('do_meta_boxes', $post_type, 'side', $post); do_action('do_meta_boxes', $post_type, 'side', $post);
add_screen_option('layout_columns', array('max' => 2) ); add_screen_option('layout_columns', array('max' => 2, 'default' => 'auto') );
if ( 'post' == $post_type ) { if ( 'post' == $post_type ) {
add_contextual_help($current_screen, add_contextual_help($current_screen,
@ -193,7 +193,7 @@ if ( 'post' == $post_type ) {
require_once('./admin-header.php'); require_once('./admin-header.php');
?> ?>
<div class="wrap"> <div class="wrap columns-<?php echo (int) $screen_layout_columns ? (int) $screen_layout_columns : 'auto'; ?>">
<?php screen_icon(); ?> <?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> <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 ) : ?> <?php if ( $notice ) : ?>
@ -224,10 +224,11 @@ wp_nonce_field( 'closedpostboxes', 'closedpostboxesnonce', false );
<div id="poststuff" class="metabox-holder<?php echo 1 != $screen_layout_columns ? ' has-right-sidebar' : ''; ?>"> <div id="poststuff" class="metabox-holder<?php echo 1 != $screen_layout_columns ? ' has-right-sidebar' : ''; ?>">
<div id="side-info-column" class="inner-sidebar"> <div id="side-info-column" class="inner-sidebar">
<?php <?php
('page' == $post_type) ? do_action('submitpage_box') : do_action('submitpost_box'); if ( 1 != $screen_layout_columns ) {
$side_meta_boxes = do_meta_boxes($post_type, 'side', $post); ('page' == $post_type) ? do_action('submitpage_box') : do_action('submitpost_box');
$side_meta_boxes = do_meta_boxes($post_type, 'side', $post);
}
?> ?>
</div> </div>
@ -291,6 +292,11 @@ wp_nonce_field( 'samplepermalink', 'samplepermalinknonce', false );
<?php <?php
} }
if ( 1 == $screen_layout_columns ) {
('page' == $post_type) ? do_action('submitpage_box') : do_action('submitpost_box');
$side_meta_boxes = do_meta_boxes($post_type, 'side', $post);
}
do_meta_boxes($post_type, 'normal', $post); do_meta_boxes($post_type, 'normal', $post);
( 'page' == $post_type ) ? do_action('edit_page_form') : do_action('edit_form_advanced'); ( 'page' == $post_type ) ? do_action('edit_page_form') : do_action('edit_form_advanced');

22
wp-admin/edit-link-form.php
View File

@ -37,7 +37,7 @@ do_action('do_meta_boxes', 'link', 'normal', $link);
do_action('do_meta_boxes', 'link', 'advanced', $link); do_action('do_meta_boxes', 'link', 'advanced', $link);
do_action('do_meta_boxes', 'link', 'side', $link); do_action('do_meta_boxes', 'link', 'side', $link);
add_screen_option('layout_columns', array('max' => 2) ); add_screen_option('layout_columns', array('max' => 2, 'default' => 'auto') );
add_contextual_help($current_screen, add_contextual_help($current_screen,
'<p>' . __( 'You can add or edit links on this screen by entering information in each of the boxes. Only the link&#8217;s web address and name (the text you want to display on your site as the link) are required fields.' ) . '</p>' . '<p>' . __( 'You can add or edit links on this screen by entering information in each of the boxes. Only the link&#8217;s web address and name (the text you want to display on your site as the link) are required fields.' ) . '</p>' .
@ -49,9 +49,9 @@ add_contextual_help($current_screen,
); );
require_once ('admin-header.php'); require_once ('admin-header.php');
?> ?>
<div class="wrap">
<div class="wrap columns-<?php echo (int) $screen_layout_columns ? (int) $screen_layout_columns : 'auto'; ?>">
<?php screen_icon(); ?> <?php screen_icon(); ?>
<h2><?php echo esc_html( $title ); ?> <a href="link-add.php" class="add-new-h2"><?php echo esc_html_x('Add New', 'link'); ?></a></h2> <h2><?php echo esc_html( $title ); ?> <a href="link-add.php" class="add-new-h2"><?php echo esc_html_x('Add New', 'link'); ?></a></h2>
@ -69,14 +69,13 @@ wp_nonce_field( $nonce_action );
wp_nonce_field( 'closedpostboxes', 'closedpostboxesnonce', false ); wp_nonce_field( 'closedpostboxes', 'closedpostboxesnonce', false );
wp_nonce_field( 'meta-box-order', 'meta-box-order-nonce', false ); ?> wp_nonce_field( 'meta-box-order', 'meta-box-order-nonce', false ); ?>
<div id="poststuff" class="metabox-holder<?php echo 2 == $screen_layout_columns ? ' has-right-sidebar' : ''; ?>"> <div id="poststuff" class="metabox-holder<?php echo 1 != $screen_layout_columns ? ' has-right-sidebar' : ''; ?>">
<div id="side-info-column" class="inner-sidebar"> <div id="side-info-column" class="inner-sidebar">
<?php <?php
if ( 1 != $screen_layout_columns ) {
do_action('submitlink_box'); do_action('submitlink_box');
$side_meta_boxes = do_meta_boxes( 'link', 'side', $link ); $side_meta_boxes = do_meta_boxes( 'link', 'side', $link );
}
?> ?>
</div> </div>
@ -108,6 +107,11 @@ $side_meta_boxes = do_meta_boxes( 'link', 'side', $link );
<?php <?php
if ( 1 == $screen_layout_columns ) {
do_action('submitlink_box');
$side_meta_boxes = do_meta_boxes( 'link', 'side', $link );
}
do_meta_boxes('link', 'normal', $link); do_meta_boxes('link', 'normal', $link);
do_meta_boxes('link', 'advanced', $link); do_meta_boxes('link', 'advanced', $link);

4
wp-admin/includes/template.php
View File

@ -1874,7 +1874,7 @@ function screen_layout($screen) {
if ( isset($wp_current_screen_options['layout_columns']['default']) ) if ( isset($wp_current_screen_options['layout_columns']['default']) )
$screen_layout_columns = $wp_current_screen_options['layout_columns']['default']; $screen_layout_columns = $wp_current_screen_options['layout_columns']['default'];
else else
$screen_layout_columns = '0'; $screen_layout_columns = 'auto';
} }
$i = 1; $i = 1;
@ -2270,4 +2270,4 @@ jQuery(document).ready( function($) {
//]]> //]]>
</script> </script>
<?php <?php
} }

2
wp-admin/index.php
View File

@ -25,7 +25,7 @@ $parent_file = 'index.php';
if ( is_user_admin() ) if ( is_user_admin() )
add_screen_option('layout_columns', array('max' => 4, 'default' => 1) ); add_screen_option('layout_columns', array('max' => 4, 'default' => 1) );
else else
add_screen_option('layout_columns', array('max' => 4, 'default' => 2) ); add_screen_option('layout_columns', array('max' => 4, 'default' => 'auto') );
add_contextual_help($current_screen, add_contextual_help($current_screen,

97
wp-admin/js/postbox.dev.js
View File

@ -2,30 +2,36 @@ var postboxes;
(function($) { (function($) {
postboxes = { postboxes = {
add_postbox_toggles : function(page,args) { add_postbox_toggles : function(page, args) {
this.init(page,args); this.init(page, args);
$('.postbox h3, .postbox .handlediv').click( function() { $('.postbox h3, .postbox .handlediv').click( function() {
var p = $(this).parent('.postbox'), id = p.attr('id'); var p = $(this).parent('.postbox'), id = p.attr('id');
if ( 'dashboard_browser_nag' == id ) if ( 'dashboard_browser_nag' == id )
return; return;
p.toggleClass('closed'); p.toggleClass('closed');
postboxes.save_state(page); postboxes.save_state(page);
if ( id ) { if ( id ) {
if ( !p.hasClass('closed') && $.isFunction(postboxes.pbshow) ) if ( !p.hasClass('closed') && $.isFunction(postboxes.pbshow) )
postboxes.pbshow(id); postboxes.pbshow(id);
else if ( p.hasClass('closed') && $.isFunction(postboxes.pbhide) ) else if ( p.hasClass('closed') && $.isFunction(postboxes.pbhide) )
postboxes.pbhide(id); postboxes.pbhide(id);
} }
} ); });
$('.postbox h3 a').click( function(e) { $('.postbox h3 a').click( function(e) {
e.stopPropagation(); e.stopPropagation();
} ); });
$('.postbox a.dismiss').click( function(e) { $('.postbox a.dismiss').click( function(e) {
var hide_id = $(this).parents('.postbox').attr('id') + '-hide'; var hide_id = $(this).parents('.postbox').attr('id') + '-hide';
$( '#' + hide_id ).prop('checked', false).triggerHandler('click'); $( '#' + hide_id ).prop('checked', false).triggerHandler('click');
return false; return false;
} ); });
$('.hide-postbox-tog').click( function() { $('.hide-postbox-tog').click( function() {
var box = $(this).val(); var box = $(this).val();
@ -39,39 +45,38 @@ var postboxes;
postboxes.pbhide( box ); postboxes.pbhide( box );
} }
postboxes.save_state(page); postboxes.save_state(page);
} ); });
$('.columns-prefs input[type="radio"]').click(function(){ $('.columns-prefs input[type="radio"]').click(function(){
var num = $(this).val(), ps = $('#poststuff'), wrap = $('.wrap').first(); var num = $(this).val(), ps = $('#poststuff');
if ( num == 'auto' ) { if ( num == 'auto' ) {
setUserSetting('responsive', '1');
$(document.body).addClass('responsive');
$(window).bind('resize.responsive', function(){ postboxes.auto_columns(); }); $(window).bind('resize.responsive', function(){ postboxes.auto_columns(); });
if ( ps.length ) if ( ps.length )
wrap.removeClass('columns-1').removeClass('columns-2'); $('.wrap').removeClass('columns-1').removeClass('columns-2');
postboxes.auto_columns(); postboxes.auto_columns();
} else { } else {
$(window).unbind('resize.responsive');
num = parseInt(num, 10); num = parseInt(num, 10);
deleteUserSetting('responsive');
$(document.body).removeClass('responsive');
if ( ps.length ) { // write pages if ( ps.length ) { // write pages
if ( num == 2 ) { if ( num == 2 ) {
wrap.removeClass('columns-1').addClass('columns-2'); $('.wrap').removeClass('columns-1').addClass('columns-2');
ps.addClass('has-right-sidebar'); ps.addClass('has-right-sidebar');
if ( !$('#side-info-column #side-sortables').length ) if ( !$('#side-info-column #side-sortables').length )
$('#side-info-column').append( $('#side-sortables') ); $('#side-info-column').append( $('#side-sortables') );
} else if ( num == 1 ) { } else if ( num == 1 ) {
wrap.removeClass('columns-2').addClass('columns-1'); $('.wrap').removeClass('columns-2').addClass('columns-1');
ps.removeClass('has-right-sidebar'); ps.removeClass('has-right-sidebar');
$('#normal-sortables').before( $('#side-sortables') );
if ( !$('#post-body-content #side-sortables').length )
$('#normal-sortables').before( $('#side-sortables') );
} }
} else { // dashboard } else { // dashboard
@ -141,49 +146,42 @@ var postboxes;
}, },
auto_columns : function() { // responsive admin auto_columns : function() { // responsive admin
var pb, dw; var poststuff = $('#poststuff'), width;
if ( !$(document.body).hasClass('responsive') ) if ( poststuff.length ) { // post-new, post, links, etc.
return; width = $('#post-body').width();
if ( adminpage == 'post-php' ) { if ( width < 800 ) {
pb = $('#post-body').width(); poststuff.removeClass('has-right-sidebar');
if ( pb < 800 ) { if ( !$('#post-body-content #side-sortables').length )
$('#poststuff').removeClass('has-right-sidebar'); $('#normal-sortables').before( $('#side-sortables') );
$('#normal-sortables').before( $('#side-sortables') );
} else {
poststuff.addClass('has-right-sidebar');
if ( !$('#side-info-column #side-sortables').length )
$('#side-info-column').append( $('#side-sortables') );
if ( width < 1150 )
$(document.body).removeClass('wide-window');
else
$(document.body).addClass('wide-window');
} }
if ( pb >= 800 && pb < 1150 ) { } else if ( $('#dashboard-widgets-wrap').length ) { // dashboard
$('#poststuff').addClass('has-right-sidebar'); width = $(window).width();
$('#side-info-column').append( $('#side-sortables') );
$(document.body).removeClass('wide-window');
}
if ( pb >= 1150 ) { if ( width < 950 ) {
$(document.body).addClass('wide-window');
}
} else if ( adminpage == 'index-php' ) {
dw = $('#dashboard-widgets-wrap').width();
if ( dw < 700 ) {
this._dash_columns(1) this._dash_columns(1)
} } else if ( width < 1300 ) {
if ( dw >= 700 && dw < 1100 ) {
this._dash_columns(2) this._dash_columns(2)
} } else if ( width < 1700 ) {
if ( dw >= 1100 && dw < 1500 ) {
this._dash_columns(3) this._dash_columns(3)
} } else {
if ( dw >= 1500 ) {
this._dash_columns(4) this._dash_columns(4)
} }
} }
}, },
_dash_columns : function(n) { _dash_columns : function(n) {
@ -240,12 +238,7 @@ var postboxes;
}; };
$(document).ready(function(){ $(document).ready(function(){
if ( $('#wp_auto_columns').prop('checked') ) { if ( !$('#wp_auto_columns').length || $('#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(); }); $(window).bind('resize.responsive', function(){ postboxes.auto_columns(); });
postboxes.auto_columns(); postboxes.auto_columns();
} }

2
wp-admin/js/postbox.js
View File

File diff suppressed because one or more lines are too long

2
wp-admin/network/index.php
View File

@ -38,7 +38,7 @@ wp_enqueue_script( 'dashboard' );
wp_enqueue_script( 'plugin-install' ); wp_enqueue_script( 'plugin-install' );
add_thickbox(); add_thickbox();
add_screen_option('layout_columns', array('max' => 4, 'default' => 2) ); add_screen_option('layout_columns', array('max' => 4, 'default' => 'auto') );
require_once( '../admin-header.php' ); require_once( '../admin-header.php' );

4
wp-includes/script-loader.php
View File

@ -283,7 +283,7 @@ function wp_default_scripts( &$scripts ) {
$scripts->add( 'xfn', "/wp-admin/js/xfn$suffix.js", array('jquery'), '20110524', 1 ); $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'), '20110916', 1 ); $scripts->add( 'postbox', "/wp-admin/js/postbox$suffix.js", array('jquery-ui-sortable'), '20110920', 1 );
$scripts->add( 'post', "/wp-admin/js/post$suffix.js", array('suggest', 'wp-lists', 'postbox'), '20110524', 1 ); $scripts->add( 'post', "/wp-admin/js/post$suffix.js", array('suggest', 'wp-lists', 'postbox'), '20110524', 1 );
$scripts->add_script_data( 'post', 'postL10n', array( $scripts->add_script_data( 'post', 'postL10n', array(
@ -406,7 +406,7 @@ function wp_default_styles( &$styles ) {
// Any rtl stylesheets that don't have a .dev version for ltr // Any rtl stylesheets that don't have a .dev version for ltr
$no_suffix = array( 'farbtastic' ); $no_suffix = array( 'farbtastic' );
$styles->add( 'wp-admin', "/wp-admin/css/wp-admin$suffix.css", array(), '20110919b' ); $styles->add( 'wp-admin', "/wp-admin/css/wp-admin$suffix.css", array(), '20110920' );
$styles->add( 'ie', "/wp-admin/css/ie$suffix.css", array(), '20110919' ); $styles->add( 'ie', "/wp-admin/css/ie$suffix.css", array(), '20110919' );
$styles->add_data( 'ie', 'conditional', 'lte IE 7' ); $styles->add_data( 'ie', 'conditional', 'lte IE 7' );