Changeset 9615

Timestamp:

03/22/2020 11:21:55 AM (5 years ago)

Author:

ocean90

Message:

Translate, Consistency: Add jump links for next/previous translation.

Fixes #4505.

Location:

sites/trunk/wordpress.org/public_html/wp-content/plugins

Files:

• wporg-gp-customizations/templates/consistency.php (modified) (3 diffs)
• wporg-gp-customizations/templates/style.css (modified) (2 diffs)
• wporg-gp-routes/inc/routes/class-consistency.php (modified) (1 diff)

sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates/consistency.php

@@ -82 +82 @@
         foreach ( $translations_unique as $translation ) {
             printf(
-                '<li>%s <small>(%s)</small> <a href="#%s">&darr;</a></li>',
+                '<li>%s <small>(%s)</small> <a class="anchor-jumper with-tooltip" aria-label="Go to translation" href="#%s">&darr;</a></li>',
                 str_replace( ' ', '<span class="space"> </span>', esc_translation( $translation ) ),
                 1 === $translations_unique_counts[ $translation ] ? $translations_unique_counts[ $translation ] . ' time' : $translations_unique_counts[ $translation ] . ' times',
@@ -100 +100 @@
         <tbody>
             <?php
-            $previous_translation = '';
-
+            $previous_translation      = '';
+            $translations_unique_index = 0;
             foreach ( $results as $result ) {
                 $project_name = $result->project_name;
@@ -120 +120 @@
 
                 if ( $has_different_translations && $previous_translation !== $result->translation ) {
+                    $prev_arrow = '';
+                    $next_arrow = '';
+
+
+                    if ( 0 === $translations_unique_index ) {
+                        $next_arrow = '<a class="anchor-jumper with-tooltip" aria-label="Go to next translation" href="' . esc_attr( '#t-' . md5( $translations_unique[ $translations_unique_index + 1 ] ) ) . '">&darr;</a>';
+                    } elseif ( $translations_unique_count - 1 === $translations_unique_index ) {
+                        $prev_arrow = '<a class="anchor-jumper with-tooltip" aria-label="Go to previous translation" href="' . esc_attr( '#t-' . md5( $translations_unique[ $translations_unique_index - 1 ] ) ) . '">&uarr;</a>';
+                    } else {
+                        $prev_arrow = '<a class="anchor-jumper with-tooltip" aria-label="Go to previous translation" href="' . esc_attr( '#t-' . md5( $translations_unique[ $translations_unique_index - 1 ] ) ) . '">&uarr;</a>';
+                        $next_arrow = '<a class="anchor-jumper with-tooltip" aria-label="Go to next translation" href="' . esc_attr( '#t-' . md5( $translations_unique[ $translations_unique_index + 1 ] ) ) . '">&darr;</a>';
+                    }
+
+                    printf(
+                        '<tr id="%s" class="new-translation"><th colspan="2"><strong>%s</strong> %s %s</th></tr>',
+                        esc_attr( 't-' . md5( $result->translation ) ),
+                        esc_translation( $result->translation ),
+                        $next_arrow,
+                        $prev_arrow
+                    );
+
                     $previous_translation = $result->translation;
-                    printf(
-                        '<tr id="%s" class="new-translation"><td colspan="2"><strong>%s</strong> <a href="#translations-overview">&uarr;</a></td></tr>',
-                        esc_attr( 't-' . md5( $result->translation ) ),
-                        esc_translation( $result->translation )
-                    );
+                    $translations_unique_index++;
                 }
 

sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-customizations/templates/style.css

@@ -2027 +2027 @@
 
 .consistency-table tr.new-translation {
-    border-bottom-width: 3px;
+    border-bottom-width: 0;
 }
 
@@ -2035 +2035 @@
 }
 
-.consistency-table tr.new-translation td {
-    padding: 40px 0 10px;
+.consistency-table tr.new-translation th {
+    position: sticky;
+    top: 0;
+    padding: 20px 0 10px;
+    background: #fff;
+    text-align: left;
+    box-shadow: 0 -1px 0 #e2e4e7, 0 3px 0 #e2e4e7;
+}
+
+@media screen and (min-width: 600px) {
+    .consistency-table tr.new-translation th {
+        top: 46px;
+    }
+}
+
+@media screen and (min-width: 783px) {
+    .consistency-table tr.new-translation th {
+        top: 32px;
+    }
+}
+
+.anchor-jumper {
+    padding: 0 5px;
+    font-weight: 600;
+}
+
+.consistency-table tr.new-translation th .anchor-jumper {
+    float: right;
 }
 

sites/trunk/wordpress.org/public_html/wp-content/plugins/wporg-gp-routes/inc/routes/class-consistency.php

@@ -73 +73 @@
             ] );
 
-            $translations = wp_list_pluck( $results, 'translation', 'translation_id' );
-            $translations_unique = array_unique( $translations );
+            $translations               = wp_list_pluck( $results, 'translation', 'translation_id' );
+            $translations_unique        = array_values( array_unique( $translations ) );
             $translations_unique_counts = array_count_values( $translations );
         }