coregrade/CoreGradeLearning
1
0
Fork 0
Code Issues Pull Requests Releases Activity

first commit

Browse Source
This commit is contained in:
CHIEFSOFT\ameye
2024-09-30 18:11:26 -04:00
commit e592ca6823
27270 changed files with 5002257 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/tests/behat/fixtures/action_menu_subpanel_output_testpage.php
+253
View File
@@ -0,0 +1,253 @@
<?php
// This file is part of Moodle - http://moodle.org/
//
// Moodle is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// Moodle is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
/**
* Test page for action menu subpanel output component.
*
* @copyright 2023 Ferran Recio <ferran@moodle.com>
* @package core
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
require_once(__DIR__ . '/../../../../config.php');
defined('BEHAT_SITE_RUNNING') || die();
$foo = optional_param('foo', 'none', PARAM_TEXT);
global $CFG, $PAGE, $OUTPUT;
$PAGE->set_url('/lib/tests/behat/fixtures/action_menu_subpanel_output_testpage.php');
$PAGE->add_body_class('limitedwidth');
require_login();
$PAGE->set_context(core\context\system::instance());
$PAGE->set_title('Action menu subpanel test page');
echo $OUTPUT->header();
$choice1 = new core\output\choicelist('Choice example');
$choice1->add_option("statusa", "Status A", [
'url' => new moodle_url($PAGE->url, ['foo' => 'Aardvark']),
'description' => 'Status A description',
'icon' => new pix_icon('t/user', '', ''),
]);
$choice1->add_option("statusb", "Status B", [
'url' => new moodle_url($PAGE->url, ['foo' => 'Beetle']),
'description' => 'Status B description',
'icon' => new pix_icon('t/groupv', '', ''),
]);
$choice1->set_selected_value('statusb');
$choice2 = new core\output\choicelist('Choice example');
$choice2->add_option("statusc", "Status C", [
'url' => new moodle_url($PAGE->url, ['foo' => 'Caterpillar']),
'description' => 'Status C description',
'icon' => new pix_icon('t/groups', '', ''),
]);
$choice2->add_option("statusd", "Status D", [
'url' => new moodle_url($PAGE->url, ['foo' => 'Donkey']),
'description' => 'Status D description',
'icon' => new pix_icon('t/hide', '', ''),
]);
$choice2->set_selected_value('statusc');
$normalactionlink = new action_menu_link(
new moodle_url($PAGE->url, ['foo' => 'bar']),
new pix_icon('t/emptystar', ''),
'Action link example',
false
);
echo "<h2>Action menu subpanel test page</h2>";
echo '<div id="paramcheck" class="mb-4">';
echo "<p>Foo param value: $foo</p>";
echo '</div>';
echo '<div id="regularscenario" class="mb-4">';
echo "<h3>Basic example</h3>";
$menu = new action_menu();
$menu->add($normalactionlink);
$menu->add($normalactionlink);
$menu->add(
new core\output\local\action_menu\subpanel(
'Subpanel example',
$choice1
)
);
$menu->add(
new core\output\local\action_menu\subpanel(
'Another subpanel',
$choice2
)
);
echo '<div class="border p-2 d-flex flex-row">';
echo '<div class="flex-fill">Menu right example</div><div>';
echo $OUTPUT->render($menu);
echo '</div></div>';
echo '</div>';
echo '<div id="menuleft" class="mb-4">';
echo "<h3>Menu left</h3>";
$menu = new action_menu();
$menu->set_menu_left();
$menu->add($normalactionlink);
$menu->add($normalactionlink);
$menu->add(
new core\output\local\action_menu\subpanel(
'Subpanel example',
$choice1,
null,
null
)
);
$menu->add(
new core\output\local\action_menu\subpanel(
'Another subpanel',
$choice2,
null,
null
)
);
echo '<div class="border p-2 d-flex flex-row"><div>';
echo $OUTPUT->render($menu);
echo '</div><div class="flex-fill ml-2">Menu left example</div></div>';
echo '</div>';
echo '<div id="itemicon" class="mb-4">';
echo "<h3>Menu item with icon</h3>";
$menu = new action_menu();
$menu->add($normalactionlink);
$menu->add($normalactionlink);
$menu->add(
new core\output\local\action_menu\subpanel(
'Subpanel example',
$choice1,
null,
new pix_icon('t/locked', 'Locked icon')
)
);
$menu->add(
new core\output\local\action_menu\subpanel(
'Another subpanel',
$choice2,
null,
new pix_icon('t/message', 'Message icon')
)
);
echo '<div class="border p-2 d-flex flex-row">';
echo '<div class="flex-fill">Menu right example</div><div>';
echo $OUTPUT->render($menu);
echo '</div></div>';
echo '</div>';
echo '<div id="itemiconleft" class="mb-4">';
echo "<h3>Left menu with item icon</h3>";
$menu = new action_menu();
$menu->set_menu_left();
$menu->add($normalactionlink);
$menu->add($normalactionlink);
$menu->add(
new core\output\local\action_menu\subpanel(
'Subpanel example',
$choice1,
null,
new pix_icon('t/locked', 'Locked icon')
)
);
$menu->add(
new core\output\local\action_menu\subpanel(
'Another subpanel',
$choice2,
null,
new pix_icon('t/message', 'Message icon')
)
);
echo '<div class="border p-2 d-flex flex-row"><div>';
echo $OUTPUT->render($menu);
echo '</div><div class="flex-fill ml-2">Menu left example</div></div>';
echo '</div>';
echo '<div id="dataattributes" class="mb-4">';
echo "<h3>Adding data attributes to menu item</h3>";
$menu = new action_menu();
$menu->add($normalactionlink);
$menu->add($normalactionlink);
$menu->add(
new core\output\local\action_menu\subpanel(
'Subpanel example',
$choice1,
['data-extra' => 'some extra value']
)
);
$menu->add(
new core\output\local\action_menu\subpanel(
'Another subpanel',
$choice2,
['data-extra' => 'some other value']
)
);
echo '<div class="border p-2 d-flex flex-row">';
echo '<div class="flex-fill">Menu right example</div><div>';
echo $OUTPUT->render($menu);
echo '</div></div>';
echo '<div class="mt-1 p-2 border" id="datachecks">Nothing here.</div>';
echo '</div>';
$inlinejs = <<<EOF
const datachecks = document.getElementById('datachecks');
const dataitems = document.querySelectorAll('[data-extra]');
let dataitemshtml = '';
for (let i = 0; i < dataitems.length; i++) {
dataitemshtml += '<p>Extra data attribute detected: ' + dataitems[i].getAttribute('data-extra') + '</p>';
}
datachecks.innerHTML = dataitemshtml;
EOF;
$PAGE->requires->js_amd_inline($inlinejs);
echo '<div id="drawersimulation" class="mb-4">';
echo "<h3>Drawer like example</h3>";
$menu = new action_menu();
$menu->add($normalactionlink);
$menu->add($normalactionlink);
$menu->add(
new core\output\local\action_menu\subpanel(
'Subpanel example',
$choice1
)
);
$menu->add(
new core\output\local\action_menu\subpanel(
'Another subpanel',
$choice2
)
);
echo '<div class="border p-2 d-flex flex-row" data-region="fixed-drawer" data-behat-fake-drawer="true" style="width: 350px;">';
echo '<div class="flex-fill">Drawer example</div><div>';
echo $OUTPUT->render($menu);
echo '</div></div>';
echo '</div>';
echo $OUTPUT->footer();
lib/tests/behat/fixtures/dropdown_output_testpage.php
+366
View File
@@ -0,0 +1,366 @@
<?php
// This file is part of Moodle - http://moodle.org/
//
// Moodle is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// Moodle is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
/**
* Test page for dropdown dialog output component.
*
* @copyright 2023 Ferran Recio <ferran@moodle.com>
* @package core
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
require_once(__DIR__ . '/../../../../config.php');
defined('BEHAT_SITE_RUNNING') || die();
global $CFG, $PAGE, $OUTPUT;
$PAGE->set_url('/lib/tests/behat/fixtures/dropdown_dialog_testpage.php');
$PAGE->add_body_class('limitedwidth');
require_login();
$PAGE->set_context(core\context\system::instance());
echo $OUTPUT->header();
echo "<h2>Dropdown dialog test page</h2>";
echo '<div id="regularscenario" class="mb-4">';
echo "<h3>Basic example</h3>";
$dialog = new core\output\local\dropdown\dialog('Open dialog', 'Dialog content');
echo $OUTPUT->render($dialog);
echo '</div>';
echo '<div id="richcontent" class="mb-4">';
echo "<h3>Rich content example</h3>";
$content = '
<p>Some rich content <b>element</b>.</p>
<ul>
<li>Item 1 <a href="#">Link 1</a></li>
<li>Item 2 <a href="#">Link 2</a></li>
</ul>
';
$dialog = new core\output\local\dropdown\dialog('Open dialog', $content);
echo $OUTPUT->render($dialog);
echo '</div>';
echo '<div id="richbutton" class="mb-4">';
echo "<h3>Rich button example</h3>";
$button = $OUTPUT->pix_icon('t/hide', 'Eye icon') . ' Click to <b>open</b></a>';
$dialog = new core\output\local\dropdown\dialog($button, 'Dialog content');
echo $OUTPUT->render($dialog);
echo '</div>';
echo '<div id="cssoverride" class="mb-4">';
echo "<h3>CSS override example</h3>";
$dialog = new core\output\local\dropdown\dialog(
'Open dialog',
'Dialog content',
[
'buttonclasses' => 'btn btn-primary extraclass',
]
);
echo $OUTPUT->render($dialog);
echo '</div>';
echo '<div id="extraattributes" class="mb-4">';
echo "<h3>Extra data attributes example</h3>";
$dialog = new core\output\local\dropdown\dialog('Open dialog', 'Dialog content', [
'extras' => ['data-foo' => 'bar'],
]);
echo $OUTPUT->render($dialog);
echo '</div>';
echo '<div id="customid" class="mb-4">';
echo "<h3>Custom element id</h3>";
$dialog = new core\output\local\dropdown\dialog('Open dialog', 'Dialog content', [
'extras' => ['id' => 'CustomDropdownButtonId'],
]);
echo $OUTPUT->render($dialog);
echo '</div>';
$inlinejs = "document.querySelector('#CustomDropdownButtonId button').innerHTML = 'Custom ID button found';";
$PAGE->requires->js_amd_inline($inlinejs);
echo '<div id="position" class="mb-4">';
echo "<h3>Dropdown position example</h3>";
$dialog = new core\output\local\dropdown\dialog('Open dialog', 'Dialog content');
$dialog->set_position(core\output\local\dropdown\dialog::POSITION['end']);
echo $OUTPUT->render($dialog);
echo '</div>';
echo '<div id="widths" class="mb-4">';
echo "<h3>Dropdown max width values example</h3>";
$content = '
Some long long content. Some long long content. Some long long content. Some long long content.
Some long long content. Some long long content. Some long long content. Some long long content.
Some long long content. Some long long content. Some long long content. Some long long content.
';
$dialog = new core\output\local\dropdown\dialog('Default dialog (adaptative)', $content);
$dialog->set_classes('mb-3');
echo $OUTPUT->render($dialog);
$dialog = new core\output\local\dropdown\dialog('Big dialog', $content);
$dialog->set_dialog_width(core\output\local\dropdown\dialog::WIDTH['big']);
$dialog->set_classes('mb-3');
echo $OUTPUT->render($dialog);
$dialog = new core\output\local\dropdown\dialog('Small dialog', $content);
$dialog->set_dialog_width(core\output\local\dropdown\dialog::WIDTH['small']);
$dialog->set_classes('mb-3');
echo $OUTPUT->render($dialog);
echo '</div>';
echo '<div id="dialogjscontrolssection" class="mb-4">';
echo "<h3>Dropdown JS module controls</h3>";
echo '<div class="mb-2">
<button class="btn btn-secondary" id="buttontext">Change button text</button>
<button class="btn btn-secondary" id="opendropdown">Open</button>
<button class="btn btn-secondary" id="closedropdown">Close</button>
<span id="dialogvisibility"></span>
</div>';
$dialog = new core\output\local\dropdown\dialog('Open dialog', 'Dialog content', [
'extras' => ['id' => 'dialogjscontrols'],
]);
echo $OUTPUT->render($dialog);
echo '</div>';
$inlinejs = <<<EOF
require(
['core/local/dropdown/dialog', 'jquery'],
(Module, jQuery) => {
const dialog = Module.getDropdownDialog('#dialogjscontrols');
document.querySelector('#buttontext').addEventListener('click', () => {
dialog.setButtonContent('New button text');
});
document.querySelector('#opendropdown').addEventListener('click', (e) => {
e.stopPropagation();
dialog.setVisible(true);
});
document.querySelector('#closedropdown').addEventListener('click', (e) => {
e.stopPropagation();
dialog.setVisible(false);
});
const visibility = () => {
const text = 'The dropdown is ' + (dialog.isVisible() ? 'visible' : 'hidden') + '.';
document.querySelector('#dialogvisibility').innerHTML = text;
}
visibility();
// Bootstrap 4 events are still jQuery.
jQuery(dialog.getElement()).on('shown.bs.dropdown', (e) => {
visibility();
});
jQuery(dialog.getElement()).on('hidden.bs.dropdown', (e) => {
visibility();
});
}
);
EOF;
$PAGE->requires->js_amd_inline($inlinejs);
echo "<h2>Dropdown status test page</h2>";
echo '<div id="statusregularscenario" class="mb-4">';
echo "<h3>Basic example</h3>";
$choice = new core\output\choicelist('Dialog content');
$choice->add_option('option1', 'Option 1', [
'description' => 'Option 1 description'
]);
$choice->add_option('option2', 'Option 2', [
'description' => 'Option 2 description',
'icon' => new pix_icon('t/hide', 'Eye icon 1')
]);
$choice->add_option('option3', 'Option 3', [
'icon' => new pix_icon('t/show', 'Eye icon 2')
]);
$dialog = new core\output\local\dropdown\status('Open dialog', $choice);
echo $OUTPUT->render($dialog);
echo '</div>';
echo '<div id="statusselectedscenario" class="mb-4">';
echo "<h3>Selected element example</h3>";
$choice = new core\output\choicelist('Dialog content');
$choice->add_option('option1', 'Option 1', [
'description' => 'Option 1 description',
'icon' => new pix_icon('t/show', 'Eye icon 1')
]);
$choice->add_option('option2', 'Option 2', [
'description' => 'Option 2 description',
'icon' => new pix_icon('t/hide', 'Eye icon 2')
]);
$choice->add_option('option3', 'Option 3', [
'description' => 'Option 3 description',
'icon' => new pix_icon('t/stealth', 'Eye icon 3')
]);
$choice->set_selected_value('option2');
$dialog = new core\output\local\dropdown\status('Open dialog', $choice);
echo $OUTPUT->render($dialog);
echo '</div>';
echo '<div id="statusdisablescenario" class="mb-4">';
echo "<h3>Disable option example</h3>";
$choice = new core\output\choicelist('Dialog content');
$choice->add_option('option1', 'Option 1');
$choice->add_option('option2', 'Option 2', [
'description' => 'Option 2 description',
'icon' => new pix_icon('t/hide', 'Eye icon')
]);
$choice->add_option('option3', 'Option 3');
$choice->set_option_disabled('option2', true);
$dialog = new core\output\local\dropdown\status('Open dialog', $choice);
echo $OUTPUT->render($dialog);
echo '</div>';
echo '<div id="statusoptionextrasscenario" class="mb-4">';
echo "<h3>Set option extra attributes example</h3>";
$choice = new core\output\choicelist('Dialog content');
$choice->add_option('option1', 'Option 1');
$choice->add_option('option2', 'Option 2', [
'description' => 'Option 2 description',
'icon' => new pix_icon('t/hide', 'Eye icon')
]);
$choice->add_option('option3', 'Option 3');
$choice->set_option_extras('option2', ['data-foo' => 'bar']);
$dialog = new core\output\local\dropdown\status('Open dialog', $choice);
echo $OUTPUT->render($dialog);
echo '</div>';
echo '<div id="statusoptionurl" class="mb-4">';
echo "<h3>Set option url example</h3>";
$choice = new core\output\choicelist('Dialog content');
$choice->add_option('option1', 'Option 1');
$choice->add_option('option2', 'Option 2', [
'url' => new moodle_url('/lib/tests/behat/fixtures/dropdown_output_testpage.php', ['foo' => 'bar']),
]);
$choice->add_option('option3', 'Option 3');
$choice->set_option_extras('option2', ['data-foo' => 'bar']);
$dialog = new core\output\local\dropdown\status('Open dialog', $choice);
echo $OUTPUT->render($dialog);
$foo = optional_param('foo', 'none', PARAM_TEXT);
echo "<p>Foo param value: $foo</p>";
echo '</div>';
echo '<div id="statussyncbutton" class="mb-4">';
echo "<h3>Sync button text</h3>";
$choice = new core\output\choicelist('Dialog content');
$choice->add_option('option1', 'Option 1', [
'description' => 'Option 1 description',
'icon' => new pix_icon('t/show', 'Eye icon 1')
]);
$choice->add_option('option2', 'Option 2', [
'description' => 'Option 2 description',
'icon' => new pix_icon('t/hide', 'Eye icon 2')
]);
$choice->add_option('option3', 'Option 3', [
'description' => 'Option 3 description',
'icon' => new pix_icon('t/stealth', 'Eye icon 3')
]);
$choice->set_selected_value('option2');
$dialog = new core\output\local\dropdown\status(
'Open dialog',
$choice,
['buttonsync' => true, 'updatestatus' => true]
);
echo '<button class="btn">Focus helper</button>';
echo $OUTPUT->render($dialog);
echo '</div>';
echo '<div id="statusjscontrolsection" class="mb-4">';
echo "<h3>Status JS controls</h3>";
echo '<div class="mb-2">
<button class="btn btn-secondary" id="setselected">Change selected value</button>
<button class="btn btn-secondary" id="syncbutton">Enable sync</button>
<button class="btn btn-secondary" id="updatestatus">Disable update</button>
<span id="statusvalue"></span>
</div>';
$choice = new core\output\choicelist('Dialog content');
$choice->add_option('option1', 'Option 1', [
'description' => 'Option 1 description',
'icon' => new pix_icon('t/show', 'Eye icon 1')
]);
$choice->add_option('option2', 'Option 2', [
'description' => 'Option 2 description',
'icon' => new pix_icon('t/hide', 'Eye icon 2')
]);
$choice->add_option('option3', 'Option 3', [
'description' => 'Option 3 description',
'icon' => new pix_icon('t/stealth', 'Eye icon 3')
]);
$choice->set_selected_value('option2');
$dialog = new core\output\local\dropdown\status(
'Open dialog',
$choice,
[
'extras' => ['id' => 'statusjscontrols'],
'updatestatus' => true
],
);
echo $OUTPUT->render($dialog);
echo '</div>';
$inlinejs = <<<EOF
require(
['core/local/dropdown/status', 'jquery'],
(Module, jQuery) => {
const status = Module.getDropdownStatus('#statusjscontrols');
const printValue = () => {
const text = 'The status value is ' + status.getSelectedValue() + '.';
document.querySelector('#statusvalue').innerHTML = text;
}
printValue();
document.querySelector('#setselected').addEventListener('click', () => {
if (status.getSelectedValue() == 'option2') {
status.setSelectedValue('option3');
} else {
status.setSelectedValue('option2');
}
});
document.querySelector('#syncbutton').addEventListener('click', (e) => {
if (status.isButtonSyncEnabled()) {
status.setButtonSyncEnabled(false);
} else {
status.setButtonSyncEnabled(true);
}
e.target.innerHTML = (status.isButtonSyncEnabled()) ? 'Disable sync': 'Enable sync';
});
document.querySelector('#updatestatus').addEventListener('click', (e) => {
if (status.isUpdateStatusEnabled()) {
status.setUpdateStatusEnabled(false);
} else {
status.setUpdateStatusEnabled(true);
}
e.target.innerHTML = (status.isUpdateStatusEnabled()) ? 'Disable update': 'Enable update';
});
status.getElement().addEventListener('change', () => {
printValue();
});
}
);
EOF;
$PAGE->requires->js_amd_inline($inlinejs);
echo $OUTPUT->footer();