WordPress.org

Making WordPress.org

Changeset 259


Ignore:
Timestamp:
01/10/2014 05:04:12 AM (7 years ago)
Author:
nacin
Message:

Trac: JS and CSS for report notification stars. see #127.

Location:
sites/trunk/wordpress.org/public_html/style/trac
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • sites/trunk/wordpress.org/public_html/style/trac/wp-trac.css

    r254 r259  
    900900#notifications.subscribed p.receiving-notifications {
    901901    display: block;
     902}
     903td.Stars {
     904    white-space: nowrap;
     905}
     906td.Stars .dashicons {
     907    color: #999;
     908}
     909td.Stars .dashicons:hover,
     910td.Stars .dashicons-star-filled {
     911    color: #21759b;
     912}
     913td.Stars .loading {
     914    visibility: hidden;
     915}
     916td.Stars .trac-report-star:hover {
     917    cursor: pointer;
    902918}
    903919
  • sites/trunk/wordpress.org/public_html/style/trac/wp-trac.js

    r258 r259  
    3939            // Change 'Comments' and 'Stars' columns to dashicons glyphs to save space
    4040            $('th a[href*="sort=Comments"]').html('<div class="dashicons dashicons-admin-comments"></div>');
    41             $('th a[href*="sort=Stars"]').html('<div class="dashicons dashicons-star-filled"></div>');
     41            $('th a[href*="sort=Stars"]').html('<div class="dashicons dashicons-star-empty"></div>');
    4242
    4343            // Bring back 'Delete' comment buttons, if any.
     
    410410
    411411        notifications: (function() {
    412             var notifications, _endpoint, _ticket, star;
    413 
    414             function init( endpoint, ticket ) {
    415                 var current_star;
    416                 _endpoint = endpoint;
    417                 _ticket = ticket;
     412            var notifications, endpoint, _ticket;
     413
     414            function init( settings ) {
     415                endpoint = settings.endpoint;
     416                if ( settings.ticket ) {
     417                    _ticket = settings.ticket;
     418                    ticketInit( _ticket );
     419                }
     420                $( reportInit() );
     421                $( wpTrac.hide_cc_field );
     422            }
     423
     424            function ticketInit( ticket ) {
     425                $.ajax({
     426                    url: endpoint + '?trac-notifications=' + ticket,
     427                    xhrFields: { withCredentials: true }
     428                }).success( function( data ) {
     429                    if ( data.success ) {
     430                        $( render( data ) );
     431                    }
     432                });
     433            }
     434
     435            function render( data ) {
     436                $( '#propertyform' ).before( data.data['notifications-box'] );
    418437                notifications = $('#notifications');
    419438                notifications.on( 'click', '.watch-this-ticket', subscribe )
     
    422441                    .on( 'click', '.unblock-notifications', unblock );
    423442
    424                 current_star = notifications.hasClass('subscribed') ? 'filled' : 'empty';
    425                 $('#ticket.trac-content > h2').prepend( '<div class="ticket-star dashicons dashicons-star-' + current_star + '" title="Watch/unwatch this ticket"></div>' );
     443                $('#ticket.trac-content > h2').prepend( '<div class="ticket-star dashicons dashicons-star-' +
     444                    ( notifications.hasClass('subscribed') ? 'filled' : 'empty' ) + '" title="Watch/unwatch this ticket"></div>' );
    426445                star = $('.ticket-star');
    427446                star.click( function() {
     
    430449            }
    431450
    432             function save( action ) {
     451            function save( action, ticket ) {
     452                ticket = ticket || _ticket;
    433453                $.ajax({
    434454                    type: 'POST',
    435                     url: _endpoint,
     455                    url: endpoint,
    436456                    xhrFields: { withCredentials: true },
    437457                    data: {
    438                         'trac-ticket-sub': _ticket,
     458                        'trac-ticket-sub': ticket,
    439459                        action: action
    440460                    }
     
    482502            }
    483503
     504            function reportInit() {
     505                var stars,
     506                    tickets = [],
     507                    cells = $('table.listing').find('td.Stars');
     508
     509                if ( cells.length === 0 ) {
     510                    return;
     511                }
     512                cells.wrapInner( '<span class="count" />' );
     513                cells.append(' <div class="dashicons dashicons-star-empty loading trac-report-star"></div>' );
     514                stars = $('.trac-report-star');
     515                stars.each( function() {
     516                    var ticket,
     517                        star = $(this);
     518                   
     519                    ticket = parseInt( star.parent().siblings('td.ticket').find('a').text().replace('#', ''), 10 );
     520                    tickets.push( ticket );
     521                    star.data( 'ticket', ticket );
     522                });
     523
     524                $.ajax({
     525                    type: 'POST',
     526                    url: endpoint,
     527                    xhrFields: { withCredentials: true },
     528                    data: {
     529                        'trac-ticket-subs' : true,
     530                        'tickets' : tickets
     531                    }
     532                }).success( function( data ) {
     533                    if ( ! data.success ) {
     534                        return;
     535                    }
     536
     537                    stars.each( function() {
     538                        if ( -1 !== $.inArray( $(this).data( 'ticket' ), data.data.tickets ) ) {
     539                            $(this).toggleClass( 'dashicons-star-empty dashicons-star-filled' );
     540                        }
     541                    }).removeClass('loading').on( 'click', function() {
     542                        var action, count, delta,
     543                            star = $(this);
     544                        star.toggleClass( 'dashicons-star-empty dashicons-star-filled' );
     545                        action = star.hasClass('dashicons-star-filled') ? 'subscribe' : 'unsubscribe';
     546                        delta = 'subscribe' === action ? 1 : -1;
     547                        save( action, star.data( 'ticket' ) );
     548
     549                        count = parseInt( star.prev().text(), 10 );
     550                        if ( isNaN( count ) ) {
     551                            count = 0;
     552                        }
     553                        count += delta;
     554                        star.prev().text( count ? count : '' );
     555                    });
     556                });
     557            }
     558
    484559            return {
    485560                init: init
Note: See TracChangeset for help on using the changeset viewer.