mirror_php/humhub
1
0
Fork 0
mirror of https://github.com/humhub/humhub.git synced 2025-01-16 21:58:17 +01:00
Code Issues Projects Releases Wiki Activity

Chg #7136: When opening a modal box, don't autofocus automatically on… (#7137)

Browse Source 
* Chg #7136: When opening a modal box, don't autofocus automatically on the first form input

* Add MIGRATE info

* Fix BasePicker focus
This commit is contained in:
Marc Farré 2024-07-24 17:06:25 +02:00 committed by GitHub
parent 9b851c3288
commit 15a23d6ce6
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
8 changed files with 100 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
CHANGELOG.md
View File

@ -1,7 +1,6 @@
HumHub Changelog
================
1.17.0 (TBA)
------------
- Enh #7070: Add GitHub action for PHP CS Fixer
@ -9,7 +8,8 @@ HumHub Changelog
- Fix #7100: Enable all file handlers on RichText editor toolbar
- Enh #7127: Prerequisites - Check that Web and Cli php version and user is the same
- Enh #7128: Prerequisites - check for mixed table collations
- Enh #7129: Link `wall-entry-controls`- color to `--text-color-soft`
- Enh #7129: Link `wall-entry-controls`- color to `--text-color-soft`
- Chg #7136: When opening a modal box, don't autofocus automatically on the first form input
1.16.2 (Unreleased)
---------------------

24
MIGRATE-DEV.md
View File

