Changeset 9100

Timestamp:

10/29/2014 12:36:18 AM (12 years ago)

Author:

djpaul

Message:

Mentions: load in the dashboard's Visual editor.

Inspired by Automattic's O2 team's implementation of the At.js library
inside publishing screens.

Also updated RTL CSS missed from a previous commit.

Fixes #5969

Location:

trunk/src/bp-activity

Files:

• css/mentions-rtl.css (modified) (4 diffs)
• js/mentions.js (modified) (2 diffs)

trunk/src/bp-activity/css/mentions-rtl.css

@@ -1 +1 @@
 .atwho-view {
-        background: #FFF;
+        background: rgba(204, 204, 204, 0.8);
         border-radius: 2px;
         border: 1px solid rgb(204, 204, 204);
@@ -17 +17 @@
 }
 .atwho-view ul {
+        background: #FFF;
         list-style: none;
         margin: auto;
@@ -63 +64 @@
                 margin: 0 0 0 10px;
         }
-        .atwho-view small {
-                display: none;
-        }
 }
 @media (max-width: 400px) {
@@ -78 +76 @@
                 width: 30px;
         }
+        .atwho-view {
+                border-radius: 0;
+                height: 100%;
+                right: 0 !important;
+                width: 100%;
+        }
+        .atwho-view ul li .username {
+                display: inline-block;
+                margin: -10px 0 0 0;
+                padding: 10px 0;
+        }
+        .atwho-view ul li small {
+                display: inline-block;
+                margin-right: 20px;
+        }
 }

trunk/src/bp-activity/js/mentions.js

@@ -222 +222 @@
 
         $( document ).ready(function() {
-                var users = [];
+                var loadMentionsInTinyMCE,
+                        loadAttempts = 0,
+                        users        = [];
 
                 if ( typeof window.BP_Suggestions === 'object' ) {
@@ -228 +230 @@
                 }
 
+                // Dashoard post 'visual' editor.
+                loadMentionsInTinyMCE = function() {
+                        if ( loadAttempts < 4 || ! $( 'body' ).hasClass( 'wp-admin' ) ) {
+                                loadAttempts++;
+
+                                if ( typeof window.tinyMCE === 'undefined' || window.tinyMCE.activeEditor === null || typeof window.tinyMCE.activeEditor === 'undefined' ) {
+                                        setTimeout( loadMentionsInTinyMCE, 500 );
+                                        return;
+                                }
+                        }
+
+                        $( window.tinyMCE.activeEditor.contentDocument.activeElement )
+                                .atwho( 'setIframe', $( '#content_ifr' )[0] )
+                                .bp_mentions( users );
+                };
+
                 // Activity/reply, post comments, dashboard post 'text' editor.
                 $( '.bp-suggestions, #comments form textarea, .wp-editor-area' ).bp_mentions( users );
+
+                // Dashbboard post 'visual' editor.
+                loadMentionsInTinyMCE();
         });
 })( jQuery );