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

aus Kamelopedia, der wüsten Enzyklopädie
Zur Navigation springen Zur Suche springen
(Kurzer Text zu den einzelnen Boxen (Test))
K
 
(10 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 33: Zeile 33:
 
} );
 
} );
 
}
 
}
jQuery(document).ready(mk_ajax);
+
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);
 +
    }
 +
});
  
 
/*
 
/*
Zeile 118: Zeile 126:
 
msg_counter_up();
 
msg_counter_up();
 
//wirft Fehler im IE7 & 8
 
//wirft Fehler im IE7 & 8
obj.innerHTML = msg_OK[msg_OK_counter];
+
  //obj.innerHTML = msg_OK[msg_OK_counter];
 +
  jqobj = obj;
 +
  jQuery(jqobj).html(msg_OK[msg_OK_counter]);
 
msg_counter_up();
 
msg_counter_up();
 
}
 
}
Zeile 251: Zeile 261:
 
var out = "";
 
var out = "";
 
out += "<div class='box0' >";
 
out += "<div class='box0' >";
out += "<p style='padding:3px;font-weight:bold;'>Angaben zum Motiv/ zu den Motiven</p>";
+
out += "<p class='angabe'>Beschreibende Markierungen</p>";
 
out += "<form>";
 
out += "<form>";
 
out += "<table class='boxes'>";
 
out += "<table class='boxes'>";
out += "<tr><td colspan='2'><small>Hier kannst du Schlüsselwörter angeben, bitte <b>durch Komma</b> trennen! Angeben kannst du z.B. Motiv, Farben, Besonderheiten, … . <b>Beachte bitte:</b> Mach die Tags kurz und knackig, z.B. <i>Kuh, Weiß, Lila, Violett</i>. Wenn du dein Bild mit <i>Eine weiß-violette Kuh</i> tagst (also ohne Kommas), wird es nur gefunden werden, wenn genau das ins Suchfeld eingegeben wird.</small></td></tr>";
+
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 += "</td></tr>";
 
out += "<tr><td class='left'>";
 
out += "<tr><td class='left'>";
 
out += "<textarea id='tag_box' style='width: 90%;'></textarea>";
 
out += "<textarea id='tag_box' style='width: 90%;'></textarea>";
out += "</td><td class='right'>";
+
out += "</td><td class='right' valign='top'>";
out += "<input type='button' id='tag_box_button' class='buttonStyle0' value='Tags&nbsp;Hinzufügen' onclick='mk_add_tags();'>";
+
out += "<input type='button' id='tag_box_button' class='buttonStyle0' value='Hinzufügen' onclick='mk_add_tags();'>";
 
out += " <span id='tag_msg'></span>";
 
out += " <span id='tag_msg'></span>";
 
out += "</td></tr></table>";
 
out += "</td></tr></table>";
Zeile 342: Zeile 352:
 
for ( e=0; e<imgklick.length; e++ ) {
 
for ( e=0; e<imgklick.length; e++ ) {
 
out += "<div class='box1'>";
 
out += "<div class='box1'>";
out += "<p style='padding:3px;font-weight:bold;'>Angaben zur "+ imgklick[e].name + "</p>";
+
out += "<p class='angabe'>Angaben zur "+ imgklick[e].name + "</p>";
 
out += "<form>";
 
out += "<form>";
 
out += "<table class='boxes'>";
 
out += "<table class='boxes'>";
Zeile 366: Zeile 376:
 
out += "</select>";
 
out += "</select>";
 
out += " <span id='" + imgklick[e].name + "_opt'>"+create_opts( e, selectedIndex )+"</span> ";
 
out += " <span id='" + imgklick[e].name + "_opt'>"+create_opts( e, selectedIndex )+"</span> ";
out += "</td><td class='right'>";
+
out += "</td><td class='right' valign='top'>";
out += "<input type='button' id='"+imgklick[e].name+"_button' class='buttonStyle0' value='"+imgklick[e].name+"&nbsp;hinzufügen' onclick='mk_add("+e+");'>";
+
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 += " <span id='" + imgklick[e].name + "_msg'></span>";
 
out += "</td></tr></table>";
 
out += "</td></tr></table>";

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);
};