Style changes and improvements in autocomplete

src/autocomplete/Autocompleter.js

@@ -5,12 +5,12 @@ import UserProvider from './UserProvider';
 import EmojiProvider from './EmojiProvider';
 
 const PROVIDERS = [
+    UserProvider,
     CommandProvider,
     DuckDuckGoProvider,
     RoomProvider,
-    UserProvider,
     EmojiProvider
-].map(completer => new completer());
+].map(completer => completer.getInstance());
 
 export function getCompletions(query: String) {
     return PROVIDERS.map(provider => {

src/autocomplete/CommandProvider.js

@@ -39,6 +39,8 @@ const COMMANDS = [
     }
 ];
 
+let instance = null;
+
 export default class CommandProvider extends AutocompleteProvider {
     constructor() {
         super();
@@ -49,7 +51,7 @@ export default class CommandProvider extends AutocompleteProvider {
 
     getCompletions(query: String) {
         let completions = [];
-        const matches = query.match(/(^\/\w+)/);
+        const matches = query.match(/(^\/\w*)/);
         if(!!matches) {
             const command = matches[0];
             completions = this.fuse.search(command).map(result => {
@@ -66,4 +68,11 @@ export default class CommandProvider extends AutocompleteProvider {
     getName() {
         return 'Commands';
     }
+
+    static getInstance(): CommandProvider {
+        if(instance == null)
+            instance = new CommandProvider();
+
+        return instance;
+    }
 }

src/autocomplete/DuckDuckGoProvider.js

@@ -5,6 +5,8 @@ import 'whatwg-fetch';
 const DDG_REGEX = /\/ddg\s+(.+)$/;
 const REFERER = 'vector';
 
+let instance = null;
+
 export default class DuckDuckGoProvider extends AutocompleteProvider {
     static getQueryUri(query: String) {
         return `http://api.duckduckgo.com/?q=${encodeURIComponent(query)}`
@@ -51,4 +53,11 @@ export default class DuckDuckGoProvider extends AutocompleteProvider {
     getName() {
         return 'Results from DuckDuckGo';
     }
+
+    static getInstance(): DuckDuckGoProvider {
+        if(instance == null)
+            instance = new DuckDuckGoProvider();
+
+        return instance;
+    }
 }

src/autocomplete/EmojiProvider.js

@@ -6,19 +6,19 @@ import Fuse from 'fuse.js';
 const EMOJI_REGEX = /:\w*:?/g;
 const EMOJI_SHORTNAMES = Object.keys(emojioneList);
 
+let instance = null;
+
 export default class EmojiProvider extends AutocompleteProvider {
     constructor() {
         super();
-        console.log(EMOJI_SHORTNAMES);
         this.fuse = new Fuse(EMOJI_SHORTNAMES);
     }
 
     getCompletions(query: String) {
         let completions = [];
-        const matches = query.match(EMOJI_REGEX);
-        console.log(matches);
-        if(!!matches) {
-            const command = matches[0];
+        let matches = query.match(EMOJI_REGEX);
+        let command = matches && matches[0];
+        if(command) {
             completions = this.fuse.search(command).map(result => {
                 let shortname = EMOJI_SHORTNAMES[result];
                 let imageHTML = shortnameToImage(shortname);
@@ -38,4 +38,10 @@ export default class EmojiProvider extends AutocompleteProvider {
     getName() {
         return 'Emoji';
     }
+
+    static getInstance() {
+        if(instance == null)
+            instance = new EmojiProvider();
+        return instance;
+    }
 }

src/autocomplete/RoomProvider.js

@@ -1,9 +1,12 @@
 import AutocompleteProvider from './AutocompleteProvider';
 import Q from 'q';
 import MatrixClientPeg from '../MatrixClientPeg';
+import Fuse from 'fuse.js';
 
 const ROOM_REGEX = /(?=#)[^\s]*/g;
 
+let instance = null;
+
 export default class RoomProvider extends AutocompleteProvider {
     constructor() {
         super();
@@ -13,8 +16,8 @@ export default class RoomProvider extends AutocompleteProvider {
         let client = MatrixClientPeg.get();
         let completions = [];
         const matches = query.match(ROOM_REGEX);
-        if(!!matches) {
-            const command = matches[0];
+        const command = matches && matches[0];
+        if(command) {
             completions = client.getRooms().map(room => {
                 return {
                     title: room.name,
@@ -28,4 +31,11 @@ export default class RoomProvider extends AutocompleteProvider {
     getName() {
         return 'Rooms';
     }
+    
+    static getInstance() {
+        if(instance == null)
+            instance = new RoomProvider();
+        
+        return instance;
+    }
 }

src/autocomplete/UserProvider.js

@@ -4,20 +4,22 @@ import MatrixClientPeg from '../MatrixClientPeg';
 
 const ROOM_REGEX = /@[^\s]*/g;
 
+let instance = null;
+
 export default class UserProvider extends AutocompleteProvider {
     constructor() {
         super();
+        this.users = [];
     }
 
     getCompletions(query: String) {
-        let client = MatrixClientPeg.get();
         let completions = [];
         const matches = query.match(ROOM_REGEX);
         if(!!matches) {
             const command = matches[0];
-            completions = client.getUsers().map(user => {
+            completions = this.users.map(user => {
                 return {
-                    title: user.displayName,
+                    title: user.displayName || user.userId,
                     description: user.userId
                 };
             });
@@ -28,4 +30,15 @@ export default class UserProvider extends AutocompleteProvider {
     getName() {
         return 'Users';
     }
+
+    setUserList(users) {
+        console.log('setUserList');
+        this.users = users;
+    }
+
+    static getInstance(): UserProvider {
+        if(instance == null)
+            instance = new UserProvider();
+        return instance;
+    }
 }