Making WordPress.org


Ignore:
Timestamp:
06/15/2016 10:09:02 PM (10 years ago)
Author:
coffee2code
Message:

developer.wordpress.org: Improve UX/UI for user contributed notes.

  • UI improvements to notes.
  • Order notes in descending order by cumulative vote rating.
  • Notes with a cumulative vote rating below -1 are shown slightly faded out.

Props keesiemeijer.
See #1649.

File:
1 edited

Legend:

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

    r3315 r3379  
    7373        endif;
    7474
     75        if ( ! function_exists( 'wporg_developer_get_ordered_notes' ) ) :
     76                /**
     77                 * Get contibuted notes ordered by vote
     78                 *
     79                 * By default only top level comments are returned.
     80                 * If child notes are included use wp_list_comments() or a custom walker for display.
     81                 * unapproved notes for the current user are included.
     82                 *
     83                 * @param integer $post_id Optional. Post id to get comments for
     84                 * @param array $args Arguments used for get_comments().
     85                 * @return array Array with comment objects
     86                 */
     87                function wporg_developer_get_ordered_notes( $post_id = 0, $args = array() ) {
     88
     89                        $post_id = absint( $post_id );
     90
     91                        if ( ! $post_id ) {
     92                                $post_id = get_the_ID();
     93                        }
     94
     95                        $order    = array();
     96                        $defaults = array(
     97                                'post__in'           => array( $post_id ),
     98                                'type'               => 'comment',
     99                                'status'             => 'approve',
     100                                'include_unapproved' => array_filter( array( get_current_user_id() ) ),
     101                                'parent'             => false,
     102                        );
     103
     104                        if ( is_super_admin() ) {
     105                                $defaults['status'] = 'all';
     106                        }
     107
     108                        $args = wp_parse_args( $args, $defaults );
     109
     110                        $comments = get_comments( $args );
     111               
     112                        if ( ! $comments ) {
     113                                return;
     114                        }
     115
     116                        foreach ( $comments as $key => $comment ) {
     117                                $order[ $key ] = (int) DevHub_User_Contributed_Notes_Voting::count_votes( $comment->comment_ID, 'difference' );
     118                        }
     119
     120                        // sort the posts by votes
     121                        array_multisort( $order, SORT_DESC, $comments );
     122
     123                        return $comments;
     124                }
     125        endif;
     126
    75127        if ( ! function_exists( 'wporg_developer_user_note' ) ) :
    76128                /**
    77129                 * Template for user contributed notes.
    78                  *
    79                  * Used as a callback by wp_list_comments() for displaying the notes.
    80130                 */
    81131                function wporg_developer_user_note( $comment, $args, $depth ) {
    82132                        $GLOBALS['comment'] = $comment;
    83 
    84                         if ( 'pingback' == $comment->comment_type || 'trackback' == $comment->comment_type ) : ?>
    85 
    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>' ); ?>
     133                        $count = (int) DevHub_User_Contributed_Notes_Voting::count_votes( $comment->comment_ID, 'difference' );
     134                        $comment_class = ( -1 > $count ) ? 'bad-note' : '';
     135                        ?>
     136
     137                        <li id="comment-<?php comment_ID(); ?>" <?php comment_class( $comment_class ); ?>>
     138                        <article id="div-comment-<?php comment_ID(); ?>" class="comment-body">
     139                                <header class="comment-meta">
     140                                        <?php DevHub_User_Contributed_Notes_Voting::show_voting(); ?>
     141                                        <div class="comment-author vcard">
     142                                                <span class="comment-author-attribution">
     143                                                <?php if ( 0 != $args['avatar_size'] ) {
     144                                                                echo get_avatar( $comment, $args['avatar_size'] );
     145                                                } ?>
     146
     147                                                <?php
     148                                                        // This would all be moot if core passed the $comment context for 'get_comment_author_link' filter
     149                                                        if ( $comment->user_id ) {
     150                                                                $commenter = get_user_by( 'id', $comment->user_id );
     151                                                                $url = 'https://profiles.wordpress.org/' . esc_attr( $commenter->user_nicename ) . '/';
     152                                                                $author = get_the_author_meta( 'display_name', $comment->user_id );
     153                                                        } else {
     154                                                                $url = $comment->comment_author_url;
     155                                                                $author = $comment->comment_author;
     156                                                        }
     157
     158                                                        $comment_author_link = '';
     159                                                        if ( $url ) {
     160                                                                $comment_author_link = "<a href='$url' rel='external nofollow' class='url'>";
     161                                                        }
     162                                                        $comment_author_link .= $author;
     163                                                        if ( $url ) {
     164                                                                $comment_author_link .= '</a>';
     165                                                        }
     166
     167                                                        printf( __( 'Contributed by %s', 'wporg' ), sprintf( '<cite class="fn">%s</cite>', $comment_author_link ) );
     168                                                ?>
     169
     170                                                </span>
     171                                                &mdash;
     172                                                <a href="<?php echo esc_url( get_comment_link( $comment->comment_ID ) ); ?>">
     173                                                        <time datetime="<?php comment_time( 'c' ); ?>">
     174                                                        <?php
     175                                                                printf( _x( '%1$s ago', '%1$s = human-readable time difference', 'wporg' ),
     176                                                                        human_time_diff( get_comment_time( 'U' ),
     177                                                                        current_time( 'timestamp' ) )
     178                                                                );
     179                                                        ?>
     180                                                        </time>
     181                                                </a>
     182                                                <?php edit_comment_link( __( 'Edit', 'wporg' ), '<span class="edit-link">&mdash; ', '</span>' ); ?>
     183                                        </div>
     184                                </header>
     185                                <!-- .comment-metadata -->
     186
     187                                <div class="comment-content">
     188                                        <?php comment_text(); ?>
    89189                                </div>
    90 
    91                         <?php else : ?>
    92 
    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 -->
    99 
    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                                                         } ?>
    107 
    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                                                                 } else {
    115                                                                         $url = $comment->comment_author_url;
    116                                                                         $author = $comment->comment_author;
    117                                                                 }
    118 
    119                                                                 $comment_author_link = '';
    120                                                                 if ( $url ) {
    121                                                                         $comment_author_link = "<a href='$url' rel='external nofollow' class='url'>";
    122                                                                 }
    123                                                                 $comment_author_link .= $author;
    124                                                                 if ( $url ) {
    125                                                                         $comment_author_link .= '</a>';
    126                                                                 }
    127 
    128                                                                 printf( __( 'Contributed by %s', 'wporg' ), sprintf( '<cite class="fn">%s</cite>', $comment_author_link ) );
    129                                                         ?>
    130 
    131                                                         </span>
    132                                                         &mdash;
    133                                                         Added on <a href="<?php echo esc_url( get_comment_link( $comment->comment_ID ) ); ?>">
    134                                                                 <time datetime="<?php comment_time( 'c' ); ?>">
    135                                                                         <?php printf( _x( '%1$s at %2$s', '1: date, 2: time', 'wporg' ), get_comment_date(), get_comment_time() ); ?>
    136                                                                 </time>
    137                                                         </a>
    138                                                         <?php edit_comment_link( __( 'Edit', 'wporg' ), '<span class="edit-link">&mdash; ', '</span>' ); ?>
    139                                                 </div>
    140                                                 <!-- .comment-metadata -->
    141 
    142                                                 <?php if ( '0' == $comment->comment_approved ) : ?>
    143                                                         <p class="comment-awaiting-moderation"> &mdash; <?php _e( 'Your note is awaiting moderation.', 'wporg' ); ?></p>
    144                                                 <?php endif; ?>
     190                                <!-- .comment-content -->
     191
     192                                <?php if ( '0' == $comment->comment_approved ) : ?>
     193                                        <footer class="comment-footer">
     194                                                <p class="comment-awaiting-moderation"><?php _e( 'Your note is awaiting moderation.', 'wporg' ); ?></p>
    145195                                        </footer>
    146                                         <!-- .comment-meta -->
    147 
    148                                         <?php
     196                                        <!-- .comment-footer -->
     197                                <?php endif; ?>
     198
     199                                <?php
    149200                                        comment_reply_link( array_merge( $args, array(
    150201                                                'add_below' => 'div-comment',
     
    154205                                                'after'     => '</div>',
    155206                                        ) ) );
    156                                         ?>
    157                                 </article><!-- .comment-body -->
    158 
     207                                ?>
     208                        </article><!-- .comment-body -->
    159209                        <?php
    160                         endif;
    161210                }
    162211        endif; // ends check for wporg_developer_user_note()
Note: See TracChangeset for help on using the changeset viewer.