MDL-69166 core_payment: display the gateways modal

enrol/fee/classes/plugin.php

@@ -206,9 +206,12 @@ public function enrol_page_hook(stdClass $instance) {
                 echo '<p><a href="'.$wwwroot.'/login/">'.get_string('loginsite').'</a></p>';
                 echo '</div>';
             } else {
-                echo '<div align="center"><input type="submit" value="' . get_string("sendpaymentbutton", "enrol_paypal") . '" /></div>';
-                $PAGE->requires->js_call_amd('profilefield_conditional/conditionconfig', 'init', array('#id_param1',
-                        '#profilefield_conditional_conditionconfiguration', '#id_conditionconfigbutton', $fieldid));
+                \core_payment\helper::gateways_modal_requirejs();
+                $attributes = core_payment\helper::gateways_modal_link_params($cost, $instance->currency);
+
+                echo '<div align="center">' .
+                      html_writer::tag('button', get_string("sendpaymentbutton", "enrol_paypal"), $attributes) .
+                      '</div>';
             }
 
         }

lang/en/payment.php

@@ -22,4 +22,6 @@
  * @license   http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
  */
 
+$string['nogateway'] = 'There is no payment gateway that can be used.';
+$string['selectpaymenttype'] = 'Select payment type';
 $string['supportedcurrencies'] = 'Supported currencies';

payment/amd/src/gateways_modal.js

@@ -0,0 +1,94 @@
+// 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 gateways modal.
+ *
+ * @module     core_payment/gateways_modal
+ * @package    core_payment
+ * @copyright  2019 Shamim Rezaie <[email protected]>
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+import ModalFactory from 'core/modal_factory';
+import Templates from 'core/templates';
+import {get_string as getString} from 'core/str';
+import {getGatewaysSupportingCurrency} from 'core_payment/repository';
+import Selectors from './selectors';
+import * as ModalEvents from 'core/modal_events';
+
+/**
+ * Register event listeners for the module.
+ *
+ * @param {string} nodeSelector The root to listen to.
+ */
+export const registerEventListeners = (nodeSelector) => {
+    const rootNode = document.querySelector(nodeSelector);
+
+    rootNode.addEventListener('click', (e) => {
+        e.preventDefault();
+        show(rootNode, {focusOnClose: e.target});
+    });
+};
+
+/**
+ * Shows the gateway selector modal.
+ *
+ * @param {HTMLElement} rootNode
+ * @param {Object} options - Additional options
+ * @param {HTMLElement} options.focusOnClose The element to focus on when the modal is closed.
+ */
+const show = (rootNode, {
+    focusOnClose = null,
+} = {}) => {
+    Templates.render('core_payment/gateways_modal', {})
+        .done(content => {
+            ModalFactory.create({
+                title: getString('selectpaymenttype', 'core_payment'),
+                body: content,
+            })
+            .done(function(modal) {
+                const currency = rootNode.dataset.currency;
+                getGatewaysSupportingCurrency(currency)
+                    .done(gateways => {
+                        const context = {
+                            gateways: []
+                        };
+
+                        for (let gateway of gateways) {
+                            context.gateways.push(gateway);
+                        }
+
+                        Templates.render('core_payment/gateways', context)
+                            .done((html, js) => {
+                                Templates.replaceNodeContents(modal.getRoot().find(Selectors.regions.gatewaysContainer),
+                                    html, js);
+                            });
+                    });
+
+                modal.getRoot().on(ModalEvents.hidden, function() {
+                    // Destroy when hidden.
+                    modal.destroy();
+                    try {
+                        focusOnClose.focus();
+                    } catch (e) {
+                        // eslint-disable-line
+                    }
+                });
+
+                modal.show();
+            });
+        });
+};

payment/amd/src/repository.js

@@ -0,0 +1,41 @@
+// 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/>.
+
+/**
+ * Repository for payment subsystem.
+ *
+ * @module     core_payment/repository
+ * @package    core_payment
+ * @copyright  2020 Shamim Rezaie <[email protected]>
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+import Ajax from 'core/ajax';
+
+/**
+ * Returns the list of gateways that can process payments in the given currency.
+ *
+ * @param {string} currency The currency in the three-character ISO-4217 format
+ * @returns {Promise<{shortname: string, name: string, description: String}[]>}
+ */
+export const getGatewaysSupportingCurrency = currency => {
+    const request = {
+        methodname: 'core_payment_get_gateways_for_currency',
+        args: {
+            currency
+        }
+    };
+    return Ajax.call([request])[0];
+};

payment/amd/src/selectors.js

@@ -0,0 +1,29 @@
+// 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/>.
+
+/**
+ * Define all of the selectors we will be using on the payment interface.
+ *
+ * @module     core_payment/selectors
+ * @package    core_payment
+ * @copyright  2019 Shamim Rezaie <[email protected]>
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+export default {
+    regions: {
+        gatewaysContainer: '[data-region="gateways-container"]',
+    },
+};