WordPress.org
Get WordPress

Making WordPress.org

Ticket #1649: 1649.1.patch

File 1649.1.patch, 14.9 KB (added by keesiemeijer, 8 years ago)

Declutter user notes and add transparency to bad user notes

  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/comments.php

     
    4242                                if ( is_singular( 'post' ) ) {
    4343                                        wp_list_comments();
    4444                                } else {
    45                                         wp_list_comments( array( 'callback' => 'wporg_developer_user_note' ) );
     45                                        wporg_developer_list_user_notes();
    4646                                }
    4747                        ?>
    4848                </ol><!-- .comment-list -->

  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/inc/template-tags.php

     
    7272                }
    7373        endif;
    7474
    75         if ( ! function_exists( 'wporg_developer_user_note' ) ) :
     75        if ( ! function_exists( 'wporg_developer_list_user_notes' ) ) :
    7676                /**
    77                  * Template for user contributed notes.
     77                 * List user contibuted notes
    7878                 *
    79                  * Used as a callback by wp_list_comments() for displaying the notes.
     79                 * @param integer $post_id Optional. Post id to list comments for
    8080                 */
    81                 function wporg_developer_user_note( $comment, $args, $depth ) {
    82                         $GLOBALS['comment'] = $comment;
     81                function wporg_developer_list_user_notes( $post_id = 0 ) {
    8382
    84                         if ( 'pingback' == $comment->comment_type || 'trackback' == $comment->comment_type ) : ?>
     83                        $post_id = absint( $post_id );
    8584
    86                                 <li id="comment-<?php comment_ID(); ?>" <?php comment_class(); ?>>
    87                                 <div class="comment-body">
    88                                         <?php _e( 'Pingback:', 'wporg' ); ?> <?php comment_author_link(); ?> <?php edit_comment_link( __( 'Edit', 'wporg' ), '<span class="edit-link">', '</span>' ); ?>
    89                                 </div>
     85                        if ( ! $post_id ) {
     86                                $post_id = get_the_ID();
     87                        }
    9088
    91                         <?php else : ?>
     89                        $order    = array();
     90                        $comments = get_comments( array(
     91                                        'post__in' => array( $post_id ),
     92                                        'type' => 'comment',
     93                                ) );
    9294
    93                                 <li id="comment-<?php comment_ID(); ?>" <?php comment_class( empty( $args['has_children'] ) ? '' : 'parent' ); ?>>
    94                                 <article id="div-comment-<?php comment_ID(); ?>" class="comment-body">
    95                                         <div class="comment-content">
    96                                                 <?php comment_text(); ?>
    97                                         </div>
    98                                         <!-- .comment-content -->
     95                        if ( empty( $comments ) ) {
     96                                return;
     97                        }
    9998
    100                                         <footer class="comment-meta">
    101                                                 <?php DevHub_User_Contributed_Notes_Voting::show_voting(); ?>
    102                                                 <div class="comment-author vcard">
    103                                                         <span class="comment-author-attribution">
    104                                                         <?php if ( 0 != $args['avatar_size'] ) {
    105                                                                 echo get_avatar( $comment, $args['avatar_size'] );
    106                                                         } ?>
     99                        foreach ( $comments as $key => $comment ) {
     100                                $order[ $key ] = (int) DevHub_User_Contributed_Notes_Voting::count_votes( $comment->comment_ID, 'difference' );
     101                        }
    107102
    108                                                         <?php
    109                                                                 // This would all be moot if core passed the $comment context for 'get_comment_author_link' filter
    110                                                                 if ( $comment->user_id ) {
    111                                                                         $commenter = get_user_by( 'id', $comment->user_id );
    112                                                                         $url = 'https://profiles.wordpress.org/' . esc_attr( $commenter->user_nicename ) . '/';
    113                                                                         $author = get_the_author_meta( 'display_name', $comment->user_id );
    114                                                                         $comment_author_link = "<a href='$url' rel='external nofollow' class='url'>$author</a>";
    115                                                                 } else {
    116                                                                         $comment_author_link = '';
    117                                                                 }
    118                                                                 printf( __( 'Contributed by %s', 'wporg' ), sprintf( '<cite class="fn">%s</cite>', $comment_author_link ) );
     103                        // sort the posts by votes
     104                        array_multisort( $order, SORT_DESC, $comments );
     105
     106                        foreach  ( $comments as $key => $comment ) {
     107                                wporg_developer_user_note( $comment );
     108                        }
     109                }
     110        endif;
     111
     112        if ( ! function_exists( 'wporg_developer_user_note' ) ) :
     113                /**
     114                 * Template for user contributed notes.
     115                 */
     116                function wporg_developer_user_note( $comment ) {
     117                        $GLOBALS['comment'] = $comment;
     118                        $count = (int) DevHub_User_Contributed_Notes_Voting::count_votes( $comment->comment_ID, 'difference' );
     119                        $comment_class = ( -1 > $count ) ? 'bad-note' : '';
     120                        ?>
     121
     122                        <li id="comment-<?php comment_ID(); ?>" <?php comment_class( $comment_class ); ?>>
     123                        <article id="div-comment-<?php comment_ID(); ?>" class="comment-body">
     124                                <header class="comment-meta">
     125                                        <?php DevHub_User_Contributed_Notes_Voting::show_voting(); ?>
     126                                        <div class="comment-author vcard">
     127                                                <span class="comment-author-attribution">
     128
     129                                                <?php
     130                                                        // This would all be moot if core passed the $comment context for 'get_comment_author_link' filter
     131                                                        if ( $comment->user_id ) {
     132                                                                $commenter = get_user_by( 'id', $comment->user_id );
     133                                                                $url = 'https://profiles.wordpress.org/' . esc_attr( $commenter->user_nicename ) . '/';
     134                                                                $author = get_the_author_meta( 'display_name', $comment->user_id );
     135                                                                $comment_author_link = "<a href='$url' rel='external nofollow' class='url'>$author</a>";
     136                                                        } else {
     137                                                                $comment_author_link = '';
     138                                                        }
     139                                                        printf( __( 'Contributed by %s', 'wporg' ), sprintf( '<cite class="fn">%s</cite>', $comment_author_link ) );
     140                                                ?>
     141
     142                                                </span>
     143                                                &mdash;
     144                                                <a href="<?php echo esc_url( get_comment_link( $comment->comment_ID ) ); ?>">
     145                                                        <time datetime="<?php comment_time( 'c' ); ?>">
     146                                                        <?php
     147                                                                printf( _x( '%1$s ago', '%1$s = human-readable time difference', 'wporg' ),
     148                                                                        human_time_diff( get_comment_time( 'U' ),
     149                                                                        current_time( 'timestamp' ) )
     150                                                                );
    119151                                                        ?>
     152                                                        </time>
     153                                                </a>
     154                                                <?php edit_comment_link( __( 'Edit', 'wporg' ), '<span class="edit-link">&mdash; ', '</span>' ); ?>
     155                                        </div>
     156                                </header>
     157                                <!-- .comment-metadata -->
    120158
    121                                                         </span>
    122                                                         &mdash;
    123                                                         Added on <a href="<?php echo esc_url( get_comment_link( $comment->comment_ID ) ); ?>">
    124                                                                 <time datetime="<?php comment_time( 'c' ); ?>">
    125                                                                         <?php printf( _x( '%1$s at %2$s', '1: date, 2: time', 'wporg' ), get_comment_date(), get_comment_time() ); ?>
    126                                                                 </time>
    127                                                         </a>
    128                                                         <?php edit_comment_link( __( 'Edit', 'wporg' ), '<span class="edit-link">&mdash; ', '</span>' ); ?>
    129                                                 </div>
    130                                                 <!-- .comment-metadata -->
     159                                <div class="comment-content">
     160                                        <?php comment_text(); ?>
     161                                </div>
     162                                <!-- .comment-content -->
    131163
    132                                                 <?php if ( '0' == $comment->comment_approved ) : ?>
    133                                                         <p class="comment-awaiting-moderation"> &mdash; <?php _e( 'Your note is awaiting moderation.', 'wporg' ); ?></p>
    134                                                 <?php endif; ?>
     164                                <?php if ( '0' == $comment->comment_approved ) : ?>
     165                                        <footer class="comment-footer">
     166                                                <p class="comment-awaiting-moderation"><?php _e( 'Your note is awaiting moderation.', 'wporg' ); ?></p>
    135167                                        </footer>
    136                                         <!-- .comment-meta -->
     168                                <?php endif; ?>
     169                                <!-- .comment-footer -->
    137170
    138                                         <?php
    139                                         comment_reply_link( array_merge( $args, array(
    140                                                 'add_below' => 'div-comment',
    141                                                 'depth'     => $depth,
    142                                                 'max_depth' => $args['max_depth'],
    143                                                 'before'    => '<div class="reply">',
    144                                                 'after'     => '</div>',
    145                                         ) ) );
    146                                         ?>
    147                                 </article><!-- .comment-body -->
    148 
     171                        </article><!-- .comment-body -->
     172                        </li>
    149173                        <?php
    150                         endif;
    151174                }
    152175        endif; // ends check for wporg_developer_user_note()
    153176

  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/inc/user-content-voting.php

     
    299299                $title = ( 0 == self::count_votes( $comment_id, 'total' ) ) ?
    300300                        '' :
    301301                        sprintf( __( '%s like this', 'wporg' ), self::count_votes( $comment_id, 'like_percentage' ) . '%' );
    302                 $class = '';
    303302                echo '<span '
    304                         . 'class="user-note-voting-count ' . esc_attr( $class ) . '" '
    305                         . 'title="' . esc_attr( $title ) . '">'
     303                    . 'aria-live="polite" '
     304                        . 'class="user-note-voting-count" '
     305                        . 'title="' . esc_attr( $title ) . '">'
     306                        . '<span class="screen-reader-text">' . __('User vote count', 'wporg') . '</span>'
    306307                        . self::count_votes( $comment_id, 'difference' )
    307308                        . '</span>';
    308309

  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/scss/main.scss

     
    11321132        }
    11331133
    11341134        .source-code-container {
    1135                 border-right: 1px solid #dfdfdf;
    11361135                overflow-x: auto;
    11371136                overflow-y: hidden;
    11381137        }
    … …  
    11541153
    11551154        // User contributed notes
    11561155        &.single-wp-parser-function, &.single-wp-parser-method, &.single-wp-parser-hook {
     1156
     1157                .bad-note .comment-content {
     1158                        opacity: .6;
     1159                }
     1160
     1161                .bad-note .comment-content:hover {
     1162                        opacity: 1;
     1163                }
     1164
    11571165                .comment-list,
    11581166                .comment-list ol {
    11591167                        list-style: none;
    … …  
    11621170                }
    11631171
    11641172                .comment-list li {
    1165                         padding: 2rem 1.5rem 1rem;
     1173                        margin-top: 2.5rem;
    11661174                        background: #fff;
    11671175                        overflow: auto;
     1176                        border: 1px solid #dfdfdf;
     1177                        border-radius: 2px;
    11681178
    1169                         &:first-child {
    1170                                 padding-top: 1rem;
    1171                         }
    1172 
    11731179                        article {
    1174                                 border-bottom: 1px solid #dfdfdf;
    1175                                 padding-bottom: 1em;
    11761180                                overflow: auto;
    11771181                        }
    11781182                }
    … …  
    11871191                }
    11881192
    11891193                .comment-author-attribution {
    1190                         font-weight: bold;
    11911194                }
    11921195
    11931196                .comment-meta {
    1194                         margin: 0 0 1.5em 0;
    1195                         font-size: 0.75em;
     1197                        padding: .5em 1em;
     1198                        background-color: #f7f7f7;
     1199                        overflow: auto;
    11961200                }
    11971201
    11981202                .comment-meta .comment-author cite,
    11991203                .comment-meta .comment-author cite a {
    12001204                }
     1205
    12011206                .comment-meta a {
    12021207                }
    12031208
    … …  
    12091214                        margin-left: 3.75rem;
    12101215                        margin-left: 0;
    12111216                        clear: both;
     1217                        padding: 2rem 1.5rem .5rem;
    12121218                }
    12131219
     1220                .comment-footer {
     1221                        margin: 0 1em;
     1222                        padding: 0 0 1em 0;
     1223                        position: relative;
     1224                        overflow: auto;
     1225
     1226                        a {
     1227                                float: right;
     1228                        }
     1229
     1230                        p {
     1231                                margin-bottom: 0;
     1232                        }
     1233                }
     1234
    12141235                .comment-content ol {
    12151236                        list-style: decimal inside;
    12161237                        margin: 0 0 1.5em 0;
    … …  
    14131434        }
    14141435
    14151436        .user-note-voting {
    1416                 font-size: 1.5em;
     1437                font-size: 1.2em;
    14171438                clear: left;
    14181439                float: left;
    1419                 margin-top: -5px;
     1440                margin-top: -2px;
    14201441                margin-right: 10px;
    14211442        }
    14221443        .user-note-voting-up .dashicons, .user-note-voting-down .dashicons {

  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/stylesheets/main.css

     
    13151315  padding-left: 0;
    13161316}
    13171317.devhub-wrap .source-code-container {
    1318   border-right: 1px solid #dfdfdf;
    13191318  overflow-x: auto;
    13201319  overflow-y: hidden;
    13211320}
    … …  
    13301329.devhub-wrap .comment-content a {
    13311330  word-wrap: break-word;
    13321331}
     1332.devhub-wrap.single-wp-parser-function .bad-note .comment-content, .devhub-wrap.single-wp-parser-method .bad-note .comment-content, .devhub-wrap.single-wp-parser-hook .bad-note .comment-content {
     1333  opacity: .6;
     1334}
     1335.devhub-wrap.single-wp-parser-function .bad-note .comment-content:hover, .devhub-wrap.single-wp-parser-method .bad-note .comment-content:hover, .devhub-wrap.single-wp-parser-hook .bad-note .comment-content:hover {
     1336  opacity: 1;
     1337}
    13331338.devhub-wrap.single-wp-parser-function .comment-list,
    13341339.devhub-wrap.single-wp-parser-function .comment-list ol, .devhub-wrap.single-wp-parser-method .comment-list,
    13351340.devhub-wrap.single-wp-parser-method .comment-list ol, .devhub-wrap.single-wp-parser-hook .comment-list,
    … …  
    13391344  padding: 0;
    13401345}
    13411346.devhub-wrap.single-wp-parser-function .comment-list li, .devhub-wrap.single-wp-parser-method .comment-list li, .devhub-wrap.single-wp-parser-hook .comment-list li {
    1342   padding: 2rem 1.5rem 1rem;
     1347  margin-top: 2.5rem;
    13431348  background: #fff;
    13441349  overflow: auto;
     1350  border: 1px solid #dfdfdf;
     1351  border-radius: 2px;
    13451352}
    1346 .devhub-wrap.single-wp-parser-function .comment-list li:first-child, .devhub-wrap.single-wp-parser-method .comment-list li:first-child, .devhub-wrap.single-wp-parser-hook .comment-list li:first-child {
    1347   padding-top: 1rem;
    1348 }
    13491353.devhub-wrap.single-wp-parser-function .comment-list li article, .devhub-wrap.single-wp-parser-method .comment-list li article, .devhub-wrap.single-wp-parser-hook .comment-list li article {
    1350   border-bottom: 1px solid #dfdfdf;
    1351   padding-bottom: 1em;
    13521354  overflow: auto;
    13531355}
    13541356.devhub-wrap.single-wp-parser-function .comment-list .avatar, .devhub-wrap.single-wp-parser-method .comment-list .avatar, .devhub-wrap.single-wp-parser-hook .comment-list .avatar {
    … …  
    13591361  padding: 0.125em;
    13601362  border: 1px solid #eee;
    13611363}
    1362 .devhub-wrap.single-wp-parser-function .comment-author-attribution, .devhub-wrap.single-wp-parser-method .comment-author-attribution, .devhub-wrap.single-wp-parser-hook .comment-author-attribution {
    1363   font-weight: bold;
    1364 }
    13651364.devhub-wrap.single-wp-parser-function .comment-meta, .devhub-wrap.single-wp-parser-method .comment-meta, .devhub-wrap.single-wp-parser-hook .comment-meta {
    1366   margin: 0 0 1.5em 0;
    1367   font-size: 0.75em;
     1365  padding: .5em 1em;
     1366  background-color: #f7f7f7;
     1367  overflow: auto;
    13681368}
    13691369.devhub-wrap.single-wp-parser-function .comment-content, .devhub-wrap.single-wp-parser-method .comment-content, .devhub-wrap.single-wp-parser-hook .comment-content {
    13701370  margin-left: 60px;
    13711371  margin-left: 3.75rem;
    13721372  margin-left: 0;
    13731373  clear: both;
     1374  padding: 2rem 1.5rem .5rem;
    13741375}
     1376.devhub-wrap.single-wp-parser-function .comment-footer, .devhub-wrap.single-wp-parser-method .comment-footer, .devhub-wrap.single-wp-parser-hook .comment-footer {
     1377  margin: 0 1em;
     1378  padding: 0 0 1em 0;
     1379  position: relative;
     1380  overflow: auto;
     1381}
     1382.devhub-wrap.single-wp-parser-function .comment-footer a, .devhub-wrap.single-wp-parser-method .comment-footer a, .devhub-wrap.single-wp-parser-hook .comment-footer a {
     1383  float: right;
     1384}
     1385.devhub-wrap.single-wp-parser-function .comment-footer p, .devhub-wrap.single-wp-parser-method .comment-footer p, .devhub-wrap.single-wp-parser-hook .comment-footer p {
     1386  margin-bottom: 0;
     1387}
    13751388.devhub-wrap.single-wp-parser-function .comment-content ol, .devhub-wrap.single-wp-parser-method .comment-content ol, .devhub-wrap.single-wp-parser-hook .comment-content ol {
    13761389  list-style: decimal inside;
    13771390  margin: 0 0 1.5em 0;
    … …  
    15161529  color: #555 !important;
    15171530}
    15181531.devhub-wrap .user-note-voting {
    1519   font-size: 1.5em;
     1532  font-size: 1.2em;
    15201533  clear: left;
    15211534  float: left;
    1522   margin-top: -5px;
     1535  margin-top: -2px;
    15231536  margin-right: 10px;
    15241537}
    15251538.devhub-wrap .user-note-voting-up .dashicons, .devhub-wrap .user-note-voting-down .dashicons {