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

aus Kamelopedia, der wüsten Enzyklopädie
Zur Navigation springen Zur Suche springen
(Die Seite wurde neu angelegt.)
 
Zeile 383: Zeile 383:
 
{
 
{
 
// die Zeile wird im "echten" Betrieb weggelöscht
 
// die Zeile wird im "echten" Betrieb weggelöscht
mk_my_page();
+
//mk_my_page();
  
 
var out = "";
 
var out = "";
Zeile 404: Zeile 404:
 
         out += mk_tag_box();
 
         out += mk_tag_box();
 
document.getElementById("klicktag").innerHTML = out;
 
document.getElementById("klicktag").innerHTML = out;
};
 
 
/* Wir simulieren eine Hochladeseite */
 
function mk_my_page() {
 
document.getElementById("J_FRAME").innerHTML = 
 
'<form id="upload" method="post" enctype="multipart/form-data" action="#">'+
 
' <table border="0">'+
 
' <tbody><tr>'+
 
'   '+
 
' <td align="right" valign="top"><label for="wpUploadFile">Datei:</label></td>'+
 
' <td align="left">'+
 
' <input tabindex="1" name="wpUploadFile" id="wpUploadFile" onchange=\'fillDestFilename("wpUploadFile")\' size="40" type="file"><input name="wpSourceType" value="file" type="hidden">'+
 
 
' </td>'+
 
' </tr>'+
 
' <tr>'+
 
' <td align="right"><label for="wpDestFile">Dateiname:</label></td>'+
 
' <td align="left">'+
 
' <input tabindex="2" name="wpDestFile" id="wpDestFile" size="40" value="" onkeyup="wgUploadWarningObj.keypress();" type="text">'+
 
' </td>'+
 
' </tr>'+
 
' <tr>'+
 
' <td align="right"><label for="wpUploadDescription">Beschreibung:<br>'+
 
'<span style="color: rgb(192, 0, 0); font-weight: bold; text-decoration: underline; background-color: rgb(255, 255, 64);">(Quelle angeben!)</span></label></td>'+
 
' <td align="left">'+
 
' <textarea tabindex="3" name="wpUploadDescription" id="wpUploadDescription" rows="6" cols="80"></textarea>'+
 
' </td>'+
 
' </tr>'+
 
' <tr>'+
 
' <td></td>'+
 
' <td>'+
 
' <input tabindex="7" name="wpWatchthis" id="wpWatchthis" value="true" type="checkbox">'+
 
' <label for="wpWatchthis">Diese Seite beobachten</label>'+
 
' <input tabindex="8" name="wpIgnoreWarning" id="wpIgnoreWarning" value="true" type="checkbox">'+
 
' <label for="wpIgnoreWarning">Warnungen ignorieren</label>'+
 
' </td>'+
 
' </tr>'+
 
''+
 
' <tr><td colspan="2" id="wpDestFile-warning">&nbsp;</td></tr>'+
 
' <tr>'+
 
' <td></td>'+
 
' <td align="left"><input tabindex="9" name="wpUpload" value="Datei hochladen" title="Hochladen starten [s]" accesskey="s" type="submit"></td>'+
 
' </tr>'+
 
' <tr>'+
 
' <td></td>'+
 
' <td align="left">'+
 
' <div style="color: rgb(45, 100, 161); font-size: smaller;">Zum Vermeiden unnötiger Artikelversionen bitte den <b>Vorschau-Button</b> benutzen!</div>'+
 
''+
 
' </td>'+
 
' </tr>'+
 
''+
 
' </tbody></table>'+
 
' <input name="wpDestFileWarningAck" id="wpDestFileWarningAck" value="" type="hidden">'+
 
'</form>';
 
 
};
 
};

Version vom 16. April 2008, 12:11 Uhr

/* === Hochlade-Seite === */

/* Konfiguration */

/*
 * das imgklick-Objekt:
 * 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:
 */

