moodle/moodle
3
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-08-06 17:36:38 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

MDL-71457 theme_boost: activity icon styling

Browse source
This commit is contained in:
Bas Brands 2021-09-20 11:53:23 +02:00
parent 5958c0df0c
commit f2ddd23ec1
44 changed files with 319 additions and 158 deletions
Download patch file Download diff file Expand all files Collapse all files

16
course/classes/local/entity/content_item.php
View file

@ -57,6 +57,9 @@ class content_item {
/** @var string $componentname the name of the component from which this content item originates. */
private $componentname;
/** @var string $purpose the purpose type of this component. */
private $purpose;
/**
* The content_item constructor.
*
@ -68,9 +71,10 @@ class content_item {
* @param string $help The description of the item.
* @param int $archetype the archetype for the content item (see MOD_ARCHETYPE_X definitions in lib/moodlelib.php).
* @param string $componentname the name of the component/plugin with which this content item is associated.
* @param string $purpose the purpose type of this component.
*/
public function __construct(int $id, string $name, title $title, \moodle_url $link, string $icon, string $help,
int $archetype, string $componentname) {
int $archetype, string $componentname, string $purpose) {
$this->id = $id;
$this->name = $name;
$this->title = $title;
@ -79,6 +83,7 @@ class content_item {
$this->help = $help;
$this->archetype = $archetype;
$this->componentname = $componentname;
$this->purpose = $purpose;
}
/**
@ -151,4 +156,13 @@ class content_item {
public function get_icon(): string {
return $this->icon;
}
/**
* Get purpose for this item.
*
* @return string
*/
public function get_purpose(): string {
return $this->purpose;
}
}

4
course/classes/local/exporters/course_content_item_exporter.php
View file

@ -68,6 +68,7 @@ class course_content_item_exporter extends exporter {
'help' => ['type' => PARAM_RAW, 'description' => 'Html description / help for the content item'],
'archetype' => ['type' => PARAM_RAW, 'description' => 'The archetype of the module exposing the content item'],
'componentname' => ['type' => PARAM_TEXT, 'description' => 'The name of the component exposing the content item'],
'purpose' => ['type' => PARAM_TEXT, 'description' => 'The purpose of the component exposing the content item'],
];
}
@ -136,7 +137,8 @@ class course_content_item_exporter extends exporter {
'componentname' => $this->contentitem->get_component_name(),
'favourite' => $favourite,
'legacyitem' => ($this->contentitem->get_id() == -1),
'recommended' => $recommended
'recommended' => $recommended,
'purpose' => $this->contentitem->get_purpose()
];
return $properties;

16
course/classes/local/repository/content_item_readonly_repository.php
View file

