MediaWiki:Skin/Spezial:Hochladen.js: Unterschied zwischen den Versionen

aus Kamelopedia, der wüsten Enzyklopädie
Zur Navigation springen Zur Suche springen
K
 
(105 dazwischenliegende Versionen von 3 Benutzern werden nicht angezeigt)
Zeile 1: Zeile 1:
 +
function einaus2 (inhalt, einblenden, ausblenden) {
 +
    var thisLevel  = document.getElementById(inhalt);
 +
    var otherLevel = document.getElementById(einblenden);
 +
    var linkLevel  = document.getElementById(ausblenden);
 +
    if (thisLevel.style.display == 'none') {
 +
        thisLevel.style.display = 'block';
 +
        otherLevel.style.display = 'none';
 +
        linkLevel.style.display = 'block';
 +
    } else {
 +
        thisLevel.style.display = 'none';
 +
        otherLevel.style.display = 'block';
 +
        linkLevel.style.display = 'none';
 +
    }
 +
  }
 
/* === Hochlade-Seite === */
 
/* === Hochlade-Seite === */
  
/* Konfiguration */
+
var box; // Globale Variable
 +
var BGcolor = [ "red", "green", "gray" ];
 +
/*
 +
* generieren der Datenstruktur aus DPL-Ergebnissen - #1: AJAX-Request
 +
*/
 +
var imgklick = new Array();
 +
 
 +
function mk_ajax()
 +
{
 +
 
 +
jQuery.ajax( {
 +
url: wgScript,
 +
context: document.body,
 +
dataType: "text",
 +
data: 'title=Kamelopedia:Bildsuche/Klick-Tpl&action=raw&templates=expand',
 +
success: function( data, textStatus ) { gen_imgklick( data ); mkALL(); }
 +
} );
 +
}
 +
jQuery(document).ready(function() {
 +
 
 +
if (window.location.href.indexOf("wpForReUpload=1") == -1){  //nicht beim Re-Upload
 +
      mk_ajax(); 
 +
  } else {
 +
  out = "<p style='padding: 20px; font-weight: bold;'>Geänderten Lizenz-Kram bitte nach dem Hochladen der neuen Version durch Bearbeiten der Datei-Seite anpassen.</p>";
 +
  jQuery('#klicktag').html(out);
 +
    }
 +
});
  
 
/*
 
/*
  * das imgklick-Objekt:
+
  * generieren der Datenstruktur aus DPL-Ergebnissen - #2: Parser
* hier wird festgelegt, welche Einfügeboxen erzeugt werden, welche Auswahlmöglichkeiten es gibt, welche
 
* Optionen, usw. Es wird auch festgelegt, welche Daten beim Hinzufügen ins Feld eingefügt werden.
 
*
 
* Erklärung:
 
* var imgklick =
 
* [
 
* { genau 1 Element pro Auswahlfeld
 
* name: String, der als Titel angezeigt wird, z.B. "Bildtechnik" oder "Lizenzen"
 
*              arg: String, der Argumentname benutzt wird z.B. "Technik" wird dann zu "|Technik=",
 
* prefix: String, Teil des Namens der Vorlage vor dem Schrägstrich, z.B. "Bildquelle",
 
* opts: Array für die Auswahlmöglichkeiten
 
* [
 
* { genau 1 Element pro Auswahlmöglichkeit
 
* info: String, Beschreibungstext des Auswahlfeldes,
 
* vorlage: String, Teil des Namens der Vorlage nach dem Schrägstrich, z.B. "Wiki",
 
* args: Array für die zusätzlichen Optionen
 
* [
 
* { genau 1 Element pro Option
 
* arg: String, Name des Arguments, z.B. "1" ( wird dann zu "{{...|1=...}}" ),
 
* type: String, "text" für Textbox, "textarea" für mehrere Zeilen,
 
* info: String, Beschreibungstext für die Option
 
* }
 
* ]
 
* }
 
* ]
 
* }
 
* ]
 
*
 
* Sieht leider recht kompliziert aus, einfach mal unten ansehen:
 
 
  */
 
  */
 +
