MediaWiki:Common.js : Différence entre versions
(test multislides) |
m |
||
Ligne 23 : | Ligne 23 : | ||
function init() { | function init() { | ||
− | parents = document.getElementsByClassName(' | + | parents = document.getElementsByClassName('slideshow-container'); |
for (j = 0; j < parents.length; j++) { | for (j = 0; j < parents.length; j++) { | ||
− | var slides = parents[j].getElementsByClassName(" | + | var slides = parents[j].getElementsByClassName("mySlides"); |
var dots = parents[j].getElementsByClassName("dot"); | var dots = parents[j].getElementsByClassName("dot"); | ||
slides[0].classList.add('active-slide'); | slides[0].classList.add('active-slide'); | ||
Ligne 39 : | Ligne 39 : | ||
dots[i].onclick = function() { | dots[i].onclick = function() { | ||
− | slides = this.parentNode.parentNode.getElementsByClassName(" | + | slides = this.parentNode.parentNode.getElementsByClassName("mySlides"); |
for (j = 0; j < this.parentNode.children.length; j++) { | for (j = 0; j < this.parentNode.children.length; j++) { | ||
Ligne 54 : | Ligne 54 : | ||
} | } | ||
//prev/next functionality | //prev/next functionality | ||
− | links = document.querySelectorAll('. | + | links = document.querySelectorAll('.slideshow-container a'); |
for (i = 0; i < links.length; i++) { | for (i = 0; i < links.length; i++) { | ||
Ligne 60 : | Ligne 60 : | ||
current = this.parentNode; | current = this.parentNode; | ||
− | var slides = current.getElementsByClassName(" | + | var slides = current.getElementsByClassName("mySlides"); |
var dots = current.getElementsByClassName("dot"); | var dots = current.getElementsByClassName("dot"); | ||
curr_slide = current.getElementsByClassName('active-slide')[0]; | curr_slide = current.getElementsByClassName('active-slide')[0]; | ||
Ligne 66 : | Ligne 66 : | ||
curr_slide.classList.remove('active-slide'); | curr_slide.classList.remove('active-slide'); | ||
curr_dot.classList.remove('active'); | curr_dot.classList.remove('active'); | ||
− | if (this.className == ' | + | if (this.className == 'next') { |
− | if (curr_slide.nextElementSibling.classList.contains(' | + | if (curr_slide.nextElementSibling.classList.contains('mySlides')) { |
curr_slide.nextElementSibling.classList.add('active-slide'); | curr_slide.nextElementSibling.classList.add('active-slide'); | ||
curr_dot.nextElementSibling.classList.add('active'); | curr_dot.nextElementSibling.classList.add('active'); | ||
Ligne 78 : | Ligne 78 : | ||
} | } | ||
− | if (this.className == ' | + | if (this.className == 'prev') { |
if (curr_slide.previousElementSibling) { | if (curr_slide.previousElementSibling) { |
Version du 24 janvier 2019 à 23:13
/* Tout JavaScript ici sera chargé avec chaque page accédée par n’importe quel utilisateur. */
/* For a responsive Wiki we need to add the viewport meta tag to the head of the page */
var viewPortTag=document.createElement('meta');
viewPortTag.id="viewport";
viewPortTag.name = "viewport";
/* user-scalable=no forbid to users to zoom in and out to the page, and only scroll it. */
viewPortTag.content = "width=device-width; initial-scale=1.0; user-scalable=yes";
document.getElementsByTagName('head')[0].appendChild(viewPortTag);
var theme=document.createElement('meta');
theme.id="theme";
theme.name="theme-color";
theme.content="#1f0e02";
/* Slideshow pour faire défiler les images, c'est du JS pompé sur le wiki italien */
(function() {
init(); //on page load - show first slide, hidethe rest
function init() {
parents = document.getElementsByClassName('slideshow-container');
for (j = 0; j < parents.length; j++) {
var slides = parents[j].getElementsByClassName("mySlides");
var dots = parents[j].getElementsByClassName("dot");
slides[0].classList.add('active-slide');
dots[0].classList.add('active');
}
}
dots = document.getElementsByClassName('dot'); //dots functionality
for (i = 0; i < dots.length; i++) {
dots[i].onclick = function() {
slides = this.parentNode.parentNode.getElementsByClassName("mySlides");
for (j = 0; j < this.parentNode.children.length; j++) {
this.parentNode.children[j].classList.remove('active');
slides[j].classList.remove('active-slide');
if (this.parentNode.children[j] == this) {
index = j;
}
}
this.classList.add('active');
slides[index].classList.add('active-slide');
}
}
//prev/next functionality
links = document.querySelectorAll('.slideshow-container a');
for (i = 0; i < links.length; i++) {
links[i].onclick = function() {
current = this.parentNode;
var slides = current.getElementsByClassName("mySlides");
var dots = current.getElementsByClassName("dot");
curr_slide = current.getElementsByClassName('active-slide')[0];
curr_dot = current.getElementsByClassName('active')[0];
curr_slide.classList.remove('active-slide');
curr_dot.classList.remove('active');
if (this.className == 'next') {
if (curr_slide.nextElementSibling.classList.contains('mySlides')) {
curr_slide.nextElementSibling.classList.add('active-slide');
curr_dot.nextElementSibling.classList.add('active');
} else {
slides[0].classList.add('active-slide');
dots[0].classList.add('active');
}
}
if (this.className == 'prev') {
if (curr_slide.previousElementSibling) {
curr_slide.previousElementSibling.classList.add('active-slide');
curr_dot.previousElementSibling.classList.add('active');
} else {
slides[slides.length - 1].classList.add('active-slide');
dots[slides.length - 1].classList.add('active');
}
}
}
}
})();
/*
* rwdImageMaps jQuery plugin v1.6
*
* Allows image maps to be used in a responsive design by recalculating the area coordinates to match the actual image size on load and window.resize
*
* Copyright (c) 2016 Matt Stow
* https://github.com/stowball/jQuery-rwdImageMaps
* http://mattstow.com
* Licensed under the MIT license
*/
;(function($) {
$.fn.rwdImageMaps = function() {
var $img = this;
var rwdImageMap = function() {
$img.each(function() {
if (typeof($(this).attr('usemap')) == 'undefined')
return;
var that = this,
$that = $(that);
// Since WebKit doesn't know the height until after the image has loaded, perform everything in an onload copy
$('<img />').on('load', function() {
var attrW = 'width',
attrH = 'height',
w = $that.attr(attrW),
h = $that.attr(attrH);
if (!w || !h) {
var temp = new Image();
temp.src = $that.attr('src');
if (!w)
w = temp.width;
if (!h)
h = temp.height;
}
var wPercent = $that.width()/100,
hPercent = $that.height()/100,
map = $that.attr('usemap').replace('#', ''),
c = 'coords';
$('map[name="' + map + '"]').find('area').each(function() {
var $this = $(this);
if (!$this.data(c))
$this.data(c, $this.attr(c));
var coords = $this.data(c).split(','),
coordsPercent = new Array(coords.length);
for (var i = 0; i < coordsPercent.length; ++i) {
if (i % 2 === 0)
coordsPercent[i] = parseInt(((coords[i]/w)*100)*wPercent);
else
coordsPercent[i] = parseInt(((coords[i]/h)*100)*hPercent);
}
$this.attr(c, coordsPercent.toString());
});
}).attr('src', $that.attr('src'));
});
};
$(window).resize(rwdImageMap).trigger('resize');
return this;
};
})(jQuery);
$(document).ready(function(e) {
$('img[usemap]').rwdImageMaps();
});
// Modal windows in javascript
$(".trigger").on("click", function() {
var modal = $(this).data("modal");
$(modal).toggle();
});
$(".modal").on("click", function(e) {
var className = e.target.className;
if(className === "modal" || className === "close-button"){
$(this).closest(".modal").toggle();
}
});
/* Pour le bas de page */
$('div#content').append( "<div class='content-footer'></div>" );
/* Pour les cookies */
(function () {
var req = new XMLHttpRequest();
req.addEventListener('load', function (ev) {
if (this.status >= 200 && this.status < 300) {
var data = JSON.parse(this.responseText);
if (data.hasOwnProperty('version')) {
var gdpr = document.createElement("script");
gdpr.src = "https://s3-static.geo.gfsrv.net/cookiebanner/" + data.version + "/cookie.min.js";
document.head.appendChild(gdpr);
}
}
});
req.open('GET', "https://s3-static.geo.gfsrv.net/cookiebanner/version.json");
req.send();
})();