Making WordPress.org

Changeset 2618


Ignore:
Timestamp:
02/25/2016 09:17:16 PM (10 years ago)
Author:
ocean90
Message:

Rosetta Roles: Store selected projects in a collection and sync them with a hidden input field.

Prevents losing checked projects when the list gets filtered.

See #1590.

Location:
sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/js/rosetta-roles.js

    r2548 r2618  
    2222
    2323                initialize: function() {
     24                        _.bindAll( this, 'uncheck' );
     25
    2426                        // Store the original sub-projects data, it's used to reset the collection on searches.
    2527                        this._subProjects = this.get( 'sub_projects' );
     
    2931                                project: this,
    3032                        } ) );
    31                         this.set( 'checked', _.contains( projects.settings.accessList, parseInt( this.get( 'id' ), 10 ) ) );
     33
     34                        var isChecked = projects.selection.get( this.get( 'id' ) );
     35                        if ( isChecked ) {
     36                                this.set( 'checked', true );
     37                        }
    3238
    3339                        this.listenTo( this.get( 'subProjects' ), 'change:checked', this.updateChecked );
    3440
     41                        $window.on( 'uncheck-other-projects.rosetta', this.uncheck );
     42
     43                        this.on( 'change:checked', this.updateSelection );
     44
    3545                        this.checkForCheckedSubProjects();
     46                },
     47
     48                uncheck: function() {
     49                        this.set( 'checked', false );
    3650                },
    3751
     
    4256
    4357                        this.checkForCheckedSubProjects();
     58                },
     59
     60                updateSelection: function( model, checked ) {
     61                        if ( checked ) {
     62                                projects.selection.add( { id: this.get( 'id' ) } );
     63                                $window.trigger( 'uncheck-all-projects.rosetta' );
     64                        } else {
     65                                projects.selection.remove( { id: this.get( 'id' ) } );
     66                        }
    4467                },
    4568
     
    5982                initialize: function() {
    6083                        _.bindAll( this, 'disableActiveStates' );
     84
    6185                        this.on( 'change:isActive', this.toggleActiveStates );
    62                         $window.on( 'deactivate-all-projects.rosetta', this.disableActiveStates );
     86
     87                        $window.on( 'deactivate-other-projects.rosetta', this.disableActiveStates );
    6388                },
    6489
     
    6792                                return;
    6893                        }
     94
    6995                        this.each( function( project ) {
    7096                                if ( project.get( 'id' ) != model.get( 'id' ) ) {
     
    7399                        });
    74100
    75                         $window.trigger( 'deactivate-other-projects.rosetta' );
     101                        $window.trigger( 'deactivate-all-projects.rosetta' );
    76102                },
    77103
     
    92118
    93119                initialize: function() {
    94                         this.set( 'checked', _.contains( projects.settings.accessList, this.get( 'id' ) ) );
     120                        _.bindAll( this, 'uncheck' );
     121
     122                        var isChecked = projects.selection.get( this.get( 'id' ) );
     123                        if ( isChecked ) {
     124                                this.set( 'checked', true );
     125                        }
     126
     127                        $window.on( 'uncheck-other-projects.rosetta', this.uncheck );
     128
     129                        this.on( 'change:checked', this.updateSelection );
     130                },
     131
     132                uncheck: function() {
     133                        this.set( 'checked', false );
     134                },
     135
     136                updateSelection: function( model, checked ) {
     137                        if ( checked ) {
     138                                projects.selection.add( { id: this.get( 'id' ) } );
     139                                $window.trigger( 'uncheck-all-projects.rosetta' );
     140                        } else {
     141                                projects.selection.remove( { id: this.get( 'id' ) } );
     142                        }
    95143                }
    96144        });
     
    174222        });
    175223
     224        projects.model.Selection = Backbone.Collection.extend({
     225
     226                initialize: function() {
     227                        this.$field = $( '#project-access-list' );
     228                        this.on( 'add remove reset', this.updateInputField );
     229                },
     230
     231                updateInputField: function() {
     232                        this.$field.val( _.pluck( this.toJSON(), 'id' ).join() );
     233                }
     234        });
     235
    176236        /**
    177237         * VIEWS
     
    215275
    216276                prepare: function() {
    217                         return _.pick( this.model.toJSON(), 'id', 'name', 'slug', 'checked', 'checkedSubProjects' );
     277                        return _.pick( this.model.toJSON(), 'name', 'slug', 'checked', 'checkedSubProjects' );
    218278                },
    219279
     
    426486        };
    427487
     488        projects.selection = new projects.model.Selection();
     489
    428490        projects.init = function() {
     491                _.each( projects.settings.accessList, function( projectID ) {
     492                        projects.selection.add( { id: projectID } );
     493                });
     494
    429495                var data = null;
    430496
     
    448514        $( projects.init );
    449515
    450         $( '#project-all' ).on( 'click', function() {
     516        var $projectAll = $( '#project-all' ), $projectAllCheckbox = $projectAll.find( 'input' );
     517
     518        $projectAll.on( 'click', function() {
    451519                var $el = $( this );
    452520
     
    456524
    457525                $el.addClass( 'active' );
    458                 $window.trigger( 'deactivate-all-projects.rosetta' );
    459         });
    460 
    461         $window.on( 'deactivate-other-projects.rosetta', function() {
    462                 $( '#project-all' ).removeClass( 'active' );
     526                $window.trigger( 'deactivate-other-projects.rosetta' );
     527        });
     528
     529        $projectAll.find( 'input' ).on( 'change', function() {
     530                var checked = $( this ).prop( 'checked' );
     531
     532                if ( checked ) {
     533                        projects.selection.add( { id: 'all' } );
     534                        $window.trigger( 'uncheck-other-projects.rosetta' );
     535                } else {
     536                        projects.selection.remove( { id: 'all' } );
     537                }
     538        });
     539
     540        $window.on( 'deactivate-all-projects.rosetta', function() {
     541                $projectAll.removeClass( 'active' );
     542        } );
     543
     544        $window.on( 'uncheck-all-projects.rosetta', function() {
     545                var checked =  $projectAllCheckbox.prop( 'checked' );
     546
     547                if ( checked ) {
     548                        projects.selection.remove( { id: 'all' } );
     549                        $projectAllCheckbox.prop( 'checked', false );
     550                }
    463551        } );
    464552} )( jQuery );
  • sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/rosetta-roles.php

    r2550 r2618  
    55 * Description: WordPress interface for managing roles.
    66 * Author: ocean90
    7  * Version: 1.1
     7 * Version: 1.2
    88 */
    99
     
    209209                                #>
    210210                                <label>
    211                                         <input type="checkbox" class="input-checkbox" name="projects[]" value="{{data.id}}"
     211                                        <input type="checkbox" class="input-checkbox"
    212212                                        <#
    213213                                        if ( data.checked ) {
     
    435435                                $all_projects = array_map( 'intval', $all_projects );
    436436
    437                                 $projects = (array) $_REQUEST['projects'];
     437                                $projects = explode( ',', $_REQUEST['projects'] );
    438438                                if ( in_array( 'all', $projects, true ) ) {
    439439                                        $this->update_translation_editor( $user_details, array( 'all' ) );
  • sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/views/edit-translation-editor.php

    r2545 r2618  
    1818                                                                <li id="project-all" class="active">
    1919                                                                        <label>
    20                                                                                 <input name="projects[]" value="all" type="checkbox"<?php checked( in_array( 'all', $project_access_list ) ); ?>> <?php _e( 'All projects', 'rosetta' ); ?>
     20                                                                                <input type="checkbox"<?php checked( in_array( 'all', $project_access_list ) ); ?>> <?php _e( 'All projects', 'rosetta' ); ?>
    2121                                                                        </label>
    2222                                                                        <div class="sub-projects-wrapper">
     
    3535                </table>
    3636
     37                <input type="hidden" id="project-access-list" name="projects" value="<?php esc_attr( implode( ',', $project_access_list ) ); ?>">
    3738                <input type="hidden" name="action" value="update-translation-editor">
    3839                <input type="hidden" name="user_id" value="<?php echo esc_attr( $user_id ); ?>">
Note: See TracChangeset for help on using the changeset viewer.