function gen_imgklick( txt )
 +
{
  
var imgklick =  
+
        txt = txt.replace(/ *[|¦] */g, "|");
[
+
        txt = txt.replace(/[\n\r]+/g, "\n" );
{
 
name: "Quellen",
 
arg: "Quellen",
 
prefix: "Bildquelle",
 
opts:
 
[
 
{
 
name: "Kamelopedia",
 
info: "Das Bild stammt aus der Kamelopedia.",
 
vorlage: "Kamelo",
 
args:
 
[
 
{ arg: "1", type: "text", info: "Bildname:", pre: "Bild:" }
 
]
 
  
},
+
        /* Sicherheits-Feature: HTML-Tags weg (bis auf <br>) */
{
+
        txt = txt.replace(/[<]/g, "&lt;" );
name: "Wikipedia",
+
        txt = txt.replace(/[>]/g, "&gt;" );
info: "Das Bild stammt aus der Wikipedia.",
+
        txt = txt.replace( /&lt;br *\/? *&gt;/g, "<br/>" );
vorlage: "Wiki",
+
        lines = txt.split( "\n" );
args:
+
//alert(txt);
[
+
        for( i=0; i<lines.length; i++ )
{ arg: "1", type: "text", info: "Bildname:", pre: "Bild:" }
+
        {
]
+
                //zeile auslesen
 +
                type = lines[i].substring(0,1);
 +
                lines[i] = lines[i].substring(1);
 +
                elements = lines[i].split( "|" );
 +
               
 +
                if( type == ";" ) // Vorlage
 +
                {
 +
                if ( elements[4] == "no" ) // ignorieren-Flag gesetzt
 +
                        continue;
 +
                if ( elements[2] == "" )
 +
                        elements[2] = elements[1];
 +
                if ( ! imgklick[0] || imgklick[imgklick.length-1].name != elements[0] )
 +
                        imgklick.push( { name: elements[0], arg: elements[0], prefix:elements[0], opts: [ ] } );
 +
                imgklick[imgklick.length-1].opts.push( { name: elements[2], info: elements[3], vorlage: elements[1], args: [ ], selected: elements[4] } );
 +
                }
 +
                else if( type == "*" ) // Argument
 +
                {
 +
                opts = imgklick[imgklick.length-1].opts;
 +
                opts[opts.length-1].args.push( { arg: elements[0], type: elements[1], info: elements[2], pre: elements[3], options: elements.slice(4) } );
 +
                }
 +
        }
 +
}
  
},
+
/*
{
+
* Benutzer-Rückmeldungen:
name: "Stupidedia",
+
*/
info: "Das Bild stammt aus der Stupidedia.",
+
msg_OK =
vorlage: "Stupi",
+
[
args:
+
"In Ordnung.",
[
+
"Aber gerne.",
{ arg: "1", type: "text", info: "Bildname:", pre: "Bild:" }
+
"Bitteschön.",
]
+
"Klar doch!",
},
+
"Kein Problem.",
{
+
"Jawohl.",
name: "Scan",
+
"Gerne doch."
info: "Das wurde gescannt.",
+
];
vorlage: "Scan",
 
args:
 
[
 
{ arg: "1", type: "text", info: "Was hast du eingescannt:", pre: "" }
 
]
 
},
 
{
 
name: "Screenshot",
 
info: "Das wurde gescreenshottet.",
 
vorlage: "Screen",
 
args:
 
[
 
{ arg: "1", type: "text", info: "Wo? (Webseite oder Programm)", pre: "" }
 
]
 
},
 
{
 
name: "Selbst",
 
info: "Das Bild wurde komplett selbst erzeugt.",
 
vorlage: "Selbst",
 
args:
 
[ /* keine */ ]
 
},
 
{
 
name: "Unzureichend",
 
info: "Die Quellenangabe des Bildes ist unzureichend!",
 
vorlage: "Unzureichend",
 
args:
 
[
 
/* { arg: "1", type: "textarea", info: "Bitte begründe hier, warum die Quellenangabe unzureichend ist:", pre: "" } */
 
]
 
}
 
  
]
 
},
 
{
 
name: "Lizenz",
 
arg: "Lizenz",
 
prefix: "Bildlizenz",
 
opts:
 
[
 
{
 
name: "GNU FDL",
 
info: "Das Bild steht unter der GNU FDL (wie auch sonst hier alles).",
 
vorlage: "GNU_FDL",
 
args:
 
[ /* keine */ ]
 
},
 
{
 
name: "Public Domain",
 
info: "Das Bild ist gemeinfrei.",
 
vorlage: "PD",
 
args:
 
[ /* keine */ ]
 
},
 
{
 
name: "Creative Commons",
 
info: "Das Bild steht unter einer Kommunisten-Lizenz",
 
vorlage: "CCS1",
 
args:
 
[ /* keine */ ]
 
}
 
]
 
 
},
 
{
 
name: "Bildtechnik",
 
arg: "Technik",
 
prefix: "Bildtechnik",
 
opts:
 
[
 
{
 
name: "Unbekannt",
 
info: "Es wurde keine Bildtechnik angegeben.",
 
vorlage: "Unbekannt",
 
args: [ /* keine */ ]
 
},
 
{
 
name: "Animation",
 
info: "Das Bild wurde animiert.",
 
vorlage:"Animation",
 
args: [ /* keine */ ]
 
},
 
{
 
name: "Audio",
 
info: "Das Bild wurde vertont.",
 
vorlage:"Audio",
 
args: [ /* keine */ ]
 
},
 
{
 
name: "Grafik",
 
info: "Das Bild ist eine Grafik.",
 
vorlage:"Grafik",
 
args: [ /* keine */ ]
 
},
 
{
 
name: "Malerei",
 
info: "Das Bild wurde gemalt.",
 
vorlage:"Foto",
 
args: [ /* keine */ ]
 
},
 
{
 
name: "Mischtechnik",
 
info: "Das Bild ist eine Mischtechnik.",
 
vorlage:"Mix",
 
args: [ /* keine */ ]
 
},
 
{
 
name: "Foto",
 
info: "Das Bild wurde fotographiert",
 
vorlage:"Foto",
 
args: [ /* keine */ ]
 
},
 
{
 
name: "Sonstiges",
 
info: "",
 
vorlage: "Sonstige",
 
args:
 
[
 
{ arg: "Technik", type: "text", info: "Das Bild ist ein(e) ... ", pre: ""}
 
]
 
}
 
]
 
},
 
{
 
name: "Malware",
 
arg: "Malware",
 
prefix: "Malware",
 
opts:
 
[
 
{
 
name: "Keine",
 
info: "Es wurde keine Malware benutzt",
 
vorlage: "keine",
 
args: [ /* keine */ ]
 
},
 
{
 
name: "Gimp",
 
info: "Das Bild wurde gegimpt.",
 
vorlage: "Gimp",
 
args: [ /* keine */ ]
 
},
 
{
 
name: "Inkscape",
 
info: "Das Bild wurde geinkscapet.",
 
vorlage: "Inkscape",
 
args: [ /* keine */ ]
 
},
 
{
 
name: "Paint",
 
info: "Das Bild wurde gepaintet.",
 
vorlage: "Paint",
 
args: [ /* keine */ ]
 
},
 
{
 
name: "Sonstige",
 
info: "",
 
vorlage: "Sonstige",
 
args:
 
[
 
{ arg: "Malware", type: "text", info: "Das Bild wurde ...", pre: ""}
 
]
 
}
 
]
 
}
 
];
 
  
 
