From 3fe964656498e4a9d10b0d995a59b3b88afcbe9c Mon Sep 17 00:00:00 2001 From: Lukas Date: Wed, 23 Oct 2019 02:29:33 +0200 Subject: [PATCH] Enabling and disabling the commit button to prevent empty commits (web editor) (#8590) * Enabling and disabling the commit button to prevent empty commits Signed-off-by: LukBukkit * The button won't get enabled if you change the commit message Signed-off-by: LukBukkit * Fixes a spelling mistake for 'silent' Signed-off-by: LukBukkit --- public/js/index.js | 22 +++++++++++++++++++++- 1 file changed, 21 insertions(+), 1 deletion(-) diff --git a/public/js/index.js b/public/js/index.js index e9a4bcaac..90819677a 100644 --- a/public/js/index.js +++ b/public/js/index.js @@ -1572,7 +1572,27 @@ function initEditor() { }); }).trigger('keyup'); - $('#commit-button').click(function (event) { + // Using events from https://github.com/codedance/jquery.AreYouSure#advanced-usage + // to enable or disable the commit button + const $commitButton = $('#commit-button'); + const $editForm = $('.ui.edit.form'); + const dirtyFileClass = 'dirty-file'; + + // Disabling the button at the start + $commitButton.prop('disabled', true); + + // Registering a custom listener for the file path and the file content + $editForm.areYouSure({ + silent: true, + dirtyClass: dirtyFileClass, + fieldSelector: ':input:not(.commit-form-wrapper :input)', + change: function () { + const dirty = $(this).hasClass(dirtyFileClass); + $commitButton.prop('disabled', !dirty); + } + }); + + $commitButton.click(function (event) { // A modal which asks if an empty file should be committed if ($editArea.val().length === 0) { $('#edit-empty-content-modal').modal({