WordPress.org
Get WordPress

Making WordPress.org


Ignore:
Timestamp:
06/15/2016 10:09:02 PM (9 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.