// name: Wie heißt die Grundvorlage?
 
// name: Wie heißt die Grundvorlage?
Zeile 252: Zeile 108:
 
// Welches Argument ("|xxxx=") soll für die Tags verwendet werden?
 
// Welches Argument ("|xxxx=") soll für die Tags verwendet werden?
 
tag_arg = "Motiv";
 
tag_arg = "Motiv";
 +
 +
// globales Prefix für Vorlagen (Grundvorlage ausgenommen)
 +
globalPrefix = "Bild/";
 +
// globaler Separator
 +
globalSep = ": ";
  
 
/* Programmablauf */
 
/* Programmablauf */
  
 +
/*
 +
* Den Nachrichtenzähler auf irgendwas setzen
 +
*/
 +
msg_OK_counter = Math.floor( Math.random() * msg_OK.length );
 +
 +
function add_msg( obj )
 +
{
 +
if( obj.innerHTML == msg_OK[msg_OK_counter] )
 +
msg_counter_up();
 +
//wirft Fehler im IE7 & 8
 +
  //obj.innerHTML = msg_OK[msg_OK_counter];
 +
  jqobj = obj;
 +
  jQuery(jqobj).html(msg_OK[msg_OK_counter]);
 +
msg_counter_up();
 +
}
 +
 +
function msg_counter_up()
 +
{
 +
msg_OK_counter++;
 +
if ( msg_OK_counter >= msg_OK.length )
 +
msg_OK_counter = 0;
 +
}
 
