Clean up .button and .button[disabled] CSS classes, add spinner and gray-out buttons after clicking Publish or Update post.

git-svn-id: http://svn.automattic.com/wordpress/trunk@11874 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
azaozz 2009-08-25 05:14:49 +00:00
parent 8d4223adb3
commit e9ce147405
14 changed files with 145 additions and 107 deletions

File diff suppressed because one or more lines are too long

View File

@ -196,7 +196,7 @@ strong .post-com-count span {
}
.error,
#login #login_error {
.login #login_error {
background-color: #ffebe8;
border-color: #c00;
}
@ -298,6 +298,7 @@ input[type=submit]:hover {
.submit input,
.button-secondary {
background: #f2f2f2 url(../images/white-grad.png) repeat-x scroll left top;
text-shadow: rgba(255,255,255,1) 0 1px 0;
}
.button:active,
@ -306,46 +307,62 @@ input[type=submit]:hover {
background: #eee url(../images/white-grad-active.png) repeat-x scroll left top;
}
.button-primary,
.submit .button-primary,
#login form .submit input {
border-color: #5b86ab !important;
input.button-primary,
button.button-primary,
a.button-primary {
border-color: #5b86ab;
font-weight: bold;
color: #fff !important;
color: #fff;
background: #5580a6 url(../images/button-grad-vs.png) repeat-x scroll left top;
text-shadow: rgba(0,0,0,0.3) 0 -1px 0;
}
.button-primary:active,
#login form .submit input:active {
background: #21759b url(../images/button-grad-active-vs.png) repeat-x scroll left top !important;
input.button-primary:active,
button.button-primary:active,
a.button-primary:active {
background: #21759b url(../images/button-grad-active-vs.png) repeat-x scroll left top;
color: #eaf2fa;
}
input.button-primary:hover,
button.button-primary:hover,
a.button-primary:hover,
a.button-primary:focus,
a.button-primary:active {
border-color: #2e5475;
color: #eaf2fa;
}
.button-disabled,
.button[disabled],
.button:disabled,
.button-secondary[disabled],
.button-secondary:disabled,
a.button.disabled {
color: #ccc !important;
border-color: #ccc;
color: #aaa !important;
border-color: #bbb !important;
background: #ddd !important;
text-shadow: 1px 1px 2px white !important;
}
.button-primary-disabled,
.button-primary[disabled],
.button-primary:disabled {
color: #80a3d2 !important;
color: #B0C3E2 !important;
background: #6590A6 none repeat scroll 0 0 !important;
}
a:hover,
a:active,
a:focus {
color: #d54e21;
}
a:hover,
#wphead #viewsite a:hover,
#adminmenu a:hover,
#adminmenu ul.wp-submenu a:hover,
#the-comment-list .comment a:hover,
#rightnow a:hover,
#login form .submit input:hover,
#media-upload a.del-link:hover,
div.dashboard-widget-submit input:hover,
.subsubsub a:hover,
@ -366,12 +383,6 @@ div.dashboard-widget-submit input:hover,
background:#faf9f7 !important;
}
.button-primary:hover,
#login form .submit input:hover {
border-color: #2e5475 !important;
color: #eaf2fa !important;
}
#side-sortables #category-tabs .tabs a {
color: #333;
}
@ -425,7 +436,6 @@ a.delete {
}
.updated,
.login #login_error,
.login .message {
background-color: #ffffe0;
border-color: #e6db55;
@ -700,10 +710,6 @@ body.login {
color: #fff;
}
#login form input {
color: #555;
}
#user_info {
color: #b6d1e4;
}
@ -1500,20 +1506,6 @@ fieldset.inline-edit-col-right .inline-edit-col {
border-bottom-color: #626262;
}
.submit input,
.button,
.button-primary,
.button-secondary,
.button-highlighted,
#postcustomstuff .submit input {
text-shadow: rgba(255,255,255,1) 0 1px 0;
}
.button-primary,
.submit .button-primary {
text-shadow: rgba(0,0,0,0.3) 0 -1px 0;
}
#screen-meta a.show-settings {
background-color: transparent;
text-shadow: rgba(255,255,255,0.7) 0 1px 0;

