diff --git a/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/ClassEditSheet.xml b/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/ClassEditSheet.xml index eade57c3b882..f52d8b50fa75 100644 --- a/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/ClassEditSheet.xml +++ b/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/ClassEditSheet.xml @@ -314,6 +314,7 @@ xcontext.put('propertyCustomDisplayer', new PropertyCustomDisplayer(xcontext)) * Displays a configuration property of a class field. This macro can also be used to display a property of an object. *# #macro (displayFieldProperty $property $prefix $field) + ## This 'displayFormType' property only exists for boolean fields. #set ($displayFormType = $property.getProperty('displayFormType')) #if ($property.classType == 'Boolean' && (!$displayFormType || $displayFormType.value == 'checkbox')) <dt> @@ -1392,8 +1393,10 @@ XWiki.FormFieldPrettyNameManager = Class.create({ var label = previousDT.down('label'); prettyNameInput.title = label.textContent || label.innerText; } + prettyNameInput.ariaLabel = '$escapetool.javascript($services.localization.render('platform.appwithinminutes.classEditorFieldPrettyNameToolTip'))'; // Replace the preview label with the pretty name input. var previewLabel = field.getViewer().down('label'); + // We unset the for attribute, so that this label will not be set implicitely OR explicitely anymore. previewLabel.writeAttribute('for', ''); previewLabel.removeChild(previewLabel.lastChild); previewLabel.insert(prettyNameInput); @@ -1418,10 +1421,12 @@ XWiki.FormFieldDefaultValueManager = Class.create({ _enhanceFieldDefaultValue : function(event) { var field = event.memo.field; var fieldName = field.getName(); - field.getViewer().select('input[type=text]', 'textarea').each(function(input) { + // We select the default field input and update it. + field.getViewer().select('dd :input').each(function(input) { if (!input.title && input.name.endsWith('_0_' + fieldName)) { input.title = '$escapetool.javascript($services.localization.render('platform.appwithinminutes.classEditorFieldDefaultValueToolTip'))'; } + input.ariaLabel = '$escapetool.javascript($services.localization.render('platform.appwithinminutes.classEditorFieldDefaultValueToolTip'))'; }); }, _onSave : function() { @@ -1456,7 +1461,8 @@ XWiki.FormFieldHintManager = Class.create({ if (hintInput) { hintInput.addClassName('xHint'); if (!hintInput.title) { - hintInput.title = 'Hint'; + hintInput.title = '$escapetool.javascript($services.localization.render('platform.appwithinminutes.classEditorFieldHintToolTip'))'; + hintInput.ariaLabel = '$escapetool.javascript($services.localization.render('platform.appwithinminutes.classEditorFieldHintToolTip'))'; } // Move the hint input below the pretty name input, in the field viewer. var dd = hintInput.up('dd'); diff --git a/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/Content.xml b/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/Content.xml index f2fb240dba6a..51e0219af4ab 100644 --- a/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/Content.xml +++ b/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/Content.xml @@ -39,6 +39,7 @@ {{velocity}} #if ($type == 'edit') #set ($className = $object.getxWikiClass().name) + #set ($id = "${prefix}${name}") #if ($doc.fullName == $className) ## We are editing the class so the content must be read from / written to the template document. #set ($name = 'templateContent') @@ -51,15 +52,13 @@ ## Use the preferred content editor. #set ($useWysiwygEditor = $xwiki.getUserPreference('editor') == 'Wysiwyg') {{html clean="false"}} - ## The "content" id is expected by some JavaScript and CSS code. - #set ($id = 'content') #if (!$useWysiwygEditor) <div id="xwikieditcontentinner"> ## The tool bar may have an entry to insert an HTML macro. Make sure it doesn't break the HTML macro we are currently in. #set ($toolBar = "#template('simpleedittoolbar.vm')") $!toolBar.replace('{{', '&#123;&#123;') ## Display a simple textarea. - <textarea id="$id" cols="80" rows="25" name="$name">$escapetool.xml($editedDocument.content)</textarea> + <textarea id="$escapetool.xml($id)" cols="80" rows="25" name="$name">$escapetool.xml($editedDocument.content)</textarea> #end #if ($useWysiwygEditor) $!services.edit.syntaxContent.wysiwyg($editedDocument.content, $editedDocument.syntax, { diff --git a/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/Title.xml b/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/Title.xml index 0b3170f3ffb1..2010fd10653c 100644 --- a/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/Title.xml +++ b/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/Title.xml @@ -39,6 +39,7 @@ {{velocity}} #if ($type == 'edit') #set ($className = $object.getxWikiClass().name) + #set ($id = $escapetool.xml("${prefix}${name}")) #if ($doc.fullName == $className) ## We are editing the class so the title must be read from / written to the template document. #set ($name = 'templateTitle') @@ -52,7 +53,7 @@ #end #end {{html clean="false"}} - <input type="text" name="$name" value="$!escapetool.xml($value)" + <input id="$id" type="text" name="$name" value="$!escapetool.xml($value)" ## The default value for an AppWithinMinutes field should be optional so we make only the actual page title ## mandatory and not the template title, which holds the default title value. #if ($name == 'title' && $xwiki.getSpacePreference('xwiki.title.mandatory') == 1)required #end diff --git a/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/Translations.xml b/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/Translations.xml index f5c017307449..436169388496 100644 --- a/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/Translations.xml +++ b/xwiki-platform-core/xwiki-platform-appwithinminutes/xwiki-platform-appwithinminutes-ui/src/main/resources/AppWithinMinutes/Translations.xml @@ -135,6 +135,8 @@ platform.appwithinminutes.classEditorMoveFieldLabel=Move platform.appwithinminutes.classEditorMoveFieldHint=Drag and drop to change the order platform.appwithinminutes.classEditorFieldDefaultValueToolTip=Default value +platform.appwithinminutes.classEditorFieldPrettyNameToolTip=Pretty Name +platform.appwithinminutes.classEditorFieldHintToolTip=Hint ### Date Picker platform.appwithinminutes.classEditorDatePickerAcceptSelectedDate=OK diff --git a/xwiki-platform-core/xwiki-platform-flamingo/xwiki-platform-flamingo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/edit.less b/xwiki-platform-core/xwiki-platform-flamingo/xwiki-platform-flamingo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/edit.less index 0493f92f4374..7262f270ae91 100644 --- a/xwiki-platform-core/xwiki-platform-flamingo/xwiki-platform-flamingo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/edit.less +++ b/xwiki-platform-core/xwiki-platform-flamingo/xwiki-platform-flamingo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/edit.less @@ -88,10 +88,6 @@ margin-bottom: 0; } -textarea#content { - width: 100%; -} - // // Editable properties (in-place editing) // diff --git a/xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/js/xwiki/wikieditor/wikibits.js b/xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/js/xwiki/wikieditor/wikibits.js index 2593eabc1f18..aaa5c725ba2e 100644 --- a/xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/js/xwiki/wikieditor/wikibits.js +++ b/xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/js/xwiki/wikieditor/wikibits.js @@ -54,7 +54,7 @@ function escapeQuotes(text) { // use sampleText instead of selection if there is none // copied and adapted from phpBB function insertTags(tagOpen, tagClose, sampleText) { - var txtarea = ($('edit') && $('edit').content) || $('content'); + var txtarea = ($('edit') && $('edit').content) || $$("textarea[name='content']"); // IE if (document.selection && !is_gecko) { diff --git a/xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/uicomponents/edit/editableProperty.js b/xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/uicomponents/edit/editableProperty.js index 98c7ff5bb850..c017f0bb8736 100644 --- a/xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/uicomponents/edit/editableProperty.js +++ b/xwiki-platform-core/xwiki-platform-web/xwiki-platform-web-war/src/main/webapp/resources/uicomponents/edit/editableProperty.js @@ -130,7 +130,20 @@ define('editableProperty', ['jquery', 'xwiki-meta'], function($, xcontext) { // Allow others to enhance the editor. $(document).trigger('xwiki:dom:updated', {'elements': editor.toArray()}); // Focus the first visible input. - editor.find(':input').filter(':visible').focus(); + var editInput = editor.find(':input').filter(':visible'); + // If we cannot find any kind of editInput, then we're in a weird edge case + // and we don't want to apply any of the following changes. + if (!editInput) { + return; + } + editInput.focus(); + // Make sure the edit input has an ID, and use the name of the input as a fallback. + // We add some random UUID to make sure we don't inadvertently collide with another ID. + if (!editInput.attr('id')) { + editInput.attr('id', editInput.attr('name') + '-' + crypto.randomUUID().toString()); + } + // Bind the label to the newly generated edit input. + editableProperty.find('label').attr('for', editInput.attr('id')); }).catch(() => { new XWiki.widgets.Notification(l10n['web.editableProperty.editFailed'], 'error'); return Promise.reject(); @@ -148,11 +161,15 @@ define('editableProperty', ['jquery', 'xwiki-meta'], function($, xcontext) { .next('.editableProperty-editor').filter(':visible').trigger('xwiki:actions:cancel').hide(); editableProperty.find('.editableProperty-save, .editableProperty-cancel').hide(); editableProperty.find('.editableProperty-edit').show(); + // Remove the for attribute from the label, resetting it to its default state. + editableProperty.find('label').removeAttr('for'); }; var save = function(editableProperty) { // Disable the save and cancel actions while the property is being saved. editableProperty.find('.editableProperty-save, .editableProperty-cancel').addClass('disabled'); + // Remove the for attribute from the label, resetting it to its default state. + editableProperty.find('label').removeAttr('for'); // Show progress notification message. var notification = new XWiki.widgets.Notification(l10n['core.editors.saveandcontinue.notification.inprogress'], 'inprogress');