Changeset 988

Timestamp:

11/17/2014 11:23:36 PM (9 years ago)

Author:

coffee2code

Message:

Use wp_editor() instead of a textarea for user contributed notes comment form.

Includes php, js, inline code QuickTag buttons.

fixes #692.
props DrewAPicture.

Location:

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

Files:

• comments.php (modified) (2 diffs)
• inc/user-content.php (modified) (2 diffs)
• js/user-notes.js (modified) (1 diff)

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

@@ -59 +59 @@
 
     <?php comment_form( array(
-        'comment_field'       => '<p class="comment-form-comment"><label for="comment">' . _x( 'Add Note', 'noun', 'wporg' ) . '</label> <textarea id="comment" name="comment" cols="45" rows="8" aria-required="true"></textarea></p>',
+        'comment_field'       => DevHub_User_Submitted_Content::wp_editor_comments(),
         'comment_notes_after' => '<p>' .
             __( 'Notes should supplement code reference entries, for example examples, tips, explanations, use-cases, and best practices.', 'wporg' ) .
@@ -65 +65 @@
             __( 'Do not use this form for support requests, discussions, spam, bug reports, complaints, or self-promotion. Entries of this nature will be deleted.', 'wporg' ) .
             '</p><p>' .
-            sprintf( __( 'You can enter text and code. Code should be wrapped in the %s shortcode.', 'wporg' ), '[code][/code]' ) .
+            __( 'You can enter text and code. Use the php, js, or inline code buttons to wrap code snippets.', 'wporg' ) .
             '</p><p class="user-notes-are-gpl">' .
             sprintf( __( '<strong>NOTE:</strong> All contributions are licensed under <a href="%s">GFDL</a> and are moderated before appearing on the site.', 'wporg' ), 'https://gnu.org/licenses/fdl.html' ) .

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

@@ -67 +67 @@
             wp_enqueue_style( 'syntaxhighlighter-theme-default' );
 
-            wp_enqueue_script( 'wporg-developer-user-notes', get_template_directory_uri() . '/js/user-notes.js', array(), '20140912', true );
+            wp_enqueue_script( 'wporg-developer-user-notes', get_template_directory_uri() . '/js/user-notes.js', array( 'quicktags' ), '20140912', true );
             if ( get_option( 'thread_comments' ) ) {
                 wp_enqueue_script( 'comment-reply' );
@@ -109 +109 @@
     }
 
+    /**
+     * Capture an {@see wp_editor()} instance as the 'User Contributed Notes' comment form.
+     *
+     * Uses output buffering to capture the editor instance for use with the {@see comments_form()}.
+     *
+     * @return string HTML output for the wp_editor-ized comment form.
+     */
+    public static function wp_editor_comments() {
+        ob_start();
+        echo '<p class="comment-form-comment"><label for="comment">' . _x( 'Add Note', 'noun', 'wporg' ) . '</label>';
+        wp_editor( '', 'comment', array(
+            'media_buttons' => false,
+            'textarea_name' => 'comment',
+            'textarea_rows' => 8,
+            'quicktags'     => array(
+                'buttons' => 'strong,em,ul,ol,li,wporg_php,js'
+            ),
+            'teeny'         => true,
+            'tinymce'       => false,
+        ) );
+        echo '</p>';
+        return ob_get_clean();
+    }
+
+    public static function mce_buttons( $buttons ) {
+        $buttons = array_merge( $buttons, array( 'wporg_php' ) );
+        return $buttons;
+    }
+
+    public static function mce_plugins( $plugins ) {
+        $plugins['wporg_php'] = get_stylesheet_directory_uri() . '/js/user-notes.js';
+        return $plugins;
+    }
 } // DevHub_User_Submitted_Content
 

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/js/user-notes.js

@@ -21 +21 @@
         }
     } );
+
+    // Add php and js buttons to QuickTags.
+    QTags.addButton( 'php', 'php', '[php]', '[/php]' );
+    QTags.addButton( 'js', 'js', '[js]', '[/js]' );
+    QTags.addButton( 'inline-code', 'inline code', '<code>', '</code>' );
+
 } )( jQuery );