File diff suppressed because one or more lines are too long

View File

@ -196,7 +196,7 @@ strong .post-com-count span {
}
.error,
#login #login_error {
.login #login_error {
background-color: #ffebe8;
border-color: #c00;
}
@ -298,6 +298,7 @@ input[type=submit]:hover {
.submit input,
.button-secondary {
background: #f2f2f2 url(../images/white-grad.png) repeat-x scroll left top;
text-shadow: rgba(255,255,255,1) 0 1px 0;
}
.button:active,
@ -306,46 +307,62 @@ input[type=submit]:hover {
background: #eee url(../images/white-grad-active.png) repeat-x scroll left top;
}
.button-primary,
.submit .button-primary,
#login form .submit input {
border-color: #298cba !important;
input.button-primary,
button.button-primary,
a.button-primary {
border-color: #298cba;
font-weight: bold;
color: #FFF !important;
color: #fff;
background: #21759B url(../images/button-grad.png) repeat-x scroll left top;
text-shadow: rgba(0,0,0,0.3) 0 -1px 0;
}
.button-primary:active,
#login form .submit input:active {
background: #21759b url(../images/button-grad-active.png) repeat-x scroll left top !important;
input.button-primary:active,
button.button-primary:active,
a.button-primary:active {
background: #21759b url(../images/button-grad-active.png) repeat-x scroll left top;
color: #eaf2fa;
}
input.button-primary:hover,
button.button-primary:hover,
a.button-primary:hover,
a.button-primary:focus,
a.button-primary:active {
border-color: #13455b;
color: #eaf2fa;
}
.button-disabled,
.button[disabled],
.button:disabled,
.button-secondary[disabled],
.button-secondary:disabled,
a.button.disabled {
color: #ccc !important;
border-color: #ccc;
color: #aaa !important;
border-color: #bbb !important;
background: #ddd !important;
text-shadow: 1px 1px 2px white !important;
}
.button-primary-disabled,
.button-primary[disabled],
.button-primary:disabled {
color: #2fa0d5 !important;
color: #9FD0D5 !important;
background: #298CBA none repeat scroll 0 0 !important;
}
a:hover,
a:active,
a:focus {
color: #d54e21;
}
a:hover,
#wphead #viewsite a:hover,
#adminmenu a:hover,
#adminmenu ul.wp-submenu a:hover,
#the-comment-list .comment a:hover,
#rightnow a:hover,
#login form .submit input:hover,
#media-upload a.del-link:hover,
div.dashboard-widget-submit input:hover,
.subsubsub a:hover,
@ -362,12 +379,6 @@ div.dashboard-widget-submit input:hover,
border-color: #dfdfdf;
}
.button-primary:hover,
#login form .submit input:hover {
border-color: #13455b !important;
color: #EAF2FA !important;
}
#side-sortables #category-tabs .tabs a {
color: #333;
}
@ -421,7 +432,6 @@ a.delete {
}
.updated,
.login #login_error,
.login .message {
background-color: #ffffe0;
border-color: #e6db55;
@ -695,10 +705,6 @@ body.login {
color: #fff;
}
#login form input {
color: #555;
}
#user_info {
color: #999;
}
@ -1489,20 +1495,6 @@ fieldset.inline-edit-col-right .inline-edit-col {
border-bottom-color: #626262;
}
.submit input,
.button,
.button-primary,
.button-secondary,
.button-highlighted,
#postcustomstuff .submit input {
text-shadow: rgba(255,255,255,1) 0 1px 0;
}
.button-primary,
.submit .button-primary {
text-shadow: rgba(0,0,0,0.3) 0 -1px 0;
}
#screen-meta a.show-settings {
background-color: transparent;
text-shadow: rgba(255,255,255,0.7) 0 1px 0;

View File

@ -403,3 +403,12 @@ table.ie-fixed {
height: 32px;
width: 40px;
}
#wpcontent .button-primary-disabled {
color: #9FD0D5;
background: #298CBA;
}
#wpcontent #ajax-loading {
vertical-align: baseline;
}

