MDL-59936 calendar: use event colour in summary modal header

sbourget · Oct 30, 2017 · 8f73087 · 8f73087
1 parent 4febb36
commit 8f73087
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 3 deletions.
diff --git a/calendar/amd/build/calendar.min.js b/calendar/amd/build/calendar.min.js
diff --git a/calendar/amd/src/calendar.js b/calendar/amd/src/calendar.js
@@ -86,18 +86,44 @@ define([
         });
     };
 
+    /**
+     * Get the CSS class to apply for the given event type.
+     *
+     * @param {String} eventType The calendar event type
+     * @return {String}
+     */
+    var getEventTypeClassFromType = function(eventType) {
+        switch (eventType) {
+            case 'user':
+                return 'calendar_event_user';
+            case 'site':
+                return 'calendar_event_site';
+            case 'group':
+                return 'calendar_event_group';
+            case 'category':
+                return 'calendar_event_category';
+            case 'course':
+                return 'calendar_event_course';
+            default:
+                return 'calendar_event_course';
+        }
+    };
+
     /**
      * Render the event summary modal.
      *
      * @param {Number} eventId The calendar event id.
      */
     var renderEventSummaryModal = function(eventId) {
+        var typeClass = '';
+
         // Calendar repository promise.
         CalendarRepository.getEventById(eventId).then(function(getEventResponse) {
             if (!getEventResponse.event) {
                 throw new Error('Error encountered while trying to fetch calendar event with ID: ' + eventId);
             }
             var eventData = getEventResponse.event;
+            typeClass = getEventTypeClassFromType(eventData.eventtype);
 
             return getEventType(eventData.eventtype).then(function(eventType) {
                 eventData.eventtype = eventType;
@@ -112,6 +138,7 @@ define([
                 templateContext: {
                     canedit: eventData.canedit,
                     candelete: eventData.candelete,
+                    headerclasses: typeClass,
                     isactionevent: eventData.isactionevent,
                     url: eventData.url
                 }

diff --git a/lib/templates/modal.mustache b/lib/templates/modal.mustache
@@ -45,7 +45,7 @@
         data-region="modal"
         aria-labelledby="{{uniqid}}-modal-title"
         role="document">
-        <div class="modal-header" data-region="header">
+        <div class="modal-header {{$headerclasses}}{{headerclasses}}{{/headerclasses}}" data-region="header">
             <button type="button" class="close" data-action="hide" title="{{#str}} closebuttontitle {{/str}}"></button>
             {{$header}}
                 <h3 id="{{uniqid}}-modal-title" data-region="title" tabindex="0">

diff --git a/theme/boost/templates/core/modal.mustache b/theme/boost/templates/core/modal.mustache
@@ -43,7 +43,7 @@
 <div class="modal moodle-has-zindex" data-region="modal-container" aria-hidden="true" role="dialog">
     <div class="modal-dialog {{$classes}}{{/classes}}" role="document" data-region="modal" aria-labelledby="{{uniqid}}-modal-title">
         <div class="modal-content">
-            <div class="modal-header" data-region="header">
+            <div class="modal-header {{$headerclasses}}{{headerclasses}}{{/headerclasses}}" data-region="header">
                 <button type="button" class="close" data-action="hide" aria-label={{#quote}}{{#str}}closebuttontitle{{/str}}{{/quote}}>
                   <span aria-hidden="true">&times;</span>
                 </button>