+++ /dev/null
-// 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/>.
-
-/**
- * Overlay manager for the Moodle Calendar.
- *
- * @module moodle-core_calendar-info
- * @package core_calendar
- * @copyright 2014 Andrew Nicols <andrew@nicols.co.uk>
- * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
- * @main moodle-core_calendar-info
- */
-
-var ARIACONTROLS = 'aria-controls',
- BOUNDINGBOX = 'boundingBox',
- CALENDAREVENT = '[data-core_calendar-title]',
- CALENDARTABLE = 'calendartable',
- DATAPREFIX = 'core_calendar-',
- DOT = '.',
- EVENTCONTENT = 'eventcontent',
- EVENTDELAY = 'delay',
- EVENTTITLE = 'eventtitle',
- INNERHTML = 'innerHTML',
-
- /**
- * Overlay manager for the Moodle calendar.
- *
- * @namespace M.core_calendar
- * @class Info
- * @constructor
- */
-
- Info = function() {
- Info.superclass.constructor.apply(this, arguments);
- };
-
-
-Y.extend(Info, Y.Base, {
- /**
- * A pointer to the timer used for showing the panel.
- *
- * @property _showTimer
- * @type object
- * @private
- */
- _showTimer: null,
-
- /**
- * A pointer to the timer used for hiding the panel.
- *
- * @property _hideTimer
- * @type object
- * @private
- */
- _hideTimer: null,
-
- /**
- * A pointer for the Calendar Overlay.
- *
- * @property _panel
- * @type object
- * @private
- */
- _panel: null,
-
- /**
- * A pointer to the cell containing the currently open calendar day.
- *
- * @property _currentDay
- * @type object
- * @private
- */
- _currentDay: null,
-
- initializer: function() {
- var body = Y.one(Y.config.doc.body);
- body.delegate(['mouseenter', 'focus'], this._startShow, CALENDAREVENT, this);
- body.delegate(['mouseleave', 'blur'], this._startHide, CALENDAREVENT, this);
- },
-
- /**
- * Initialise the Overlay in which information is displayed.
- *
- * @method __initOverlay
- * @chainable
- */
- _initOverlay: function() {
- if (!this._panel) {
- this._panel = new Y.Overlay({
- headerContent: Y.Node.create('<h2 class="' + EVENTTITLE + '"/>'),
- bodyContent: Y.Node.create('<div class="' + EVENTCONTENT + '"/>'),
- visible: false,
- render: true
- });
-
- this._panel.get(BOUNDINGBOX)
- .addClass('calendar-event-panel');
- }
-
- return this;
- },
-
- /**
- * Prepare to show the Overlay, and kick off the jobs that cause it to be shown.
- *
- * @method _startShow
- * @param {EventFacade} e
- * @private
- */
- _startShow: function(e) {
- if (this._isCurrentDayVisible(e.currentTarget)) {
- // Only start the show if the current day isn't already visible.
- return;
- }
-
- this._cancelHide()
- ._cancelShow()
-
- // Initialise the panel now - this will only happen once. This way
- // it's ready for when the timer times out.
- ._initOverlay();
-
-
- this._showTimer = setTimeout(Y.bind(function() {
- var calendarCell = e.target.ancestor(CALENDAREVENT, true);
- this._show(calendarCell);
- }, this), this.get(EVENTDELAY));
- },
-
- /**
- * Display the Overlay immediately.
- *
- * @method _show
- * @param {Node} dayCell The location that the Overlay should be displayed.
- */
- _show: function(dayCell) {
- var bb = this._panel.get(BOUNDINGBOX),
- widgetPositionAlign = Y.WidgetPositionAlign,
- calendarParent = dayCell.ancestor(DOT + CALENDARTABLE);
-
- bb.one(DOT + EVENTTITLE).set(INNERHTML, dayCell.getData(DATAPREFIX + 'title'));
- bb.one(DOT + EVENTCONTENT).set(INNERHTML, dayCell.getData(DATAPREFIX + 'popupcontent'));
-
- // Set the ARIA attributes for the owning cell.
- if (this._currentDay) {
- this._currentDay.setAttribute(ARIACONTROLS, null);
- }
- dayCell.setAttribute(ARIACONTROLS, dayCell.get('id'));
-
- // Move the panel to the current target.
- dayCell.appendChild(bb);
-
- // Keep track of the new day being shown.
- this._currentDay = dayCell;
-
- this._panel.constrain(calendarParent);
- this._panel
- .set('width', calendarParent.get('offsetWidth') + 'px')
- // Align it with the area clicked.
- .align(calendarParent, [
- widgetPositionAlign.TC,
- widgetPositionAlign.TC
- ])
- // Show it.
- .show();
-
- bb.setAttribute('tabindex', '0')
- .focus();
- },
-
- /**
- * Cancel the timers which would cause the overlay to be shown.
- *
- * @method _cancelShow
- * @chainable
- * @private
- */
- _cancelShow: function() {
- if (this._showTimer) {
- clearTimeout(this._showTimer);
- }
-
- return this;
- },
-
- /**
- * Prepare to hide the Overlay, and kick off the jobs that cause it to be hidden.
- *
- * @method _startHide
- * @param {EventFacade} e
- * @private
- */
- _startHide: function(e) {
- if (e.type === 'blur' && e.currentTarget.contains(e.target)) {
- return;
- }
- this._cancelShow()
- ._cancelHide();
- this._hideTimer = setTimeout(Y.bind(function() {
- this._hide();
- }, this), this.get(EVENTDELAY));
- },
-
- /**
- * Hide the Overlay immediately.
- *
- * @method _hide
- */
- _hide: function() {
- if (this._panel) {
- this._panel.hide();
- }
- },
-
- /**
- * Cancel the timers which would cause the overlay to be hidden.
- *
- * @method _cancelHide
- * @chainable
- * @private
- */
- _cancelHide: function() {
- if (this._hideTimer) {
- clearTimeout(this._hideTimer);
- }
-
- return this;
- },
-
- /**
- * Determine whether the specified day is currently visible.
- *
- * @method _isCurrentDayVisible
- * @param specifiedDay {Node} The Node to check visibility for.
- * @private
- */
- _isCurrentDayVisible: function(specifiedDay) {
- if (!this._panel || !this._panel.get('visible')) {
- return false;
- }
-
- if (specifiedDay !== this._currentDay) {
- return false;
- }
-
- return true;
- }
-}, {
- NAME: 'calendarInfo',
- ATTRS: {
- /**
- * The delay to use before showing or hiding the calendar.
- *
- * @attribute delay
- * @type Number
- * @default 300
- */
- delay: {
- value: 300
- }
- }
-});
-
-Y.namespace('M.core_calendar.info').init = function(config) {
- return new Info(config);
-};
.path-calendar .maincalendar .calendar_event_user {
border-color: #dce7ec;
}
-.path-calendar .maincalendar .calendar-event-panel {
- background-color: #eee;
- border: 2px solid #eee;
-}
-.path-calendar .maincalendar .calendar-event-panel .yui3-overlay-content {
- padding: 19px;
- background-color: #fdfdfd;
- border: 1px solid #e3e3e3;
- -webkit-border-radius: 4px;
- -moz-border-radius: 4px;
- border-radius: 4px;
- -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
- -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
- box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
-}
.path-calendar .maincalendar .calendar-controls .current {
font-family: inherit;
font-weight: bold;
line-height: inherit;
text-align: center;
}
-.block .calendar-event-panel {
- background-color: #eee;
- border: 1px solid #eee;
-}
-.block .calendar-event-panel .yui3-overlay-content {
- padding: 19px;
- background-color: #fdfdfd;
- border: 1px solid #e3e3e3;
- -webkit-border-radius: 4px;
- -moz-border-radius: 4px;
- border-radius: 4px;
- -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
- -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
- box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
-}
-.block .calendar-event-panel .yui3-overlay-content h2.eventtitle {
- line-height: 1.2;
- font-size: 18px;
-}
-.block .calendar-event-panel .yui3-overlay-content .eventcontent img {
- padding-right: 5px;
-}
.block .calendar-controls .previous,
.block .calendar-controls .current,
.block .calendar-controls .next {