View File

@ -1 +1 @@
*{margin:0;padding:0;}body{border-top-width:30px;border-top-style:solid;font:11px "Lucida Grande",Verdana,Arial,"Bitstream Vera Sans",sans-serif;}form{margin-left:8px;padding:16px 16px 40px 16px;font-weight:normal;-moz-border-radius:11px;-khtml-border-radius:11px;-webkit-border-radius:11px;border-radius:5px;background:#fff;border:1px solid #e5e5e5;-moz-box-shadow:rgba(200,200,200,1) 0 4px 18px;-webkit-box-shadow:rgba(200,200,200,1) 0 4px 18px;-khtml-box-shadow:rgba(200,200,200,1) 0 4px 18px;box-shadow:rgba(200,200,200,1) 0 4px 18px;}form .forgetmenot{font-weight:normal;float:left;margin-bottom:0;}#login form .submit input{font-family:"Lucida Grande",Verdana,Arial,"Bitstream Vera Sans",sans-serif;padding:3px 10px;border:none;font-size:12px;border-width:1px;border-style:solid;-moz-border-radius:11px;-khtml-border-radius:11px;-webkit-border-radius:11px;border-radius:11px;cursor:pointer;text-decoration:none;margin-top:-3px;text-shadow:rgba(0,0,0,0.3) 0 -1px 0;}#login form p{margin-bottom:0;}label{color:#777;font-size:13px;}form .forgetmenot label{font-size:11px;line-height:19px;}form .submit{float:right;}form p{margin-bottom:24px;}h1 a{background:url(../images/logo-login.gif) no-repeat top center;width:326px;height:67px;text-indent:-9999px;overflow:hidden;padding-bottom:15px;display:block;}#nav{text-shadow:rgba(255,255,255,1) 0 1px 0;}#backtoblog a{position:absolute;top:7px;left:15px;text-decoration:none;}#login{width:320px;margin:7em auto;}#login_error,.message{margin:0 0 16px 8px;border-width:1px;border-style:solid;padding:12px;-moz-border-radius:3px;-khtml-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;}#nav{margin:0 0 0 8px;padding:16px;}#user_pass,#user_login,#user_email{font-size:24px;width:97%;padding:3px;margin-top:2px;margin-right:6px;margin-bottom:16px;border:1px solid #e5e5e5;background:#fbfbfb;}.clear{clear:both;}
*{margin:0;padding:0;}body{border-top-width:30px;border-top-style:solid;font:11px "Lucida Grande",Verdana,Arial,"Bitstream Vera Sans",sans-serif;}form{margin-left:8px;padding:16px 16px 40px 16px;font-weight:normal;-moz-border-radius:11px;-khtml-border-radius:11px;-webkit-border-radius:11px;border-radius:5px;background:#fff;border:1px solid #e5e5e5;-moz-box-shadow:rgba(200,200,200,1) 0 4px 18px;-webkit-box-shadow:rgba(200,200,200,1) 0 4px 18px;-khtml-box-shadow:rgba(200,200,200,1) 0 4px 18px;box-shadow:rgba(200,200,200,1) 0 4px 18px;}form .forgetmenot{font-weight:normal;float:left;margin-bottom:0;}.button-primary{font-family:"Lucida Grande",Verdana,Arial,"Bitstream Vera Sans",sans-serif;padding:3px 10px;border:none;font-size:12px;border-width:1px;border-style:solid;-moz-border-radius:11px;-khtml-border-radius:11px;-webkit-border-radius:11px;border-radius:11px;cursor:pointer;text-decoration:none;margin-top:-3px;}#login form p{margin-bottom:0;}label{color:#777;font-size:13px;}form .forgetmenot label{font-size:11px;line-height:19px;}form .submit{float:right;}form p{margin-bottom:24px;}h1 a{background:url(../images/logo-login.gif) no-repeat top center;width:326px;height:67px;text-indent:-9999px;overflow:hidden;padding-bottom:15px;display:block;}#nav{text-shadow:rgba(255,255,255,1) 0 1px 0;}#backtoblog a{position:absolute;top:7px;left:15px;text-decoration:none;}#login{width:320px;margin:7em auto;}#login_error,.message{margin:0 0 16px 8px;border-width:1px;border-style:solid;padding:12px;-moz-border-radius:3px;-khtml-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;}#nav{margin:0 0 0 8px;padding:16px;}#user_pass,#user_login,#user_email{font-size:24px;width:97%;padding:3px;margin-top:2px;margin-right:6px;margin-bottom:16px;border:1px solid #e5e5e5;background:#fbfbfb;}input{color:#555;}.clear{clear:both;}

View File

@ -22,9 +22,13 @@ form {
box-shadow: rgba(200,200,200,1) 0 4px 18px;
}
form .forgetmenot { font-weight: normal; float: left; margin-bottom: 0; }
form .forgetmenot {
font-weight: normal;
float: left;
margin-bottom: 0;
}
#login form .submit input {
.button-primary {
font-family: "Lucida Grande", Verdana, Arial, "Bitstream Vera Sans", sans-serif;
padding: 3px 10px;
border: none;
@ -38,7 +42,6 @@ form .forgetmenot { font-weight: normal; float: left; margin-bottom: 0; }
cursor: pointer;
text-decoration: none;
margin-top: -3px;
text-shadow: rgba(0,0,0,0.3) 0 -1px 0;
}
#login form p {
@ -55,9 +58,13 @@ form .forgetmenot label {
line-height: 19px;
}
form .submit { float: right; }
form .submit {
float: right;
}
form p { margin-bottom: 24px; }
form p {
margin-bottom: 24px;
}
h1 a {
background: url(../images/logo-login.gif) no-repeat top center;
@ -82,7 +89,8 @@ h1 a {
#login { width: 320px; margin: 7em auto; }
#login_error, .message {
#login_error,
.message {
margin: 0 0 16px 8px;
border-width: 1px;
border-style: solid;
@ -93,9 +101,14 @@ h1 a {
border-radius: 3px;
}
#nav { margin: 0 0 0 8px; padding: 16px; }
#nav {
margin: 0 0 0 8px;
padding: 16px;
}
#user_pass, #user_login, #user_email {
#user_pass,
#user_login,
#user_email {
font-size: 24px;
width: 97%;
padding: 3px;
@ -106,6 +119,10 @@ h1 a {
background: #fbfbfb;
}
input {
color: #555;
}
.clear {
clear: both;
}

View File

@ -190,6 +190,7 @@ if ( ( 'edit' == $action ) && current_user_can("delete_${post_type}", $post->ID)
</div>
<div id="publishing-action">
<img src="images/wpspin_light.gif" id="ajax-loading" style="visibility:hidden;" alt="" />
<?php
if ( !in_array( $post->post_status, array('publish', 'future', 'private') ) || 0 == $post->ID ) {
if ( $can_publish ) :

File diff suppressed because one or more lines are too long

View File

@ -325,6 +325,7 @@ form p.submit a.cancel:hover {
#publishing-action {
text-align: right;
float: right;
line-height: 23px;
}
#post-body #minor-publishing {
@ -406,6 +407,7 @@ a.button-secondary {
line-height: 15px;
padding: 3px 10px;
white-space: nowrap;
-webkit-border-radius: 10px;
}
#doaction,
@ -1896,7 +1898,8 @@ input#link_url {
padding: 0 0 5px 10px;
}
#media-buttons img {
#media-buttons img,
#submitpost #ajax-loading {
vertical-align: middle;
}
@ -3314,6 +3317,10 @@ label,
vertical-align: middle;
}
#misc-publishing-actions label {
vertical-align: baseline;
}
.plugin-update-tr .update-message {
margin: 5px;
padding: 3px 5px;

View File

@ -7,9 +7,21 @@ jQuery(document).ready( function($) {
autosavePeriodical = $.schedule({time: autosaveL10n.autosaveInterval * 1000, func: function() { autosave(); }, repeat: true, protect: true});
//Disable autosave after the form has been submitted
$("#post").submit(function() { $.cancel(autosavePeriodical); });
$("#post").submit(function() {
$.cancel(autosavePeriodical);
});
$('.submitbox input[type="submit"], .submitbox a.submitdelete').click(function(){window.onbeforeunload = null;});
$('input[type="submit"], a.submitdelete', '#submitpost').click(function(){
window.onbeforeunload = null;
$(':button, :submit', '#submitpost').each(function(){
var t = $(this);
if ( t.hasClass('button-primary') )
t.addClass('button-primary-disabled');
else
t.addClass('button-disabled');
});
$('#ajax-loading').css('visibility', 'visible');
});
window.onbeforeunload = function(){
var mce = typeof(tinyMCE) != 'undefined' ? tinyMCE.activeEditor : false, title, content;
@ -160,11 +172,13 @@ function autosave_loading() {
}
function autosave_enable_buttons() {
jQuery(".submitbox :button:disabled, .submitbox :submit:disabled").attr('disabled', '');
jQuery(':button, :submit', '#submitpost').removeAttr('disabled');
jQuery('#ajax-loading').css('visibility', 'hidden');
}
function autosave_disable_buttons() {
jQuery(".submitbox :button:enabled, .submitbox :submit:enabled").attr('disabled', 'disabled');
jQuery(':button, :submit', '#submitpost').attr('disabled', 'disabled');
//jQuery('#ajax-loading').css('visibility', 'visible');
// Re-enable 5 sec later. Just gives autosave a head start to avoid collisions.
setTimeout(autosave_enable_buttons, 5000);
}
@ -173,12 +187,13 @@ autosave = function() {
// (bool) is rich editor enabled and active
var rich = (typeof tinyMCE != "undefined") && tinyMCE.activeEditor && !tinyMCE.activeEditor.isHidden(), post_data, doAutoSave, ed, origStatus, successCallback;
autosave_disable_buttons();
post_data = {
action: "autosave",
post_ID: jQuery("#post_ID").val() || 0,
post_title: jQuery("#title").val() || "",
autosavenonce: jQuery('#autosavenonce').val(),
//tags_input: jQuery("#tags-input").val() || "",
post_type: jQuery('#post_type').val() || "",
autosave: 1
};
@ -217,8 +232,6 @@ autosave = function() {
doAutoSave = false;
}
autosave_disable_buttons();
origStatus = jQuery('#original_post_status').val();
goodcats = ([]);

File diff suppressed because one or more lines are too long

View File

@ -98,7 +98,7 @@ function wp_default_scripts( &$scripts ) {
'l10n_print_after' => 'try{convertEntities(wpAjax);}catch(e){};'
) );
$scripts->add( 'autosave', "/wp-includes/js/autosave$suffix.js", array('schedule', 'wp-ajax-response'), '20090807' );
$scripts->add( 'autosave', "/wp-includes/js/autosave$suffix.js", array('schedule', 'wp-ajax-response'), '20090823' );
$scripts->add_data( 'autosave', 'group', 1 );
$scripts->add( 'wp-lists', "/wp-includes/js/wp-lists$suffix.js", array('wp-ajax-response'), '20090504' );
@ -434,12 +434,12 @@ function wp_default_styles( &$styles ) {
$rtl_styles = array( 'global', 'colors', 'dashboard', 'ie', 'install', 'login', 'media', 'theme-editor', 'upload', 'widgets', 'press-this', 'plugin-install', 'farbtastic' );
// all colors stylesheets need to have the same query strings (cache manifest compat)
$colors_version = '20090720';
$colors_version = '20090824';
$styles->add( 'wp-admin', "/wp-admin/wp-admin$suffix.css", array(), '20090720' );
$styles->add( 'wp-admin', "/wp-admin/wp-admin$suffix.css", array(), '20090824' );
$styles->add_data( 'wp-admin', 'rtl', "/wp-admin/rtl$suffix.css" );
$styles->add( 'ie', '/wp-admin/css/ie.css', array(), '20090630' );
$styles->add( 'ie', '/wp-admin/css/ie.css', array(), '20090824' );
$styles->add_data( 'ie', 'conditional', 'lte IE 7' );
// Register "meta" stylesheet for admin colors. All colors-* style sheets should have the same version string.
@ -459,7 +459,7 @@ function wp_default_styles( &$styles ) {
$styles->add( 'theme-editor', "/wp-admin/css/theme-editor$suffix.css", array(), '20090625' );
$styles->add( 'press-this', "/wp-admin/css/press-this$suffix.css", array(), '20090514' );
$styles->add( 'thickbox', '/wp-includes/js/thickbox/thickbox.css', array(), '20090514' );
$styles->add( 'login', "/wp-admin/css/login$suffix.css", array(), '20090514' );
$styles->add( 'login', "/wp-admin/css/login$suffix.css", array(), '20090824' );
$styles->add( 'plugin-install', "/wp-admin/css/plugin-install$suffix.css", array(), '20090514' );
$styles->add( 'theme-install', "/wp-admin/css/theme-install$suffix.css", array(), '20090610' );
$styles->add( 'farbtastic', '/wp-admin/css/farbtastic.css', array(), '1.2' );
@ -541,15 +541,22 @@ function wp_style_loader_src( $src, $handle ) {
if ( 'colors' == $handle || 'colors-rtl' == $handle ) {
global $_wp_admin_css_colors;
$color = get_user_option('admin_color');
if ( empty($color) || !isset($_wp_admin_css_colors[$color]) )
$color = 'fresh';
$color = $_wp_admin_css_colors[$color];
$parsed = parse_url( $src );
$url = $color->url;
if ( defined('STYLE_DEBUG') && STYLE_DEBUG )
$url = preg_replace('/.css$|.css(?=\?)/', '.dev.css', $url);
if ( isset($parsed['query']) && $parsed['query'] ) {
wp_parse_str( $parsed['query'], $qv );
$url = add_query_arg( $qv, $url );
}
return $url;
}

View File

@ -347,7 +347,7 @@ case 'retrievepassword' :
<input type="text" name="user_login" id="user_login" class="input" value="<?php echo esc_attr($user_login); ?>" size="20" tabindex="10" /></label>
</p>
<?php do_action('lostpassword_form'); ?>
<p class="submit"><input type="submit" name="wp-submit" id="wp-submit" value="<?php esc_attr_e('Get New Password'); ?>" tabindex="100" /></p>
<p class="submit"><input type="submit" name="wp-submit" id="wp-submit" class="button-primary" value="<?php esc_attr_e('Get New Password'); ?>" tabindex="100" /></p>
</form>
<p id="nav">
@ -420,7 +420,7 @@ case 'register' :
<?php do_action('register_form'); ?>
<p id="reg_passmail"><?php _e('A password will be e-mailed to you.') ?></p>
<br class="clear" />
<p class="submit"><input type="submit" name="wp-submit" id="wp-submit" value="<?php esc_attr_e('Register'); ?>" tabindex="100" /></p>
<p class="submit"><input type="submit" name="wp-submit" id="wp-submit" class="button-primary" value="<?php esc_attr_e('Register'); ?>" tabindex="100" /></p>
</form>
<p id="nav">
@ -514,7 +514,7 @@ default:
<?php do_action('login_form'); ?>
<p class="forgetmenot"><label><input name="rememberme" type="checkbox" id="rememberme" value="forever" tabindex="90" /> <?php esc_attr_e('Remember Me'); ?></label></p>
<p class="submit">
<input type="submit" name="wp-submit" id="wp-submit" value="<?php esc_attr_e('Log In'); ?>" tabindex="100" />
<input type="submit" name="wp-submit" id="wp-submit" class="button-primary" value="<?php esc_attr_e('Log In'); ?>" tabindex="100" />
<input type="hidden" name="redirect_to" value="<?php echo esc_attr($redirect_to); ?>" />
<input type="hidden" name="testcookie" value="1" />
</p>