Setting to be able to place the course context menu within the course beneath the page header.

CHANGES.md

@@ -6,6 +6,7 @@ Changes
 
 ### Unreleased
 
+* 2017-07-18 - Setting to be able to place the course context menu within the course benath the page header.
 * 2017-07-14 - Setting to place the link to the homepage always on top of the nav drawer.
 * 2017-07-14 - Minor change to use bootstrap z-index variable for the maintenance warning.
 * 2017-07-12 - Made changes from 2017-22-05 'Adding additional classes to list group items' undone because it won't be integrated into Moodle core.

README.md

@@ -121,6 +121,10 @@ With this setting you can add an additional course edit on / off button to the c
 
 With this setting you can choose the place where the information to which role a user has switched is being displayed. If not checked (default value), the role information will be displayed right beneath the user\'s name in the user menu (like in theme Boost). If checked, this information - together with a link to switch back - will be displayed beneath the course, as this functionality is course related.
 
+#### 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.
+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.
 
 ### 4. Tab "Footer Layout Settings"
 

amd/build/incoursesettings.min.js

+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

amd/src/incoursesettings.js

+// 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/>.
+
+/**
+ * Theme Boost Campus - JS code for displaying course setting within the course.
+ *
+ * @package    theme_boost_campus
+ * @copyright  2017 Kathrin Osswald, Ulm University <kathrin.osswald@uni-ulm.de>
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+define(['jquery'], function($) {
+    "use strict";
+
+    function initInCourseSettings() {
+        $('#page-header .context-header-settings-menu').on('click', function (e) {
+            e.stopPropagation();
+            if ($('#boost-campus-course-settings').is(":visible")) {
+                $('#boost-campus-course-settings').hide(400);
+            } else {
+                $('#boost-campus-course-settings').show(400);
+            }
+        });
+    }
+
+    return {
+        init: function() {
+            initInCourseSettings();
+        }
+    };
+});

classes/output/core_renderer.php

@@ -130,9 +130,9 @@ class core_renderer extends \theme_boost\output\core_renderer {
      * @return string HTML to display the main header.
      */
     public function full_header() {
-        /* MODIFICATION START */
+        // MODIFICATION START.
         global $PAGE, $USER, $COURSE;
-        /* MODIFICATION END */
+        // MODIFICATION END.
         /* ORIGINAL START.
         global $PAGE;
         ORIGINAL END. */
@@ -141,14 +141,30 @@ class core_renderer extends \theme_boost\output\core_renderer {
         $html .= html_writer::start_div('col-xs-12 p-a-1');
         $html .= html_writer::start_div('card');
         $html .= html_writer::start_div('card-block');
+        // MODIFICATION START:
+        // Only display the core context header menu if the setting "showsettingsincourse" is disabled
+        // or we are viewing the frontpage.
+        if (get_config('theme_boost_campus', 'showsettingsincourse') == 'no' || $PAGE->pagelayout == 'frontpage') {
             $html .= html_writer::div($this->context_header_settings_menu(), 'pull-xs-right context-header-settings-menu');
+        }
+        // MODIFICATION END.
+        /* ORIGINAL START.
+        $html .= html_writer::div($this->context_header_settings_menu(), 'pull-xs-right context-header-settings-menu');
+        ORIGINAL END. */
         $html .= html_writer::start_div('pull-xs-left');
         $html .= $this->context_header();
         $html .= html_writer::end_div();
+        /** @noinspection SpellCheckingInspection */
         $pageheadingbutton = $this->page_heading_button();
         if (empty($PAGE->layout_options['nonavbar'])) {
             $html .= html_writer::start_div('clearfix w-100 pull-xs-left', array('id' => 'page-navbar'));
             $html .= html_writer::tag('div', $this->navbar(), array('class' => 'breadcrumb-nav'));
+            // MODIFICATION START: Add the course context menu to the course page.
+            if (get_config('theme_boost_campus', 'showsettingsincourse') == 'yes') {
+                $html .= html_writer::div($this->context_header_settings_menu(),
+                    'pull-xs-right context-header-settings-menu m-l-1');
+            }
+            // MODIFICATION END.
             $html .= html_writer::div($pageheadingbutton, 'breadcrumb-button pull-xs-right');
             $html .= html_writer::end_div();
         } else if ($pageheadingbutton) {

lang/en/theme_boost_campus.php

@@ -72,6 +72,10 @@ $string['courseeditbuttonsetting_desc'] = 'With this setting you can add an addi
 $string['showswitchedroleincoursesetting'] = 'Position of switch role information';
 $string['showswitchedroleincoursesetting_desc'] = 'With this setting you can choose the place where the information to which role a user has switched is being displayed. If not checked (default value), the role information will be displayed right beneath the user\'s name in the user menu (like in theme Boost). If checked, this information - together with a link to switch back - will be displayed beneath the course, as this functionality is course related.';
 $string['switchedroleto'] = 'You are viewing this course currently with the role:';
+// ...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/>
+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.';
 
 // Footer layout settings.
 $string['footerlayoutsettings'] = 'Footer Layout Settings';

layout/columns2.php

@@ -24,6 +24,9 @@
  */
 
 defined('MOODLE_INTERNAL') || die();
+// MODIFICATION START.
+global $PAGE;
+// MODIFICATION END.
 
 user_preference_allow_ajax_update('drawer-open-nav', PARAM_ALPHA);
 require_once($CFG->libdir . '/behat/lib.php');
@@ -55,6 +58,19 @@ $catchctrlarrowdown = get_config('theme_boost_campus', 'catchctrlarrowdown');
 if (isset($catchctrlarrowdown) && $catchctrlarrowdown == true) {
     $catchshortcuts[] = 'ctrlarrowdown';
 }
+// MODIFICATION START.
+// If the setting 'showsettingsincourse' is enabled.
+if (get_config('theme_boost_campus', 'showsettingsincourse') == 'yes') {
+    // Only search for the courseadmin node if we are within a course context.
+    if ($PAGE->context->contextlevel == CONTEXT_COURSE) {
+        // Get the course context menu.
+        $node = $PAGE->settingsnav->find('courseadmin', navigation_node::TYPE_COURSE);
+    }
+} else {
+    $node = false;
+}
+// MODIFICATION END.
+
 $templatecontext = [
     'sitename' => format_string($SITE->shortname, true, ['context' => context_course::instance(SITEID), "escape" => false]),
     'output' => $OUTPUT,
@@ -64,7 +80,10 @@ $templatecontext = [
     'navdraweropen' => $navdraweropen,
     'regionmainsettingsmenu' => $regionmainsettingsmenu,
     'hasregionmainsettingsmenu' => !empty($regionmainsettingsmenu),
-    'catchshortcuts' => json_encode($catchshortcuts)
+    // MODIFICATION START.
+    'catchshortcuts' => json_encode($catchshortcuts),
+    'node' => $node
+    // MODIFICATION END.
 ];
 
 // MODIDFICATION START.

lib.php

@@ -72,15 +72,15 @@ function theme_boost_campus_get_main_scss_content($theme) {
  */
 function theme_boost_campus_get_pre_scss($theme) {
     global $CFG;
-    /* MODIFICATION START */
+    // MODIFICATION START.
     require_once($CFG->dirroot . '/theme/boost_campus/locallib.php');
-    /* MODIFICATION END */
+    // MODIFICATION END.
 
     $scss = '';
     $configurable = [
         // Config key => [variableName, ...].
         'brandcolor' => ['brand-primary'],
-        /* MODIFICATION START */
+        // MODIFICATION START.
         'section0title' => ['section0title'],
         'showswitchedroleincourse' => ['showswitchedroleincourse'],
         'loginform' => ['loginform'],
@@ -94,8 +94,9 @@ function theme_boost_campus_get_pre_scss($theme) {
         'branddangercolor' => ['brand-danger'],
         'darknavbar' => ['darknavbar'],
         'footerblocks' => ['footerblocks'],
-        'badgeareaitemsmaxheight' => ['badgeareaitemsmaxheight']
-        /* MODIFICATION END */
+        'badgeareaitemsmaxheight' => ['badgeareaitemsmaxheight'],
+        'showsettingsincourse' => ['showsettingsincourse']
+        // MODIFICATION END.
     ];
 
     // Prepend variables first.
@@ -109,9 +110,9 @@ function theme_boost_campus_get_pre_scss($theme) {
         }, (array) $targets);
     }
 
-    /* MODIFICATION START: Add login background images that are uploaded to the setting 'loginbackgroundimage' to CSS */
+    // MODIFICATION START: Add login background images that are uploaded to the setting 'loginbackgroundimage' to CSS.
     $scss .= theme_boost_campus_get_loginbackgroundimage_scss();
-    /* MODIFICATION END */
+    // MODIFICATION END.
 
     // Prepend pre-scss.
     if (!empty($theme->settings->scsspre)) {

scss/post.scss

@@ -297,6 +297,22 @@ body.loginbackgroundimage {
     }
 }
 
+/* If showsettingsincourse is enabled, we have to style the cog icon a bit different. */
+@if variable-exists(showsettingsincourse) {
+    @if $showsettingsincourse == 'yes' {
+        #page-navbar {
+            .breadcrumb-button {
+                margin-top: 0;
+            }
+            /* If the setting is enabled we do not need the triangle icon, because there is no menu
+             * popping up next to the cog icon. */
+            .context-header-settings-menu .dropdown-toggle::after {
+                display: none;
+            }
+        }
+    }
+}
+
 
 /*------------------------------------
   Course content
@@ -753,3 +769,17 @@ a[href^="mailto"]::before {
 #back-to-top::before {
     vertical-align: 0.3rem;
 }
+
+/* In-course course settings. */
+#boost-campus-course-settings {
+    /* Initially do not display the settings. Visibility will be changed on click with incoursesettings.js. */
+    display: none;
+    /* Improve color of tab content so it looks more like a real tab. */
+    .tab-content .card {
+        background-color: #f4f4f4;
+        border-left: 1px solid #ddd;
+        border-right: 1px solid #ddd;
+        border-bottom: 1px solid #ddd;
+        margin-bottom: 2rem;
+    }
+}

settings.php

@@ -231,6 +231,17 @@ if ($ADMIN->fulltree) {
     $setting->set_updatedcallback('theme_reset_all_caches');
     $page->add($setting);
 
+    // Setting to display information of a switched role in the course header.
+    $name = 'theme_boost_campus/showsettingsincourse';
+    $title = get_string('showsettingsincoursesetting', 'theme_boost_campus', null, true);
+    $description = get_string('showsettingsincoursesetting_desc', 'theme_boost_campus', null, true);
+    $setting = new admin_setting_configcheckbox($name, $title, $description, 'no', 'yes', 'no'); // Overriding default values
+    // yes = 1 and no = 0 because of the use of empty() in theme_boost_campus_get_pre_scss() (lib.php).
+    // Default 0 value would not write the variable to scss that could cause the scss to crash if used in that file.
+    // See MDL-58376.
+    $setting->set_updatedcallback('theme_reset_all_caches');
+    $page->add($setting);
+
     // Add tab to settings page.
     $settings->add($page);
 

templates/columns2.mustache

@@ -52,6 +52,8 @@
     * Remove section for footer blocks with own mustache template
     * Add theme_boost_campus/nav-drawer template instead of theme_boost/nav-drawer template
     * Require own javascript module for back to top button functionality
+    * If setting "showsettingsincourse" is enabled, then render course context menu from theme_boost_campus/settings_link_page template
+      and use the equivalent own javascript "incoursesettings".
 }}
 {{{ output.doctype }}}
 <html {{{ output.htmlattributes }}}>
@@ -75,6 +77,9 @@
 
         <div id="page-content" class="row">
             <div id="region-main-box" class="col-xs-12">
+                {{#node}}
+                    {{> theme_boost_campus/settings_link_page }}
+                {{/node}}
                 {{#hasregionmainsettingsmenu}}
                 <div id="region-main-settings-menu" class="hidden-print {{#hasblocks}}has-blocks{{/hasblocks}}">
                     <div> {{{ output.region_main_settings_menu }}} </div>
@@ -114,4 +119,9 @@ require(['theme_boost_campus/backtotop'], function(mod) {
 require(['theme_boost_campus/catchshortcuts'], function(mod) {
     mod.init({{{catchshortcuts}}});
 });
+{{#node}}
+    require(['theme_boost_campus/incoursesettings'], function(mod) {
+    mod.init();
+    });
+{{/node}}
 {{/js}}

templates/settings_link_page.mustache

+{{!
+    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/settings_link_page
+
+    Displays the admin tree as a list of grouped links.
+
+    Example context (json):
+    {
+        "node": {
+            "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-course-settings" class="card" >
+    <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>
+            </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>
+                    </li>
+                {{/display}}
+            {{/children.count}}
+        {{/node.children}}
+        </ul>
+
+        <div class="tab-content">
+            <div class="tab-pane active" id="link{{node.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">
+                                        {{#node.children}}
+                                            {{^children.count}}
+                                                {{#display}}
+                                                    <li><a href="{{{action}}}">{{text}}</a></li>
+                                                {{/display}}
+                                            {{/children.count}}
+                                        {{/node.children}}
+                                    </ul>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            {{#node.children}}
+                {{#children.count}}
+                    <div class="tab-pane" id="link{{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}}
+            {{/node.children}}
+        </div>
+    </div>
+</div>

templates/settings_link_page.mustache.original

+{{!
+    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 core/settings_link_page
+
+    Displays the admin tree as a list of grouped links.
+
+    Example context (json):
+    {
+        "node": {
+            "text": "Root of menu",
+            "key": "test0",
+            "display": true,
+            "children": [
+                {
+                    "text": "Child of menu",
+                    "key": "test1",
+                    "display": true,
+                    "children": []
+                }
+            ]
+        }
+    }
+}}
+
+<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>
+    </li>
+<!-- Now the first level children with sub nodes -->
+{{#node.children}}
+    {{#children.count}}
+        {{#display}}
+            {{^is_short_branch}}
+                <li class="nav-item">
+                    <a class="nav-link" href="#link{{key}}" data-toggle="tab" role="tab">{{text}}</a>
+                </li>
+            {{/is_short_branch}}
+        {{/display}}
+    {{/children.count}}
+{{/node.children}}
+</ul>
+
+<div class="tab-content">
+    <div class="tab-pane active" id="link{{node.key}}" role="tabpanel">
+        <div class="card">
+            <div class="card-block">
+                <div class="container">
+                    <div class="row">
+                        <div class="col-sm-6 push-sm-6">
+                            <ul class="list-unstyled">
+                                {{#node.children}}
+                                    {{^children.count}}
+                                        {{#display}}
+                                            <li><a href="{{{action}}}">{{text}}</a></li>
+                                        {{/display}}
+                                    {{/children.count}}
+                                {{/node.children}}
+                            </ul>
+                        </div>
+                    </div>
+
+                    {{#node.children}}
+                        {{#display}}
+                            {{#children.count}}
+                                {{#is_short_branch}}
+                                    <hr>
+                                    <div class="row">
+                                        <div class="col-sm-6">
+                                            {{#action}}<h4><a href="{{action}}">{{text}}</a><h4>{{/action}}
+                                            {{^action}}<h4>{{text}}<h4>{{/action}}
+                                        </div>
+                                        <div class="col-sm-6">
+                                            <ul class="list-unstyled">
+                                                {{#children}}
+                                                    {{> core/settings_link_page_single }}
+                                                {{/children}}
+                                            </ul>
+                                        </div>
+                                    </div>
+                                {{/is_short_branch}}
+                            {{/children.count}}
+                        {{/display}}
+                    {{/node.children}}
+                </div>
+            </div>
+        </div>
+    </div>
+    {{#node.children}}
+        {{#children.count}}
+            <div class="tab-pane" id="link{{key}}" role="tabpanel">
+                <div class="card">
+                    <div class="card-block">
+                        <div class="container">
+                            <div class="row">
+                                <div class="col-sm-6">
+                                    {{#action}}<h4><a href="{{action}}">{{text}}</a><h4>{{/action}}
+                                    {{^action}}<h4>{{text}}<h4>{{/action}}
+                                </div>
+                                <div class="col-sm-6">
+                                    <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-6">
+                                                {{#action}}<h4><a href="{{action}}">{{text}}</a><h4>{{/action}}
+                                                {{^action}}<h4>{{text}}<h4>{{/action}}
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <ul class="list-unstyled">
+                                                    {{#children}}
+                                                        {{> core/settings_link_page_single }}
+                                                    {{/children}}
+                                                </ul>
+                                            </div>
+                                        </div>
+                                    {{/children.count}}
+                                {{/display}}
+                            {{/children}}
+                        </div>
+                    </div>
+                </div>
+            </div>
+        {{/children.count}}
+    {{/node.children}}
+</div>

version.php

@@ -25,7 +25,7 @@
 defined('MOODLE_INTERNAL') || die();
 
 $plugin->component = 'theme_boost_campus';
-$plugin->version = 2017063001;
+$plugin->version = 20170717801;
 $plugin->release = 'v3.2-r1';
 $plugin->requires = 2016070700;
 $plugin->maturity = MATURITY_STABLE;