/*
 
/*
 
  * fügt zu einer Auswahl die Optionsbeschreibung und die Argumente ein.
 
  * fügt zu einer Auswahl die Optionsbeschreibung und die Argumente ein.
Zeile 263: Zeile 146:
 
{
 
{
 
out = create_opts( element, t.value );
 
out = create_opts( element, t.value );
document.getElementById(imgklick[element].name+"_opt").innerHTML = out;
+
jout =  document.getElementById(imgklick[element].name+"_opt");
 +
jQuery(jout).html(out);
 
return true;
 
return true;
 
};
 
};
Zeile 274: Zeile 158:
 
function create_opts( element, val )
 
function create_opts( element, val )
 
{
 
{
var out = imgklick[element].opts[val].info + " ";
+
var out = imgklick[element].opts[val].info + "<br/>";
for ( i = 0; i<imgklick[element].opts[val].args.length; i++ )
+
var wdt;// optionale Variable für die Breite eines Eingabefeldes
{
+
for ( i = 0; i<imgklick[element].opts[val].args.length; i++ )
arg = imgklick[element].opts[val].args[i];
+
{
if ( arg.type == "textarea" )
+
arg = imgklick[element].opts[val].args[i];
out += arg.info + " <textarea style='width: 90%;' id='"+imgklick[element].name+"_arg_" + i+"'>"+arg.pre+"</textarea>";
+
if ( arg.type == "textarea" )
else
+
out += "<br/>" + arg.info + " <textarea style='width: 90%;' id='"+imgklick[element].name+"_arg_" + i+"'>"+arg.pre+"</textarea>";
out += arg.info + " <input type='" + arg.type + "' value='"+arg.pre+"' id='"+imgklick[element].name+"_arg_" + i + "'/>";
+
                else if ( arg.type == "select" && imgklick[element].opts[val].args[i].options != null && imgklick[element].opts[val].args[i].options[0] != null)
}
+
                {
return out;
+
 
 +
                        out += "<br/>" + arg.info + " <select id='"+imgklick[element].name+"_arg_" + i+"'>";
 +
                        for ( opt=0; opt<imgklick[element].opts[val].args[i].options.length; opt++ )
 +
                        {
 +
 
 +
                                pos =  imgklick[element].opts[val].args[i].options[opt].indexOf("=");
 +
                                var optkey; var optval;
 +
 
 +
                                if ( pos == -1 )
 +
                                {
 +
                                        optkey = imgklick[element].opts[val].args[i].options[opt];
 +
                                        optval = imgklick[element].opts[val].args[i].options[opt];
 +
                                }
 +
                                else
 +
                                {
 +
                                        optval = imgklick[element].opts[val].args[i].options[opt].substring(0,pos);
 +
                                        optkey = imgklick[element].opts[val].args[i].options[opt].substring(pos+1);
 +
                                }
 +
                                var sel = "";
 +
                                if ( optkey == imgklick[element].opts[val].args[i].pre )
 +
                                        sel = "select='selected'";
 +
                                out += "<option value='"+optval+"' "+sel+">"+optkey+"</option>";
 +
                               
 +
                        }
 +
                        out += "</select>";
 +
                }
 +
else
 +
{
 +
if (imgklick[element].opts[val].args[i].options[0])
 +
{
 +
wdt=imgklick[element].opts[val].args[i].options[0];
 +
}
 +
else
 +
{
 +
wdt="150px";
 +
}
 +
out += arg.info + " <input type='" + arg.type + "' style='width:"+wdt+"' value='"+arg.pre+"' id='"+imgklick[element].name+"_arg_" + i + "'/>&nbsp;";
 +
}
 +
}
 +
return out;
 
}
 
}
  
Zeile 297: Zeile 220:
 
args += "|" + obj.args[i].arg + "=" + document.getElementById(imgklick[element].name+"_arg_"+i).value;
 
args += "|" + obj.args[i].arg + "=" + document.getElementById(imgklick[element].name+"_arg_"+i).value;
 
}
 
}
var box = document.getElementById("wpUploadDescription");
+
var val = "{{"+globalPrefix+imgklick[element].prefix+globalSep+obj.vorlage+args+"}}";
var val = "{{"+imgklick[element].prefix+"/"+obj.vorlage+args+"}}";
 
 
        var arg = imgklick[element].arg;
 
var reg = new RegExp("{{"+grundvorlage.name+"[\s\n]*([|](.|\n)*)?}}");
 
var reg_has_arg = new RegExp("({{"+grundvorlage.name+"[\s\n]*([|](.|\n)*)?[|][\s\n]*"+arg+"=)((.|\n)*}})");
 
var reg_hasnt_arg = new RegExp("({{"+grundvorlage.name+"[\s\n]*)(([|](.|\n)*)?}})");
 
  
 +
var arg = imgklick[element].arg;
 +
var reg = new RegExp("[{][{]"+grundvorlage.name+"[\s\n\r]*([|](.|\n|\r)*)?[}][}]");
 +
var reg_has_arg = new RegExp("([{][{]"+grundvorlage.name+"[\s\n\r]*([|](.|\n|\r)*)?[|][\s\n]*"+arg+"=)((.|\n|\r)*}})");
 +
var reg_hasnt_arg = new RegExp("([{][{]"+grundvorlage.name+"[\s\n\r]*)(([|](.|\n|\r)*)?[}][}])");
 
if ( -1 == box.value.search(reg) )
 
if ( -1 == box.value.search(reg) )
 
{ // kein Grundvorlage
 
{ // kein Grundvorlage
alert("Grundvorlage nicht gefunden.\n Falls du die Grundvorlage noch nicht eingefügt hast, solltest du das zu allererst tun und dann hiermit weitermachen.\nFalls du schon eine Grundvorlage eingefügt hast, hast du vermutlich soeben einen Programmfehler gefunden.");
+
mk_add_g();
 
}
 
}
else if ( -1 != box.value.search(reg_has_arg))
 
box.value = box.value.replace( reg_has_arg, "$1\n"+val+"$4" );
 
else
 
box.value = box.value.replace( reg_hasnt_arg, "$1|"+arg+"=\n"+val+"\n$2");
 
 
 
};
+
document.getElementById(imgklick[element].name+"_button").style.color=BGcolor[1];
 +
if ( -1 != box.value.search(reg_has_arg))
 +
box.value = box.value.replace( reg_has_arg, "$1\n"+val+"$4" );
 +
else
 +
box.value = box.value.replace( reg_hasnt_arg, "$1|"+arg+"=\n"+val+"\n$2");
 +
 
 +
add_msg( document.getElementById(imgklick[element].name+"_msg") );
 +
 +
}
  
 
/*
 
/*
Zeile 322: Zeile 247:
 
{
 
{
 
var out = "";
 
var out = "";
out += "<div style='border: 1px red dotted; margin: 5px; padding: 5px;'>";
+
out += "<div class='box1' >";
out += "<form><h4>Grundvorlage einfügen</h4>";
+
out += "<form>";
out += "Als erstes brauchst du eine Grundvorlage: <input type='button' value='Hinzufügen!' onclick='mk_add_g();'>";
+
out += "<table class='boxes'>";
 +
out += "</table>";
 
out += "</form>";
 
out += "</form>";
 
out += "</div>";
 
out += "</div>";
        return out;
+
return out;
 
}
 
}
 +
  
 
function mk_tag_box ()
 
function mk_tag_box ()
 
{
 
{
 
var out = "";
 
var out = "";
out += "<div style='border: 1px red dotted; margin: 5px; padding: 5px;'>";
+
out += "<div class='box0' >";
out += "<form><h4>Tags einfügen</h4>";
+
out += "<p class='angabe'>Beschreibende Markierungen</p>";
        out += "Hier kannst du Schlüsselwörter angeben, bitte durch Komma trennen! Angeben kannst du z.B. Motiv, Farben, Besonderheiten, … :<br/><textarea id='tag_box' style='width:95%;'></textarea><br/>";
+
out += "<form>";
out += "<input type='button' value='Hinzufügen!' onclick='mk_add_tags();'>";
+
out += "<table class='boxes'>";
 +
out += "<tr><td colspan='2'><small>Hier kannst du – <b>durch Komma</b> getrennte – Schlüsselwörter angeben (z.B. Motiv, Farben, Besonderheiten).<br /><b>Beachte bitte:</b> Mach die Tags kurz und knackig, z.B. <i>Kuh, Weiß, Lila, Violett</i>. </small></td></tr>";
 +
out += "</td></tr>";
 +
out += "<tr><td class='left'>";
 +
out += "<textarea id='tag_box' style='width: 90%;'></textarea>";
 +
out += "</td><td class='right' valign='top'>";
 +
out += "<input type='button' id='tag_box_button' class='buttonStyle0' value='Hinzufügen' onclick='mk_add_tags();'>";
 +
out += " <span id='tag_msg'></span>";
 +
out += "</td></tr></table>";
 
out += "</form>";
 
out += "</form>";
 
out += "</div>";
 
out += "</div>";
        return out;
+
return out;
 
}
 
}
 +
 +
  
 
function mk_add_tags ()
 
function mk_add_tags ()
 
{
 
{
var box = document.getElementById("wpUploadDescription");
 
 
var val = document.getElementById("tag_box").value;
 
var val = document.getElementById("tag_box").value;
+
 
var reg = new RegExp("{{"+grundvorlage.name+"[\s\n]*([|](.|\n)*)?}}");
+
var reg = new RegExp("[{][{]"+grundvorlage.name+"[\s\n\r]*([|](.|\n|\r)*)?[}][}]");
var reg_has_arg = new RegExp("({{"+grundvorlage.name+"[\s\n]*([|](.|\n)*)?[|][\s\n]*"+tag_arg+"=[\n]?)((.|\n)*}})");
+
var reg_has_arg = new RegExp("([{][{]"+grundvorlage.name+"[\s\n\r]*([|](.|\n|\r)*)?[|][\s\n\r]*"+tag_arg+"=[\s\n\r]*)((.|\n|\r)*[}][}])");
var reg_hasnt_arg = new RegExp("({{"+grundvorlage.name+"[\s\n]*)(([|](.|\n)*)?}})");
+
var reg_hasnt_arg = new RegExp("([{][{]"+grundvorlage.name+"[\s\n\r]*)(([|](.|\n|\r)*)?[}][}])");
  
 
if ( -1 == box.value.search(reg) )
 
if ( -1 == box.value.search(reg) )
 
{ // kein Grundvorlage
 
{ // kein Grundvorlage
alert("Grundvorlage nicht gefunden.");
+
mk_add_g();
                return;
+
}
}
+
else if ( -1 != box.value.search(reg_has_arg))
+
document.getElementById("tag_box_button").style.color=BGcolor[1];
box.value = box.value.replace( reg_has_arg, "$1"+val+", $4" );
+
if ( -1 != box.value.search(reg_has_arg))
else
+
box.value = box.value.replace( reg_has_arg, "$1"+val+", $4" );
box.value = box.value.replace( reg_hasnt_arg, "$1|"+tag_arg+"=\n"+val+"\n$2");
+
else
 +
box.value = box.value.replace( reg_hasnt_arg, "$1|"+tag_arg+"=\n"+val+"\n$2");
 +
add_msg(document.getElementById("tag_msg"));
 +
 
}
 
}
  
Zeile 367: Zeile 306:
 
function mk_add_g ()
 
function mk_add_g ()
 
{
 
{
box = document.getElementById("wpUploadDescription");
+
if ( -1 == box.value.search(new RegExp("[{][{]"+grundvorlage.name+"(\s|\n|\r)*([|](.|\n|\r)*)?[}][}]")) )
if ( -1 == box.value.search(new RegExp("{{"+grundvorlage.name+"(\s|\n)*([|](.|\n)*)?}}")) )
+
{
        {
 
 
box.value += "{{"+grundvorlage.einfg+"}}";
 
box.value += "{{"+grundvorlage.einfg+"}}";
        }
+
//add_msg(document.getElementById("g_msg"));
        else
+
//document.getElementById("text_box_button").style.color=BGcolor[2];
                alert("Wiki sagt: Ich glaube, da gibt es schon eine Grundvorlage.");
+
}
 +
else {
 +
alert("Wiki sagt: Ich glaube, da gibt es schon eine Grundvorlage.");
 +
}
 +
return;
 
}
 
}
 +
  
 
/*
 
/*
 
  * am Anfang alles reinladen
 
  * am Anfang alles reinladen
 
  */
 
  */