@ -1,16 +1,21 @@
Module Migration Guide
======================
See [humhub/documentation::docs/develop/modules-migrate.md](https://github.com/humhub/documentation/blob/master/docs/develop/modules-migrate.md)
for full version.
See [humhub/documentation::docs/develop/modules-migrate.md](https://github.com/humhub/documentation/blob/master/docs/develop/modules-migrate.md) for full version.
Version 1.17 (Unreleased)
-------------------------
### Behaviour change
- Forms in modal box no longer have focus automatically on the first field. [The `autofocus` attribute](https://developer.mozilla.org/docs/Web/HTML/Global_attributes/autofocus) is now required on the field. More info: [#7136](https://github.com/humhub/humhub/issues/7136)
Version 1.16 (April 2024)
-------------------------
At least PHP 8.0 is required with this version.
#### Removed
- `\humhub\modules\search\*` The existing search module was removed and the related features merged
into the 'content', 'user' and 'space' modules.
- `\humhub\modules\search\*` The existing search module was removed and the related features merged into the 'content', 'user' and 'space' modules.
- `\humhub\modules\user\models\User::getSearchAttributes()` and `\humhub\modules\space\models\Space::getSearchAttributes()`
### Behaviour change
@ -23,8 +28,7 @@ At least PHP 8.0 is required with this version.
### Deprecations
- `\humhub\components\Module::getIsActivated()` use `getIsEnabled()` instead
(note: this also affects the virtual instance property `\humhub\modules\friendship\Module::$isActivated` which should
now read `$isEnabled`!)
(note: this also affects the virtual instance property `\humhub\modules\friendship\Module::$isActivated` which should now read `$isEnabled`!)
- `\humhub\components\Module::migrate()` use `getMigrationService()->migrateUp(MigrationService::ACTION_MIGRATE)` instead
- `\humhub\libs\BaseSettingsManager::isDatabaseInstalled()` use `Yii::$app->isDatabaseInstalled()` instead
- `\humhub\models\Setting::isInstalled()` use `Yii::$app->isInstalled()` instead
@ -32,9 +36,7 @@ At least PHP 8.0 is required with this version.
- `\humhub\modules\content\components\ContentAddonActiveRecord::canWrite()`
- `\humhub\modules\file\models\File::canRead()` use `canView()` instead
- `\humhub\modules\friendship\Module::getIsEnabled()` use `isFriendshipEnabled()` instead
(note: `\humhub\modules\friendship\Module::getIsEnabled()` and the virtual
property `\humhub\modules\friendship\Module::isEnabled` now return the status of the module -
which yields always true for core modules.)
(note: `\humhub\modules\friendship\Module::getIsEnabled()` and the virtual property `\humhub\modules\friendship\Module::isEnabled` now return the status of the module - which yields always true for core modules.)
- `\humhub\modules\marketplace\Module::isEnabled()` use `isMarketplaceEnabled()` instead
- `\humhub\modules\marketplace\services\ModuleService::activate()` use `enable()` instead
@ -63,9 +65,7 @@ Version 1.15
-------------------------
### Behaviour change
- `\humhub\libs\BaseSettingsManager::deleteAll()` no longer uses the `$prefix` parameter as a full wildcard, but
actually as a prefix. Use `$prefix = '%pattern%'` to get the old behaviour. Or use `$parameter = '%suffix'` if you
want to match against the end of the names.
- `\humhub\libs\BaseSettingsManager::deleteAll()` no longer uses the `$prefix` parameter as a full wildcard, but actually as a prefix. Use `$prefix = '%pattern%'` to get the old behaviour. Or use `$parameter = '%suffix'` if you want to match against the end of the names.
- `\humhub\libs\BaseSettingsManager::get()` now returns a pure int in case the (trimmed) value can be converted
- New `PolymorphicRelation::getObjectModel()`: should replace `get_class()`
- Removed deprecated javascript method `setModalLoader()`

8
protected/humhub/modules/space/views/create/create.php
View File

@ -1,12 +1,12 @@
<?php
use humhub\libs\Html;
use humhub\modules\space\models\Space;
use yii\bootstrap\ActiveForm;
use humhub\modules\space\widgets\SpaceNameColorInput;
use humhub\widgets\ModalButton;
use humhub\widgets\ModalDialog;
use humhub\modules\space\widgets\SpaceNameColorInput;
use yii\bootstrap\ActiveForm;
use yii\helpers\Url;
use humhub\libs\Html;
/* @var $model Space */
/* @var $visibilityOptions array */
@ -19,7 +19,7 @@ $animation = $model->hasErrors() ? 'shake' : 'fadeIn';
<?php $form = ActiveForm::begin(['enableClientValidation' => false]); ?>
<div class="modal-body">
<?= SpaceNameColorInput::widget(['form' => $form, 'model' => $model]) ?>
<?= SpaceNameColorInput::widget(['form' => $form, 'model' => $model, 'focus' => true]) ?>
<?= $form->field($model, 'description'); ?>
<a data-toggle="collapse" id="access-settings-link" href="#collapse-access-settings" style="font-size: 11px;">

5
protected/humhub/modules/space/widgets/SpaceNameColorInput.php
View File

@ -8,6 +8,10 @@ class SpaceNameColorInput extends Widget
{
public $model;
public $form;
/**
* If set to true, the name input will be focused automatically.
*/
public bool $focus = false;
/**
* Displays / Run the Widgets
@ -17,6 +21,7 @@ class SpaceNameColorInput extends Widget
return $this->render('spaceNameColorInput', [
'model' => $this->model,
'form' => $this->form,
'focus' => $this->focus,
]);
}
}

31
protected/humhub/modules/space/widgets/views/spaceNameColorInput.php
View File

@ -1,6 +1,16 @@
<?php
use humhub\modules\ui\view\components\View;
use humhub\widgets\ColorPickerField;
use yii\base\Model;
use yii\widgets\ActiveForm;
/**
* @var $this View
* @var $model Model
* @var $form ActiveForm
* @var $focus bool
*/
$containerId = time() . 'space-color-chooser-edit';
@ -13,13 +23,16 @@ if ($model->color === null) {
<?= ColorPickerField::widget(['model' => $model, 'field' => 'color', 'container' => $containerId]); ?>
<?= $form->field($model, 'name', ['template' => '
{label}
<div class="input-group">
<span class="input-group-addon">
<i></i>
</span>
{input}
</div>
{error}{hint}'
])->textInput(['placeholder' => Yii::t('SpaceModule.manage', 'Space name'), 'maxlength' => 45]); ?>
{label}
<div class="input-group">
<span class="input-group-addon">
<i></i>
</span>
{input}
</div>
{error}{hint}',
])->textInput(array_merge([
'placeholder' => Yii::t('SpaceModule.manage', 'Space name'),
'maxlength' => 45,
], ($focus ? ['autofocus' => ''] : []))); ?>
</div>

2
protected/humhub/modules/topic/views/content-topic/edit.php
View File

@ -21,7 +21,7 @@ use yii\bootstrap\ActiveForm;
<?php ModalDialog::begin(['header' => Yii::t('TopicModule.base', '<strong>Manage</strong> Topics')]) ?>
<?php $form = ActiveForm::begin() ?>
<div class="modal-body">
<?= $form->field($model, 'topics')->widget(TopicPicker::class, ['contentContainer' => $model->getContentContainer()])->label(false) ?>
<?= $form->field($model, 'topics')->widget(TopicPicker::class, ['contentContainer' => $model->getContentContainer(), 'options' => ['autofocus' => '']])->label(false) ?>
</div>
<div class="modal-footer">

42
static/js/humhub/humhub.ui.modal.js
View File

@ -96,7 +96,7 @@ humhub.module('ui.modal', function (module, require, $) {
Modal.prototype.checkAriaLabel = function () {
var $title = this.$.find('.modal-title');
if($title.length) {
if ($title.length) {
$title.attr('id', this.getTitleId());
this.$.attr('aria-labelledby', this.getTitleId());
} else {
@ -226,7 +226,7 @@ humhub.module('ui.modal', function (module, require, $) {
});
};
var setDefaultRequestData = function(cfg) {
var setDefaultRequestData = function (cfg) {
cfg = cfg || {};
cfg.data = cfg.data || {};
cfg.viewContext = cfg.viewContext || 'modal';
@ -405,8 +405,8 @@ humhub.module('ui.modal', function (module, require, $) {
this.setFooter(this.options.footer);
}
if(this.options.size) {
this.getDialog().addClass('modal-dialog-'+this.options.size);
if (this.options.size) {
this.getDialog().addClass('modal-dialog-' + this.options.size);
}
this.options.backdrop = object.defaultValue(options.backdrop, 'static');
@ -450,10 +450,10 @@ humhub.module('ui.modal', function (module, require, $) {
}
}
if(content) {
if (content) {
this.$.empty().append(content);
this.applyAdditions();
this.$.find('select:visible, input[type="text"]:visible, textarea:visible, [contenteditable="true"]:visible').first().focus();
this.focus();
this.checkAriaLabel();
this.updateDialogOptions();
this.$.scrollTop(0);
@ -466,10 +466,10 @@ humhub.module('ui.modal', function (module, require, $) {
Modal.prototype.focus = function () {
var that = this;
setTimeout(function() {
var $input = that.$.find('select:visible:not(:disabled), input[type="text"]:visible:not(:disabled), textarea:visible:not(:disabled), [contenteditable="true"]:visible:not(:disabled)').first();
setTimeout(function () {
var $input = that.$.find('select[autofocus]:visible:not(:disabled), input[autofocus][type="text"]:visible:not(:disabled), textarea[autofocus]:visible:not(:disabled), [contenteditable="true"][autofocus]:visible:not(:disabled)').first();
if($input.data('select2')) {
if ($input.data('select2')) {
$input.select2('focus');
} else {
$input.focus();
@ -477,10 +477,10 @@ humhub.module('ui.modal', function (module, require, $) {
}, 100);
};
Modal.prototype.updateDialogOptions = function() {
Modal.prototype.updateDialogOptions = function () {
this.set({
backdrop : this.getDialog().data('backdrop'),
keyboard : this.getDialog().data('keyboard')
backdrop: this.getDialog().data('backdrop'),
keyboard: this.getDialog().data('keyboard')
});
};
@ -607,7 +607,7 @@ humhub.module('ui.modal', function (module, require, $) {
return true;
}
if($target.closest('.ProseMirror-prompt').length) {
if ($target.closest('.ProseMirror-prompt').length) {
return true;
}
@ -672,7 +672,7 @@ humhub.module('ui.modal', function (module, require, $) {
var modal = (id) ? module.get(id) : module.global;
return client.submit(evt, setDefaultRequestData(options)).then(function (response) {
if(response.success) {
if (response.success) {
modal.close();
} else {
modal.setDialog(response);
@ -702,15 +702,15 @@ humhub.module('ui.modal', function (module, require, $) {
var modal = (id) ? module.get(id) : module.global;
return modal.load(evt, setDefaultRequestData(options))
.catch(function (err) {
module.log.error(err, true);
modal.close();
});
module.log.error(err, true);
modal.close();
});
};
var unload = function() {
var unload = function () {
$('.modal').each(function () {
var modal = Modal.instance(this);
if (modal && typeof modal.close === 'function' && !$(this).find('.exclude-from-pjax-client').length ) {
if (modal && typeof modal.close === 'function' && !$(this).find('.exclude-from-pjax-client').length) {
modal.close();
}
});
@ -735,7 +735,7 @@ humhub.module('ui.modal', function (module, require, $) {
var show = function (evt) {
var modal = get(evt.$target);
if(modal) {
if (modal) {
modal.show();
}
};
@ -761,7 +761,7 @@ humhub.module('ui.modal', function (module, require, $) {
var _getConfirmOptionsByTrigger = function ($trigger) {
return {
'body': $trigger.data('action-confirm'),
'header': $trigger.data('action-confirm-header') || $trigger.data('action-confirm-title'),
'header': $trigger.data('action-confirm-header') || $trigger.data('action-confirm-title'),
'confirmText': $trigger.data('action-confirm-text'),
'cancelText': $trigger.data('action-cancel-text')
};

64
static/js/humhub/humhub.ui.picker.js
View File

@ -108,7 +108,7 @@ humhub.module('ui.picker', function (module, require, $) {
results.sort(function (a, b) {
if (a.disabled !== b.disabled) {
return (a.disabled < b.disabled) ? -1 : 1;
} else if(a.new !== b.new) {
} else if (a.new !== b.new) {
return (a.new < b.new) ? -1 : 1;
} else if (a.priority !== b.priority) {
return (a.priority > b.priority) ? -1 : 1;
@ -167,7 +167,7 @@ humhub.module('ui.picker', function (module, require, $) {
Widget.instance($node).renderPlaceholder(true);
// Focus if auto focus is active
if ($node.data('picker-focus')) {
if (Widget.instance($node).data('picker-focus')) {
Widget.instance($node).focus();
}
@ -242,15 +242,17 @@ humhub.module('ui.picker', function (module, require, $) {
item.new = false;
});
var encodedTerm = string.encode(params.term);
var encodedTerm = string.encode(params.term);
if(encodedTerm && encodedTerm.length >= that.options.minimumInputLength &&
if (encodedTerm && encodedTerm.length >= that.options.minimumInputLength &&
that.options.addOptions &&
$(data).filter(function() {return this.text.localeCompare(encodedTerm)=== 0}).length === 0) {
$(data).filter(function () {
return this.text.localeCompare(encodedTerm) === 0
}).length === 0) {
data.push({
'id': '_add:'+params.term,
'text': module.text('addOption')+' \''+encodedTerm+'\'',
'id': '_add:' + params.term,
'text': module.text('addOption') + ' \'' + encodedTerm + '\'',
'textValue': params.term,
'image': '<i class="fa fa-plus-circle" aria-hidden="true"></i>',
'new': true
@ -271,7 +273,7 @@ humhub.module('ui.picker', function (module, require, $) {
*/
Picker.prototype.templateResult = function (item) {
// If no item id is given the function was called for the search term.
if (typeof(item.id) === 'undefined') {
if (typeof (item.id) === 'undefined') {
return loader.set($('<div></div>'), {'css': {'padding': '4px'}});
}
@ -280,10 +282,10 @@ humhub.module('ui.picker', function (module, require, $) {
var template = (item.disabled) ? Picker.template.resultDisabled : Picker.template.result;
var $result = $(string.template(template, item))
.tooltip({html: false, container: 'body', placement: "bottom"})
.on('click', function (evt) {
evt.preventDefault();
});
.tooltip({html: false, container: 'body', placement: "bottom"})
.on('click', function (evt) {
evt.preventDefault();
});
$result.find('.picker-text').text(item.text);
@ -350,7 +352,7 @@ humhub.module('ui.picker', function (module, require, $) {
if (image.indexOf('fa-') === 0) {
return string.template(Picker.template.imageIcon, item);
}
if(image.indexOf('#') === 0) {
if (image.indexOf('#') === 0) {
return string.template(Picker.template.imageColor, item);
}
@ -383,7 +385,7 @@ humhub.module('ui.picker', function (module, require, $) {
})).text(text));
}
if(options.triggerChange !== false) {
if (options.triggerChange !== false) {
this.triggerChange();
}
@ -402,23 +404,23 @@ humhub.module('ui.picker', function (module, require, $) {
this.clear(false);
selection.forEach(function(item) {
if(translate) {
selection.forEach(function (item) {
if (translate) {
item = translate.call(this, item);
}
if(item && that.select(item.id, item.text, item.image, {triggerChange: false}) && vals.indexOf(item.id) < 0) {
if (item && that.select(item.id, item.text, item.image, {triggerChange: false}) && vals.indexOf(item.id) < 0) {
changed = true;
}
});
vals.forEach(function(id) {
if(!that.isSelected(id)) {
vals.forEach(function (id) {
if (!that.isSelected(id)) {
changed = true;
}
});
if(changed) {
if (changed) {
that.triggerChange();
}
};
@ -430,7 +432,7 @@ humhub.module('ui.picker', function (module, require, $) {
Picker.prototype.remove = function (id) {
var values = this.val();
if(this.isSelected(id)) {
if (this.isSelected(id)) {
values.splice(values.indexOf(id), 1);
this.$.val(values).trigger('change');
}
@ -450,14 +452,14 @@ humhub.module('ui.picker', function (module, require, $) {
Picker.prototype.clear = function (triggerChange) {
this.$.val(null);
if(triggerChange !== false) {
if (triggerChange !== false) {
this.triggerChange();
}
return this;
};
Picker.prototype.disable = function($disable) {
Picker.prototype.disable = function ($disable) {
$disable = (!object.isDefined($disable)) ? true : $disable;
this.$.prop('disabled', $disable);
};
@ -479,38 +481,38 @@ humhub.module('ui.picker', function (module, require, $) {
this.$.trigger('change');
};
Picker.prototype.val = function() {
Picker.prototype.val = function () {
return this.$.val();
};
Picker.prototype.hasValue = function(value) {
Picker.prototype.hasValue = function (value) {
var values = this.val();
return values && values.indexOf(value) >= 0;
};
Picker.prototype.hasValues = function(value) {
Picker.prototype.hasValues = function (value) {
var values = this.val();
return values && values.length;
}
Picker.prototype.data = function() {
Picker.prototype.data = function () {
return this.$.select2('data');
};
Picker.prototype.map = function() {
Picker.prototype.map = function () {
var val = this.val();
if(!val) {
if (!val) {
return {};
}
if(!Array.isArray(val)) {
if (!Array.isArray(val)) {
val = [val];
}
var result = {};
var that = this;
val.forEach(function(value) {
val.forEach(function (value) {
result[value] = that.getOption(value).text();
})