<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[1786] sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles: Rosetta: Update roles plugin to support sub projects.</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta" style="font-size: 105%">
<dt style="float: left; width: 6em; font-weight: bold">Revision</dt> <dd><a style="font-weight: bold" href="http://meta.trac.wordpress.org/changeset/1786">1786</a><script type="application/ld+json">{"@context":"http://schema.org","@type":"EmailMessage","description":"Review this Commit","action":{"@type":"ViewAction","url":"http://meta.trac.wordpress.org/changeset/1786","name":"Review Commit"}}</script></dd>
<dt style="float: left; width: 6em; font-weight: bold">Author</dt> <dd>ocean90</dd>
<dt style="float: left; width: 6em; font-weight: bold">Date</dt> <dd>2015-07-26 16:42:45 +0000 (Sun, 26 Jul 2015)</dd>
</dl>
<pre style='padding-left: 1em; margin: 2em 0; border-left: 2px solid #ccc; line-height: 1.25; font-size: 105%; font-family: sans-serif'>Rosetta: Update roles plugin to support sub projects.
props folletto for the design idea.
see <a href="http://meta.trac.wordpress.org/ticket/1101">#1101</a>.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#sitestrunkglobalwordpressorgpublic_htmlwpcontentmupluginsrolesclasstranslationeditorslisttablephp">sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/class-translation-editors-list-table.php</a></li>
<li><a href="#sitestrunkglobalwordpressorgpublic_htmlwpcontentmupluginsrolesjsrosettarolesjs">sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/js/rosetta-roles.js</a></li>
<li><a href="#sitestrunkglobalwordpressorgpublic_htmlwpcontentmupluginsrolesrosettarolesphp">sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/rosetta-roles.php</a></li>
<li><a href="#sitestrunkglobalwordpressorgpublic_htmlwpcontentmupluginsrolesviewsedittranslationeditorphp">sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/views/edit-translation-editor.php</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li>sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/css/</li>
<li><a href="#sitestrunkglobalwordpressorgpublic_htmlwpcontentmupluginsrolescssrosettarolescss">sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/css/rosetta-roles.css</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="sitestrunkglobalwordpressorgpublic_htmlwpcontentmupluginsrolesclasstranslationeditorslisttablephp"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/class-translation-editors-list-table.php</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/class-translation-editors-list-table.php 2015-07-26 16:22:58 UTC (rev 1785)
+++ sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/class-translation-editors-list-table.php 2015-07-26 16:42:45 UTC (rev 1786)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -35,6 +35,13 @@
</span><span class="cx" style="display: block; padding: 0 10px"> public $projects;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ * Holds the list of a project tree.
+ *
+ * @var array
+ */
+ public $project_tree;
+
+ /**
</ins><span class="cx" style="display: block; padding: 0 10px"> * Constructor.
</span><span class="cx" style="display: block; padding: 0 10px"> *
</span><span class="cx" style="display: block; padding: 0 10px"> * @param array $args An associative array of arguments.
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -51,6 +58,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> $this->user_role = $args['user_role'];
</span><span class="cx" style="display: block; padding: 0 10px"> $this->project_access_meta_key = $args['project_access_meta_key'];
</span><span class="cx" style="display: block; padding: 0 10px"> $this->projects = $args['projects'];
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $this->project_tree = $args['project_tree'];
</ins><span class="cx" style="display: block; padding: 0 10px"> $this->user_can_promote = current_user_can( 'promote_users' );
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -225,10 +233,47 @@
</span><span class="cx" style="display: block; padding: 0 10px"> $projects = array();
</span><span class="cx" style="display: block; padding: 0 10px"> foreach ( $project_access_list as $project_id ) {
</span><span class="cx" style="display: block; padding: 0 10px"> if ( $this->projects[ $project_id ] ) {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $projects[] = esc_html( $this->projects[ $project_id ]->name );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $parent = $this->get_parent_project( $this->project_tree, $project_id );
+ if ( $parent->id != $project_id ) {
+ $name = sprintf(
+ '%s → %s',
+ esc_html( $parent->name ),
+ esc_html( $this->projects[ $project_id ]->name )
+ );
+ } else {
+ $name = esc_html( $this->projects[ $project_id ]->name );
+ }
+ $projects[] = $name;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> echo implode( '<br>', $projects );
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ /**
+ * Returns the parent project for a sub project.
+ *
+ * @param array $tree The project tree.
+ * @param int $child_id The project tree.
+ * @return object The parent project.
+ */
+ private function get_parent_project( $tree, $child_id ) {
+ $parent = null;
+ foreach ( $tree as $project ) {
+ if ( $project->id == $child_id ) {
+ $parent = $project;
+ break;
+ }
+
+ if ( isset( $project->sub_projects ) ) {
+ $parent = $this->get_parent_project( $project->sub_projects, $child_id );
+ if ( $parent ) {
+ $parent = $project;
+ break;
+ }
+ }
+ }
+
+ return $parent;
+ }
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span></span></pre></div>
<a id="sitestrunkglobalwordpressorgpublic_htmlwpcontentmupluginsrolescssrosettarolescss"></a>
<div class="addfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Added: sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/css/rosetta-roles.css</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/css/rosetta-roles.css (rev 0)
+++ sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/css/rosetta-roles.css 2015-07-26 16:42:45 UTC (rev 1786)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -0,0 +1,83 @@
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+.projects-list {
+ position: relative;
+ display: inline-block;
+ background: #f5f5f5;
+ border: 1px solid #dfdfdf;
+ border-right: 0;
+ min-height: 100px;
+ margin: 0 0 15px;
+}
+
+.projects-list > li {
+ width: 200px;
+ margin: 0;
+ padding: 15px;
+ box-sizing: border-box;
+ border-right: 1px solid #dfdfdf;
+ border-bottom: 1px solid #dfdfdf;
+ cursor: pointer;
+}
+
+.projects-list > li:last-child {
+ border-bottom: 0;
+}
+
+#projects-list label {
+ margin: 0 !important;
+}
+
+.sub-projects-wrapper {
+ position: absolute;
+ top: -1px;
+ bottom: -1px;
+ left: 200px;
+ width: 300px;
+ padding: 10px;
+ border: 1px solid #dfdfdf;
+ border-left: 0;
+ background: #fff;
+ display: none;
+ overflow: scroll;
+ box-sizing: border-box;
+ cursor: default;
+}
+
+.projects-list > li:hover {
+ background: #fff;
+}
+
+.projects-list > li.active {
+ background: #fff;
+ border-right: 1px solid #fff;
+}
+
+.projects-list > li.active .sub-projects-wrapper {
+ display: block;
+}
+
+.sub-projects-search {
+ width: 100%;
+ margin-bottom: 10px;
+}
+
+.sub-projects-list {
+ margin: 0 0 0 2px;
+}
+
+@media screen and (max-width: 782px) {
+ .projects-list {
+ display: block;
+ }
+
+ .projects-list > li {
+ width: 100%;
+ }
+
+ .sub-projects-wrapper {
+ position: static;
+ border: 1px solid #dfdfdf;
+ width: 100%;
+ margin-top: 10px;
+ max-height: 350px;
+ }
+}
</ins></span></pre></div>
<a id="sitestrunkglobalwordpressorgpublic_htmlwpcontentmupluginsrolesjsrosettarolesjs"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/js/rosetta-roles.js</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/js/rosetta-roles.js 2015-07-26 16:22:58 UTC (rev 1785)
+++ sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/js/rosetta-roles.js 2015-07-26 16:42:45 UTC (rev 1786)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1,44 +1,356 @@
</span><span class="cx" style="display: block; padding: 0 10px"> ( function( $ ) {
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $(function() {
- var $projects = $( 'input.project' );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ var projects, l10n, $window = $(window);
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( $projects.length ) {
- var $allProjects = $( '#project-all' ),
- checked = [];
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ projects = { model: {}, view: {}, controller: {} };
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Deselect "All" if a project is checked.
- $projects.on( 'change', function() {
- $allProjects.prop( 'checked', false );
- checked = [];
- } );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ projects.settings = window._rosettaProjectsSettings || {};
+ l10n = projects.settings.l10n || {};
+ delete projects.settings.l10n;
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // (De)select projects if "All" is (de)selected.
- $allProjects.on( 'change', function() {
- if ( this.checked ) {
- $projects.each( function( index, checkbox ) {
- var $cb = $( checkbox );
- if ( $cb.prop( 'checked' ) ) {
- checked.push( $cb.attr( 'id' ) );
- $cb.prop( 'checked', false );
- }
- } );
- } else {
- for ( i = 0; i < checked.length; i++ ) {
- $( '#' + checked[ i ] ).prop( 'checked', true );
- }
- checked = [];
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * MODELS
+ */
+ projects.model.Project = Backbone.Model.extend({
+ defaults: {
+ id: 0,
+ name: '',
+ checked: false,
+ isActive: false,
+ checkedSubProjects: false
+ },
+
+ initialize: function() {
+ var subProjects = this.get( 'sub_projects' );
+ this.unset( 'sub_projects' );
+
+ this.set( 'subProjects', new projects.model.subProjects( subProjects ) );
+ this.set( 'checked', _.contains( projects.settings.accessList, parseInt( this.get( 'id' ), 10 ) ) );
+
+ this.listenTo( this.get( 'subProjects' ), 'change:checked', this.updateChecked );
+
+ this.checkForCheckedSubProjects();
+ },
+
+ updateChecked: function( model ) {
+ if ( model.get( 'checked' ) ) {
+ this.set( 'checked', false );
+ }
+
+ this.checkForCheckedSubProjects();
+ },
+
+ checkForCheckedSubProjects: function() {
+ var checked = this.get( 'subProjects' ).findWhere({ 'checked': true });
+ if ( checked ) {
+ this.set( 'checkedSubProjects', true );
+ } else {
+ this.set( 'checkedSubProjects', false );
+ }
+ }
+ });
+
+ projects.model.Projects = Backbone.Collection.extend({
+ model: projects.model.Project,
+
+ initialize: function() {
+ _.bindAll( this, 'disableActiveStates' );
+ this.on( 'change:isActive', this.toggleActiveStates );
+ $window.on( 'deactivate-all-projects.rosetta', this.disableActiveStates );
+ },
+
+ toggleActiveStates: function( model ) {
+ if ( ! model.get( 'isActive' ) ) {
+ return;
+ }
+ this.each( function( project ) {
+ if ( project.get( 'id' ) != model.get( 'id' ) ) {
+ project.set( 'isActive', false );
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- } );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ });
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Deselect all checkboxes.
- $( '#clear-all' ).on( 'click', function( event ) {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $window.trigger( 'deactivate-other-projects.rosetta' );
+ },
+
+ disableActiveStates: function() {
+ this.each( function( project ) {
+ project.set( 'isActive', false );
+ });
+ }
+ });
+
+ projects.model.subProject = Backbone.Model.extend({
+ defaults: {
+ id: 0,
+ name: '',
+ checked: false,
+ isVisible: true
+ },
+
+ initialize: function() {
+ this.set( 'checked', _.contains( projects.settings.accessList, parseInt( this.get( 'id' ), 10 ) ) );
+ }
+ });
+
+ projects.model.subProjects = Backbone.Collection.extend({
+ model: projects.model.subProject,
+
+ // Search terms
+ terms: '',
+
+ initialize: function() {
+ this.on( 'uncheckall', this.uncheckall );
+ },
+
+ uncheckall: function() {
+ this.each( function( project ) {
+ project.set( 'checked', false );
+ });
+ },
+
+ doSearch: function( value ) {
+ // Don't do anything if we've already done this search
+ if ( this.terms === value ) {
+ return;
+ }
+
+ this.terms = value;
+
+ if ( this.terms.length > 0 ) {
+ this.search( this.terms );
+ }
+
+ if ( this.terms === '' ) {
+ this.each( function( project ) {
+ project.set( 'isVisible', true );
+ });
+ }
+ },
+
+ // Performs a search within the collection
+ // @uses RegExp
+ search: function( term ) {
+ var match, name;
+
+ // Escape the term string for RegExp meta characters
+ term = term.replace( /[-\/\\^$*+?.()|[\]{}]/g, '\\$&' );
+
+ // Consider spaces as word delimiters and match the whole string
+ // so matching terms can be combined
+ term = term.replace( / /g, ')(?=.*' );
+ match = new RegExp( '^(?=.*' + term + ').+', 'i' );
+
+ // Find results
+ this.each( function( project ) {
+ name = project.get( 'name' );
+ project.set( 'isVisible', match.test( name ) );
+ });
+ },
+ });
+
+ /**
+ * VIEWS
+ */
+ projects.view.Frame = wp.Backbone.View.extend({
+ el: '#projects-list',
+
+ render: function() {
+ var view = this;
+ wp.Backbone.View.prototype.render.apply( this, arguments );
+
+ this.collection.each( function( project ) {
+ var projectView = new projects.view.Project({
+ model: project
+ });
+
+ projectView.render();
+ view.$el.append( projectView.el );
+ });
+
+ this.views.ready();
+
+ return this;
+ }
+ });
+
+ projects.view.Checkbox = wp.Backbone.View.extend({
+ className: 'project-checkbox',
+ template: wp.template( 'project-checkbox' ),
+
+ initialize: function() {
+ this.listenTo( this.model, 'change', this.render );
+ },
+
+ events: {
+ 'click .input-checkbox': 'updateChecked',
+ 'click .input-radio': 'setChecked'
+ },
+
+ prepare: function() {
+ return _.pick( this.model.toJSON(), 'id', 'name', 'checked', 'checkedSubProjects' );
+ },
+
+ updateChecked: function() {
+ this.model.set( 'checked', this.$el.find( 'input' ).prop( 'checked' ) );
+ },
+
+ setChecked: function() {
+ this.model.set( 'checked', true );
+ }
+ });
+
+ projects.view.Project = wp.Backbone.View.extend({
+ tagName: 'li',
+
+ events: {
+ 'click': 'updateIsActive'
+ },
+
+ initialize: function() {
+ this.listenTo( this.model, 'change:checked', this.propagateChange );
+ this.listenTo( this.model, 'change:isActive', this.toggleActiveState );
+
+ this.views.add( new projects.view.Checkbox({
+ model: this.model
+ }) );
+
+ this.views.add( new projects.view.SubProjects({
+ model: this.model
+ }) );
+
+ this.toggleActiveState();
+
+ this.views.ready();
+ },
+
+ propagateChange: function() {
+ if ( this.model.get( 'checked' ) ) {
+ this.model.get( 'subProjects' ).trigger( 'uncheckall' );
+ }
+ },
+
+ toggleActiveState: function() {
+ if ( this.model.get( 'isActive' ) ) {
+ this.$el.addClass( 'active' );
+ } else {
+ this.$el.removeClass( 'active' );
+ }
+ },
+
+ updateIsActive: function() {
+ this.model.set( 'isActive', true );
+ },
+ });
+
+ projects.view.SubProjects = wp.Backbone.View.extend({
+ tagName: 'div',
+ className: 'sub-projects-wrapper',
+
+ initialize: function() {
+ var collection = this.model.get( 'subProjects' );
+
+ if ( collection.length > 5 ) {
+ this.views.add( new projects.view.Search({
+ collection: collection
+ }) );
+ }
+
+ this.views.add( new projects.view.SubProjectsList({
+ collection: collection
+ }) );
+ },
+ });
+
+ projects.view.SubProjectsList = wp.Backbone.View.extend({
+ tagName: 'ul',
+ className: 'sub-projects-list',
+
+ initialize: function() {
+ var view = this;
+ this.collection.each( function( project ) {
+ view.views.add( new projects.view.SubProject({
+ model: project
+ }) );
+ });
+ }
+ });
+
+ projects.view.SubProject = wp.Backbone.View.extend({
+ tagName: 'li',
+
+ initialize: function() {
+ this.views.add( new projects.view.Checkbox({
+ model: this.model
+ }) );
+
+ this.listenTo( this.model, 'change:isVisible', this.changeVisibility );
+ },
+
+ changeVisibility: function() {
+ if ( this.model.get( 'isVisible' ) ) {
+ this.$el.removeClass( 'hidden' );
+ } else {
+ this.$el.addClass( 'hidden' );
+ }
+ }
+ });
+
+ projects.view.Search = wp.Backbone.View.extend({
+ tagName: 'input',
+ className: 'sub-projects-search',
+
+ attributes: {
+ placeholder: l10n.searchPlaceholder,
+ type: 'search',
+ },
+
+ events: {
+ 'input': 'search',
+ 'keyup': 'search',
+ 'keydown': 'search',
+ },
+
+ search: function( event ) {
+ // Prevent form submit
+ if ( event.type === 'keydown' && event.which === 13 ) {
</ins><span class="cx" style="display: block; padding: 0 10px"> event.preventDefault();
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ } else if ( event.type === 'keydown' ) {
+ return;
+ }
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- checked = [];
- $allProjects.prop( 'checked', false );
- $projects.prop( 'checked', false );
- } );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Clear on escape.
+ if ( event.type === 'keyup' && event.which === 27 ) {
+ event.target.value = '';
+ }
+
+ this.doSearch( event );
+ },
+
+ doSearch: _.debounce( function( event ) {
+ this.collection.doSearch( event.target.value );
+ }, 200 )
+ });
+
+ projects.init = function() {
+ projects.view.frame = new projects.view.Frame({
+ collection: new projects.model.Projects( projects.settings.data )
+ }).render();
+ };
+
+ $( projects.init );
+
+ $( '#project-all' ).on( 'click', function() {
+ var $el = $( this );
+
+ if ( $el.hasClass( 'active' ) ) {
+ return;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ $el.addClass( 'active' );
+ $window.trigger( 'deactivate-all-projects.rosetta' );
+ });
+
+ $window.on( 'deactivate-other-projects.rosetta', function() {
+ $( '#project-all' ).removeClass( 'active' );
</ins><span class="cx" style="display: block; padding: 0 10px"> } );
</span><span class="cx" style="display: block; padding: 0 10px"> } )( jQuery );
</span></span></pre></div>
<a id="sitestrunkglobalwordpressorgpublic_htmlwpcontentmupluginsrolesrosettarolesphp"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/rosetta-roles.php</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/rosetta-roles.php 2015-07-26 16:22:58 UTC (rev 1785)
+++ sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/rosetta-roles.php 2015-07-26 16:42:45 UTC (rev 1786)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -210,16 +210,52 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> add_action( 'load-' . $this->translation_editors_page, array( $this, 'load_translation_editors_page' ) );
</span><span class="cx" style="display: block; padding: 0 10px"> add_action( 'admin_print_scripts-' . $this->translation_editors_page, array( $this, 'enqueue_scripts' ) );
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ add_action( 'admin_footer-' . $this->translation_editors_page, array( $this, 'print_js_templates' ) );
+ add_action( 'admin_print_styles-' . $this->translation_editors_page, array( $this, 'enqueue_styles' ) );
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><span class="cx" style="display: block; padding: 0 10px"> * Enqueues scripts.
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><span class="cx" style="display: block; padding: 0 10px"> public function enqueue_scripts() {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- wp_enqueue_script( 'rosetta-roles', plugins_url( '/js/rosetta-roles.js', __FILE__ ), array( 'jquery' ), '1', true );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ wp_enqueue_script( 'rosetta-roles', plugins_url( '/js/rosetta-roles.js', __FILE__ ), array( 'jquery', 'wp-backbone' ), '2', true );
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ * Enqueues styles.
+ */
+ public function enqueue_styles() {
+ wp_enqueue_style( 'rosetta-roles', plugins_url( '/css/rosetta-roles.css', __FILE__ ), array(), '2' );
+ }
+
+ /**
+ * Prints JavaScript templates.
+ */
+ public function print_js_templates() {
+ ?>
+ <script id="tmpl-project-checkbox" type="text/html">
+ <# if ( ! data.checkedSubProjects ) {
+ #>
+ <label>
+ <input type="checkbox" class="input-checkbox" name="projects[]" value="{{data.id}}"
+ <#
+ if ( data.checked ) {
+ #> checked="checked"<#
+ }
+ #>
+ />
+ {{data.name}}
+ </label>
+ <# } else { #>
+ <label>
+ <input type="radio" class="input-radio" checked="checked" /> {{data.name}}
+ </label>
+ <# } #>
+ </script>
+ <?php
+ }
+
+ /**
</ins><span class="cx" style="display: block; padding: 0 10px"> * Loads either the overview or the edit handler.
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><span class="cx" style="display: block; padding: 0 10px"> public function load_translation_editors_page() {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -289,14 +325,16 @@
</span><span class="cx" style="display: block; padding: 0 10px"> $user_details->add_role( $this->translation_editor_role );
</span><span class="cx" style="display: block; padding: 0 10px"> $this->notify_translation_editor_update( $user_details->ID, 'add' );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $meta_key = $wpdb->get_blog_prefix() . $this->project_access_meta_key;
+
</ins><span class="cx" style="display: block; padding: 0 10px"> $projects = empty( $_REQUEST['projects'] ) ? '' : $_REQUEST['projects'];
</span><span class="cx" style="display: block; padding: 0 10px"> if ( 'custom' === $projects ) {
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ update_user_meta( $user_details->ID, $meta_key, array() );
</ins><span class="cx" style="display: block; padding: 0 10px"> $redirect = add_query_arg( 'user_id', $user_details->ID, $redirect );
</span><span class="cx" style="display: block; padding: 0 10px"> wp_redirect( add_query_arg( array( 'update' => 'user-added-custom-projects' ), $redirect ) );
</span><span class="cx" style="display: block; padding: 0 10px"> exit;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $meta_key = $wpdb->get_blog_prefix() . $this->project_access_meta_key;
</del><span class="cx" style="display: block; padding: 0 10px"> update_user_meta( $user_details->ID, $meta_key, array( 'all' ) );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> wp_redirect( add_query_arg( array( 'update' => 'user-added' ), $redirect ) );
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -392,7 +430,7 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> $redirect = add_query_arg( 'user_id', $user_details->ID, $redirect );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $all_projects = $this->get_translate_top_level_projects();
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $all_projects = $this->get_translate_projects();
</ins><span class="cx" style="display: block; padding: 0 10px"> $all_projects = wp_list_pluck( $all_projects, 'id' );
</span><span class="cx" style="display: block; padding: 0 10px"> $all_projects = array_map( 'intval', $all_projects );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -430,14 +468,33 @@
</span><span class="cx" style="display: block; padding: 0 10px"> private function render_edit_translation_editor( $user_id ) {
</span><span class="cx" style="display: block; padding: 0 10px"> global $wpdb;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $projects = $this->get_translate_top_level_projects();
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $projects = $this->get_translate_projects();
+ $project_tree = $this->get_project_tree( $projects, 0, 1 );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Sort the tree and remove array keys.
+ usort( $project_tree, array( $this, '_sort_name_callback' ) );
+ foreach ( $project_tree as $key => $project ) {
+ if ( $project->sub_projects ) {
+ usort( $project->sub_projects, array( $this, '_sort_name_callback' ) );
+ }
+ $project->sub_projects = array_values( $project->sub_projects );
+ }
+ $project_tree = array_values( $project_tree );
+
</ins><span class="cx" style="display: block; padding: 0 10px"> $meta_key = $wpdb->get_blog_prefix() . $this->project_access_meta_key;
</span><span class="cx" style="display: block; padding: 0 10px"> $project_access_list = get_user_meta( $user_id, $meta_key, true );
</span><span class="cx" style="display: block; padding: 0 10px"> if ( ! $project_access_list ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $project_access_list = array();
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ wp_localize_script( 'rosetta-roles', '_rosettaProjectsSettings', array(
+ 'l10n' => array(
+ 'searchPlaceholder' => esc_attr__( 'Search...', 'rosetta' )
+ ),
+ 'data' => $project_tree,
+ 'accessList' => $project_access_list
+ ) );
+
</ins><span class="cx" style="display: block; padding: 0 10px"> $feedback_message = $this->get_feedback_message();
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> require __DIR__ . '/views/edit-translation-editor.php';
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -503,9 +560,13 @@
</span><span class="cx" style="display: block; padding: 0 10px"> return $list_table;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $projects = $this->get_translate_projects();
+ $project_tree = $this->get_project_tree( $projects, 0, 1 );
+
</ins><span class="cx" style="display: block; padding: 0 10px"> $args = array(
</span><span class="cx" style="display: block; padding: 0 10px"> 'user_role' => $this->translation_editor_role,
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- 'projects' => $this->get_translate_top_level_projects(),
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ 'projects' => $projects,
+ 'project_tree' => $project_tree,
</ins><span class="cx" style="display: block; padding: 0 10px"> 'project_access_meta_key' => $wpdb->get_blog_prefix() . $this->project_access_meta_key,
</span><span class="cx" style="display: block; padding: 0 10px"> );
</span><span class="cx" style="display: block; padding: 0 10px"> $list_table = new Rosetta_Translation_Editors_List_Table( $args );
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -534,23 +595,22 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> /**
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- * Fetches all top level projects from translate.wordpress.org.
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ * Fetches all projects from translate.wordpress.org.
</ins><span class="cx" style="display: block; padding: 0 10px"> *
</span><span class="cx" style="display: block; padding: 0 10px"> * @return array List of projects.
</span><span class="cx" style="display: block; padding: 0 10px"> */
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- private function get_translate_top_level_projects() {
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ private function get_translate_projects() {
</ins><span class="cx" style="display: block; padding: 0 10px"> global $wpdb;
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ static $projects = null;
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $cache = get_site_transient( 'translate-top-level-projects' );
- if ( false !== $cache ) {
- return $cache;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( null !== $projects ) {
+ return $projects;
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> $_projects = $wpdb->get_results( "
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- SELECT id, name
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ SELECT id, name, parent_project_id
</ins><span class="cx" style="display: block; padding: 0 10px"> FROM translate_projects
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- WHERE parent_project_id IS NULL
- ORDER BY name ASC
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ ORDER BY id ASC
</ins><span class="cx" style="display: block; padding: 0 10px"> " );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> $projects = array();
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -558,8 +618,37 @@
</span><span class="cx" style="display: block; padding: 0 10px"> $projects[ $project->id ] = $project;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- set_site_transient( 'translate-top-level-projects', $projects, DAY_IN_SECONDS );
-
</del><span class="cx" style="display: block; padding: 0 10px"> return $projects;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ /**
+ * Transforms a flat array to a hierarchy tree.
+ *
+ * @param array $projects The projects.
+ * @param int $parent_id Optional. Parent ID. Default 0.
+ * @param int $max_depth Optional. Max depth to avoid endless recursion. Default 5.
+ * @return array The project tree.
+ */
+ public function get_project_tree( $projects, $parent_id = 0, $max_depth = 5 ) {
+ if ( $max_depth < 0 ) { // Avoid an endless recursion.
+ return;
+ }
+
+ $tree = array();
+ foreach ( $projects as $project ) {
+ if ( $project->parent_project_id == $parent_id ) {
+ $sub_projects = $this->get_project_tree( $projects, $project->id, $max_depth - 1 );
+ if ( $sub_projects ) {
+ $project->sub_projects = $sub_projects;
+ }
+
+ $tree[ $project->id ] = $project;
+ }
+ }
+ return $tree;
+ }
+
+ private function _sort_name_callback( $a, $b ) {
+ return strnatcasecmp( $a->name, $b->name );
+ }
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span></span></pre></div>
<a id="sitestrunkglobalwordpressorgpublic_htmlwpcontentmupluginsrolesviewsedittranslationeditorphp"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/views/edit-translation-editor.php</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/views/edit-translation-editor.php 2015-07-26 16:22:58 UTC (rev 1785)
+++ sites/trunk/global.wordpress.org/public_html/wp-content/mu-plugins/roles/views/edit-translation-editor.php 2015-07-26 16:42:45 UTC (rev 1786)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -9,31 +9,23 @@
</span><span class="cx" style="display: block; padding: 0 10px"> <tr>
</span><span class="cx" style="display: block; padding: 0 10px"> <th scope="row">
</span><span class="cx" style="display: block; padding: 0 10px"> <?php _e( 'Add editor access for:', 'rosetta' ); ?><br>
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <small style="font-weight:normal"><a href="#clear-all" id="clear-all"><?php _ex( 'Clear All', 'Deselects all checkboxes', 'rosetta' ); ?></a></small>
</del><span class="cx" style="display: block; padding: 0 10px"> </th>
</span><span class="cx" style="display: block; padding: 0 10px"> <td>
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <fieldset>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <fieldset id="projects">
</ins><span class="cx" style="display: block; padding: 0 10px"> <legend class="screen-reader-text"><span><?php _e( 'Add editor access for:', 'rosetta' ); ?></span></legend>
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- <p>
- <label for="project-all">
- <input name="projects[]" id="project-all" value="all" type="checkbox"<?php checked( in_array( 'all', $project_access_list ) ); ?>> <?php _e( 'All projects – If selected, translation editor will have validation permissions for all projects, including newly-added projects.', 'rosetta' ); ?>
- </label>
- </p>
- <?php
- foreach ( $projects as $project ) {
- $project_id = esc_attr( $project->id );
- printf(
- '<p><label for="project-%d"><input name="projects[]" id="project-%d" class="project" value="%d" type="checkbox"%s> %s</label></p>',
- $project_id,
- $project_id,
- $project_id,
- checked( in_array( $project->id, $project_access_list ), true, false ),
- esc_html( $project->name )
- );
- }
- ?>
- <p class="description"><?php _e( 'Each project includes sub projects and newly-added sub projects.', 'rosetta' ); ?></p>
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ <ul id="projects-list" class="projects-list">
+ <li id="project-all" class="active">
+ <label>
+ <input name="projects[]"value="all" type="checkbox"<?php checked( in_array( 'all', $project_access_list ) ); ?>> <?php _e( 'All projects', 'rosetta' ); ?>
+ </label>
+ <div class="sub-projects-wrapper">
+ <?php _e( 'The translation editor has validation permissions for all projects, including newly-added projects.', 'rosetta' ); ?>
+ </div>
+ </li>
+ </ul>
</ins><span class="cx" style="display: block; padding: 0 10px"> </fieldset>
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ <p class="description"><?php _e( 'Each project includes sub projects and newly-added sub projects.', 'rosetta' ); ?></p>
</ins><span class="cx" style="display: block; padding: 0 10px"> </td>
</span><span class="cx" style="display: block; padding: 0 10px"> </tr>
</span><span class="cx" style="display: block; padding: 0 10px"> </tbody>
</span></span></pre>
</div>
</div>
</body>
</html>