Benutzer:J*/Javascript-Spielwüste.js: Unterschied zwischen den Versionen

aus Kamelopedia, der wüsten Enzyklopädie
Zur Navigation springen Zur Suche springen
← Zum vorherigen Versionsunterschied
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
 
(27 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
/* === Hochlade-Seite === */
var CODEWORT = "Kamel"; // Das ist das gefragte Codewort. Groß- und Kleinschreibung beachten!
var HREF = "Hauptseite"; // Auf dieser Seite geht's weiter!


/* Konfiguration */
// VARIANTE 1: Mit anzeigender Grafik


/*
addOnloadHook( function () {
* das imgklick-Objekt:
// INIT
* hier wird festgelegt, welche Einfügeboxen erzeugt werden, welche Auswahlmöglichkeiten es gibt, welche
document.getElementById("eingabe1").innerHTML=("<form action='#' onsubmit='return false;' ><input id='ef1' type='text'/>&ensp;<span id='er1'></span></form>");
* Optionen, usw. Es wird auch festgelegt, welche Daten beim Hinzufügen ins Feld eingefügt werden.
document.getElementById("er1").innerHTML = document.getElementById("eingabe_falsch").innerHTML;
*
document.getElementById("ef1").onkeyup = function () {
* Erklärung:
if (this.value == CODEWORT)
* var imgklick =
// Grafik austauschen und Link erzeugen
* [
document.getElementById("er1").innerHTML = document.getElementById("eingabe_ok").innerHTML + "&ensp;<a href='"+wgScript+"?title="+encodeURI(HREF)+"'>Weiter geht's</a>";
* { genau 1 Element pro Auswahlfeld
else
* name: String, der als Titel angezeigt wird, z.B. "Bildtechnik" oder "Lizenzen"
document.getElementById("er1").innerHTML = document.getElementById("eingabe_falsch").innerHTML;
*              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?
// VARIANTE 2: Mit OK-Button
// 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?
addOnloadHook( function () {
tag_arg = "Motiv";
// INIT
 
document.getElementById("eingabe2").innerHTML=("<form action='#' id='form2'><input id='ef2' type='text'></input>&ensp;<input type='submit' value='Ich bin mir da ganz sicher!' id='okbtn2'/></form>");
/* Programmablauf */
document.getElementById("form2").onsubmit = function () {
 
if (document.getElementById("ef2").value == CODEWORT)
/*
{
* fügt zu einer Auswahl die Optionsbeschreibung und die Argumente ein.
// Ergebnis ausspucken und weiterleiten
* element: nummer des Arrayelementes ( imgklick[?] )
alert("Richtig! Weiter geht's!");
* t: das Auswahlelement (select)
location.href = wgScript+"?title="+encodeURI(HREF);
*/
}
function mk_opts( element, t )
else
{
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>";
// Ergebnis ausspucken und weiterleiten
alert("Das war wohl nix.");
// Nachfolgende Zeile auskommentieren oder entfernen um dem Nutzer mehrere Eingabeversuche zu erlauben.
location.href = wgScript+"?title="+encodeURI("Grabkammer des Pharao");
}
}
out += "</select>";
                return false; //Für den IE
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;
};
 
/* 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>';
};

Aktuelle Version vom 28. September 2010, 11:52 Uhr

var CODEWORT = "Kamel"; // Das ist das gefragte Codewort. Groß- und Kleinschreibung beachten!
var HREF = "Hauptseite"; // Auf dieser Seite geht's weiter!

// VARIANTE 1: Mit anzeigender Grafik

addOnloadHook( function () {
	// INIT
	document.getElementById("eingabe1").innerHTML=("<form action='#' onsubmit='return false;' ><input id='ef1' type='text'/>&ensp;<span id='er1'></span></form>");
	document.getElementById("er1").innerHTML = document.getElementById("eingabe_falsch").innerHTML;
	document.getElementById("ef1").onkeyup = function () {
		if (this.value == CODEWORT)
			// Grafik austauschen und Link erzeugen
			document.getElementById("er1").innerHTML = document.getElementById("eingabe_ok").innerHTML + "&ensp;<a href='"+wgScript+"?title="+encodeURI(HREF)+"'>Weiter geht's</a>";
		else
			document.getElementById("er1").innerHTML = document.getElementById("eingabe_falsch").innerHTML;
	}
});

// VARIANTE 2: Mit OK-Button

addOnloadHook( function () {
	// INIT
	document.getElementById("eingabe2").innerHTML=("<form action='#' id='form2'><input id='ef2' type='text'></input>&ensp;<input type='submit' value='Ich bin mir da ganz sicher!' id='okbtn2'/></form>");
	document.getElementById("form2").onsubmit = function () {
		if (document.getElementById("ef2").value == CODEWORT)
		{
			// Ergebnis ausspucken und weiterleiten
			alert("Richtig! Weiter geht's!");
			location.href = wgScript+"?title="+encodeURI(HREF);
		}
		else
		{
			// Ergebnis ausspucken und weiterleiten
			alert("Das war wohl nix.");
			// Nachfolgende Zeile auskommentieren oder entfernen um dem Nutzer mehrere Eingabeversuche zu erlauben.
			location.href = wgScript+"?title="+encodeURI("Grabkammer des Pharao");
		}
                return false; //Für den IE
	}
});
Abgerufen von „http://kamelopedia.net/index.php?title=Benutzer:J*/Javascript-Spielwüste.js&oldid=412426“