`Theme` items(Slide) are accessible using the keyboard

WIP #1284
This commit is contained in:
daria 2024-03-01 15:54:08 +02:00
parent 4c713ee80c
commit c35771e59d
1 changed files with 47 additions and 17 deletions

View File

@ -65,6 +65,7 @@ define([
CMeditor,
UIElements)
{
var Common;
window.CodeMirror = CMeditor;
var SLIDE_BACKCOLOR_ID = "cp-app-slide-toolbar-backcolor";
@ -108,19 +109,15 @@ define([
};
var mkThemeButton = function (framework) {
var $theme = $(h('button.cp-toolbar-appmenu', [
h('i.cptools.cptools-palette'),
h('span.cp-button-name', Messages.toolbar_theme)
]));
var $content = $(h('div.cp-toolbar-drawer-content', {
tabindex: 1
})).hide();
// set up all the necessary events
UI.createDrawer($theme, $content);
framework._.toolbar.$theme = $content;
framework._.toolbar.$bottomL.append($theme);
const $drawer = UIElements.createDropdown({
text: Messages.toolbar_theme,
options: [],
common: Common,
buttonCls: 'cptools cptools-palette'
});
framework._.toolbar.$theme = $drawer.find('ul.cp-dropdown-content');
framework._.toolbar.$bottomL.append($drawer);
$drawer.find('span').addClass('cp-button-name');
};
var mkPrintButton = function (framework, editor, $content, $print) {
@ -334,10 +331,20 @@ define([
text: Messages.slideOptionsText,
name: 'options'
});
$optionsButton.click(function () {
$('body').append(createPrintDialog());
var $options = UIElements.createDropdownEntry({
tag: 'a',
attributes: { 'class': $optionsButton.attr('class') },
content: [
h('i', { 'class': $optionsButton.children('i').attr('class') }),
h('span', $optionsButton.text())
],
action: function () {
$options.click(function () {
$('body').append(createPrintDialog());
});
}
});
framework._.toolbar.$theme.append($optionsButton);
framework._.toolbar.$theme.append($options);
metadataMgr.onChange(function () {
var md = metadataMgr.getMetadata();
@ -392,6 +399,17 @@ define([
$backgroundPicker.val(backColor);
$backgroundPicker.click();
});
var $backButton = UIElements.createDropdownEntry({
tag: 'a',
attributes: { 'class': $back.attr('class'), 'id': SLIDE_BACKCOLOR_ID },
content: [
h('i', { 'class': $back.children('i').attr('class')}),
h('span', $back.text())
],
action: function () {
$back.click();
}
});
var $foregroundPicker = $('<input>', { type: 'color', value: textColor })
.css({ display: 'none', })
@ -407,13 +425,25 @@ define([
$foregroundPicker.val(textColor);
$foregroundPicker.click();
});
var $textButton = UIElements.createDropdownEntry({
tag: 'a',
attributes: { 'class': $text.attr('class'),'id': SLIDE_COLOR_ID },
content: [
h('i', { 'class': $text.children('i').attr('class') }),
h('span', $text.text())
],
action: function () {
$text.click();
}
});
var $testColor = $('<input>', { type: 'color', value: '!' });
if ($testColor.attr('type') !== "color" || $testColor.val() === '!') { return; }
$check.append($backgroundPicker);
$check.append($foregroundPicker);
framework._.toolbar.$theme.append($text).append($back);
framework._.toolbar.$theme.append($textButton).append($backButton);
metadataMgr.onChange(function () {
var md = metadataMgr.getMetadata();