Changeset 32920
- Timestamp:
- 06/24/2015 02:45:38 AM (10 years ago)
- Location:
- trunk/src/wp-admin
- Files:
-
- 3 edited
Legend:
- Unmodified
- Added
- Removed
-
trunk/src/wp-admin/css/press-this.css
r32704 r32920 391 391 } 392 392 393 .split-button { 394 position: relative; 395 display: inline-block; 396 } 397 398 .split-button-body { 399 display: none; 400 position: absolute; 401 bottom: 37px; 402 right: 0; 403 border: 1px solid #ccc; 404 background-color: #fff; 405 min-width: 160px; 406 max-width: 100%; 407 padding: 5px; 408 -webkit-border-radius: 3px; 409 border-radius: 3px; 410 -webkit-box-shadow: 1px 0 4px rgba( 0, 0, 0, 0.15 ); 411 box-shadow: 1px 0 4px rgba( 0, 0, 0, 0.15 ); 412 } 413 414 .split-button-body:before, 415 .split-button-body:after { 416 position: absolute; 417 right: 12px; 418 display: block; 419 width: 0; 420 height: 0; 421 border-style: solid; 422 border-color: transparent; 423 content: ''; 424 } 425 426 .split-button-body:before { 427 bottom: -18px; 428 border-top-color: #a0a5aa; 429 border-width: 9px; 430 right: 11px; 431 } 432 433 .split-button-body:after { 434 bottom: -16px; 435 border-top-color: #fff; 436 border-width: 8px; 437 } 438 439 .split-button-body .split-button-option { 440 display: block; 441 padding: 4px 10px; 442 margin: 0; 443 width: 100%; 444 text-align: left; 445 } 446 447 .is-open .split-button-body { 448 display: block; 449 } 450 451 .split-button-primary, 452 .split-button-toggle { 453 -webkit-border-radius: 0; 454 border-radius: 0; 455 display: block; 456 margin: 0; 457 font-size: 13px; 458 text-decoration: none; 459 white-space: nowrap; 460 cursor: pointer; 461 -webkit-appearance: none; 462 line-height: 2; 463 padding: 0 10px 1px; 464 background: #00a0d2; 465 border-color: #0073aa; 466 border-width: 1px; 467 border-style: solid; 468 -webkit-box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.5), 0 1px 0 rgba( 0, 0, 0, 0.15 ); 469 box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.5 ), 0 1px 0 rgba( 0, 0, 0, 0.15 ); 470 color: #fff; 471 } 472 473 .split-button-primary { 474 -webkit-border-top-left-radius: 3px; 475 border-top-left-radius: 3px; 476 -webkit-border-bottom-left-radius: 3px; 477 border-bottom-left-radius: 3px; 478 border-right: 0 none; 479 float: left; 480 } 481 482 .split-button-toggle { 483 padding: 0; 484 -webkit-border-top-right-radius: 3px; 485 border-top-right-radius: 3px; 486 -webkit-border-bottom-right-radius: 3px; 487 border-bottom-right-radius: 3px; 488 border-left: 0 none; 489 float: right; 490 } 491 492 .split-button-toggle i { 493 margin: 4px 20px 3px 0; 494 padding: 0 10px; 495 border-left: 1px solid #fff; 496 } 497 498 .split-button-primary:hover, 499 .split-button-toggle:hover { 500 outline: none; 501 background: #0091cd; 502 border-color: #0073aa; 503 -webkit-box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.6 ); 504 box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.6 ); 505 } 506 507 .split-button-primary:focus, 508 .split-button-toggle:focus { 509 outline: none; 510 border-color: #0e3950; 511 -webkit-box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.6 ), 512 0 0 0 1px #5b9dd9, 513 0 0 2px 1px rgba(30, 140, 190, .8); 514 box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.6 ), 515 0 0 0 1px #5b9dd9, 516 0 0 2px 1px rgba(30, 140, 190, .8); 517 } 518 519 .split-button-primary:active, 520 .split-button-toggle:active { 521 background: #0073aa; 522 border-color: #005082; 523 color: rgba( 255, 255, 255, 0.95 ); 524 -webkit-box-shadow: inset 0 1px 0 rgba( 0, 0, 0, 0.1 ); 525 box-shadow: inset 0 1px 0 rgba( 0, 0, 0, 0.1 ); 526 } 393 527 394 528 /** … … 1754 1888 } 1755 1889 1756 .draft-button.is-hidden,1757 .draft-button .saving-draft,1758 .draft-button.is-saving .save-draft {1759 display: none;1760 }1761 1762 .draft-button.is-saving .saving-draft {1763 display: inline;1764 }1765 1766 1890 /* TinyMCE styles */ 1767 1891 .editor .wp-media-buttons { -
trunk/src/wp-admin/includes/class-wp-press-this.php
r32901 r32920 1450 1450 <div class="post-actions"> 1451 1451 <span class="spinner"> </span> 1452 <button type="button" class="button-subtle draft-button" aria-live="polite"> 1453 <span class="save-draft"><?php _e( 'Save Draft' ); ?></span> 1454 <span class="saving-draft"><?php _e( 'Saving...' ); ?></span> 1455 </button> 1456 <a href="<?php echo esc_url( get_edit_post_link( $post_ID ) ); ?>" class="edit-post-link" style="display: none;" target="_blank"><?php _e( 'Standard Editor' ); ?></a> 1457 <button type="button" class="button-subtle preview-button"><?php _e( 'Preview' ); ?></button> 1458 <button type="button" class="button-primary publish-button"><?php echo ( current_user_can( 'publish_posts' ) ) ? __( 'Publish' ) : __( 'Submit for Review' ); ?></button> 1452 <div class="split-button"> 1453 <div class="split-button-body"> 1454 <button type="button" class="button-subtle draft-button split-button-option" aria-live="polite"><?php _e( 'Save Draft' ); ?></button> 1455 <a href="<?php echo esc_url( get_edit_post_link( $post_ID ) ); ?>" class="edit-post-link split-button-option" target="_blank"><?php _e( 'Standard Editor' ); ?></a> 1456 <button type="button" class="button-subtle preview-button split-button-option"><?php _e( 'Preview' ); ?></button> 1457 </div> 1458 <div class="split-button-head"> 1459 <button type="button" class="publish-button split-button-primary"><?php 1460 echo ( current_user_can( 'publish_posts' ) ) ? __( 'Publish' ) : __( 'Submit for Review' ); 1461 ?></button><button type="button" class="split-button-toggle" aria-haspopup="true" aria-expanded="false"> 1462 <i class="dashicons dashicons-arrow-down-alt2"></i> 1463 <span class="screen-reader-text"><?php _e('Toggle dropdown'); ?></span> 1464 </button> 1465 </div> 1466 </div> 1459 1467 </div> 1460 1468 </div> -
trunk/src/wp-admin/js/press-this.js
r32106 r32920 7 7 var editor, $mediaList, $mediaThumbWrap, 8 8 saveAlert = false, 9 editLinkVisible = false,10 9 textarea = document.createElement( 'textarea' ), 11 10 sidebarIsOpen = false, … … 164 163 */ 165 164 function submitPost( action ) { 166 var data, 167 keepFocus = $( document.activeElement ).hasClass( 'draft-button' ); 165 var data; 168 166 169 167 saveAlert = false; … … 185 183 clearNotices(); 186 184 }).done( function( response ) { 187 var $link, $button;188 189 185 if ( ! response.success ) { 190 186 renderError( response.data.errorMessage ); … … 200 196 } 201 197 } else if ( response.data.postSaved ) { 202 $link = $( '.edit-post-link' ); 203 $button = $( '.draft-button' ); 204 editLinkVisible = true; 205 206 $button.fadeOut( 200, function() { 207 $button.removeClass( 'is-saving' ); 208 $link.fadeIn( 200, function() { 209 var active = document.activeElement; 210 // Different browsers move the focus to different places when the button is disabled. 211 if ( keepFocus && ( active === $button[0] || $( active ).hasClass( 'post-actions' ) || active.nodeName === 'BODY' ) ) { 212 $link.focus(); 213 } 214 }); 215 }); 198 // consider showing "Saved" message 216 199 } 217 200 }).fail( function() { 218 201 renderError( __( 'serverError' ) ); 219 202 }); 220 }221 222 function resetDraftButton() {223 if ( editLinkVisible ) {224 editLinkVisible = false;225 226 $( '.edit-post-link' ).fadeOut( 200, function() {227 $( '.draft-button' ).removeClass( 'is-saving' ).fadeIn( 200 );228 });229 }230 203 } 231 204 … … 551 524 $titleField.on( 'focus', function() { 552 525 $placeholder.addClass( 'is-hidden' ); 553 resetDraftButton();554 526 }).on( 'blur', function() { 555 527 if ( ! $titleField.text() && ! $titleField.html() ) { … … 627 599 } 628 600 601 function splitButtonClose() { 602 $( '.split-button' ).removeClass( 'is-open' ); 603 $( '.split-button-toggle' ).attr( 'aria-expanded', 'false' ); 604 } 605 629 606 /* *************************************************************** 630 607 * PROCESSING FUNCTIONS … … 649 626 */ 650 627 function monitor() { 628 var $splitButton = $( '.split-button' ); 629 651 630 $( document ).on( 'tinymce-editor-init', function( event, ed ) { 652 631 editor = ed; … … 654 633 editor.on( 'nodechange', function() { 655 634 hasSetFocus = true; 656 resetDraftButton(); 657 } ); 635 }); 636 637 editor.on( 'focus', function() { 638 splitButtonClose(); 639 }); 658 640 }).on( 'click.press-this keypress.press-this', '.suggested-media-thumbnail', function( event ) { 659 641 if ( event.type === 'click' || event.keyCode === 13 ) { 660 642 insertSelectedMedia( $( this ) ); 643 } 644 }).on( 'click.press-this', function( event ) { 645 if ( ! $( event.target ).closest( 'button' ).hasClass( 'split-button-toggle' ) ) { 646 splitButtonClose(); 661 647 } 662 648 }); … … 669 655 if ( $button.length ) { 670 656 if ( $button.hasClass( 'draft-button' ) ) { 671 $button.addClass( 'is-saving' );672 657 submitPost( 'draft' ); 673 658 } else if ( $button.hasClass( 'publish-button' ) ) { … … 680 665 $( '#pressthis-form' ).attr( 'target', '_blank' ).submit().attr( 'target', '' ); 681 666 $( '#wp-preview' ).val( '' ); 667 } else if ( $button.hasClass( 'split-button-toggle' ) ) { 668 if ( $splitButton.hasClass( 'is-open' ) ) { 669 $splitButton.removeClass( 'is-open' ); 670 $button.attr( 'aria-expanded', 'false' ); 671 } else { 672 $splitButton.addClass( 'is-open' ); 673 $button.attr( 'aria-expanded', 'true' ); 674 } 682 675 } 683 676 } else if ( $target.hasClass( 'edit-post-link' ) && window.opener ) {
Note: See TracChangeset
for help on using the changeset viewer.