var imgklick = 
[
	{
		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:" }
				]

			},
			{
				name: "Wikipedia",
				info: "Das Bild stammt aus der Wikipedia.",
				vorlage: "Wiki",
				args:
				[
					{ arg: "1", type: "text", info: "Bildname:", pre: "Bild:" }
				]

			},
			{
				name: "Stupidedia",
				info: "Das Bild stammt aus der Stupidedia.",
				vorlage: "Stupi",
				args:
				[
					{ arg: "1", type: "text", info: "Bildname:", pre: "Bild:" }
				]
			},
			{
				name: "Scan",
				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?
// 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";

/* Programmablauf */

/*
 * 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 );
	document.getElementById(imgklick[element].name+"_opt").innerHTML = 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 + " ";
for ( i = 0; i<imgklick[element].opts[val].args.length; i++ )
{
	arg = imgklick[element].opts[val].args[i];
	if ( arg.type == "textarea" )
		out += arg.info + " <textarea style='width: 90%;' id='"+imgklick[element].name+"_arg_" + i+"'>"+arg.pre+"</textarea>";
	else
		out += arg.info + " <input type='" + arg.type + "' value='"+arg.pre+"' id='"+imgklick[element].name+"_arg_" + i + "'/>";
}
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 box = document.getElementById("wpUploadDescription");
	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)*)?}})");

	if ( -1 == box.value.search(reg) )
	{ // kein Grundvorlage
		alert("Grundvorlage nicht gefunden.");
	}
	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");
	
};

/*
 * returnt eine Box zum Einfügen der übergeordneten Vorlage
 */
function mk_g_box ()
{
	var out = "";
	out += "<div style='border: 1px red dotted; margin: 5px; padding: 5px;'>";
	out += "<form><h4>Grundvorlage einfügen</h4>";
	out += "Als erstes brauchst du eine Grundvorlage: <input type='button' value='Hinzufügen!' onclick='mk_add_g();'>";
	out += "</form>";
	out += "</div>";
        return out;
}

function mk_tag_box ()
{
	var out = "";
	out += "<div style='border: 1px red dotted; margin: 5px; padding: 5px;'>";
	out += "<form><h4>Tags einfügen</h4>";
        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 += "<input type='button' value='Hinzufügen!' onclick='mk_add_tags();'>";
	out += "</form>";
	out += "</div>";
        return out;
}

function mk_add_tags ()
{
	var box = document.getElementById("wpUploadDescription");
	var val = document.getElementById("tag_box").value;
		
	var reg = new RegExp("{{"+grundvorlage.name+"[\s\n]*([|](.|\n)*)?}}");
	var reg_has_arg = new RegExp("({{"+grundvorlage.name+"[\s\n]*([|](.|\n)*)?[|][\s\n]*"+tag_arg+"=[\n]?)((.|\n)*}})");
	var reg_hasnt_arg = new RegExp("({{"+grundvorlage.name+"[\s\n]*)(([|](.|\n)*)?}})");

	if ( -1 == box.value.search(reg) )
	{ // kein Grundvorlage
		alert("Grundvorlage nicht gefunden.");
                return;
	}
	else 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");
}

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

/*
 * am Anfang alles reinladen
 */
addOnloadHook(mkALL);
function mkALL()
{
	// die Zeile wird im "echten" Betrieb weggelöscht
	//mk_my_page();

	var out = "";
        out += mk_g_box();
	for ( e=0; e<imgklick.length; e++ )
	{
		out += "<div style='border: 1px red dotted; margin: 5px; padding: 5px;'>";
		out += "<form><h4>"+imgklick[e].name+" hinzufügen</h4>";
		out += "<select name='" + e + "' id='" + imgklick[e].name + "_select' size='1' onchange='mk_opts( "+e+", this );'>";
		for ( i = 0; i<imgklick[e].opts.length; i++ )
		{
			out += "<option value='" + i + "'>" + imgklick[e].opts[i].name + "</option>";
		}
		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 += "</form>";
		out += "</div>";

	}
        out += mk_tag_box();
	document.getElementById("klicktag").innerHTML = out;
};