Encyclopédie-de-L'AFN_1830-1962 - Modifications récentes [fr]

MediaWiki:Common.js

2026-05-01T13:22:47Z

← Version précédente		Version du 1 mai 2026 à 15:22
Ligne 53 :		Ligne 53 :


	// === External OOUI Dialog - Déplaçable ~~et redimensionnable~~ ===		// === External OOUI Dialog Déplaçable ===
	if (~~typeof window.openExtDialog ===~~ '~~undefined~~') {		mw.loader.using('oojs-ui-core').done(function () {

	// Création du WindowManager ~~une seule fois~~		if (typeof window.openExtDialog !== 'undefined') {
			return; // déjà initialisé
			}

			// Création du WindowManager
	window.extDialogWM = new OO.ui.WindowManager();		window.extDialogWM = new OO.ui.WindowManager();
	$(document.body).append(window.extDialogWM.$element);		$(document.body).append(window.extDialogWM.$element);

			// Définition de la classe du Dialog
	function ExternalIframeDialog(config) {		function ExternalIframeDialog(config) {
	ExternalIframeDialog.super.call(this, config);		ExternalIframeDialog.super.call(this, config);
Ligne 81 :		Ligne 86 :
	};		};

	// Fonction ~~globale accessible partout~~		// Fonction principale à appeler depuis les pages
	window.openExtDialog = function (url, title = 'Page externe', width = 1100, height = 750) {		window.openExtDialog = function (url, title = 'Page externe', width = 1100, height = 750) {
	~~mw.loader.using('oojs-ui-core').done(function () {~~		var dialog = new ExternalIframeDialog({ size: 'large' });
	var dialog = new ExternalIframeDialog({ size: 'large' });

	dialog.setTitle(title);		dialog.setTitle(title);
	dialog.iframe.attr('src', url);		dialog.iframe.attr('src', url);

	window.extDialogWM.addWindows([dialog]);		window.extDialogWM.addWindows([dialog]);
	window.extDialogWM.openWindow(dialog, {		window.extDialogWM.openWindow(dialog, {
	width: width,		width: width,
	height: height		height: height
	});		});

	// Rendre ~~la fenêtre déplaçable~~		// Rendre draggable après ouverture
	setTimeout(function () {		setTimeout(function () {
			if (dialog.$element) {
	dialog.$element.draggable({		dialog.$element.draggable({
	handle: '.oo-ui-window-head',		handle: '.oo-ui-window-head',
	containment: 'window'		containment: 'window'
	});		});
	}~~, 500);~~		}
	});		}, 600);
	};		};
	}
			console.log('[ExternalDialog] OOUI Dialog initialisé avec succès');
			});

Widget:ExternalDialog

2026-05-01T13:19:40Z

Contenu remplacé par « <!-- Prout -> »

← Version précédente		Version du 1 mai 2026 à 15:19
Ligne 1 :		Ligne 1 :
	<!--~~{$title\|escape:html}~~-->		<!-- Prout ->

	~~<script>~~
	~~/* === External OOUI Dialog Widget === */~~

	~~if (typeof window.myExternalWM === 'undefined') {~~
	~~window.myExternalWM = new OO.ui.WindowManager();~~
	~~$( 'body' ).append( window.myExternalWM.$element );~~
	}

	~~function ExternalIframeDialog( config ) {~~
	~~ExternalIframeDialog.super.call( this, config );~~
	}
	~~OO.inheritClass( ExternalIframeDialog, OO.ui.Dialog );~~

	~~ExternalIframeDialog.static.name = 'externalIframeDialog';~~

	~~ExternalIframeDialog.prototype.initialize = function () {~~
	~~ExternalIframeDialog.super.prototype.initialize.call( this );~~

	~~this.iframe = $( '<iframe>' )~~
	~~.attr( 'frameborder', '0' )~~
	~~.attr( 'allowfullscreen', '' )~~
	~~.css( { width: '100%', height: '100%', border: 'none' } );~~

	~~this.$body.append( this.iframe );~~
	};

	~~ExternalIframeDialog.prototype.getBodyHeight = function () {~~
	~~return this.config.height \|\| 700;~~
	};

	~~// Fonction globale à appeler depuis la page~~
	~~window.openExtDialog = function ( url, title = 'Page externe', w = 1100, h = 750 ) {~~
	~~var dialog = new ExternalIframeDialog( { size: 'large' } );~~

	~~dialog.setTitle( title );~~
	~~dialog.iframe.attr( 'src', url );~~

	~~window.myExternalWM.addWindows( [ dialog ] );~~
	~~window.myExternalWM.openWindow( dialog, { width: w, height: h } );~~

	~~// Rendre la fenêtre déplaçable~~
	~~setTimeout( function() {~~
	~~dialog.$element.draggable({~~
	~~handle: '.oo-ui-window-head',~~
	~~containment: 'window'~~
	~~});~~
	~~}, 400 );~~
	};
	~~</script>~~

	~~<style>~~
	~~.oo-ui-window-frame {~~
	~~background: rgba(255, 255, 255, 0.97) !important;~~
	~~border-radius: 8px;~~
	}
	~~.oo-ui-windowManager-overlay {~~
	~~background: rgba(0, 0, 0, 0.7) !important;~~
	}
	~~</style~~>

