Add inline update

Author: SamuelTallet

docs/README.md

@@ -1,6 +1,6 @@
 # Free MongoDB GUI powered by PHP
 
-Visually administrate your MongoDB database. Create, read and delete operations are supported.<br>
+Visually administrate your MongoDB database. Create, read, update and delete your documents.<br>
 Autocompletion is available for collection fields and MongoDB keywords via `Ctrl` + `Space` keys.
 
 Screenshots

index.php

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

routes.php

@@ -46,6 +46,11 @@
 	CollectionController::class . '@findAction'
 );
 
+$router->post(
+	'/ajax/database/{databaseName}/collection/{collectionName}/updateOne',
+	CollectionController::class . '@updateOneAction'
+);
+
 $router->get(
 	'/ajax/database/{databaseName}/collection/{collectionName}/enumFields',
 	CollectionController::class . '@enumFieldsAction'

src/Controllers/CollectionController.php

@@ -147,6 +147,45 @@ public function findAction($databaseName, $collectionName) : Response {
 
     }
 
+    /**
+     * @see https://docs.mongodb.com/php-library/v1.6/reference/method/MongoDBCollection-updateOne/index.html
+     */
+    public function updateOneAction($databaseName, $collectionName) : Response {
+
+        global $mongoDBClient;
+
+        $collection = $mongoDBClient->$databaseName->$collectionName;
+
+        $requestBody = $this->getRequestBody();
+
+        if ( is_null($requestBody) ) {
+            return new Response(400, 'Request body is missing.');
+        }
+
+        $decodedRequestBody = json_decode($requestBody, JSON_OBJECT_AS_ARRAY);
+
+        if ( is_null($decodedRequestBody) ) {
+            return new Response(400, 'Request body is invalid.');
+        }
+
+        if ( isset($decodedRequestBody['filter']['_id'])
+            && is_string($decodedRequestBody['filter']['_id']) ) {
+                $decodedRequestBody['filter']['_id'] =
+                    new \MongoDB\BSON\ObjectId($decodedRequestBody['filter']['_id']);
+        }
+
+        $updateResult = $collection->updateOne(
+            $decodedRequestBody['filter'], $decodedRequestBody['update']
+        );
+
+        return new Response(
+            200,
+            json_encode($updateResult->getModifiedCount()),
+            ['Content-Type' => 'application/json']
+        );
+
+    }
+
     public function enumFieldsAction($databaseName, $collectionName) : Response {
 
         global $mongoDBClient;

static/css/mpg.css

@@ -43,6 +43,13 @@ button, input {
 
 }
 
+.json-container .json-value[data-document-field-is-updatable="true"]:hover {
+
+    cursor: url("/static/images/edit-icon-32x32.png") 16 16, text;
+    outline: 1.5px solid #ddd;
+
+}
+
 #mpg-databases-list, #mpg-collections-list {
 
     list-style-type: none;

static/images/edit-icon-32x32.png

@@ -28,8 +28,15 @@ var JsonView = (function (exports) {
     var params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     var key = params.key,
         value = params.value,
-        type = params.type;
-    return "\n    <div class=\"line\">\n      <div class=\"empty-icon\"></div>\n      <div class=\"json-key\">".concat(key, "</div>\n      <div class=\"json-separator\">:</div>\n      <div class=\"json-value json-").concat(type, "\">").concat(value, "</div>\n    </div>\n  ");
+        type = params.type,
+
+        // XXX Modification made for MongoDB PHP GUI.
+        documentFieldIsUpdatable = params.documentFieldIsUpdatable,
+        documentId = params.documentId,
+        documentFieldName = params.documentFieldName;
+
+    // XXX Modification made for MongoDB PHP GUI.
+    return "\n    <div class=\"line\">\n      <div class=\"empty-icon\"></div>\n      <div class=\"json-key\">".concat(key, "</div>\n      <div class=\"json-separator\">:</div>\n      <div data-document-id=\"" + documentId + "\" data-document-field-is-updatable=\"" + documentFieldIsUpdatable + "\" data-document-field-name=\"" + documentFieldName + "\" data-document-field-type=\"" + type + "\" class=\"json-value json-").concat(type, "\">").concat(value, "</div>\n    </div>\n  ");
   }
 
   function hideNodeChildren(node) {
@@ -90,6 +97,77 @@ var JsonView = (function (exports) {
     return el;
   }
 
+  // XXX Modification made for MongoDB PHP GUI.
+  function getDocFieldFromNode(node) {
+
+    var docFieldArray = [];
+
+    docFieldArray.push(node.key);
+
+    switch (node.depth) {
+
+      case 2:
+        if ( node.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.key);
+        }
+        if ( node.parent.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.parent.key);
+        }
+        break;
+
+      case 3:
+        if ( node.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.key);
+        }
+        if ( node.parent.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.parent.key);
+        }
+        if ( node.parent.parent.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.parent.parent.key);
+        }
+        break;
+
+      case 4:
+        if ( node.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.key);
+        }
+        if ( node.parent.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.parent.key);
+        }
+        if ( node.parent.parent.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.parent.parent.key);
+        }
+        if ( node.parent.parent.parent.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.parent.parent.parent.key);
+        }
+        break;
+
+      case 5:
+        if ( node.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.key);
+        }
+        if ( node.parent.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.parent.key);
+        }
+        if ( node.parent.parent.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.parent.parent.key);
+        }
+        if ( node.parent.parent.parent.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.parent.parent.parent.key);
+        }
+        if ( node.parent.parent.parent.parent.parent.depth >= 2 ) {
+          docFieldArray.push(node.parent.parent.parent.parent.parent.key);
+        }
+        break;
+        
+    }
+
+    docFieldArray.reverse();
+
+    return docFieldArray.join('.');
+
+  }
+
   function createNodeElement(node) {
     var el = document.createElement('div');
 
@@ -110,10 +188,27 @@ var JsonView = (function (exports) {
         toggleNode(node);
       });
     } else {
+
+      // XXX Modification made for MongoDB PHP GUI.
+      if ( node.key === '$oid' ) {
+        MPG.documentId = node.value;
+      }
+      if ( node.depth >= 2 && node.depth <= 5 && node.key !== '$oid' ) {
+        var documentFieldIsUpdatable = true;
+      } else {
+        var documentFieldIsUpdatable = false;
+      }
+
       el.innerHTML = notExpandedTemplate({
         key: node.key,
         value: node.value,
-        type: _typeof(node.value)
+        type: _typeof(node.value),
+
+        // XXX Modification made for MongoDB PHP GUI.
+        documentFieldIsUpdatable: ( documentFieldIsUpdatable ) ? 'true' : 'false',
+        documentId: MPG.documentId,
+        documentFieldName: getDocFieldFromNode(node)
+
       });
     }