Changeset 3788 for sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/functions.php

Timestamp:

08/09/2016 06:06:41 PM (8 years ago)

Author:

coffee2code

Message:

developer.wordpress.org: Add a comment preview to the front-end form for user contributed notes.

• Preview is fetched via AJAX.
• Preview updates 1.5 seconds after user stops typing.
• Adds editor toolbar button "preview note".
• Moves filtering of 'syntaxhighlighter_htmlresult' outside of just handbooks since it can also be applied elsewhere.

Props keesiemeijer.
Fixes #1865.

File:

• sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/functions.php (modified) (3 diffs)

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/functions.php

@@ -45 +45 @@
  */
 require __DIR__ . '/inc/user-content.php';
+
+/**
+ * User-submitted content preview.
+ */
+require __DIR__ . '/inc/user-content-preview.php';
 
 /**
@@ -112 +117 @@
 
     add_filter( 'document_title_separator', __NAMESPACE__ . '\\theme_title_separator', 10, 2 );
+
+    add_filter( 'syntaxhighlighter_htmlresult', __NAMESPACE__ . '\\syntaxhighlighter_htmlresult' );
 }
 
@@ -277 +284 @@
     }
 }
+
+/**
+ * If a syntax highlighted code block exceeds a given number of lines, wrap the
+ * markup with other markup to trigger the code expansion/collapse JS handling
+ * already implemented for the code reference.
+ *
+ * @param string  $text The pending result of the syntax highlighting.
+ * @return string
+ */
+function syntaxhighlighter_htmlresult( $text ) {
+
+    // is_admin() is true in front end AJAX requests.
+    if ( is_admin() && !( defined( 'DOING_AJAX' ) && DOING_AJAX ) ) {
+        return $text;
+    }
+
+    $new_text      = '';
+    // Collapse is handled for >10 lines. But just go ahead and show the full
+    // code if that is just barely being exceeded (no one wants to expand to
+    // see one or two more lines).
+    $lines_to_show = 12;
+    $do_collapse   = ( substr_count( $text, "\n" ) - 1 ) > $lines_to_show;
+
+    if ( $do_collapse )  {
+        $new_text .= '<section class="source-content">';
+        $new_text .= '<div class="source-code-container">';
+    }
+
+    $new_text .= $text;
+
+    if ( $do_collapse ) {
+        $new_text .= '</div>';
+        $new_text .= '<p class="source-code-links"><span>';
+        $new_text .= '<a href="#" class="show-complete-source">' . __( 'Expand full source code', 'wporg' ) . '</a>';
+        $new_text .= '<a href="#" class="less-complete-source">' . __( 'Collapse full source code', 'wporg' ) . '</a>';
+        $new_text .= '</span></p>';
+        $new_text .= '</section>';
+    }
+
+    return $new_text;
+}