addOnloadHook(mkALL);
+
 
 
function mkALL()
 
function mkALL()
 
{
 
{
// die Zeile wird im "echten" Betrieb weggelöscht
+
box = document.getElementById("wpUploadDescription");
//mk_my_page();
+
        var klapp1 = "";
 +
        var klapp2 = "";
 +
 
 +
if ( ! box || box == null )
 +
{ // Bild wird nicht hochgeladen, sondern bearbeitet!
 +
                klapp1 = "<div id='lboxein' style='padding:5px;'><a href='javascript:einaus2(\"lbox\",\"lboxein\",\"lboxaus\")'>[Bild-Lizenz-Box anzeigen]</a></div><div id='lboxaus' style='display:none;padding:5px;border-bottom:1px solid #aaa;'><a href='javascript:einaus2(\"lbox\",\"lboxein\",\"lboxaus\")'>[Bild-Lizenz-Box verbergen]</a> (Hinweis: Grundvorlage muss nicht mehr per Huf eingefügt werden)</div><div id='lbox' style='display:none;'>";
 +
                klapp2 = "</div>";
 +
box = document.getElementById("wpTextbox1");
 +
var ibox = document.createElement("div");
 +
ibox.id = "klicktag";
 +
tb = document.getElementById("wpTextbox1");
 +
if ( tb )
 +
tb.parentNode.insertBefore(ibox, tb);
 +
else
 +
box.parentNode.insertBefore(ibox, box);
 +
}
 +
if ( ! box || box == null )
 +
        {
 +
return;
 +
        }
  
 
var out = "";
 
var out = "";
        out += mk_g_box();
+
//out += mk_g_box();
for ( e=0; e<imgklick.length; e++ )
+
//---------------------------------------------------
{
+
for ( e=0; e<imgklick.length; e++ ) {
out += "<div style='border: 1px red dotted; margin: 5px; padding: 5px;'>";
+
out += "<div class='box1'>";
out += "<form><h4>"+imgklick[e].name+" hinzufügen</h4>";
+
out += "<p class='angabe'>Angaben zur "+ imgklick[e].name + "</p>";
 +
out += "<form>";
 +
out += "<table class='boxes'>";
 +
out += "<tr><td class='left'>";
 
out += "<select name='" + e + "' id='" + imgklick[e].name + "_select' size='1' onchange='mk_opts( "+e+", this );'>";
 
out += "<select name='" + e + "' id='" + imgklick[e].name + "_select' size='1' onchange='mk_opts( "+e+", this );'>";
 +
 +
var selectedIndex = null;var selectedIndex = null;
 
for ( i = 0; i<imgklick[e].opts.length; i++ )
 
for ( i = 0; i<imgklick[e].opts.length; i++ )
 
{
 
{
out += "<option value='" + i + "'>" + imgklick[e].opts[i].name + "</option>";
+
var sel = "";
 +
if ( imgklick[e].opts[i].selected == "selected" && selectedIndex == null )
 +
{
 +
sel=' selected="selected" ';
 +
selectedIndex=i;
 +
}
 +
else
 +
sel = '';
 +
out += "<option value='" + i + "'"+sel+">" + imgklick[e].opts[i].name + "</option>";
 
}
 
}
 +
 +
if ( selectedIndex == null )
 +
selectedIndex = 0;
 
out += "</select>";
 
out += "</select>";
out += " <span id='" + imgklick[e].name + "_opt'>"+create_opts( e, 0 )+"</span> <input type='button' value='Hinzufügen' onclick='mk_add("+e+");'>";
+
out += " <span id='" + imgklick[e].name + "_opt'>"+create_opts( e, selectedIndex )+"</span> ";
 +
out += "</td><td class='right' valign='top'>";
 +
out += "<input type='button' id='"+imgklick[e].name+"_button' class='buttonStyle0' value='Hinzufügen' onclick='mk_add("+e+");'>";
 +
out += " <span id='" + imgklick[e].name + "_msg'></span>";
 +
out += "</td></tr></table>";
 
out += "</form>";
 
out += "</form>";
 
out += "</div>";
 
out += "</div>";
 +
}
  
}
+
//-------------------------------------------------------
        out += mk_tag_box();
+
out += mk_tag_box();
document.getElementById("klicktag").innerHTML = out;
+
        jout = klapp1 + "<div class='outer' >" + out + "</div>" + klapp2;
 +
        jQuery('#klicktag').html(jout);
 
};
 
};

