Lock page when changes are done in the SQL editor

The CodeMirror does not update underlying textarea in all cases, so we
need to handle it directly.

Fixes #13821

Signed-off-by: Michal Čihař <michal@cihar.com>

ChangeLog

@@ -7,6 +7,7 @@ phpMyAdmin - ChangeLog
 - issue #13436 Improve detection that MySQL server needs SSL connection
 - issue #13038 Support JSON datatype on MariaDB 10.2.7 and newer
 - issue #13824 Fixed constructing ALTER query with AFTER
+- issue #13821 Lock page when changes are done in the SQL editor
 
 4.7.5 (2017-10-23)
 - issue #13615 Avoid problems with browsing unknown query types

js/ajax.js

@@ -139,28 +139,37 @@ var AJAX = {
      *
      * @return void
      */
-    lockPageHandler: function(event) {
-        //Don't lock on enter.
-        if (0 === event.charCode) {
-            return;
-        }
-
-        var lockId = $(this).data('lock-id');
-        if (typeof lockId === 'undefined') {
-            return;
-        }
-        /*
-         * @todo Fix Code mirror does not give correct full value (query)
-         * in textarea, it returns only the change in content.
-         */
+    lockPageHandler: function (event) {
         var newHash = null;
-        if (event.data.value == 1) {
-            newHash = AJAX.hash($(this).val());
+        var oldHash = null;
+        var lockId;
+        // CodeMirror lock
+        if (event.data.value === 3) {
+            newHash = event.data.content;
+            oldHash = true;
+            lockId = 'cm';
         } else {
-            newHash = AJAX.hash($(this).is(":checked"));
+            // Don't lock on enter.
+            if (0 === event.charCode) {
+                return;
+            }
+
+            lockId = $(this).data('lock-id');
+            if (typeof lockId === 'undefined') {
+                return;
+            }
+            /*
+             * @todo Fix Code mirror does not give correct full value (query)
+             * in textarea, it returns only the change in content.
+             */
+            if (event.data.value === 1) {
+                newHash = AJAX.hash($(this).val());
+            } else {
+                newHash = AJAX.hash($(this).is(':checked'));
+            }
+            oldHash = $(this).data('val-hash');
         }
-        var oldHash = $(this).data('val-hash');
-        // Set lock if old value != new value
+        // Set lock if old value !== new value
         // otherwise release lock
         if (oldHash !== newHash) {
             AJAX.lockedTargets[lockId] = true;

js/functions.js

@@ -294,6 +294,15 @@ function PMA_getSQLEditor($textarea, options, resize, lintOptions) {
         // enable autocomplete
         codemirrorEditor.on("inputRead", codemirrorAutocompleteOnInputRead);
 
+        // page locking
+        codemirrorEditor.on('change', function (e) {
+            e.data = {
+                value: 3,
+                content: codemirrorEditor.isClean(),
+            };
+            AJAX.lockPageHandler(e);
+        });
+
         return codemirrorEditor;
     }
     return null;