MediaWiki:Common.js: Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
K (Die Seite wurde geleert.) |
K |
||
Zeile 1: | Zeile 1: | ||
+ | /*** POPUPS ***/ | ||
+ | // Altes speichern und neue Elemente gestalten | ||
+ | var bilder = [[]]; | ||
+ | function getThumbs() { | ||
+ | var a=0; | ||
+ | for (i=0;i<document.getElementsByTagName('img').length;i++) { | ||
+ | if (document.getElementsByTagName('img')[i].src.indexOf('thumb')!=-1) { | ||
+ | var thumb = document.getElementsByTagName('img')[i]; | ||
+ | var bildSrc = thumb.src.replace(/thumb\//, ''); | ||
+ | bildSrc = bildSrc.slice(0,(bildSrc.indexOf(bildSrc.split('/')[bildSrc.split('/').length-1]))-1); | ||
+ | var bildname = bildSrc.split('/')[bildSrc.split('/').length-1]; | ||
+ | var namensgeber=document.getElementById('pp_'+bildname)||document.getElementById('pp_'+bildname.toLowerCase())||false; | ||
+ | |||
+ | bilder[0][a] = new Image; | ||
+ | bilder[0][a].src = bildSrc; | ||
+ | bilder[0][a].text = namensgeber? namensgeber.innerHTML : ''; | ||
+ | |||
+ | if (thumb.parentNode.tagName=='A') { | ||
+ | var bildlink = '<a href="'+thumb.parentNode.href+'">[Bildseite]</a> '; | ||
+ | if (sysopRights) | ||
+ | bildlink += '<a href="'+thumb.parentNode.href.replace(/an\//,"w/index.php?title=")+'&action=edit">[bearbeiten]</a> '; | ||
+ | bilder[0][a].text += '<p class="editsection">' + bildlink + '</p>'; | ||
+ | thumb.parentNode.href= "javascript:pp_open("+a+",0)"; | ||
+ | thumb.parentNode.title="Popup öffnen"; | ||
+ | } | ||
+ | a++; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | body_width = document.body.offsetWidth; | ||
+ | body_height = document.body.offsetHeight; | ||
+ | screen_height = window.innerHeight || document.documentElement.offsetHeight; | ||
+ | screen_width = window.innerWidth-15 || document.documentElement.offsetWidth-15; | ||
+ | |||
+ | writeImgDiv(); | ||
+ | } | ||
+ | |||
+ | //Pfeiltasten | ||
+ | var usePfeil = 0; | ||
+ | |||
+ | function writeImgDiv() { | ||
+ | ppImgScreen = document.body.appendChild(document.createElement('div')); | ||
+ | ppImgScreen.id = "ppScreen"; ppImgScreen.style.display = "none"; | ||
+ | ppImgDiv = document.body.appendChild(document.createElement('div')); | ||
+ | ppImgDiv.id = "ppImgDiv"; | ||
+ | ppImgDiv.style.display = "none"; | ||
+ | ppImg = ppImgDiv.appendChild(document.createElement('div')).appendChild(document.createElement('img')); | ||
+ | ppImgTop = ppImgDiv.appendChild(document.createElement('div')); | ||
+ | ppImgInfo = ppImgDiv.appendChild(document.createElement('div')); | ||
+ | ppImgInfo.className = "ppFloat"; | ||
+ | ppImgClick = ppImgDiv.appendChild(document.createElement('div')); | ||
+ | ppImgClick.className = "ppClick"; | ||
+ | |||
+ | ppImgScreen.onclick = | ||
+ | ppImgInfo.onclick = hideDiv; | ||
+ | } | ||
+ | |||
+ | function pp_open(indexB, arrayB) { | ||
+ | //welcher Bilderarray? | ||
+ | var aIndex = arrayB || 0; | ||
+ | var auswahl = bilder[aIndex]; | ||
+ | //welches Bild? | ||
+ | var x = indexB || 0; | ||
+ | |||
+ | //Scrollposition ermitteln | ||
+ | var scrY = document.documentElement.scrollTop || // Explorer 6 Strict | ||
+ | document.body.scrollTop || //all other Explorers | ||
+ | self.pageYOffset || | ||
+ | 0; | ||
+ | |||
+ | with (ppImgScreen.style) { | ||
+ | width = document.body.offsetWidth+"px"; | ||
+ | height = document.body.offsetHeight+"px"; | ||
+ | display = "block"; | ||
+ | } | ||
+ | //Anpassen an Fenster | ||
+ | if (auswahl[x].height>(screen_height)) { | ||
+ | auswahl[x].width=auswahl[x].width/auswahl[x].height*screen_height; | ||
+ | auswahl[x].height=screen_height; | ||
+ | } | ||
+ | if (auswahl[x].width>(screen_width)) { | ||
+ | auswahl[x].height=auswahl[x].height/auswahl[x].width*screen_width; | ||
+ | auswahl[x].width=screen_width; | ||
+ | } | ||
+ | // | ||
+ | var ppH = auswahl[x].height+28, // Maße für das Schriftfenster (ppImgInfo) | ||
+ | ppW = auswahl[x].width+10, | ||
+ | ppBoTop = ((ppH+10) < screen_height) ? //wenn Bildübergröße | ||
+ | 0 : ((ppH+10)-screen_height)/2 +"px"; | ||
+ | |||
+ | //Bild gestalten | ||
+ | ppImg.src = auswahl[x].src; | ||
+ | ppImg.height= auswahl[x].height; | ||
+ | ppImg.width= auswahl[x].width; | ||
+ | ppImgInfo.innerHTML=auswahl[x].text; //Begleittext... | ||
+ | |||
+ | with (ppImgInfo.style) { | ||
+ | if ( (ppW+300)<body_width) { | ||
+ | left = ppW+"px"; top = ppBoTop; width = (body_width-ppW-64)/2+"px";} | ||
+ | else { | ||
+ | left = (auswahl[x].width/2-10)+"px"; top = ppH+"px"; width = (body_width/2-32)+"px"; | ||
+ | } | ||
+ | } | ||
+ | ppImgTop.innerHTML="Bild "+(x+1)+"/"+auswahl.length; | ||
+ | ppImgTop.id="ppIndex"; | ||
+ | ppImgClick.style.width=450+"px"; | ||
+ | ppImgClick.style.left=ppW-543+"px"; | ||
+ | |||
+ | if (auswahl.length>1) {// mehr als ein bild | ||
+ | bck=ppImgTop.insertBefore(document.createElement('a'), ppImgTop.firstChild); | ||
+ | nxt=ppImgTop.appendChild(document.createElement('a')); | ||
+ | bck.id="bck1"; | ||
+ | nxt.id="nxt1"; | ||
+ | ppH=auswahl[x].height+28; | ||
+ | ppW=(auswahl[x].width+10)/2; | ||
+ | with (bck.style) { left=0; height=ppH+"px"; width=ppW+"px"; } | ||
+ | with (nxt.style){ left=ppW+"px"; height=ppH+"px"; width=ppW+"px"; } | ||
+ | //neues Bild aufrufen | ||
+ | vor=(x+1<auswahl.length)? x+1:0; | ||
+ | zur=(x-1>-1)? x-1:auswahl.length-1; | ||
+ | nxt.href="javascript:pp_open("+vor+","+aIndex+")"; | ||
+ | bck.href="javascript:pp_open("+zur+","+aIndex+")"; | ||
+ | |||
+ | ppImgClick.innerHTML = "<span>Ins Bild klicken oder Pfeiltasten [←] [→] = Neues Bild! <br/>Sonst wo klicken oder [Esc] = Bild schließen!</span>" | ||
+ | |||
+ | ppImgClick.onclick = | ||
+ | ppImgScreen.onclick = | ||
+ | ppImgInfo.onclick = hideDiv; | ||
+ | |||
+ | } | ||
+ | else { | ||
+ | ppImgDiv.onclick=hideDiv; | ||
+ | ppImgClick.innerHTML = "<span>Beliebiger Klick oder [Esc] = Bild schließen!<br/> </span>"; | ||
+ | } | ||
+ | |||
+ | usePfeil=1; //Schalter für Pfeilfunktion | ||
+ | pfeil=function(e) { | ||
+ | e=e||event; | ||
+ | if (e.keyCode&&usePfeil&&(typeof(vor)!="undefined"||typeof(zur)!="undefined")) | ||
+ | if (e.keyCode==39||e.keyCode==102) pp_open(vor,aIndex); | ||
+ | else if (e.keyCode==37||e.keyCode==100) pp_open(zur,aIndex); | ||
+ | else if (e.keyCode==27) hideDiv(); | ||
+ | } | ||
+ | document.onkeydown = pfeil; | ||
+ | |||
+ | //ppImgDiv positionieren und zeigen | ||
+ | abstand_x = auswahl[x].width < document.body.clientWidth ? | ||
+ | (document.body.clientWidth - auswahl[x].width-10)/2 : 0; | ||
+ | abstand_y = scrY + (screen_height-auswahl[x].height)/3; | ||
+ | |||
+ | with (ppImgDiv.style) { | ||
+ | left = abstand_x+"px"; | ||
+ | top = abstand_y+"px"; | ||
+ | } | ||
+ | //Image Screen Größe (falls Bild größer als body) | ||
+ | var maxW = ((auswahl[x].width+12) > body_width) ? | ||
+ | (auswahl[x].width+12) : body_width; | ||
+ | with (ppImgScreen.style) { | ||
+ | width = maxW + "px"; | ||
+ | height = document.body.offsetHeight+"px"; | ||
+ | display = "block"; | ||
+ | } | ||
+ | ppImgDiv.style.display = "block"; | ||
+ | /* | ||
+ | function aaa(){newDiv.parentNode.removeChild(newDiv)} | ||
+ | window.setTimeout('aaa()', 500); | ||
+ | //Bild anzeigen | ||
+ | newDiv = document.body.appendChild(ppImgDiv.cloneNode(true)); | ||
+ | newDiv.style.display = "block"; */ | ||
+ | } | ||
+ | |||
+ | //popup-Div SCHLIESSEN | ||
+ | |||
+ | function hideDiv() { | ||
+ | ppImgScreen.style.display = | ||
+ | ppImgDiv.style.display = "none"; | ||
+ | usePfeil=0; //Pfeiltasten nicht mehr verwenden | ||
+ | } |
Version vom 4. Januar 2012, 15:40 Uhr
/*** POPUPS ***/
// Altes speichern und neue Elemente gestalten
var bilder = [[]];
function getThumbs() {
var a=0;
for (i=0;i<document.getElementsByTagName('img').length;i++) {
if (document.getElementsByTagName('img')[i].src.indexOf('thumb')!=-1) {
var thumb = document.getElementsByTagName('img')[i];
var bildSrc = thumb.src.replace(/thumb\//, '');
bildSrc = bildSrc.slice(0,(bildSrc.indexOf(bildSrc.split('/')[bildSrc.split('/').length-1]))-1);
var bildname = bildSrc.split('/')[bildSrc.split('/').length-1];
var namensgeber=document.getElementById('pp_'+bildname)||document.getElementById('pp_'+bildname.toLowerCase())||false;
bilder[0][a] = new Image;
bilder[0][a].src = bildSrc;
bilder[0][a].text = namensgeber? namensgeber.innerHTML : '';
if (thumb.parentNode.tagName=='A') {
var bildlink = '<a href="'+thumb.parentNode.href+'">[Bildseite]</a> ';
if (sysopRights)
bildlink += '<a href="'+thumb.parentNode.href.replace(/an\//,"w/index.php?title=")+'&action=edit">[bearbeiten]</a> ';
bilder[0][a].text += '<p class="editsection">' + bildlink + '</p>';
thumb.parentNode.href= "javascript:pp_open("+a+",0)";
thumb.parentNode.title="Popup öffnen";
}
a++;
}
}
body_width = document.body.offsetWidth;
body_height = document.body.offsetHeight;
screen_height = window.innerHeight || document.documentElement.offsetHeight;
screen_width = window.innerWidth-15 || document.documentElement.offsetWidth-15;
writeImgDiv();
}
//Pfeiltasten
var usePfeil = 0;
function writeImgDiv() {
ppImgScreen = document.body.appendChild(document.createElement('div'));
ppImgScreen.id = "ppScreen"; ppImgScreen.style.display = "none";
ppImgDiv = document.body.appendChild(document.createElement('div'));
ppImgDiv.id = "ppImgDiv";
ppImgDiv.style.display = "none";
ppImg = ppImgDiv.appendChild(document.createElement('div')).appendChild(document.createElement('img'));
ppImgTop = ppImgDiv.appendChild(document.createElement('div'));
ppImgInfo = ppImgDiv.appendChild(document.createElement('div'));
ppImgInfo.className = "ppFloat";
ppImgClick = ppImgDiv.appendChild(document.createElement('div'));
ppImgClick.className = "ppClick";
ppImgScreen.onclick =
ppImgInfo.onclick = hideDiv;
}
function pp_open(indexB, arrayB) {
//welcher Bilderarray?
var aIndex = arrayB || 0;
var auswahl = bilder[aIndex];
//welches Bild?
var x = indexB || 0;
//Scrollposition ermitteln
var scrY = document.documentElement.scrollTop || // Explorer 6 Strict
document.body.scrollTop || //all other Explorers
self.pageYOffset ||
0;
with (ppImgScreen.style) {
width = document.body.offsetWidth+"px";
height = document.body.offsetHeight+"px";
display = "block";
}
//Anpassen an Fenster
if (auswahl[x].height>(screen_height)) {
auswahl[x].width=auswahl[x].width/auswahl[x].height*screen_height;
auswahl[x].height=screen_height;
}
if (auswahl[x].width>(screen_width)) {
auswahl[x].height=auswahl[x].height/auswahl[x].width*screen_width;
auswahl[x].width=screen_width;
}
//
var ppH = auswahl[x].height+28, // Maße für das Schriftfenster (ppImgInfo)
ppW = auswahl[x].width+10,
ppBoTop = ((ppH+10) < screen_height) ? //wenn Bildübergröße
0 : ((ppH+10)-screen_height)/2 +"px";
//Bild gestalten
ppImg.src = auswahl[x].src;
ppImg.height= auswahl[x].height;
ppImg.width= auswahl[x].width;
ppImgInfo.innerHTML=auswahl[x].text; //Begleittext...
with (ppImgInfo.style) {
if ( (ppW+300)<body_width) {
left = ppW+"px"; top = ppBoTop; width = (body_width-ppW-64)/2+"px";}
else {
left = (auswahl[x].width/2-10)+"px"; top = ppH+"px"; width = (body_width/2-32)+"px";
}
}
ppImgTop.innerHTML="Bild "+(x+1)+"/"+auswahl.length;
ppImgTop.id="ppIndex";
ppImgClick.style.width=450+"px";
ppImgClick.style.left=ppW-543+"px";
if (auswahl.length>1) {// mehr als ein bild
bck=ppImgTop.insertBefore(document.createElement('a'), ppImgTop.firstChild);
nxt=ppImgTop.appendChild(document.createElement('a'));
bck.id="bck1";
nxt.id="nxt1";
ppH=auswahl[x].height+28;
ppW=(auswahl[x].width+10)/2;
with (bck.style) { left=0; height=ppH+"px"; width=ppW+"px"; }
with (nxt.style){ left=ppW+"px"; height=ppH+"px"; width=ppW+"px"; }
//neues Bild aufrufen
vor=(x+1<auswahl.length)? x+1:0;
zur=(x-1>-1)? x-1:auswahl.length-1;
nxt.href="javascript:pp_open("+vor+","+aIndex+")";
bck.href="javascript:pp_open("+zur+","+aIndex+")";
ppImgClick.innerHTML = "<span>Ins Bild klicken oder Pfeiltasten [←] [→] = Neues Bild! <br/>Sonst wo klicken oder [Esc] = Bild schließen!</span>"
ppImgClick.onclick =
ppImgScreen.onclick =
ppImgInfo.onclick = hideDiv;
}
else {
ppImgDiv.onclick=hideDiv;
ppImgClick.innerHTML = "<span>Beliebiger Klick oder [Esc] = Bild schließen!<br/> </span>";
}
usePfeil=1; //Schalter für Pfeilfunktion
pfeil=function(e) {
e=e||event;
if (e.keyCode&&usePfeil&&(typeof(vor)!="undefined"||typeof(zur)!="undefined"))
if (e.keyCode==39||e.keyCode==102) pp_open(vor,aIndex);
else if (e.keyCode==37||e.keyCode==100) pp_open(zur,aIndex);
else if (e.keyCode==27) hideDiv();
}
document.onkeydown = pfeil;
//ppImgDiv positionieren und zeigen
abstand_x = auswahl[x].width < document.body.clientWidth ?
(document.body.clientWidth - auswahl[x].width-10)/2 : 0;
abstand_y = scrY + (screen_height-auswahl[x].height)/3;
with (ppImgDiv.style) {
left = abstand_x+"px";
top = abstand_y+"px";
}
//Image Screen Größe (falls Bild größer als body)
var maxW = ((auswahl[x].width+12) > body_width) ?
(auswahl[x].width+12) : body_width;
with (ppImgScreen.style) {
width = maxW + "px";
height = document.body.offsetHeight+"px";
display = "block";
}
ppImgDiv.style.display = "block";
/*
function aaa(){newDiv.parentNode.removeChild(newDiv)}
window.setTimeout('aaa()', 500);
//Bild anzeigen
newDiv = document.body.appendChild(ppImgDiv.cloneNode(true));
newDiv.style.display = "block"; */
}
//popup-Div SCHLIESSEN
function hideDiv() {
ppImgScreen.style.display =
ppImgDiv.style.display = "none";
usePfeil=0; //Pfeiltasten nicht mehr verwenden
}