Aktuelle Version vom 1. Februar 2014, 00:15 Uhr

function einaus2 (inhalt, einblenden, ausblenden) {
    var thisLevel  = document.getElementById(inhalt);
    var otherLevel = document.getElementById(einblenden);
    var linkLevel  = document.getElementById(ausblenden);
    if (thisLevel.style.display == 'none') {
        thisLevel.style.display = 'block';
        otherLevel.style.display = 'none';
        linkLevel.style.display = 'block';
    } else {
        thisLevel.style.display = 'none';
        otherLevel.style.display = 'block';
        linkLevel.style.display = 'none';
    }
  }
/* === Hochlade-Seite === */

var box; // Globale Variable
var BGcolor = [ "red", "green", "gray" ];
/*
 * generieren der Datenstruktur aus DPL-Ergebnissen - #1: AJAX-Request
 */
var imgklick = new Array();

function mk_ajax()
{

	jQuery.ajax( {
		url: wgScript,
		context: document.body,
		dataType: "text", 
		data: 'title=Kamelopedia:Bildsuche/Klick-Tpl&action=raw&templates=expand',
		success: function( data, textStatus ) { gen_imgklick( data ); mkALL(); }
	} );
}
jQuery(document).ready(function() {

if (window.location.href.indexOf("wpForReUpload=1") == -1){   //nicht beim Re-Upload
      mk_ajax();  
	  } else {
	   out = "<p style='padding: 20px; font-weight: bold;'>Geänderten Lizenz-Kram bitte nach dem Hochladen der neuen Version durch Bearbeiten der Datei-Seite anpassen.</p>";
	   jQuery('#klicktag').html(out);
	  	  }
});

/*
 * generieren der Datenstruktur aus DPL-Ergebnissen - #2: Parser
 */
function gen_imgklick( txt )
{

        txt = txt.replace(/ *[|¦] */g, "|");
        txt = txt.replace(/[\n\r]+/g, "\n" );

        /* Sicherheits-Feature: HTML-Tags weg (bis auf <br>) */
        txt = txt.replace(/[<]/g, "&lt;" );
        txt = txt.replace(/[>]/g, "&gt;" );
        txt = txt.replace( /&lt;br *\/? *&gt;/g, "<br/>" );
        lines = txt.split( "\n" );
//alert(txt);
        for( i=0; i<lines.length; i++ )
        {
                //zeile auslesen
                type = lines[i].substring(0,1);
                lines[i] = lines[i].substring(1);
                elements = lines[i].split( "|" );
                
                if( type == ";" ) // Vorlage
                {
                if ( elements[4] == "no" ) // ignorieren-Flag gesetzt
                        continue;
                if ( elements[2] == "" )
                        elements[2] = elements[1];
                if ( ! imgklick[0] || imgklick[imgklick.length-1].name != elements[0] )
                        imgklick.push( { name: elements[0], arg: elements[0], prefix:elements[0], opts: [ ] } );
                imgklick[imgklick.length-1].opts.push( { name: elements[2], info: elements[3], vorlage: elements[1], args: [ ], selected: elements[4] } );
                }
                else if( type == "*" ) // Argument
                {
                opts = imgklick[imgklick.length-1].opts;
                opts[opts.length-1].args.push( { arg: elements[0], type: elements[1], info: elements[2], pre: elements[3], options: elements.slice(4) } );
                }
        }
}

/*
 * Benutzer-Rückmeldungen:
 */
msg_OK = 
[
	"In Ordnung.",
	"Aber gerne.",
	"Bitteschön.",
	"Klar doch!",
	"Kein Problem.",
	"Jawohl.",
	"Gerne doch."
];


// name: Wie heißt die Grundvorlage?
// einfg: Wie soll sie am Anfang eingefügt werden?
grundvorlage =
{ 
	name: "Bild",
	einfg: "Bild\n"
};

// Welches Argument ("|xxxx=") soll für die Tags verwendet werden?
tag_arg = "Motiv";

// globales Prefix für Vorlagen (Grundvorlage ausgenommen)
globalPrefix = "Bild/";
// globaler Separator
globalSep = ": ";