@ -94,9 +94,9 @@ class content_item_readonly_repository implements content_item_readonly_reposito
// modname:link, i.e. lti:http://etc...
// We need to grab the module name out to create the componentname.
$modname = (strpos($item->name, ':') !== false) ? explode(':', $item->name)[0] : $item->name;
$purpose = plugin_supports('mod', $modname, FEATURE_MOD_PURPOSE, MOD_PURPOSE_OTHER);
return new content_item($item->id, $item->name, $item->title, $item->link, $item->icon, $item->help ?? '',
$item->archetype, 'mod_' . $modname);
$item->archetype, 'mod_' . $modname, $purpose);
}
/**
@ -202,16 +202,18 @@ class content_item_readonly_repository implements content_item_readonly_reposito
// If the module chooses to implement the hook, this may be thrown away.
$help = $this->get_core_module_help_string($mod->name);
$archetype = plugin_supports('mod', $mod->name, FEATURE_MOD_ARCHETYPE, MOD_ARCHETYPE_OTHER);
$purpose = plugin_supports('mod', $mod->name, FEATURE_MOD_PURPOSE, MOD_PURPOSE_OTHER);
$contentitem = new content_item(
$mod->id,
$mod->name,
new lang_string_title("modulename", $mod->name),
new \moodle_url(''), // No course scope, so just an empty link.
$OUTPUT->pix_icon('icon', '', $mod->name, ['class' => 'icon']),
$OUTPUT->pix_icon('icon', '', $mod->name, ['class' => 'icon activityicon']),
$help,
$archetype,
'mod_' . $mod->name
'mod_' . $mod->name,
$purpose,
);
$modcontentitemreference = clone($contentitem);
@ -265,16 +267,18 @@ class content_item_readonly_repository implements content_item_readonly_reposito
// If the module chooses to implement the hook, this may be thrown away.
$help = $this->get_core_module_help_string($mod->name);
$archetype = plugin_supports('mod', $mod->name, FEATURE_MOD_ARCHETYPE, MOD_ARCHETYPE_OTHER);
$purpose = plugin_supports('mod', $mod->name, FEATURE_MOD_PURPOSE, MOD_PURPOSE_OTHER);
$contentitem = new content_item(
$mod->id,
$mod->name,
new lang_string_title("modulename", $mod->name),
new \moodle_url($urlbase, ['add' => $mod->name]),
$OUTPUT->pix_icon('icon', '', $mod->name, ['class' => 'icon']),
$OUTPUT->pix_icon('icon', '', $mod->name, ['class' => 'icon activityicon']),
$help,
$archetype,
'mod_' . $mod->name
'mod_' . $mod->name,
$purpose,
);
// Legacy vs new hooks.

1
course/format/classes/output/local/content/cm/title.php
View file

@ -110,6 +110,7 @@ class title implements renderable, templatable {
'pluginname' => get_string('pluginname', 'mod_' . $mod->modname),
'linkclasses' => $displayoptions['linkclasses'],
'textclasses' => $displayoptions['textclasses'],
'purpose' => plugin_supports('mod', $mod->modname, FEATURE_MOD_PURPOSE, MOD_PURPOSE_OTHER),
];
// File type after name, for alphabetic lists (screen reader).

6
course/format/templates/local/content/cm/title.mustache
View file

@ -29,13 +29,15 @@
"pluginname": "File",
"altname": "PDF file",
"linkclasses": "",
"textclasses": ""
"textclasses": "",
"purpose": "content",
"modname": "resource"
}
}}
{{#url}}
<div class="activity-instance d-flex flex-column">
<div class="activitytitle media {{textclasses}} modtype_{{modname}} position-relative align-self-start">
<div class="activityiconcontainer courseicon align-self-start mr-3">
<div class="activityiconcontainer {{purpose}} courseicon align-self-start mr-3">
<img src="{{{icon}}}" class="activityicon " alt="{{{modname}}} icon">
</div>
<div class="media-body align-self-center">

10
course/renderer.php
View file

@ -710,9 +710,13 @@ class core_course_renderer extends plugin_renderer_base {
$onclick = htmlspecialchars_decode($mod->onclick, ENT_QUOTES);
// Display link itself.
$activitylink = html_writer::empty_tag('img', array('src' => $mod->get_icon_url(),
'class' => 'iconlarge activityicon', 'alt' => '', 'role' => 'presentation', 'aria-hidden' => 'true')) .
html_writer::tag('span', $instancename . $altname, array('class' => 'instancename'));
$instancename = html_writer::tag('span', $instancename . $altname, ['class' => 'instancename ml-1']);
$imageicon = html_writer::empty_tag('img', ['src' => $mod->get_icon_url(),
'class' => 'activityicon', 'alt' => '', 'role' => 'presentation', 'aria-hidden' => 'true']);
$imageicon = html_writer::tag('span', $imageicon, ['class' => 'activityiconcontainer courseicon']);
$activitylink = $imageicon . $instancename;
if ($mod->uservisible) {
$output .= html_writer::link($url, $activitylink, array('class' => 'aalink' . $linkclasses, 'onclick' => $onclick));
} else {

5
course/templates/local/activitychooser/item.mustache
View file

@ -26,13 +26,14 @@
"urls": {
"addoption": "http://addoptionurl.com"
},
"icon": "<img class='icon' src='http://urltooptionicon'>"
"icon": "<img class='icon' src='http://urltooptionicon'>",
"purpose": "content"
}
}}
<div role="menuitem" tabindex="-1" aria-label="{{title}}" class="option border-0 card m-1 bg-white" data-region="chooser-option-container" data-internal="{{name}}" data-modname="{{componentname}}_{{link}}">
<div class="optioninfo card-body d-flex flex-column text-center p-1" data-region="chooser-option-info-container">
<a class="d-flex flex-column justify-content-between flex-fill" href="{{link}}" title="{{#str}} addnew, moodle, {{title}} {{/str}}" tabindex="-1" data-action="add-chooser-option">
<div class="optionicon mt-2 mb-1 icon-size-5 icon-no-margin">
<div class="optionicon mt-2 mb-1 mx-auto icon-no-margin modicon_{{name}} activityiconcontainer {{purpose}}">
{{{icon}}}
</div>
<div class="optionname clamp-2">{{title}}</div>

7
course/tests/content_item_test.php
View file

@ -47,7 +47,8 @@ class content_item_test extends \advanced_testcase {
$this->resetAfterTest();
$contentitem = new content_item(22, 'Item name', new lang_string_title('modulename', 'mod_assign'),
new \moodle_url('mod_edit.php'), '<img src="test">', 'Description of the module', MOD_ARCHETYPE_RESOURCE, 'mod_page');
new \moodle_url('mod_edit.php'), '<img src="test">', 'Description of the module', MOD_ARCHETYPE_RESOURCE, 'mod_page',
MOD_PURPOSE_CONTENT);
$this->assertEquals(22, $contentitem->get_id());
$this->assertEquals('Item name', $contentitem->get_name());
@ -57,6 +58,7 @@ class content_item_test extends \advanced_testcase {
$this->assertEquals('Description of the module', $contentitem->get_help());
$this->assertEquals(MOD_ARCHETYPE_RESOURCE, $contentitem->get_archetype());
$this->assertEquals('mod_page', $contentitem->get_component_name());
$this->assertEquals('content', $contentitem->get_purpose());
}
/**
@ -66,7 +68,8 @@ class content_item_test extends \advanced_testcase {
$this->resetAfterTest();
$contentitem = new content_item(22, 'Item name', new string_title('My custom string'),
new \moodle_url('mod_edit.php'), '<img src="test">', 'Description of the module', MOD_ARCHETYPE_RESOURCE, 'mod_page');
new \moodle_url('mod_edit.php'), '<img src="test">', 'Description of the module', MOD_ARCHETYPE_RESOURCE, 'mod_page',
MOD_PURPOSE_CONTENT);
$this->assertEquals('My custom string', $contentitem->get_title()->get_value());
}

3
course/tests/exporters_content_item_test.php
View file

@ -92,7 +92,8 @@ class exporters_content_item_test extends \advanced_testcase {
'* First point
* Another point',
MOD_ARCHETYPE_OTHER,
'core_test'
'core_test',
MOD_PURPOSE_CONTENT
);
$ciexporter = new course_content_item_exporter($contentitem, ['context' => \context_course::instance($course->id)]);

12
course/upgrade.txt
View file

@ -2,7 +2,17 @@ This files describes API changes in /course/*,
information provided here is intended especially for developers.
=== 4.0 ===
* All activity icons have been replaced with black monochrome icons. The background
colour for these icons is defined using a new 'FEATURE_MOD_PURPOSE' support variable in the module lib.php file
Available purpose types are:
- MOD_PURPOSE_COMMUNICATION
- MOD_PURPOSE_ASSESSMENT
- MOD_PURPOSE_COLLABORATION
- MOD_PURPOSE_CONTENT
- MOD_PURPOSE_ADMINISTRATION
- MOD_PURPOSE_INTERFACE
- MOD_PURPOSE_OTHER
The colours for these types are defined in theme/boost/scss/moodle/variables.scss
* The format_base is now deprecated. Use core_courseformat\base instead.
* The new course output components deprecate many renderer methods from course
renderer and course format renderer: