|
|
| (Une version intermédiaire par le même utilisateur non affichée) |
| Ligne 1 : |
Ligne 1 : |
| <!--{$title|escape:html}--> | | <!-- Prout -> |
| | |
| <script>
| |
| // Création du WindowManager une seule fois
| |
| if (typeof window.externalWM === 'undefined') {
| |
| window.externalWM = new OO.ui.WindowManager();
| |
| $(document.body).append(window.externalWM.$element);
| |
| }
| |
| | |
| function ExternalIframeDialog(config) {
| |
| ExternalIframeDialog.super.call(this, config);
| |
| }
| |
| OO.inheritClass(ExternalIframeDialog, OO.ui.Dialog);
| |
| | |
| ExternalIframeDialog.static.name = 'externalIframe';
| |
| ExternalIframeDialog.prototype.initialize = function () {
| |
| ExternalIframeDialog.super.prototype.initialize.call(this);
| |
| | |
| this.iframe = $('<iframe>')
| |
| .attr({
| |
| frameborder: 0,
| |
| allowfullscreen: true
| |
| })
| |
| .css({ width: '100%', height: '100%', border: 'none' });
| |
| | |
| this.$body.append(this.iframe);
| |
| };
| |
| | |
| ExternalIframeDialog.prototype.getBodyHeight = function () {
| |
| return this.config.height || 700;
| |
| };
| |
| | |
| // Fonction globale d'ouverture (plus fiable)
| |
| window.openExternalOOUIDialog = function (url, title = 'Page externe', width = 1100, height = 750) {
| |
| const dialog = new ExternalIframeDialog({
| |
| size: 'large'
| |
| });
| |
| | |
| dialog.iframe.attr('src', url);
| |
| dialog.setTitle(title);
| |
| | |
| window.externalWM.addWindows([dialog]);
| |
| window.externalWM.openWindow(dialog, {
| |
| width: width,
| |
| height: height
| |
| });
| |
| | |
| // Rendre la fenêtre déplaçable
| |
| setTimeout(() => {
| |
| dialog.$element.draggable({
| |
| handle: '.oo-ui-window-head',
| |
| containment: 'window'
| |
| });
| |
| }, 300);
| |
| };
| |
| </script>
| |
| | |
| <style>
| |
| .oo-ui-windowManager-modal .oo-ui-window-frame {
| |
| background-color: rgba(255, 255, 255, 0.96) !important;
| |
| border-radius: 8px;
| |
| box-shadow: 0 8px 25px rgba(0,0,0,0.5);
| |
| }
| |
| .oo-ui-windowManager-overlay {
| |
| background-color: rgba(0, 0, 0, 0.65) !important;
| |
| }
| |
| </style>
| |