Aide:Bac à sable

2026-05-01T13:17:19Z

← Version précédente		Version du 1 mai 2026 à 15:17
(Une version intermédiaire par le même utilisateur non affichée)
Ligne 11 :		Ligne 11 :
	</div>		</div>

	~~{{#widget:ExternalDialog}}~~



			<html>
	<button onclick="openExtDialog('http://stock.encyclopedie-afn.org/orient.html', 'Test Fenêtre', 1000, 700);">		<button onclick="openExtDialog('http://stock.encyclopedie-afn.org/orient.html', 'Test Fenêtre', 1000, 700);">
	Ouvrir la fenêtre (Test)		Ouvrir la fenêtre (Test)
	</button>		</button>
			</html>

MediaWiki:Common.js

2026-05-01T13:12:06Z

← Version précédente		Version du 1 mai 2026 à 15:12
Ligne 51 :		Ligne 51 :
	}		}
	*/		*/


			// === External OOUI Dialog - Déplaçable et redimensionnable ===
			if (typeof window.openExtDialog === 'undefined') {

			// Création du WindowManager une seule fois
			window.extDialogWM = new OO.ui.WindowManager();
			$(document.body).append(window.extDialogWM.$element);

			function ExternalIframeDialog(config) {
			ExternalIframeDialog.super.call(this, config);
			}
			OO.inheritClass(ExternalIframeDialog, OO.ui.Dialog);

			ExternalIframeDialog.static.name = 'externalIframeDialog';

			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 accessible partout
			window.openExtDialog = function (url, title = 'Page externe', width = 1100, height = 750) {
			mw.loader.using('oojs-ui-core').done(function () {
			var dialog = new ExternalIframeDialog({ size: 'large' });

			dialog.setTitle(title);
			dialog.iframe.attr('src', url);

			window.extDialogWM.addWindows([dialog]);
			window.extDialogWM.openWindow(dialog, {
			width: width,
			height: height
			});

			// Rendre la fenêtre déplaçable
			setTimeout(function () {
			dialog.$element.draggable({
			handle: '.oo-ui-window-head',
			containment: 'window'
			});
			}, 500);
			});
			};
			}

Aide:Bac à sable

2026-05-01T13:07:49Z

@@ Ligne 11 : / Ligne 11 : @@
 </div>
