New file box now has default file name + extension

Whenever a user creates a file or folder in the web UI, the input field
will contain a default file name, pre-selected up to the extension for
easier typing.

The purpose is mostly to prevent users creating text files without an
extension.

Fixes #6045

2 files changed, 15 insertions, 5 deletions

diff --git a/apps/files/js/file-upload.js b/apps/files/js/file-upload.js
index bc1244a1e6e..e9663353f74 100644
--- a/apps/files/js/file-upload.js
+++ b/apps/files/js/file-upload.js
@@ -508,11 +508,15 @@ $(document).ready(function() {
 		$(this).children('p').remove();
 		
 		// add input field
-		var form=$('<form></form>');
-		var input=$('<input type="text">');
+		var form = $('<form></form>');
+		var input = $('<input type="text">');
+		var newName = $(this).attr('data-newname') || '';
+		if (newName) {
+			input.val(newName);
+		}
 		form.append(input);
 		$(this).append(form);
-
+		var lastPos;
 		var checkInput = function () {
 			var filename = input.val();
 			if (type === 'web' && filename.length === 0) {
@@ -543,6 +547,12 @@ $(document).ready(function() {
 		});
 
 		input.focus();
+		// pre select name up to the extension
+		lastPos = newName.lastIndexOf('.');
+		if (lastPos === -1) {
+			lastPos = newName.length;
+		}
+		input.selectRange(0, lastPos);
 		form.submit(function(event) {
 			event.stopPropagation();
 			event.preventDefault();
diff --git a/apps/files/templates/index.php b/apps/files/templates/index.php
index 4f8623573cb..bb46086a4d2 100644
--- a/apps/files/templates/index.php
+++ b/apps/files/templates/index.php
@@ -5,9 +5,9 @@
 				<a><?php p($l->t('New'));?></a>
 				<ul>
 					<li style="background-image:url('<?php p(OCP\mimetype_icon('text/plain')) ?>')"
-						data-type='file'><p><?php p($l->t('Text file'));?></p></li>
+						data-type='file' data-newname='<?php p($l->t('New text file.txt')) ?>'><p><?php p($l->t('Text file'));?></p></li>
 					<li style="background-image:url('<?php p(OCP\mimetype_icon('dir')) ?>')"
-						data-type='folder'><p><?php p($l->t('Folder'));?></p></li>
+						data-type='folder' data-newname='<?php p($l->t('New folder')) ?>'><p><?php p($l->t('Folder'));?></p></li>
 					<li style="background-image:url('<?php p(OCP\image_path('core', 'places/link.svg')) ?>')"
 						data-type='web'><p><?php p($l->t('From link'));?></p></li>
 				</ul>