Add autocompletion

Author: SamuelTallet

index.php

@@ -20,7 +20,7 @@
  * 
  * @var string
  */
-define('MPG_APP_VERSION', '0.9.2');
+define('MPG_APP_VERSION', '0.9.3');
 
 /**
  * Development mode?

routes.php

@@ -45,3 +45,8 @@
 	'/ajax/database/{databaseName}/collection/{collectionName}/find',
 	CollectionController::class . '@findAction'
 );
+
+$router->get(
+	'/ajax/database/{databaseName}/collection/{collectionName}/enumFields',
+	CollectionController::class . '@enumFieldsAction'
+);

src/Controllers/CollectionController.php

@@ -3,6 +3,7 @@
 namespace Controllers;
 
 use Capsule\Response;
+use Helpers\MongoDBHelper;
 
 class CollectionController extends Controller {
 
@@ -120,16 +121,32 @@ public function findAction($databaseName, $collectionName) : Response {
 
         $documents = $collection->find(
             $decodedRequestBody['filter'], $decodedRequestBody['options']
+        )->toArray();
+
+        return new Response(
+            200, json_encode($documents), ['Content-Type' => 'application/json']
         );
 
-        $responseBody = [];
+    }
+
+    public function enumFieldsAction($databaseName, $collectionName) : Response {
 
-        foreach ($documents as $document) {
-            $responseBody[] = $document;
+        global $mongoDBClient;
+
+        $collection = $mongoDBClient->$databaseName->$collectionName;
+
+        $documents = $collection->find([], ['limit' => 1])->toArray();
+
+        if ( empty($documents) ) {
+            return new Response(404, 'Collection is empty');
         }
-        
+
+        $documentFields = MongoDBHelper::arrayKeysMulti(
+            json_decode(json_encode($documents[0]), JSON_OBJECT_AS_ARRAY)
+        );
+
         return new Response(
-            200, json_encode($responseBody), ['Content-Type' => 'application/json']
+            200, json_encode($documentFields), ['Content-Type' => 'application/json']
         );
 
     }

src/Helpers/MongoDBHelper.php

@@ -33,4 +33,28 @@ public static function createClient() : MongoDBClient {
 
     }
 
+    /**
+     * Gets all keys from a multidimensional array.
+     * @see https://gist.github.com/JohnQUnknown/8761761
+     * 
+     * @param array $array
+     * 
+     * @return array
+     */
+    public static function arrayKeysMulti(array $array) : array {
+
+        $keys = [];
+
+        foreach ($array as $key => $_value) {
+            $keys[] = $key;
+
+            if ( is_array($array[$key]) ) {
+                $keys = array_merge($keys, self::arrayKeysMulti($array[$key]));
+            }
+        }
+
+        return $keys;
+
+    }
+
 }

static/css/codemirror-addon/show-hint.css

@@ -0,0 +1,36 @@
+.CodeMirror-hints {
+  position: absolute;
+  z-index: 10;
+  overflow: hidden;
+  list-style: none;
+
+  margin: 0;
+  padding: 2px;
+
+  -webkit-box-shadow: 2px 3px 5px rgba(0,0,0,.2);
+  -moz-box-shadow: 2px 3px 5px rgba(0,0,0,.2);
+  box-shadow: 2px 3px 5px rgba(0,0,0,.2);
+  border-radius: 3px;
+  border: 1px solid silver;
+
+  background: white;
+  font-size: 90%;
+  font-family: monospace;
+
+  max-height: 20em;
+  overflow-y: auto;
+}
+
+.CodeMirror-hint {
+  margin: 0;
+  padding: 0 4px;
+  border-radius: 2px;
+  white-space: pre;
+  color: black;
+  cursor: pointer;
+}
+
+li.CodeMirror-hint-active {
+  background: #08f;
+  color: white;
+}

static/css/mpg.css

@@ -23,6 +23,13 @@ button, input {
 
 }
 
+.CodeMirror-hints {
+
+    font-family: Consolas, monospace;
+    font-size: 100%;
+
+}
+
 .json-container {
 
     font-family: Consolas, monospace;

static/js/codemirror-addon/mpg-hint.js

@@ -0,0 +1,51 @@
+// CodeMirror, copyright (c) by Marijn Haverbeke and others
+// Distributed under an MIT license: https://codemirror.net/LICENSE
+
+(function(mod) {
+  if (typeof exports == "object" && typeof module == "object") // CommonJS
+    mod(require("../../lib/codemirror"));
+  else if (typeof define == "function" && define.amd) // AMD
+    define(["../../lib/codemirror"], mod);
+  else // Plain browser env
+    mod(CodeMirror);
+})(function(CodeMirror) {
+  "use strict";
+
+  var WORD = /[\w$]+/, RANGE = 500;
+
+  CodeMirror.registerHelper("hint", "anyword", function(editor, options) {
+
+    var word = options && options.word || WORD;
+    var range = options && options.range || RANGE;
+    var cur = editor.getCursor(), curLine = editor.getLine(cur.line);
+    var end = cur.ch, start = end;
+    while (start && word.test(curLine.charAt(start - 1))) --start;
+    var curWord = start != end && curLine.slice(start, end);
+
+    options.list = MPG.mongoDBKeywords.concat(MPG.collectionFields);
+
+    /**
+     * Code block taken from Mongolo project.
+     * @see https://github.com/tetreum/mongolo/blob/develop/htdocs/js/src/custom-hint.js
+     */
+
+    var list = [],
+        suggestedWord,
+        k;
+
+    if (curWord)
+    {
+      for (k in options.list)
+      {
+        if (!options.list.hasOwnProperty(k)) {continue;}
+        suggestedWord = options.list[k];
+
+        if (suggestedWord.toLowerCase().startsWith(curWord.toLowerCase()) && list.indexOf(suggestedWord) == -1) {
+          list.push(suggestedWord);
+        }
+      }
+    }
+
+    return {list: list, from: CodeMirror.Pos(cur.line, start), to: CodeMirror.Pos(cur.line, end)};
+  });
+});