/* Programmablauf */

/*
 * Den Nachrichtenzähler auf irgendwas setzen
 */
msg_OK_counter = Math.floor( Math.random() * msg_OK.length );

function add_msg( obj )
{
	if( obj.innerHTML == msg_OK[msg_OK_counter] )
		msg_counter_up();
		//wirft Fehler im IE7 & 8
	  //obj.innerHTML = msg_OK[msg_OK_counter];
	  jqobj = obj;
	  jQuery(jqobj).html(msg_OK[msg_OK_counter]);
	msg_counter_up();
}

function msg_counter_up()
{
	msg_OK_counter++;
	if ( msg_OK_counter >= msg_OK.length )
		msg_OK_counter = 0;
}
/*
 * fügt zu einer Auswahl die Optionsbeschreibung und die Argumente ein.
 * element: nummer des Arrayelementes ( imgklick[?] )
 * t: das Auswahlelement (select)
 */
function mk_opts( element, t )
{
	out = create_opts( element, t.value );
	jout =  document.getElementById(imgklick[element].name+"_opt");
	jQuery(jout).html(out);
	return true;
};

/*
 * gibt zu einer Auswahl die Optionsbeschreibung zurück.
 * element: nummer des Arrayelementes imgklick[?]
 * val: nummer des Arrayelements imgklick[].opts[?] bzw. Nummer der Auswahl
 */
function create_opts( element, val )
{
	var out = imgklick[element].opts[val].info + "<br/>";
	var wdt;// optionale Variable für die Breite eines Eingabefeldes
	for ( i = 0; i<imgklick[element].opts[val].args.length; i++ )
	{
		arg = imgklick[element].opts[val].args[i];
		if ( arg.type == "textarea" )
			out += "<br/>" + arg.info + " <textarea style='width: 90%;' id='"+imgklick[element].name+"_arg_" + i+"'>"+arg.pre+"</textarea>";
                else if ( arg.type == "select" && imgklick[element].opts[val].args[i].options != null && imgklick[element].opts[val].args[i].options[0] != null)
                {

                        out += "<br/>" + arg.info + " <select id='"+imgklick[element].name+"_arg_" + i+"'>";
                        for ( opt=0; opt<imgklick[element].opts[val].args[i].options.length; opt++ )
                        {

                                pos =  imgklick[element].opts[val].args[i].options[opt].indexOf("=");
                                var optkey; var optval;

                                if ( pos == -1 )
                                {
                                         optkey = imgklick[element].opts[val].args[i].options[opt];
                                         optval = imgklick[element].opts[val].args[i].options[opt];
                                }
                                else
                                {
                                         optval = imgklick[element].opts[val].args[i].options[opt].substring(0,pos);
                                         optkey = imgklick[element].opts[val].args[i].options[opt].substring(pos+1);
                                }
                                var sel = "";
                                if ( optkey == imgklick[element].opts[val].args[i].pre )
                                        sel = "select='selected'"; 
                                out += "<option value='"+optval+"' "+sel+">"+optkey+"</option>";
                                
                        }
                        out += "</select>";
                }
		else
		{
			if (imgklick[element].opts[val].args[i].options[0])
			{
				wdt=imgklick[element].opts[val].args[i].options[0];
			}
			else
			{
				wdt="150px";
			}
			out += arg.info + " <input type='" + arg.type + "' style='width:"+wdt+"' value='"+arg.pre+"' id='"+imgklick[element].name+"_arg_" + i + "'/>&nbsp;";
		}
	}
	return out;
}

/*
 * fügt Text in die Textbox ein (eigentliches Klicktag)
 */
function mk_add( element )
{
	obj = imgklick[element].opts[document.getElementById(imgklick[element].name+"_select").value];
	var args = "";
	for( i=0; i<obj.args.length; i++ )
	{
		args += "|" + obj.args[i].arg + "=" + document.getElementById(imgklick[element].name+"_arg_"+i).value;
	}
	var val = "{{"+globalPrefix+imgklick[element].prefix+globalSep+obj.vorlage+args+"}}";

	var arg = imgklick[element].arg;
	var reg = new RegExp("[{][{]"+grundvorlage.name+"[\s\n\r]*([|](.|\n|\r)*)?[}][}]");
	var reg_has_arg = new RegExp("([{][{]"+grundvorlage.name+"[\s\n\r]*([|](.|\n|\r)*)?[|][\s\n]*"+arg+"=)((.|\n|\r)*}})");
	var reg_hasnt_arg = new RegExp("([{][{]"+grundvorlage.name+"[\s\n\r]*)(([|](.|\n|\r)*)?[}][}])");
	if ( -1 == box.value.search(reg) )
	{ // kein Grundvorlage
		mk_add_g();
	}
	
		document.getElementById(imgklick[element].name+"_button").style.color=BGcolor[1];
		if ( -1 != box.value.search(reg_has_arg))
			box.value = box.value.replace( reg_has_arg, "$1\n"+val+"$4" );
		else
			box.value = box.value.replace( reg_hasnt_arg, "$1|"+arg+"=\n"+val+"\n$2");

		add_msg( document.getElementById(imgklick[element].name+"_msg") );	
	
}

/*
 * returnt eine Box zum Einfügen der übergeordneten Vorlage
 */
function mk_g_box ()
{
	var out = "";
	out += "<div class='box1' >";
	out += "<form>";
	out += "<table class='boxes'>";
	out += "</table>";
	out += "</form>";
	out += "</div>";
	return out;
}


