From 3c02504da36c3150ef64c54120b0aec7dd0e37af Mon Sep 17 00:00:00 2001 From: Kathrin Osswald <kathrin.osswald@uni-ulm.de> Date: Fri, 17 Nov 2017 13:45:14 +0100 Subject: [PATCH] Extended the behaviour of the setting showsettingsincourse to respect activities and resources menus, too. --- CHANGES.md | 1 + README.md | 3 +- amd/build/incoursesettings.min.js | 2 +- amd/src/incoursesettings.js | 25 ++- classes/output/core_renderer.php | 1 - lang/en/theme_boost_campus.php | 2 +- layout/columns2.php | 11 +- locallib.php | 30 +++- scss/post.scss | 22 ++- templates/activity_settings_incourse.mustache | 143 ++++++++++++++++++ templates/columns2.mustache | 7 +- templates/settings_link_page.mustache | 9 +- 12 files changed, 237 insertions(+), 19 deletions(-) create mode 100644 templates/activity_settings_incourse.mustache diff --git a/CHANGES.md b/CHANGES.md index d5b5692..afdab2f 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -6,6 +6,7 @@ Changes ### Unreleased +* 2017-11-17 - Extended the behaviour of the setting "showsettingsincourse" to respect activities and resources menus, too. Please check this setting due to the new scope. * 2017-11-09 - Replaced the settings icon with a edit profile button on the profile page. * 2017-11-07 - Updated travis.yml to use newer node version for fixing TravisCI error. * 2017-10-17 - Minor change in SCSS to fit the borders of the current section in the periods format into the section. diff --git a/README.md b/README.md index 6340e17..bb1edf1 100644 --- a/README.md +++ b/README.md @@ -125,7 +125,8 @@ With this setting you can choose the place where the information to which role a ##### In course settings menu -With this setting you can change the displaying of the course context menu. In Boost, there is a popup context menu right next to the cog icon and clicking on the "More..." menu item will lead the user to another page with all course settings. By enabling this setting the settings will occur directly beneath the course header. +With this setting you can change the displaying of the context menus. In Boost, there is a popup context menu right next to the cog icon. By enabling this setting the settings will occur directly beneath the course header. The settings are arranged in tabs, so it is easier for the user to get to the desired setting instead of scanning a long list of menu items. With this setting we also hide the settings icon on the participants page as the entries on this page are duplicated with the in-course course menu and therefore not necessary. + Please note that this change does not affect users who have switched off javascript in their browsers - they will still get the behaviour from Moodle core with a popup course context menu. ##### Move "Switch role to..." to the course settings diff --git a/amd/build/incoursesettings.min.js b/amd/build/incoursesettings.min.js index 1bbfb5d..dc2ad80 100644 --- a/amd/build/incoursesettings.min.js +++ b/amd/build/incoursesettings.min.js @@ -1 +1 @@ -define(["jquery"],function(a){"use strict";function b(){a("#page-header .context-header-settings-menu").on("click",function(b){b.stopPropagation(),a("#boost-campus-course-settings").is(":visible")?a("#boost-campus-course-settings").hide(400):a("#boost-campus-course-settings").show(400)})}return{init:function(){b()}}}); \ No newline at end of file +define(["jquery"],function(a){"use strict";function b(){var b=a("#boost-campus-course-settings"),c=a("#boost-campus-activity-settings");a("#page-header .context-header-settings-menu").on("click",function(a){a.stopPropagation(),b.is(":visible")?b.hide(400):(b.show(400),c.is(":visible")&&c.hide(400))}),a("#region-main-settings-menu .action-menu .dropdown-toggle").on("click",function(a){a.stopPropagation(),c.is(":visible")?c.hide(400):(c.show(400),b.is(":visible")&&b.hide(400))})}return{init:function(){b()}}}); \ No newline at end of file diff --git a/amd/src/incoursesettings.js b/amd/src/incoursesettings.js index dd0b355..544e9d9 100644 --- a/amd/src/incoursesettings.js +++ b/amd/src/incoursesettings.js @@ -28,12 +28,31 @@ define(['jquery'], function($) { * Initialising. */ function initInCourseSettings() { + var courseSettings = $('#boost-campus-course-settings'); + var activitySettings = $('#boost-campus-activity-settings'); + $('#page-header .context-header-settings-menu').on('click', function(event) { event.stopPropagation(); - if ($('#boost-campus-course-settings').is(":visible")) { - $('#boost-campus-course-settings').hide(400); + if (courseSettings.is(":visible")) { + courseSettings.hide(400); + } else { + courseSettings.show(400); + // Additionally close activity settings if they are currently open. + if (activitySettings.is(":visible")) { + activitySettings.hide(400); + } + } + }); + $('#region-main-settings-menu .action-menu .dropdown-toggle').on('click', function(event) { + event.stopPropagation(); + if (activitySettings.is(":visible")) { + activitySettings.hide(400); } else { - $('#boost-campus-course-settings').show(400); + activitySettings.show(400); + // Additionally close course settings if they are currently open. + if (courseSettings.is(":visible")) { + courseSettings.hide(400); + } } }); } diff --git a/classes/output/core_renderer.php b/classes/output/core_renderer.php index 7dcbfa5..5f07ff7 100644 --- a/classes/output/core_renderer.php +++ b/classes/output/core_renderer.php @@ -390,7 +390,6 @@ class core_renderer extends \theme_boost\output\core_renderer { ORIGINAL END. */ } - // TODO Remove the copied function build_action_menu_from_navigation in version 3.4 of the theme. // This will be the first Moodle major version having MDL-58174 integrated from version x.0 on. diff --git a/lang/en/theme_boost_campus.php b/lang/en/theme_boost_campus.php index 3f94127..48d4c7a 100644 --- a/lang/en/theme_boost_campus.php +++ b/lang/en/theme_boost_campus.php @@ -76,7 +76,7 @@ $string['switchedroleto'] = 'You are viewing this course currently with the role $string['coursesettingsheadingsetting'] = 'Course settings'; // ...Show course settings within the course. $string['showsettingsincoursesetting'] = 'In course settings menu'; -$string['showsettingsincoursesetting_desc'] = 'With this setting you can change the displaying of the course context menu. In Boost, there is a popup context menu right next to the cog icon and clicking on the "More..." menu item will lead the user to another page with all course settings. By enabling this setting the settings will occur directly beneath the course header.<br/> +$string['showsettingsincoursesetting_desc'] = 'With this setting you can change the displaying of the context menus. In Boost, there is a popup context menu right next to the cog icon. By enabling this setting the settings will occur directly beneath the course header. The settings are arranged in tabs, so it is easier for the user to get to the desired setting instead of scanning a long list of menu items. With this setting we also hide the settings icon on the participants page as the entries on this page are duplicated with the in-course course menu and therefore not necessary.<br/> Please note that this change does not affect users who have switched off javascript in their browsers - they will still get the behaviour from Moodle core with a popup course context menu.'; // ...Show switch role to link within the in-course course settings. $string['incoursesettingsswitchtorolesetting'] = 'Move "Switch role to..." to the course settings'; diff --git a/layout/columns2.php b/layout/columns2.php index ca63e57..593ffb8 100644 --- a/layout/columns2.php +++ b/layout/columns2.php @@ -81,8 +81,15 @@ $templatecontext = [ // MODIDFICATION START. // Use the returned value from theme_boost_campus_get_modified_flatnav_defaulthomepageontop as the template context. $templatecontext['flatnavigation'] = theme_boost_campus_process_flatnav($PAGE->flatnav); -// Add the returned value from theme_boost_campus_get_incourse_settings to the template context. -$templatecontext['node'] = theme_boost_campus_get_incourse_settings(); +// If setting showsettingsincourse is enabled. +if (get_config('theme_boost_campus', 'showsettingsincourse') == 'yes') { + // Context value for requiring incoursesettings.js. + $templatecontext['incoursesettings'] = true; + // Add the returned value from theme_boost_campus_get_incourse_settings to the template context. + $templatecontext['node'] = theme_boost_campus_get_incourse_settings(); + // Add the returned value from theme_boost_campus_get_incourse_activity_settings to the template context. + $templatecontext['activitynode'] = theme_boost_campus_get_incourse_activity_settings(); +} // Render colums2.mustache from boost_campus. echo $OUTPUT->render_from_template('theme_boost_campus/columns2', $templatecontext); diff --git a/locallib.php b/locallib.php index 8cc0fba..b2e025b 100644 --- a/locallib.php +++ b/locallib.php @@ -126,7 +126,7 @@ function theme_boost_campus_get_imageareacontent() { $settings = explode("|", $line); // Check if both parameters are set. if (!empty($settings[1])) { - // The name of the image is the key for the URL that will be set. + // The name of the image is the key for the URL that will be set. $links[$settings[0]] = $settings[1]; } } @@ -240,7 +240,7 @@ function theme_boost_campus_set_node_on_top(flat_navigation $flatnav, $nodename, /** - * Provides the node for the in-course course settings. + * Provides the node for the in-course course or activity settings. * * @return navigation_node. */ @@ -286,6 +286,32 @@ function theme_boost_campus_get_incourse_settings() { } } } + return $node; + } +} + +/** + * Provides the node for the in-course settings for other contexts. + * + * @return navigation_node. + */ +function theme_boost_campus_get_incourse_activity_settings() { + global $PAGE; + $context = $PAGE->context; + $node = false; + // If setting showsettingsincourse is enabled. + if (get_config('theme_boost_campus', 'showsettingsincourse') == 'yes') { + // Settings belonging to activity or resources. + if ($context->contextlevel == CONTEXT_MODULE) { + $node = $PAGE->settingsnav->find('modulesettings', navigation_node::TYPE_SETTING); + } else if ($context->contextlevel == CONTEXT_COURSECAT) { + // For course category context, show category settings menu, if we're on the course category page. + if ($PAGE->pagetype === 'course-index-category') { + $node = $PAGE->settingsnav->find('categorysettings', navigation_node::TYPE_CONTAINER); + } + } else { + $node = false; + } } return $node; } diff --git a/scss/post.scss b/scss/post.scss index 9f6d0ed..d49994b 100644 --- a/scss/post.scss +++ b/scss/post.scss @@ -495,6 +495,21 @@ body.loginbackgroundimage { display: none; } +/* If showsettingsincourse is enabled */ +@if variable-exists(showsettingsincourse) { + @if $showsettingsincourse == 'yes' { + /* We do not show the cog icon on the participants page as the settings on this page are + * duplicated with the in-course course menu. */ + .path-user #region-main-settings-menu { + display: none; + } + /* Hide the triangle down icon. */ + #region-main-settings-menu .dropdown-toggle::after { + display: none; + } + } +} + /* * Misc * / @@ -821,10 +836,13 @@ a[href^="mailto"]::before { vertical-align: 0.3rem; } -/* In-course course settings. */ -#boost-campus-course-settings { +/* In-course settings. */ +#boost-campus-course-settings, +#boost-campus-activity-settings { /* Initially do not display the settings. Visibility will be changed on click with incoursesettings.js. */ display: none; + border-bottom: 2px solid $brand-primary; + margin-bottom: 3rem; /* Improve color of tab content so it looks more like a real tab. */ .tab-content .card { background-color: #f4f4f4; diff --git a/templates/activity_settings_incourse.mustache b/templates/activity_settings_incourse.mustache new file mode 100644 index 0000000..2f0d525 --- /dev/null +++ b/templates/activity_settings_incourse.mustache @@ -0,0 +1,143 @@ +{{! + 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/>. +}} +{{! + @template theme_boost_campus/activity_settings_incourse + + Displays the admin tree as a list of grouped links. + + Example context (json): + { + "activitynode": { + "text": "Root of menu", + "key": "test0", + "display": true, + "children": [ + { + "text": "Child of menu", + "key": "test1", + "display": true, + "children": [] + } + ] + } + } +}} +{{! MODIFICATION: + * Added divs around the tab structure to be able to insert this on different sites. + * Changed the grid definitions for improved displaying. + * Inserted heading for the general course settings. + * Removed check for !is_short_branch to display all children of the course settings within an own tab. +}} + +<div id="boost-campus-activity-settings" class="card" > + <h2>{{incourse_activitynode_heading}}</h2> + <div class="p-t-2"> + <ul class="nav nav-tabs" role="tablist"> + <!-- First the top most activitynode and immediate children --> + <li class="nav-item"> + <a class="nav-link active" href="#activity-settings-{{key}}" data-toggle="tab" role="tab">{{activitynode.text}}</a> + </li> + <!-- Now the first level children with sub activitynodes --> + {{#activitynode.children}} + {{#children.count}} + {{#display}} + <li class="nav-item"> + <a class="nav-link" href="#activity-settings-{{key}}" data-toggle="tab" role="tab">{{text}}</a> + </li> + {{/display}} + {{/children.count}} + {{/activitynode.children}} + </ul> + + <div class="tab-content"> + <div class="tab-pane active" id="activity-settings-{{key}}" role="tabpanel"> + <div class="card"> + <div class="card-block"> + <div class="container"> + <div class="row"> + <div class="col-sm-4"> + {{#action}}<h4><a href="{{action}}">{{text}}</a></h4>{{/action}} + {{^action}}<h4>{{text}}</h4>{{/action}} + </div> + <div class="col-sm-8"> + <ul class="list-unstyled"> + {{#activitynode.children}} + {{^children.count}} + {{#display}} + <li><a href="{{{action}}}">{{text}}</a></li> + {{/display}} + {{/children.count}} + {{/activitynode.children}} + </ul> + </div> + </div> + </div> + </div> + </div> + </div> + {{#activitynode.children}} + {{#children.count}} + <div class="tab-pane" id="activity-settings-{{key}}" role="tabpanel"> + <div class="card"> + <div class="card-block"> + <div class="container"> + <div class="row"> + <div class="col-sm-4"> + {{#action}}<h4><a href="{{action}}">{{text}}</a></h4>{{/action}} + {{^action}}<h4>{{text}}</h4>{{/action}} + </div> + <div class="col-sm-8"> + <ul class="list-unstyled"> + {{#children}} + {{#display}} + {{^children.count}} + <li><a href="{{{action}}}">{{text}}</a></li> + {{/children.count}} + {{/display}} + {{/children}} + </ul> + </div> + </div> + {{#children}} + {{#display}} + {{#children.count}} + <hr> + <div class="row"> + <div class="col-sm-4"> + {{#action}}<h4><a href="{{action}}">{{text}}</a></h4>{{/action}} + {{^action}}<h4>{{text}}</h4>{{/action}} + </div> + <div class="col-sm-8"> + <ul class="list-unstyled"> + {{#children}} + {{> core/settings_link_page_single }} + {{/children}} + </ul> + </div> + </div> + {{/children.count}} + {{/display}} + {{/children}} + </div> + </div> + </div> + </div> + {{/children.count}} + {{/activitynode.children}} + </div> + </div> +</div> diff --git a/templates/columns2.mustache b/templates/columns2.mustache index 8cc1a62..291c5cf 100644 --- a/templates/columns2.mustache +++ b/templates/columns2.mustache @@ -91,6 +91,9 @@ <div class="region_main_settings_menu_proxy"></div> {{/hasregionmainsettingsmenu}} {{{ output.course_content_header }}} + {{#activitynode}} + {{> theme_boost_campus/activity_settings_incourse }} + {{/activitynode}} {{{ output.main_content }}} {{{ output.course_content_footer }}} </div> @@ -119,9 +122,9 @@ require(['theme_boost_campus/backtotop'], function(mod) { require(['theme_boost_campus/catchshortcuts'], function(mod) { mod.init({{{catchshortcuts}}}); }); -{{#node}} +{{#incoursesettings}} require(['theme_boost_campus/incoursesettings'], function(mod) { mod.init(); }); -{{/node}} +{{/incoursesettings}} {{/js}} diff --git a/templates/settings_link_page.mustache b/templates/settings_link_page.mustache index ea40907..54a18fb 100644 --- a/templates/settings_link_page.mustache +++ b/templates/settings_link_page.mustache @@ -44,18 +44,19 @@ }} <div id="boost-campus-course-settings" class="card" > + <h2>{{incourse_node_heading}}</h2> <div class="m-x-2 p-t-2"> <ul class="nav nav-tabs" role="tablist"> <!-- First the top most node and immediate children --> <li class="nav-item"> - <a class="nav-link active" href="#link{{node.key}}" data-toggle="tab" role="tab">{{node.text}}</a> + <a class="nav-link active" href="#course-settings-{{node.key}}" data-toggle="tab" role="tab">{{node.text}}</a> </li> <!-- Now the first level children with sub nodes --> {{#node.children}} {{#children.count}} {{#display}} <li class="nav-item"> - <a class="nav-link" href="#link{{key}}" data-toggle="tab" role="tab">{{text}}</a> + <a class="nav-link" href="#course-settings-{{key}}" data-toggle="tab" role="tab">{{text}}</a> </li> {{/display}} {{/children.count}} @@ -63,7 +64,7 @@ </ul> <div class="tab-content"> - <div class="tab-pane active" id="link{{node.key}}" role="tabpanel"> + <div class="tab-pane active" id="course-settings-{{node.key}}" role="tabpanel"> <div class="card"> <div class="card-block"> <div class="container"> @@ -90,7 +91,7 @@ </div> {{#node.children}} {{#children.count}} - <div class="tab-pane" id="link{{key}}" role="tabpanel"> + <div class="tab-pane" id="course-settings-{{key}}" role="tabpanel"> <div class="card"> <div class="card-block"> <div class="container"> -- GitLab