1
0
mirror of https://github.com/moodle/moodle.git synced 2025-04-18 15:07:34 +02:00

MDL-76905 core_courseformat: match prototype visual style

This commit is contained in:
Ferran Recio 2023-03-06 11:29:06 +01:00
parent 794f107e88
commit ae799fad7d
15 changed files with 93 additions and 26 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

@ -6,6 +6,6 @@ define("core_courseformat/local/content/bulkedittools",["exports","core/reactive
* @class core_courseformat/local/content/bulkedittools
* @copyright 2023 Ferran Recio <ferran@moodle.com>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_pending=(obj=_pending)&&obj.__esModule?obj:{default:obj},(0,_prefetch.prefetchStrings)("core_courseformat",["bulkselection"]);class Component extends _reactive.BaseComponent{create(){this.name="bulk_editor_tools",this.selectors={ACTIONS:'[data-for="bulkaction"]',ACTIONTOOL:'[data-for="bulkactions"] li',CANCEL:'[data-for="bulkcancel"]',COUNT:"[data-for='bulkcount']",SELECTABLE:"[data-bulkcheckbox][data-is-selectable]",SELECTALL:'[data-for="selectall"]',BULKBTN:'[data-for="enableBulk"]'},this.classes={HIDE:"d-none",DISABLED:"disabled"}}static init(target,selectors){return new this({element:document.querySelector(target),reactive:(0,_courseeditor.getCurrentCourseEditor)(),selectors:selectors})}stateReady(){const cancelBtn=this.getElement(this.selectors.CANCEL);cancelBtn&&this.addEventListener(cancelBtn,"click",this._cancelBulk);const selectAll=this.getElement(this.selectors.SELECTALL);selectAll&&this.addEventListener(selectAll,"change",this._selectAllClick)}getWatchers(){return[{watch:"bulk.enabled:updated",handler:this._refreshEnabled},{watch:"bulk:updated",handler:this._refreshTools}]}_refreshEnabled(_ref){let{element:element}=_ref;element.enabled?(0,_stickyFooter.enableStickyFooter)():(0,_stickyFooter.disableStickyFooter)()}_refreshTools(param){this._refreshSelectCount(param),this._refreshSelectAll(param),this._refreshActions(param)}async _refreshSelectCount(_ref2){let{element:bulk}=_ref2;const selectedCount=await(0,_str.get_string)("bulkselection","core_courseformat",bulk.selection.length),selectedElement=this.getElement(this.selectors.COUNT);selectedElement&&(selectedElement.innerHTML=selectedCount)}_refreshSelectAll(_ref3){let{element:bulk}=_ref3;const selectall=this.getElement(this.selectors.SELECTALL);if(!selectall)return;if(""===bulk.selectedType)return selectall.checked=!1,void(selectall.disabled=!0);selectall.disabled=!1;const maxSelection=document.querySelectorAll(this.selectors.SELECTABLE).length;selectall.checked=bulk.selection.length==maxSelection}_refreshActions(_ref4){let{element:bulk}=_ref4;const displayType="section"==bulk.selectedType?"section":"cm",enabled=""!==bulk.selectedType;this.getElements(this.selectors.ACTIONS).forEach((action=>{action.classList.toggle(this.classes.DISABLED,!enabled);const actionTool=action.closest(this.selectors.ACTIONTOOL),isHidden=action.dataset.bulk!=displayType;null==actionTool||actionTool.classList.toggle(this.classes.HIDE,isHidden)}))}_cancelBulk(){const pending=new _pending.default("courseformat/content:bulktoggle_off");this.reactive.dispatch("bulkEnable",!1),setTimeout((()=>{var _document$querySelect;null===(_document$querySelect=document.querySelector(this.selectors.BULKBTN))||void 0===_document$querySelect||_document$querySelect.focus(),pending.resolve()}),150)}_selectAllClick(event){const target=event.target,bulk=this.reactive.get("bulk");""!==bulk.selectedType&&(target.checked?this._handleSelectAll(bulk):this._handleUnselectAll())}_handleUnselectAll(){const pending=new _pending.default("courseformat/content:bulktUnselectAll");this.reactive.dispatch("bulkEnable",!0),setTimeout((()=>{var _document$querySelect2;null===(_document$querySelect2=document.querySelector(this.selectors.SELECTABLE))||void 0===_document$querySelect2||_document$querySelect2.focus(),pending.resolve()}),150)}_handleSelectAll(bulk){const selectableIds=[],selectables=document.querySelectorAll(this.selectors.SELECTABLE);if(0==selectables.length)return;selectables.forEach((selectable=>{selectableIds.push(selectable.dataset.id)}));const mutation="cm"===bulk.selectedType?"cmSelect":"sectionSelect";this.reactive.dispatch(mutation,selectableIds)}}return _exports.default=Component,_exports.default}));
*/Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_pending=(obj=_pending)&&obj.__esModule?obj:{default:obj},(0,_prefetch.prefetchStrings)("core_courseformat",["bulkselection"]);class Component extends _reactive.BaseComponent{create(){this.name="bulk_editor_tools",this.selectors={ACTIONS:'[data-for="bulkaction"]',ACTIONTOOL:'[data-for="bulkactions"] li',CANCEL:'[data-for="bulkcancel"]',COUNT:"[data-for='bulkcount']",SELECTABLE:"[data-bulkcheckbox][data-is-selectable]",SELECTALL:'[data-for="selectall"]',BULKBTN:'[data-for="enableBulk"]'},this.classes={HIDE:"d-none",DISABLED:"disabled"}}static init(target,selectors){return new this({element:document.querySelector(target),reactive:(0,_courseeditor.getCurrentCourseEditor)(),selectors:selectors})}stateReady(){const cancelBtn=this.getElement(this.selectors.CANCEL);cancelBtn&&this.addEventListener(cancelBtn,"click",this._cancelBulk);const selectAll=this.getElement(this.selectors.SELECTALL);selectAll&&this.addEventListener(selectAll,"change",this._selectAllClick)}getWatchers(){return[{watch:"bulk.enabled:updated",handler:this._refreshEnabled},{watch:"bulk:updated",handler:this._refreshTools}]}_refreshEnabled(_ref){let{element:element}=_ref;element.enabled?(0,_stickyFooter.enableStickyFooter)():(0,_stickyFooter.disableStickyFooter)()}_refreshTools(param){this._refreshSelectCount(param),this._refreshSelectAll(param),this._refreshActions(param)}async _refreshSelectCount(_ref2){let{element:bulk}=_ref2;const stringName=bulk.selection.length>1?"bulkselection_plural":"bulkselection",selectedCount=await(0,_str.get_string)(stringName,"core_courseformat",bulk.selection.length),selectedElement=this.getElement(this.selectors.COUNT);selectedElement&&(selectedElement.innerHTML=selectedCount)}_refreshSelectAll(_ref3){let{element:bulk}=_ref3;const selectall=this.getElement(this.selectors.SELECTALL);if(!selectall)return;if(""===bulk.selectedType)return selectall.checked=!1,void(selectall.disabled=!0);selectall.disabled=!1;const maxSelection=document.querySelectorAll(this.selectors.SELECTABLE).length;selectall.checked=bulk.selection.length==maxSelection}_refreshActions(_ref4){let{element:bulk}=_ref4;const displayType="section"==bulk.selectedType?"section":"cm",enabled=""!==bulk.selectedType;this.getElements(this.selectors.ACTIONS).forEach((action=>{action.classList.toggle(this.classes.DISABLED,!enabled),action.tabIndex=enabled?0:-1;const actionTool=action.closest(this.selectors.ACTIONTOOL),isHidden=action.dataset.bulk!=displayType;null==actionTool||actionTool.classList.toggle(this.classes.HIDE,isHidden)}))}_cancelBulk(){const pending=new _pending.default("courseformat/content:bulktoggle_off");this.reactive.dispatch("bulkEnable",!1),setTimeout((()=>{var _document$querySelect;null===(_document$querySelect=document.querySelector(this.selectors.BULKBTN))||void 0===_document$querySelect||_document$querySelect.focus(),pending.resolve()}),150)}_selectAllClick(event){const target=event.target,bulk=this.reactive.get("bulk");""!==bulk.selectedType&&(target.checked?this._handleSelectAll(bulk):this._handleUnselectAll())}_handleUnselectAll(){const pending=new _pending.default("courseformat/content:bulktUnselectAll");this.reactive.dispatch("bulkEnable",!0),setTimeout((()=>{var _document$querySelect2;null===(_document$querySelect2=document.querySelector(this.selectors.SELECTABLE))||void 0===_document$querySelect2||_document$querySelect2.focus(),pending.resolve()}),150)}_handleSelectAll(bulk){const selectableIds=[],selectables=document.querySelectorAll(this.selectors.SELECTABLE);if(0==selectables.length)return;selectables.forEach((selectable=>{selectableIds.push(selectable.dataset.id)}));const mutation="cm"===bulk.selectedType?"cmSelect":"sectionSelect";this.reactive.dispatch(mutation,selectableIds)}}return _exports.default=Component,_exports.default}));
//# sourceMappingURL=bulkedittools.min.js.map

File diff suppressed because one or more lines are too long

@ -604,9 +604,10 @@ export default class extends BaseComponent {
if (sectionIds.length == 0) {
return;
}
const title = (sectionIds.length == 1) ? 'sectionavailability_title' : 'sectionsavailability_title';
// Show the availability modal to decide which action to trigger.
const modalParams = {
title: getString('availability', 'core'),
title: this.reactive.getFormatString(title),
body: Templates.render('core_courseformat/local/content/section/availabilitymodal', []),
saveButtonText: getString('apply', 'core'),
type: ModalFactory.types.SAVE_CANCEL,

@ -135,7 +135,8 @@ export default class Component extends BaseComponent {
* @param {Object} param.element the affected element (bulk in this case).
*/
async _refreshSelectCount({element: bulk}) {
const selectedCount = await getString('bulkselection', 'core_courseformat', bulk.selection.length);
const stringName = (bulk.selection.length > 1) ? 'bulkselection_plural' : 'bulkselection';
const selectedCount = await getString(stringName, 'core_courseformat', bulk.selection.length);
const selectedElement = this.getElement(this.selectors.COUNT);
if (selectedElement) {
selectedElement.innerHTML = selectedCount;
@ -176,6 +177,7 @@ export default class Component extends BaseComponent {
const enabled = (bulk.selectedType !== '');
this.getElements(this.selectors.ACTIONS).forEach(action => {
action.classList.toggle(this.classes.DISABLED, !enabled);
action.tabIndex = (enabled) ? 0 : -1;
const actionTool = action.closest(this.selectors.ACTIONTOOL);
const isHidden = (action.dataset.bulk != displayType);

@ -808,12 +808,14 @@ abstract class base {
$stringmanager = get_string_manager();
$component = 'format_' . $this->format;
$formatoverridbles = [
'sectionavailability_title',
'sectiondelete_title',
'sectiondelete_info',
'sectionsdelete_title',
'sectionsdelete_info',
'sectionmove_title',
'sectionmove_info',
'sectionsavailability_title',
'sectionsmove_title',
'sectionsmove_info',
'selectsection'

@ -155,7 +155,7 @@ class bulkedittools implements named_templatable, renderable {
'icon' => 't/show',
'action' => 'sectionAvailability',
'name' => get_string('availability'),
'title' => get_string('sectionavailability', 'core_courseformat'),
'title' => $this->format->get_format_string('sectionsavailability'),
'bulk' => 'section',
];
}

@ -25,7 +25,7 @@
}}
<button
id="bulk-enable-{{uniqid}}"
class="bulkEnable btn text-primary"
class="bulkEnable btn text-primary text-nowrap"
data-for="enableBulk"
>
{{#str}} bulkedit, core_courseformat {{/str}} {{#pix}} i/edit, core {{/pix}}

@ -60,8 +60,8 @@
data-for="bulkaction"
{{#title}} title="{{title}}" {{/title}}
>
<div class="w-100 pl-2">{{#pix}}{{icon}}{{/pix}}</div>
<div>{{name}}</div>
<span class="w-100 pl-2">{{#pix}}{{icon}}{{/pix}}</span>
<span>{{name}}</span>
</button>
</li>
{{/actions}}
@ -74,7 +74,7 @@
class="btn pr-0 pb-0"
data-action="bulkcancel"
data-for="bulkcancel"
title="{{#str}} bulkeditoff, core_courseformat {{/str}}"
title="{{#str}} bulkcancel, core_courseformat {{/str}}"
>
{{#pix}} e/cancel, core {{/pix}}
</button>

@ -41,9 +41,9 @@ Feature: Bulk course section actions.
When I click on "Select topic Topic 1" "checkbox"
And I click on "Select topic Topic 2" "checkbox"
And I should see "2 selected" in the "sticky-footer" "region"
And I click on "Section availability" "button" in the "sticky-footer" "region"
And I click on "Hide on course page" "radio" in the "Availability" "dialogue"
And I click on "Apply" "button" in the "Availability" "dialogue"
And I click on "Topics availability" "button" in the "sticky-footer" "region"
And I click on "Hide on course page" "radio" in the "Topics availability" "dialogue"
And I click on "Apply" "button" in the "Topics availability" "dialogue"
Then I should see "Hidden from students" in the "Activity sample 1" "activity"
And I should see "Hidden from students" in the "Activity sample 2" "activity"
And I should see "Hidden from students" in the "Activity sample 3" "activity"
@ -56,10 +56,10 @@ Feature: Bulk course section actions.
Scenario: Bulk show sections
Given I click on "Select topic Topic 1" "checkbox"
Given I click on "Select topic Topic 3" "checkbox"
And I click on "Section availability" "button" in the "sticky-footer" "region"
And I click on "Hide on course page" "radio" in the "Availability" "dialogue"
And I click on "Apply" "button" in the "Availability" "dialogue"
And I click on "Select topic Topic 3" "checkbox"
And I click on "Topics availability" "button" in the "sticky-footer" "region"
And I click on "Hide on course page" "radio" in the "Topics availability" "dialogue"
And I click on "Apply" "button" in the "Topics availability" "dialogue"
And I should see "Hidden from students" in the "Activity sample 1" "activity"
And I should see "Hidden from students" in the "Activity sample 2" "activity"
And I should not see "Hidden from students" in the "Activity sample 3" "activity"
@ -71,9 +71,9 @@ Feature: Bulk course section actions.
When I click on "Select topic Topic 1" "checkbox"
And I click on "Select topic Topic 2" "checkbox"
And I should see "2 selected" in the "sticky-footer" "region"
And I click on "Section availability" "button" in the "sticky-footer" "region"
And I click on "Show on course page" "radio" in the "Availability" "dialogue"
And I click on "Apply" "button" in the "Availability" "dialogue"
And I click on "Topics availability" "button" in the "sticky-footer" "region"
And I click on "Show on course page" "radio" in the "Topics availability" "dialogue"
And I click on "Apply" "button" in the "Topics availability" "dialogue"
Then I should not see "Hidden from students" in the "Activity sample 1" "activity"
And I should not see "Hidden from students" in the "Activity sample 2" "activity"
And I should not see "Hidden from students" in the "Activity sample 3" "activity"

@ -36,9 +36,12 @@ $string['privacy:metadata'] = 'The Topics format plugin does not store any perso
$string['indentation'] = 'Allow indentation on course page';
$string['indentation_help'] = 'Allow teachers, and other users with the manage activities capability, to indent items on the course page.';
$string['section0name'] = 'General';
$string['sectionavailability_title'] = 'Topic availability';
$string['sectiondelete_title'] = 'Delete topic?';
$string['sectionmove_title'] = 'Move topic';
$string['sectionname'] = 'Topic';
$string['sectionsavailability'] = 'Topics availability';
$string['sectionsavailability_title'] = 'Topics availability';
$string['sectionsdelete'] = 'Delete topics';
$string['sectionsdelete_info'] = 'This will delete {$a->count} topics and all the activities they contain.';
$string['sectionsdelete_title'] = 'Delete selected topics?';

@ -38,9 +38,12 @@ $string['privacy:metadata'] = 'The Weekly format plugin does not store any perso
$string['indentation'] = 'Allow indentation on course page';
$string['indentation_help'] = 'Allow teachers, and other users with the manage activities capability, to indent items on the course page.';
$string['section0name'] = 'General';
$string['sectionavailability_title'] = 'Week availability';
$string['sectiondelete_title'] = 'Delete week?';
$string['sectionmove_title'] = 'Move section';
$string['sectionname'] = 'Week';
$string['sectionsavailability'] = 'Weeks availability';
$string['sectionsavailability_title'] = 'Weeks availability';
$string['sectionsdelete'] = 'Delete weeks';
$string['sectionsdelete_info'] = 'This will delete {$a->count} weeks and all the activities they contain.';
$string['sectionsdelete_title'] = 'Delete selected weeks?';

@ -29,6 +29,60 @@ Feature: Weeks format bulk activity actions.
And I click on "Bulk edit" "button"
And I should see "0 selected" in the "sticky-footer" "region"
Scenario: Bulk hide weeks
Given I should not see "Hidden from students" in the "Activity sample 1" "activity"
And I should not see "Hidden from students" in the "Activity sample 2" "activity"
And I should not see "Hidden from students" in the "Activity sample 3" "activity"
And I should not see "Hidden from students" in the "Activity sample 4" "activity"
And I should not see "Hidden from students" in the "1 May - 7 May" "section"
And I should not see "Hidden from students" in the "8 May - 14 May" "section"
And I should not see "Hidden from students" in the "15 May - 21 May" "section"
And I should not see "Hidden from students" in the "22 May - 28 May" "section"
When I click on "Select week 1 May - 7 May" "checkbox"
And I click on "Select week 8 May - 14 May" "checkbox"
And I should see "2 selected" in the "sticky-footer" "region"
And I click on "Weeks availability" "button" in the "sticky-footer" "region"
And I click on "Hide on course page" "radio" in the "Weeks availability" "dialogue"
And I click on "Apply" "button" in the "Weeks availability" "dialogue"
Then I should see "Hidden from students" in the "Activity sample 1" "activity"
And I should see "Hidden from students" in the "Activity sample 2" "activity"
And I should see "Hidden from students" in the "Activity sample 3" "activity"
And I should see "Hidden from students" in the "Activity sample 4" "activity"
And I should see "Hidden from students" in the "1 May - 7 May" "section"
And I should see "Hidden from students" in the "8 May - 14 May" "section"
And I should not see "Hidden from students" in the "15 May - 21 May" "section"
And I should not see "Hidden from students" in the "22 May - 28 May" "section"
And I should see "0 selected" in the "sticky-footer" "region"
Scenario: Bulk show weeks
Given I click on "Select week 1 May - 7 May" "checkbox"
And I click on "Select week 15 May - 21 May" "checkbox"
And I click on "Weeks availability" "button" in the "sticky-footer" "region"
And I click on "Hide on course page" "radio" in the "Weeks availability" "dialogue"
And I click on "Apply" "button" in the "Weeks availability" "dialogue"
And I should see "Hidden from students" in the "Activity sample 1" "activity"
And I should see "Hidden from students" in the "Activity sample 2" "activity"
And I should not see "Hidden from students" in the "Activity sample 3" "activity"
And I should not see "Hidden from students" in the "Activity sample 4" "activity"
And I should see "Hidden from students" in the "1 May - 7 May" "section"
And I should not see "Hidden from students" in the "8 May - 14 May" "section"
And I should see "Hidden from students" in the "15 May - 21 May" "section"
And I should not see "Hidden from students" in the "22 May - 28 May" "section"
When I click on "Select week 1 May - 7 May" "checkbox"
And I click on "Select week 8 May - 14 May" "checkbox"
And I should see "2 selected" in the "sticky-footer" "region"
And I click on "Weeks availability" "button" in the "sticky-footer" "region"
And I click on "Show on course page" "radio" in the "Weeks availability" "dialogue"
And I click on "Apply" "button" in the "Weeks availability" "dialogue"
Then I should not see "Hidden from students" in the "Activity sample 1" "activity"
And I should not see "Hidden from students" in the "Activity sample 2" "activity"
And I should not see "Hidden from students" in the "Activity sample 3" "activity"
And I should not see "Hidden from students" in the "Activity sample 4" "activity"
And I should not see "Hidden from students" in the "1 May - 7 May" "section"
And I should not see "Hidden from students" in the "8 May - 14 May" "section"
And I should see "Hidden from students" in the "15 May - 21 May" "section"
And I should not see "Hidden from students" in the "22 May - 28 May" "section"
Scenario: Delete a single week using bulk action
Given I should see "1 May - 7 May" in the "region-main" "region"
And I should see "8 May - 14 May" in the "region-main" "region"
@ -42,7 +96,7 @@ Feature: Weeks format bulk activity actions.
And I click on "Select week 8 May - 14 May" "checkbox"
And I should see "2 selected" in the "sticky-footer" "region"
When I click on "Delete weeks" "button" in the "sticky-footer" "region"
And I click on "Delete" "button" in the ".modal" "css_element"
And I click on "Delete" "button" in the "Delete selected weeks?" "dialogue"
Then I should see "1 May - 7 May" in the "region-main" "region"
And I should see "8 May - 14 May" in the "region-main" "region"
And I should not see "15 May - 21 May" in the "region-main" "region"
@ -66,7 +120,7 @@ Feature: Weeks format bulk activity actions.
And I click on "Select week 15 May - 21 May" "checkbox"
And I should see "2 selected" in the "sticky-footer" "region"
When I click on "Delete weeks" "button" in the "sticky-footer" "region"
And I click on "Delete" "button" in the ".modal" "css_element"
And I click on "Delete" "button" in the "Delete selected weeks?" "dialogue"
Then I should see "1 May - 7 May" in the "region-main" "region"
And I should see "8 May - 14 May" in the "region-main" "region"
And I should not see "15 May - 21 May" in the "region-main" "region"

@ -29,9 +29,9 @@ $string['availability_hide_help'] = 'Not available to students.';
$string['availability_stealth'] = 'Make available but don\'t show on course page';
$string['availability_stealth_help'] = 'Available to students if you provide a link. Activities will still appear in the gradebook and other reports.';
$string['bulkedit'] = 'Bulk edit';
$string['bulkeditoff'] = 'Close bulk edit';
$string['bulkcancel'] = 'Close bulk editing';
$string['bulkcancel'] = 'Close bulk edit';
$string['bulkselection'] = '{$a} selected';
$string['bulkselection_plural'] = '{$a} selected';
$string['cmavailability'] = 'Activity availability';
$string['cmdelete_info'] = 'This will delete "{$a->name}" and any user data it contains';
$string['cmdelete_title'] = 'Delete activity?';
@ -47,9 +47,11 @@ $string['courseindex'] = 'Course index';
$string['nobulkaction'] = 'No bulk actions available';
$string['preference:coursesectionspreferences'] = 'Section user preferences for course {$a}';
$string['privacy:metadata:preference:coursesectionspreferences'] = 'Section user preferences like collapsed and expanded.';
$string['sectionavailability'] = 'Section availability';
$string['sectionavailability_title'] = 'Section availability';
$string['sectiondelete_info'] = 'This will delete "{$a->name}" and all the activities it contains.';
$string['sectiondelete_title'] = 'Delete section?';
$string['sectionsavailability'] = 'Sections availability';
$string['sectionsavailability_title'] = 'Sections availability';
$string['sectionsdelete'] = 'Delete sections';
$string['sectionmove_info'] = 'Move "{$a}" after';
$string['sectionmove_title'] = 'Move section';