Skip to content

Commit

Permalink
MDL-54701 message: renamed mdl-popover to popover-region
Browse files Browse the repository at this point in the history
  • Loading branch information
@ryanwyllie @mdjnelson
ryanwyllie authored and mdjnelson committed Oct 7, 2016
1 parent 6b2657d commit d4555a3
Show file tree
Hide file tree
Showing 9 changed files with 446 additions and 447 deletions.
70 changes: 35 additions & 35 deletions lib/amd/src/mdl_popover_controller.js → lib/amd/src/popover_region_controller.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,12 +14,12 @@
// along with Moodle. If not, see <http://www.gnu.org/licenses/>.

/**
* Controls the mdl popover element.
* Controls the popover region element.
*
* See template: core/mdl_popover
* See template: core/popover_region
*
* @module core/mdl_popover_controller
* @class mdl_popover_controller
* @module core/popover_region_controller
* @class popover_region_controller
* @package core
* @copyright 2015 Ryan Wyllie <ryan@moodle.com>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
Expand All @@ -29,19 +29,19 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
function($, str, customEvents) {

var SELECTORS = {
CONTENT: '.mdl-popover-content',
CONTENT_CONTAINER: '.mdl-popover-content-container',
MENU_CONTAINER: '.mdl-popover-container',
MENU_TOGGLE: '.mdl-popover-toggle',
CONTENT: '.popover-region-content',
CONTENT_CONTAINER: '.popover-region-content-container',
MENU_CONTAINER: '.popover-region-container',
MENU_TOGGLE: '.popover-region-toggle',
};

/**
* Constructor for the MdlPopoverController.
* Constructor for the PopoverRegionController.
*
* @param element jQuery object root element of the popover
* @return object MdlPopoverController
* @return object PopoverRegionController
*/
var MdlPopoverController = function(element) {
var PopoverRegionController = function(element) {
this.root = $(element);
this.content = this.root.find(SELECTORS.CONTENT);
this.contentContainer = this.root.find(SELECTORS.CONTENT_CONTAINER);
Expand All @@ -53,12 +53,12 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
/**
* The collection of events triggered by this controller.
*/
MdlPopoverController.prototype.events = function() {
PopoverRegionController.prototype.events = function() {
return {
menuOpened: 'mdlpopover:menuopened',
menuClosed: 'mdlpopover:menuclosed',
startLoading: 'mdlpopover:startLoading',
stopLoading: 'mdlpopover:stopLoading',
menuOpened: 'popoverregion:menuopened',
menuClosed: 'popoverregion:menuclosed',
startLoading: 'popoverregion:startLoading',
stopLoading: 'popoverregion:stopLoading',
};
};

Expand All @@ -68,7 +68,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
* @method getContentContainer
* @return jQuery object
*/
MdlPopoverController.prototype.getContentContainer = function() {
PopoverRegionController.prototype.getContentContainer = function() {
return this.contentContainer;
};

Expand All @@ -78,7 +78,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
* @method getContent
* @return jQuery object
*/
MdlPopoverController.prototype.getContent = function() {
PopoverRegionController.prototype.getContent = function() {
return this.content;
};

Expand All @@ -88,7 +88,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
* @method isMenuOpen
* @return bool
*/
MdlPopoverController.prototype.isMenuOpen = function() {
PopoverRegionController.prototype.isMenuOpen = function() {
return !this.root.hasClass('collapsed');
};

Expand All @@ -97,7 +97,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
*
* @method toggleMenu
*/
MdlPopoverController.prototype.toggleMenu = function() {
PopoverRegionController.prototype.toggleMenu = function() {
if (this.isMenuOpen()) {
this.closeMenu();
} else {
Expand All @@ -112,7 +112,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
*
* @method closeMenu
*/
MdlPopoverController.prototype.closeMenu = function() {
PopoverRegionController.prototype.closeMenu = function() {
// We're already closed.
if (!this.isMenuOpen()) {
return;
Expand All @@ -132,7 +132,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
*
* @method openMenu
*/
MdlPopoverController.prototype.openMenu = function() {
PopoverRegionController.prototype.openMenu = function() {
// We're already open.
if (this.isMenuOpen()) {
return;
Expand All @@ -150,7 +150,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
*
* @method updateButtonAriaLabel
*/
MdlPopoverController.prototype.updateButtonAriaLabel = function() {
PopoverRegionController.prototype.updateButtonAriaLabel = function() {
if (this.isMenuOpen()) {
str.get_string('hidepopoverwindow').done(function(string) {
this.menuToggle.attr('aria-label', string);
Expand All @@ -169,7 +169,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
*
* @method startLoading
*/
MdlPopoverController.prototype.startLoading = function() {
PopoverRegionController.prototype.startLoading = function() {
this.isLoading = true;
this.getContentContainer().addClass('loading');
this.getContentContainer().attr('aria-busy', 'true');
Expand All @@ -183,7 +183,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
*
* @method stopLoading
*/
MdlPopoverController.prototype.stopLoading = function() {
PopoverRegionController.prototype.stopLoading = function() {
this.isLoading = false;
this.getContentContainer().removeClass('loading');
this.getContentContainer().attr('aria-busy', 'false');
Expand All @@ -195,7 +195,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
*
* @method focusMenuToggle
*/
MdlPopoverController.prototype.focusMenuToggle = function() {
PopoverRegionController.prototype.focusMenuToggle = function() {
this.menuToggle.focus();
};

Expand All @@ -205,7 +205,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
* @method contentItemHasFocus
* @return bool
*/
MdlPopoverController.prototype.contentItemHasFocus = function() {
PopoverRegionController.prototype.contentItemHasFocus = function() {
return this.getContentItemWithFocus().length > 0;
};

Expand All @@ -215,7 +215,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
* @method getContentItemWithFocus
* @return jQuery object
*/
MdlPopoverController.prototype.getContentItemWithFocus = function() {
PopoverRegionController.prototype.getContentItemWithFocus = function() {
var currentFocus = $(document.activeElement);
var items = this.getContent().children();
var currentItem = items.filter(currentFocus);
Expand All @@ -232,7 +232,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
*
* @method focusFirstContentItem
*/
MdlPopoverController.prototype.focusFirstContentItem = function() {
PopoverRegionController.prototype.focusFirstContentItem = function() {
this.getContent().children().first().focus();
};

Expand All @@ -241,7 +241,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
*
* @method focusLastContentItem
*/
MdlPopoverController.prototype.focusLastContentItem = function() {
PopoverRegionController.prototype.focusLastContentItem = function() {
this.getContent().children().last().focus();
};

Expand All @@ -251,7 +251,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
*
* @method focusNextContentItem
*/
MdlPopoverController.prototype.focusNextContentItem = function() {
PopoverRegionController.prototype.focusNextContentItem = function() {
var currentItem = this.getContentItemWithFocus();

if (currentItem.length && currentItem.next()) {
Expand All @@ -265,7 +265,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
*
* @method focusPreviousContentItem
*/
MdlPopoverController.prototype.focusPreviousContentItem = function() {
PopoverRegionController.prototype.focusPreviousContentItem = function() {
var currentItem = this.getContentItemWithFocus();

if (currentItem.length && currentItem.prev()) {
Expand All @@ -278,7 +278,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
*
* @method registerBaseEventListeners
*/
MdlPopoverController.prototype.registerBaseEventListeners = function() {
PopoverRegionController.prototype.registerBaseEventListeners = function() {
customEvents.define(this.root, [
customEvents.events.activate,
customEvents.events.escape,
Expand Down Expand Up @@ -313,7 +313,7 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
*
* @method registerListNavigationEventListeners
*/
MdlPopoverController.prototype.registerListNavigationEventListeners = function() {
PopoverRegionController.prototype.registerListNavigationEventListeners = function() {
customEvents.define(this.root, [
customEvents.events.down,
customEvents.events.up,
Expand Down Expand Up @@ -352,5 +352,5 @@ define(['jquery', 'core/str', 'core/custom_interaction_events'],
}.bind(this));
};

return MdlPopoverController;
return PopoverRegionController;
});
30 changes: 15 additions & 15 deletions lib/templates/mdl_popover.mustache → lib/templates/popover_region.mustache
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,9 @@
along with Moodle. If not, see <http://www.gnu.org/licenses/>.
}}
{{!
@template core/mdl_popover
@template core/popover_region
This template will render a mdl popover
This template will render a popover region
Classes required for JS:
* none
Expand All @@ -33,37 +33,37 @@
}

}}
<div class="mdl-popover mdl-popover-{{uniqid}} collapsed {{$classes}}{{/classes}}" {{$attributes}}{{/attributes}}>
<div class="mdl-popover-toggle"
<div class="popover-region popover-region-{{uniqid}} collapsed {{$classes}}{{/classes}}" {{$attributes}}{{/attributes}}>
<div class="popover-region-toggle"
aria-role="button"
aria-controls="mdl-popover-container-{{uniqid}}"
aria-controls="popover-region-container-{{uniqid}}"
aria-haspopup="true"
aria-label="{{$togglelabel}}{{#str}}showpopovermenu{{/str}}{{/togglelabel}}"
tabindex="0">
{{$togglecontent}}{{/togglecontent}}
</div>
<div {{$containerattributes}}{{/containerattributes}}
id="mdl-popover-container-{{uniqid}}"
class="mdl-popover-container"
id="popover-region-container-{{uniqid}}"
class="popover-region-container"
aria-expanded="false"
aria-hidden="true"
aria-label="{{$containerlabel}}{{/containerlabel}}"
role="region">
<div class="mdl-popover-header-container">
<h3 class="mdl-popover-header-text">{{$headertext}}{{/headertext}}</h3>
<div class="mdl-popover-header-actions">{{$headeractions}}{{/headeractions}}</div>
<div class="popover-region-header-container">
<h3 class="popover-region-header-text">{{$headertext}}{{/headertext}}</h3>
<div class="popover-region-header-actions">{{$headeractions}}{{/headeractions}}</div>
</div>
<div class="mdl-popover-content-container">
<div class="mdl-popover-content">
<div class="popover-region-content-container">
<div class="popover-region-content">
{{$content}}{{/content}}
</div>
<div class="loading-icon">{{#pix}} y/loading, core, {{#str}} loading, mod_assign {{/str}} {{/pix}}</div>
{{> core/loading }}
</div>
</div>
</div>
{{#js}}
require(['jquery', 'core/mdl_popover_controller'], function($, controller) {
var container = $(".mdl-popover-{{uniqid}}");
require(['jquery', 'core/popover_region_controller'], function($, controller) {
var container = $(".popover-region-{{uniqid}}");
var controller = new controller(container);
controller.registerBaseEventListeners();
});
Expand Down
6 changes: 3 additions & 3 deletions message/amd/src/message_popover_controller.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,15 +26,15 @@
* @since 3.2
*/
define(['jquery', 'theme_bootstrapbase/bootstrap', 'core/ajax', 'core/templates', 'core/str',
'core/notification', 'core/custom_interaction_events', 'core/mdl_popover_controller',
'core/notification', 'core/custom_interaction_events', 'core/popover_region_controller',
'core_message/message_repository', 'core/url'],
function($, bootstrap, ajax, templates, str, debugNotification, customEvents,
PopoverController, messageRepo, URL) {

var SELECTORS = {
MARK_ALL_READ_BUTTON: '.mark-all-read-button',
USER_ID: 'data-userid',
MODE_TOGGLE: '.mdl-popover-header-actions .fancy-toggle',
MODE_TOGGLE: '.popover-region-header-actions .fancy-toggle',
CONTENT: '.messages',
CONTENT_ITEM_CONTAINER: '.content-item-container',
EMPTY_MESSAGE: '.empty-message',
Expand All @@ -43,7 +43,7 @@ define(['jquery', 'theme_bootstrapbase/bootstrap', 'core/ajax', 'core/templates'

/**
* Constructor for the MessagePopoverController.
* Extends MdlPopoverController.
* Extends PopoverRegionController.
*
* @param element jQuery object root element of the popover
* @return object MessagePopoverController
Expand Down
14 changes: 7 additions & 7 deletions message/amd/src/notification_popover_controller.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,15 +26,15 @@
* @since 3.2
*/
define(['jquery', 'theme_bootstrapbase/bootstrap', 'core/ajax', 'core/templates', 'core/str',
'core/notification', 'core/custom_interaction_events', 'core/mdl_popover_controller',
'core/notification', 'core/custom_interaction_events', 'core/popover_region_controller',
'core_message/notification_repository'],
function($, bootstrap, ajax, templates, str, debugNotification, customEvents,
popoverController, notificationRepo) {

var SELECTORS = {
MARK_ALL_READ_BUTTON: '.mark-all-read-button',
USER_ID: 'data-userid',
MODE_TOGGLE: '.mdl-popover-header-actions .fancy-toggle',
MODE_TOGGLE: '.popover-region-header-actions .fancy-toggle',
UNREAD_NOTIFICATIONS_CONTAINER: '.unread-notifications',
ALL_NOTIFICATIONS_CONTAINER: '.all-notifications',
BLOCK_BUTTON: '.block-button',
Expand All @@ -51,7 +51,7 @@ define(['jquery', 'theme_bootstrapbase/bootstrap', 'core/ajax', 'core/templates'

/**
* Constructor for the NotificationPopoverController.
* Extends MdlPopoverController.
* Extends PopoverRegionController.
*
* @param element jQuery object root element of the popover
* @return object NotificationPopoverController
Expand Down Expand Up @@ -387,7 +387,7 @@ define(['jquery', 'theme_bootstrapbase/bootstrap', 'core/ajax', 'core/templates'
* list current contains focus, otherwise the first item in the list is
* given focus.
*
* Overrides MdlPopoverController.focusNextContentItem
* Overrides PopoverRegionController.focusNextContentItem
* @method focusNextContentItem
*/
NotificationPopoverController.prototype.focusNextContentItem = function() {
Expand All @@ -406,7 +406,7 @@ define(['jquery', 'theme_bootstrapbase/bootstrap', 'core/ajax', 'core/templates'
* Shift focus to the previous content item in the content item list, if the
* content item list contains focus.
*
* Overrides MdlPopoverController.focusPreviousContentItem
* Overrides PopoverRegionController.focusPreviousContentItem
* @method focusPreviousContentItem
*/
NotificationPopoverController.prototype.focusPreviousContentItem = function() {
Expand All @@ -422,7 +422,7 @@ define(['jquery', 'theme_bootstrapbase/bootstrap', 'core/ajax', 'core/templates'
/**
* Give focus to the first item in the list of content items.
*
* Overrides MdlPopoverController.focusFirstContentItem
* Overrides PopoverRegionController.focusFirstContentItem
* @method focusFirstContentItem
*/
NotificationPopoverController.prototype.focusFirstContentItem = function() {
Expand All @@ -442,7 +442,7 @@ define(['jquery', 'theme_bootstrapbase/bootstrap', 'core/ajax', 'core/templates'
* Give focus to the last item in the list of content items, that is the list
* of notifications that have already been loaded.
*
* Overrides MdlPopoverController.focusLastContentItem
* Overrides PopoverRegionController.focusLastContentItem
* @method focusLastContentItem
*/
NotificationPopoverController.prototype.focusLastContentItem = function() {
Expand Down
Loading

0 comments on commit d4555a3

Please sign in to comment.