-<HTML>
+{{#widget:ExternalDialog}}
-{{#Widget:ExternalDialog}}
+<button onclick="openExtDialog('http://stock.encyclopedie-afn.org/orient.html', 'Test Fenêtre', 1000, 700);">
-<button onclick="ExternalDialog(
+     Ouvrir la fenêtre (Test)
 </button>

Widget:ExternalDialog

2026-05-01T13:06:36Z

← Version précédente		Version du 1 mai 2026 à 15:06
Ligne 2 :		Ligne 2 :

	<script>		<script>
	// ~~Création du WindowManager une seule fois~~		/* === External OOUI Dialog Widget === */
	if (typeof window.~~externalWM~~ === 'undefined') {
	window.~~externalWM~~ = new OO.ui.WindowManager();		if (typeof window.myExternalWM === 'undefined') {
	$(~~document.~~body).append(window.~~externalWM~~.$element);		window.myExternalWM = new OO.ui.WindowManager();
			$( 'body' ).append( window.myExternalWM.$element );
	}		}

	function ExternalIframeDialog(config) {		function ExternalIframeDialog( config ) {
	ExternalIframeDialog.super.call(this, config);		ExternalIframeDialog.super.call( this, config );
	}		}
	OO.inheritClass(ExternalIframeDialog, OO.ui.Dialog);		OO.inheritClass( ExternalIframeDialog, OO.ui.Dialog );

			ExternalIframeDialog.static.name = 'externalIframeDialog';

	~~ExternalIframeDialog.static.name = 'externalIframe';~~
	ExternalIframeDialog.prototype.initialize = function () {		ExternalIframeDialog.prototype.initialize = function () {
	ExternalIframeDialog.super.prototype.initialize.call(this);		ExternalIframeDialog.super.prototype.initialize.call( this );

	this.iframe = $('<iframe>')		this.iframe = $( '<iframe>' )
	.attr({		.attr( 'frameborder', '0' )
	frameborder: 0,		.attr( 'allowfullscreen', '' )
	allowfullscreen~~: true~~		.css( { width: '100%', height: '100%', border: 'none' } );
	})
	.css({ width: '100%', height: '100%', border: 'none' });

	this.$body.append(this.iframe);		this.$body.append( this.iframe );
	};		};

Ligne 31 :		Ligne 31 :
	};		};

	// Fonction globale ~~d'ouverture (plus fiable)~~		// Fonction globale à appeler depuis la page
	window.~~openExternalOOUIDialog~~ = function (url, title = 'Page externe', ~~width~~ = 1100, ~~height~~ = 750) {		window.openExtDialog = function ( url, title = 'Page externe', w = 1100, h = 750 ) {
	~~const~~ dialog = new ExternalIframeDialog({		var dialog = new ExternalIframeDialog( { size: 'large' } );
	size: 'large'
	});		dialog.setTitle( title );
			dialog.iframe.attr( 'src', url );
	dialog.iframe.attr('src', url);
	~~dialog.setTitle(title~~);

	window.~~externalWM~~.addWindows([dialog]);		window.myExternalWM.addWindows( [ dialog ] );
	window.~~externalWM~~.openWindow(dialog, {		window.myExternalWM.openWindow( dialog, { width: w, height: h } );
	width: ~~width~~,
	height: ~~height~~
	});

	// Rendre la fenêtre déplaçable		// Rendre la fenêtre déplaçable
	setTimeout(() => {		setTimeout( function() {
	dialog.$element.draggable({		dialog.$element.draggable({
	handle: '.oo-ui-window-head',		handle: '.oo-ui-window-head',
	containment: 'window'		containment: 'window'
	});		});
	}, ~~300~~);		}, 400 );
	};		};
	</script>		</script>

	<style>		<style>
	~~.oo-ui-windowManager-modal~~ .oo-ui-window-frame {		.oo-ui-window-frame {
	background~~-color~~: rgba(255, 255, 255, 0.96) !important;		background: rgba(255, 255, 255, 0.97) !important;
	border-radius: 8px;		border-radius: 8px;
	~~box-shadow: 0 8px 25px rgba(0,0,0,0.5);~~
	}		}
	.oo-ui-windowManager-overlay {		.oo-ui-windowManager-overlay {
	background~~-color~~: rgba(0, 0, 0, 0.65) !important;		background: rgba(0, 0, 0, 0.7) !important;
	}		}
	</style>		</style>

Aide:Bac à sable

2026-05-01T13:04:34Z

@@ Ligne 11 : / Ligne 11 : @@
 </div>
-{{#widget:Iframe
+<HTML>
-<a href="#" onclick="openExternalDialog('https://stock.encyclopedie-afn.org/orient.html', 'Orientation Sites PN', 700, 450); return false;">Lire orientation</a>
+{{#Widget:ExternalDialog}}
+<button onclick="ExternalDialog(
+     'http://stock.encyclopedie-afn.org/orient.html',
      'Mon Application',
 ,     /* largeur en pixels */
@@ Ligne 34 : / Ligne 25 : @@
      Ouvrir dans une fenêtre déplaçable
 </button>

Widget:ExternalDialog

2026-05-01T09:36:22Z

← Version précédente		Version du 1 mai 2026 à 11:36
Ligne 2 :		Ligne 2 :

	<script>		<script>
	// Création du ~~gestionnaire de fenêtres OOUI (~~une seule fois)		// Création du WindowManager une seule fois
	if (!window.~~externalWindowManager~~) {		if (typeof window.externalWM === 'undefined') {
	window.~~externalWindowManager~~ = new OO.ui.WindowManager();		window.externalWM = new OO.ui.WindowManager();
	$(document.body).append(window.~~externalWindowManager~~.$element);		$(document.body).append(window.externalWM.$element);
	}		}

	~~// Classe du Dialog personnalisé~~
	function ExternalIframeDialog(config) {		function ExternalIframeDialog(config) {
	ExternalIframeDialog.super.call(this, config);		ExternalIframeDialog.super.call(this, config);
Ligne 14 :		Ligne 13 :
	OO.inheritClass(ExternalIframeDialog, OO.ui.Dialog);		OO.inheritClass(ExternalIframeDialog, OO.ui.Dialog);

	ExternalIframeDialog.static.name = '~~externalIframeDialog~~';		ExternalIframeDialog.static.name = 'externalIframe';
	~~ExternalIframeDialog.static.title = 'Chargement...'; // sera mis à jour dynamiquement~~
	~~ExternalIframeDialog.static.size = 'large'; // taille par défaut (small/medium/large)~~

	ExternalIframeDialog.prototype.initialize = function () {		ExternalIframeDialog.prototype.initialize = function () {
	ExternalIframeDialog.super.prototype.initialize.call(this);		ExternalIframeDialog.super.prototype.initialize.call(this);

	~~this.$element.addClass('external-iframe-dialog');~~

	this.iframe = $('<iframe>')		this.iframe = $('<iframe>')
	.attr('frameborder', 0)		.attr({
	~~.attr('~~allowfullscreen', true)		frameborder: 0,
	.css({		allowfullscreen: true
	width: '100%',		})
	height: '100%',		.css({ width: '100%', height: '100%', border: 'none' });
	border: 'none'
	~~});~~

	~~this.panel = new OO.ui.PanelLayout({~~
	~~padded: false,~~
	~~expanded: true,~~
	~~scrollable: false~~
	});

	this~~.panel~~.$~~element~~.append(this.iframe);		this.$body.append(this.iframe);
	~~this.$body.append(this.panel.$element~~);
	};		};

	~~// Permet de définir la taille du contenu~~
	ExternalIframeDialog.prototype.getBodyHeight = function () {		ExternalIframeDialog.prototype.getBodyHeight = function () {
	return this.height \|\| ~~600~~; ~~// hauteur par défaut~~		return this.config.height \|\| 700;
	};		};

	// Fonction globale ~~pour ouvrir le dialog~~		// Fonction globale d'ouverture (plus fiable)
	window.~~openExternalDialog~~ = function (url, title = 'Page externe', width = ~~1000~~, height = ~~700~~) {		window.openExternalOOUIDialog = function (url, title = 'Page externe', width = 1100, height = 750) {
	const dialog = new ExternalIframeDialog({		const dialog = new ExternalIframeDialog({
	size: 'large' ~~// on gère la taille manuellement via CSS~~		size: 'large'
	});		});

	dialog.~~title = title;~~		dialog.iframe.attr('src', url);
	~~dialog.height = height;~~

	~~externalWindowManager~~.~~addWindows~~(~~[dialog]~~);

	~~// Mise à jour du titre~~
	dialog.setTitle(title);		dialog.setTitle(title);

	~~// Chargement de l'iframe~~		window.externalWM.addWindows([dialog]);
	~~dialog~~.~~iframe~~.~~attr~~(~~'src', url~~);		window.externalWM.openWindow(dialog, {

	~~// Ouverture avec taille personnalisée~~
	~~externalWindowManager~~.openWindow(dialog, {
	width: width,		width: width,
	height: height		height: height
	});		});

	// Rendre ~~le dialog~~ déplaçable ~~(draggable)~~		// Rendre la fenêtre déplaçable
	setTimeout(() => {		setTimeout(() => {
	dialog.$element.draggable({		dialog.$element.draggable({
	handle: '.oo-ui-window-head', ~~// barre de titre~~		handle: '.oo-ui-window-head',
	containment: 'window'		containment: 'window'
	});		});
	}, ~~100~~);		}, 300);
	};		};
	</script>		</script>

	<style>		<style>
	~~/* Fond partiellement transparent */~~		.oo-ui-windowManager-modal .oo-ui-window-frame {
	.~~external~~-~~iframe~~-~~dialog~~ .oo-ui-window-frame {		background-color: rgba(255, 255, 255, 0.96) !important;
	background-color: rgba(255, 255, 255, 0.95) !important;
	border-radius: 8px;		border-radius: 8px;
	box-shadow: 0 ~~10px 30px~~ rgba(0, 0, 0, 0.4);		box-shadow: 0 8px 25px rgba(0,0,0,0.5);
	}		}
			.oo-ui-windowManager-overlay {
	~~/* Légère transparence sur le overlay */~~
	~~.oo-ui-windowManager-modal >~~ .oo-ui-windowManager-overlay {
	background-color: rgba(0, 0, 0, 0.65) !important;		background-color: rgba(0, 0, 0, 0.65) !important;
	}		}
	</style>		</style>

Aide:Bac à sable

2026-05-01T09:29:28Z

← Version précédente		Version du 1 mai 2026 à 11:29
(3 versions intermédiaires par le même utilisateur non affichées)
Ligne 18 :		Ligne 18 :
	}}		}}
	[[File:wiki.png]]		[[File:wiki.png]]



			<a href="#" onclick="openExternalDialog('https://stock.encyclopedie-afn.org/orient.html', 'Orientation Sites PN', 700, 450); return false;">Lire orientation</a>


			{{#widget:ExternalDialog}}

			<button onclick="openExternalDialog(
			'https://stock.encyclopedie-afn.org/orient.html',
			'Mon Application',
			600, /* largeur en pixels */
			450 /* hauteur en pixels */
			);">
			Ouvrir dans une fenêtre déplaçable
			</button>

Widget:ExternalDialog

2026-05-01T09:19:09Z

Page créée avec «  <script> // Création du gestionnaire de fenêtres OOUI (une seule fois) if (!window.externalWindowManager) { window.externalWindowManager = new OO.ui.WindowManager(); $(document.body).append(window.externalWindowManager.$element); } // Classe du Dialog personnalisé function ExternalIframeDialog(config) { ExternalIframeDialog.super.call(this, config); } OO.inheritClass(ExternalIframeDialog, OO.ui.Dialog); ExternalIframe... »

Nouvelle page

<script>
// Création du gestionnaire de fenêtres OOUI (une seule fois)
if (!window.externalWindowManager) {
window.externalWindowManager = new OO.ui.WindowManager();
$(document.body).append(window.externalWindowManager.$element);
}

// Classe du Dialog personnalisé
function ExternalIframeDialog(config) {
ExternalIframeDialog.super.call(this, config);
}
OO.inheritClass(ExternalIframeDialog, OO.ui.Dialog);

ExternalIframeDialog.static.name = 'externalIframeDialog';
ExternalIframeDialog.static.title = 'Chargement...'; // sera mis à jour dynamiquement
ExternalIframeDialog.static.size = 'large'; // taille par défaut (small/medium/large)

ExternalIframeDialog.prototype.initialize = function () {
ExternalIframeDialog.super.prototype.initialize.call(this);

this.$element.addClass('external-iframe-dialog');

this.iframe = $('<iframe>')
.attr('frameborder', 0)
.attr('allowfullscreen', true)
.css({
width: '100%',
height: '100%',
border: 'none'
});

this.panel = new OO.ui.PanelLayout({
padded: false,
expanded: true,
scrollable: false
});

this.panel.$element.append(this.iframe);
this.$body.append(this.panel.$element);
};

// Permet de définir la taille du contenu
ExternalIframeDialog.prototype.getBodyHeight = function () {
return this.height || 600; // hauteur par défaut
};

// Fonction globale pour ouvrir le dialog
window.openExternalDialog = function (url, title = 'Page externe', width = 1000, height = 700) {
const dialog = new ExternalIframeDialog({
size: 'large' // on gère la taille manuellement via CSS
});

dialog.title = title;
dialog.height = height;

externalWindowManager.addWindows([dialog]);

// Mise à jour du titre
dialog.setTitle(title);

// Chargement de l'iframe
dialog.iframe.attr('src', url);

// Ouverture avec taille personnalisée
externalWindowManager.openWindow(dialog, {
width: width,
height: height
});

// Rendre le dialog déplaçable (draggable)
setTimeout(() => {
dialog.$element.draggable({
handle: '.oo-ui-window-head', // barre de titre
containment: 'window'
});
}, 100);
};
</script>

<style>
/* Fond partiellement transparent */
.external-iframe-dialog .oo-ui-window-frame {
background-color: rgba(255, 255, 255, 0.95) !important;
border-radius: 8px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

/* Légère transparence sur le overlay */
.oo-ui-windowManager-modal > .oo-ui-windowManager-overlay {
background-color: rgba(0, 0, 0, 0.65) !important;
}
</style>