function mk_tag_box ()
{
	var out = "";
	out += "<div class='box0' >";
	out += "<p class='angabe'>Beschreibende Markierungen</p>";
	out += "<form>";
	out += "<table class='boxes'>";
	out += "<tr><td colspan='2'><small>Hier kannst du – <b>durch Komma</b> getrennte – Schlüsselwörter angeben (z.B. Motiv, Farben, Besonderheiten).<br /><b>Beachte bitte:</b> Mach die Tags kurz und knackig, z.B. <i>Kuh, Weiß, Lila, Violett</i>. </small></td></tr>";
	out += "</td></tr>";
	out += "<tr><td class='left'>";
	out += "<textarea id='tag_box' style='width: 90%;'></textarea>";
	out += "</td><td class='right' valign='top'>";
	out += "<input type='button' id='tag_box_button' class='buttonStyle0' value='Hinzufügen' onclick='mk_add_tags();'>";
	out += " <span id='tag_msg'></span>";
	out += "</td></tr></table>";
	out += "</form>";
	out += "</div>";
	return out;
}



function mk_add_tags ()
{
	var val = document.getElementById("tag_box").value;

	var reg = new RegExp("[{][{]"+grundvorlage.name+"[\s\n\r]*([|](.|\n|\r)*)?[}][}]");
	var reg_has_arg = new RegExp("([{][{]"+grundvorlage.name+"[\s\n\r]*([|](.|\n|\r)*)?[|][\s\n\r]*"+tag_arg+"=[\s\n\r]*)((.|\n|\r)*[}][}])");
	var reg_hasnt_arg = new RegExp("([{][{]"+grundvorlage.name+"[\s\n\r]*)(([|](.|\n|\r)*)?[}][}])");

	if ( -1 == box.value.search(reg) )
	{ // kein Grundvorlage
		mk_add_g();
		}
	
		document.getElementById("tag_box_button").style.color=BGcolor[1];
		if ( -1 != box.value.search(reg_has_arg))
			box.value = box.value.replace( reg_has_arg, "$1"+val+", $4" );
		else
			box.value = box.value.replace( reg_hasnt_arg, "$1|"+tag_arg+"=\n"+val+"\n$2");
		add_msg(document.getElementById("tag_msg"));
	
}

/*
 * fügt die Grundvorlage ein
 */
function mk_add_g ()
{
	if ( -1 == box.value.search(new RegExp("[{][{]"+grundvorlage.name+"(\s|\n|\r)*([|](.|\n|\r)*)?[}][}]")) )
	{
		box.value += "{{"+grundvorlage.einfg+"}}";
		//add_msg(document.getElementById("g_msg"));
		//document.getElementById("text_box_button").style.color=BGcolor[2];
	}
	else {
		alert("Wiki sagt: Ich glaube, da gibt es schon eine Grundvorlage.");
		}
		return;
}


/*
 * am Anfang alles reinladen
 */

function mkALL()
{
	box = document.getElementById("wpUploadDescription");
        var klapp1 = "";
        var klapp2 = "";

	if ( ! box || box == null )
	{ // Bild wird nicht hochgeladen, sondern bearbeitet!
                klapp1 = "<div id='lboxein' style='padding:5px;'><a href='javascript:einaus2(\"lbox\",\"lboxein\",\"lboxaus\")'>[Bild-Lizenz-Box anzeigen]</a></div><div id='lboxaus' style='display:none;padding:5px;border-bottom:1px solid #aaa;'><a href='javascript:einaus2(\"lbox\",\"lboxein\",\"lboxaus\")'>[Bild-Lizenz-Box verbergen]</a> (Hinweis: Grundvorlage muss nicht mehr per Huf eingefügt werden)</div><div id='lbox' style='display:none;'>";
                klapp2 = "</div>";
		box = document.getElementById("wpTextbox1");
		var ibox = document.createElement("div");
		ibox.id = "klicktag";
		tb = document.getElementById("wpTextbox1");
		if ( tb )
			tb.parentNode.insertBefore(ibox, tb);
		else
			box.parentNode.insertBefore(ibox, box);
	}
	if (  ! box || box == null )
        {
		return;
        }

	var out = "";
	//out += mk_g_box();
//---------------------------------------------------
	for ( e=0; e<imgklick.length; e++ )	{
		out += "<div class='box1'>";
		out += "<p class='angabe'>Angaben zur "+ imgklick[e].name + "</p>";
		out += "<form>";
		out += "<table class='boxes'>";
		out += "<tr><td class='left'>";
		out += "<select name='" + e + "' id='" + imgklick[e].name + "_select' size='1' onchange='mk_opts( "+e+", this );'>";

		var selectedIndex = null;var selectedIndex = null;
		for ( i = 0; i<imgklick[e].opts.length; i++ )
		{
			var sel = "";
			if ( imgklick[e].opts[i].selected == "selected" && selectedIndex == null )
			{
					sel=' selected="selected" ';
					selectedIndex=i;
			}
			else
					sel = '';
			out += "<option value='" + i + "'"+sel+">" + imgklick[e].opts[i].name + "</option>";
		}

		if ( selectedIndex == null )
			selectedIndex = 0;
		out += "</select>";
		out += " <span id='" + imgklick[e].name + "_opt'>"+create_opts( e, selectedIndex )+"</span> ";
		out += "</td><td class='right' valign='top'>";
		out += "<input type='button' id='"+imgklick[e].name+"_button' class='buttonStyle0' value='Hinzufügen' onclick='mk_add("+e+");'>";
		out += " <span id='" + imgklick[e].name + "_msg'></span>";
		out += "</td></tr></table>";
		out += "</form>";
		out += "</div>";
	}

//-------------------------------------------------------
	out += mk_tag_box();
        jout = klapp1 + "<div class='outer' >" + out + "</div>" + klapp2;
        jQuery('#klicktag').html(jout);
};