Commit be2247fb authored by Damyon Wiese's avatar Damyon Wiese Committed by Marina Glancy
Browse files

MDL-56586 blocks: Do the addblock in a modal

parent b1e5624a
File suppressed by a .gitattributes entry or the file's encoding is unsupported.
File suppressed by a .gitattributes entry or the file's encoding is unsupported.
File suppressed by a .gitattributes entry or the file's encoding is unsupported.
// 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/>.
/**
* Show an add block modal instead of doing it on a separate page.
*
* @module core/addblockmodal
* @class addblockmodal
* @package core
* @copyright 2016 Damyon Wiese <damyon@moodle.com>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
define(['jquery', 'core/modal_factory', 'core/templates', 'core/str', 'core/notification'],
function($, ModalFactory, Templates, Str, Notification) {
return /** @alias module:core/addblockmodal */ {
/**
* Global init function for this module.
*
* @method init
* @param {Object} context The template context for rendering this modal body.
*/
init: function(context) {
var addblocklink = $('[data-key=addblock]');
// We need the fetch the names of the blocks. It was too much to send in the page.
Str.get_string('addblock').done(function(title) {
var titlerequests = [];
$.each(context.blocks, function(index, key) {
titlerequests[titlerequests.length] = {key: 'pluginname', component: 'block_' + key};
});
var blocks = [];
Str.get_strings(titlerequests).done(function(titles) {
$.each(titles, function(index, title) {
blocks[blocks.length] = {name: context.blocks[index], title: title};
});
context.blocks = blocks;
ModalFactory.create({
title: title,
body: Templates.render('core/add_block_body', context),
type: 'CANCEL',
}, addblocklink);
});
}).fail(Notification.exception);
}
};
});
// 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/>.
/**
* Contain the logic for the cancel modal.
*
* @module core/modal_cancel
* @class modal_cancel
* @package core
* @copyright 2016 Ryan Wyllie <ryan@moodle.com>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
define(['jquery', 'core/notification', 'core/custom_interaction_events', 'core/modal', 'core/modal_events'],
function($, Notification, CustomEvents, Modal, ModalEvents) {
var SELECTORS = {
CANCEL_BUTTON: '[data-action="cancel"]',
};
/**
* Constructor for the Modal.
*
* @param {object} root The root jQuery element for the modal
*/
var ModalCancel = function(root) {
Modal.call(this, root);
if (!this.getFooter().find(SELECTORS.CANCEL_BUTTON).length) {
Notification.exception({message: 'No cancel button found'});
}
};
ModalCancel.prototype = Object.create(Modal.prototype);
ModalCancel.prototype.constructor = ModalCancel;
/**
* Override parent implementation to prevent changing the footer content.
*/
ModalCancel.prototype.setFooter = function() {
Notification.exception({message: 'Can not change the footer of a cancel modal'});
return;
};
/**
* Set up all of the event handling for the modal.
*
* @method registerEventListeners
*/
ModalCancel.prototype.registerEventListeners = function() {
// Apply parent event listeners.
Modal.prototype.registerEventListeners.call(this);
this.getModal().on(CustomEvents.events.activate, SELECTORS.CANCEL_BUTTON, function(e, data) {
var cancelEvent = $.Event(ModalEvents.cancel);
this.getRoot().trigger(cancelEvent, this);
if (!cancelEvent.isDefaultPrevented()) {
this.hide();
data.originalEvent.preventDefault();
}
}.bind(this));
};
return ModalCancel;
});
......@@ -22,15 +22,16 @@
* @copyright 2016 Ryan Wyllie <ryan@moodle.com>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
define(['jquery', 'core/modal_events', 'core/modal', 'core/modal_save_cancel', 'core/modal_confirm',
define(['jquery', 'core/modal_events', 'core/modal', 'core/modal_save_cancel', 'core/modal_confirm', 'core/modal_cancel',
'core/templates', 'core/notification', 'core/custom_interaction_events'],
function($, ModalEvents, Modal, ModalSaveCancel, ModalConfirm, Templates, Notification, CustomEvents) {
function($, ModalEvents, Modal, ModalSaveCancel, ModalConfirm, ModalCancel, Templates, Notification, CustomEvents) {
// The templates for each type of modal.
var TEMPLATES = {
DEFAULT: 'core/modal',
SAVE_CANCEL: 'core/modal_save_cancel',
CONFIRM: 'core/modal_confirm',
CANCEL: 'core/modal_cancel',
};
// The JS classes for each type of modal.
......@@ -38,6 +39,7 @@ define(['jquery', 'core/modal_events', 'core/modal', 'core/modal_save_cancel', '
DEFAULT: Modal,
SAVE_CANCEL: ModalSaveCancel,
CONFIRM: ModalConfirm,
CANCEL: ModalCancel,
};
// The available types of modals.
......@@ -45,6 +47,7 @@ define(['jquery', 'core/modal_events', 'core/modal', 'core/modal_save_cancel', '
DEFAULT: 'DEFAULT',
SAVE_CANCEL: 'SAVE_CANCEL',
CONFIRM: 'CONFIRM',
CANCEL: 'CANCEL',
};
/**
......@@ -58,8 +61,9 @@ define(['jquery', 'core/modal_events', 'core/modal', 'core/modal_save_cancel', '
var setUpTrigger = function(modal, triggerElement) {
if (typeof triggerElement != 'undefined') {
CustomEvents.define(triggerElement, [CustomEvents.events.activate]);
triggerElement.on(CustomEvents.events.activate, function() {
triggerElement.on(CustomEvents.events.activate, function(e, data) {
modal.show();
data.originalEvent.preventDefault();
});
modal.getRoot().on(ModalEvents.hidden, function() {
......
......@@ -3769,13 +3769,19 @@ class flat_navigation extends navigation_node_collection {
if (isset($this->page->theme->addblockposition) &&
$this->page->theme->addblockposition == BLOCK_ADDBLOCK_POSITION_FLATNAV &&
$PAGE->user_is_editing() && $PAGE->user_can_edit_blocks() &&
$PAGE->blocks->get_addable_blocks()) {
($addable = $PAGE->blocks->get_addable_blocks())) {
$url = new moodle_url($PAGE->url, ['bui_addblock' => '', 'sesskey' => sesskey()]);
$addablock = navigation_node::create(get_string('addblock'), $url);
$flat = new flat_navigation_node($addablock, 0);
$flat->set_showdivider(true);
$flat->key = 'addblock';
$this->add($flat);
$blocks = [];
foreach ($addable as $block) {
$blocks[] = $block->name;
}
$params = array('blocks' => $blocks, 'url' => '?' . $url->get_query_string(false));
$PAGE->requires->js_call_amd('core/addblockmodal', 'init', array($params));
}
}
......
{{!
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/add_block_body
Template for the body of the add block modal.
Context variables required for this template:
* blocks - list of blocks containing name and title
* url - base url for links back to same page.
Example context (json):
{
"blocks" : [ { "name": "test", "title": "Test block" } ],
"url" : "?a=b"
}
}}
<div class="list-group">
{{#blocks}}
<a href="{{url}}&amp;bui_addblock={{name}}" class="list-group-item list-group-item-action">{{title}}</a>
{{/blocks}}
</div>
{{!
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/modal_save_cancel
Moodle modal template with one cancel button.
The purpose of this template is to render a modal.
Classes required for JS:
* none
Data attributes required for JS:
* none
Context variables required for this template:
* title A cleaned string (use clean_text()) to display.
* body HTML content for the boday
Example context (json):
{
"title": "Example cancel modal",
"body": "Some example content for the body"
}
}}
{{< core/modal }}
{{$footer}}
<button type="button" class="btn btn-secondary" data-action="cancel">{{#str}} cancel {{/str}}</button>
{{/footer}}
{{/ core/modal }}
......@@ -40,6 +40,6 @@
{{$body}}{{#str}} areyousure {{/str}}{{/body}}
{{$footer}}
<button type="button" class="btn btn-primary" data-action="yes">{{#str}} yes {{/str}}</button>
<button type="button" class="btn" data-action="no">{{#str}} no {{/str}}</button>
<button type="button" class="btn btn-secondary" data-action="no">{{#str}} no {{/str}}</button>
{{/footer}}
{{/ core/modal }}
......@@ -41,6 +41,6 @@
{{< core/modal }}
{{$footer}}
<button type="button" class="btn btn-primary" data-action="save">{{#str}} savechanges {{/str}}</button>
<button type="button" class="btn" data-action="cancel">{{#str}} cancel {{/str}}</button>
<button type="button" class="btn btn-secondary" data-action="cancel">{{#str}} cancel {{/str}}</button>
{{/footer}}
{{/ core/modal }}
......@@ -62,7 +62,7 @@
<nav class="list-group m-t-1">
{{/showdivider}}
{{#action}}
<a class="list-group-item list-group-item-action {{#isactive}}font-weight-bold{{/isactive}}" href="{{{action}}}">
<a class="list-group-item list-group-item-action {{#isactive}}font-weight-bold{{/isactive}}" href="{{{action}}}" data-key="{{key}}">
<div class="m-l-{{get_indent}}">
{{#is_section}}
<div class="media">
......@@ -79,7 +79,7 @@
</a>
{{/action}}
{{^action}}
<div class="list-group-item">
<div class="list-group-item" data-key="{{key}}">
<div class="m-l-{{get_indent}}">
{{#is_section}}
{{#pix}}i/folder{{/pix}}
......
......@@ -39,7 +39,12 @@ class behat_theme_boost_behat_blocks extends behat_blocks {
public function i_add_the_block($blockname) {
$this->execute('behat_navigation::i_select_from_flat_navigation_drawer', get_string('addblock'));
$this->execute('behat_forms::press_button', $blockname);
if (!$this->running_javascript()) {
$this->execute('behat_forms::press_button', $blockname);
} else {
$this->execute('behat_general::i_click_on_in_the', $blockname, 'link', '.modal-body', 'css_element');
}
}
public function i_open_the_blocks_action_menu($blockname) {
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment