Programmieren

Developers Shame Day – Mein Beitrag

2
1 year ago
by lotterfriends in ,

Dies ist mein Beitrag zum Developer Shame Day (DSD). Dieser Schnipsel kommt noch aus der der Zeit in der ich gerade mit PHP begonnen habe und ich jede Funktion googlen musst. Die Schnipsel stammen aus meinem Newssystem was irgendwie immer meinen aktuellen PHP-Wissenstand wiederspielte. Immer wenn ich etwas neues gelernt habe, habe ich es dort umgesetzt und eingebaut. So wächst es noch heute und ein Ende ist nicht in Sicht :-) 

<?php
session_start();
if (isset ($_GET[logout])) {
	$logout = $_GET[logout];
	if ($logout == "ja") {
		if (isset($_COOKIE[session_name()])) {
    		setcookie(session_name(), '', time()-42000, '/');
			echo ("Erfolgreich Ausgelogt<br />
				   <a href='../'>&lt;-zu&uuml;ck zur Startseite</a>");
			session_unset();
			die();
			}
	}
}

$base_url = dirname(__FILE__);
if (file_exists($base_url."/news_config.php")) {
	include "".$base_url."/news_config.php";
}

if (!isset ($_SESSION[name])) {
	$_SESSION[pass] = md5($_POST['passwort']);
	$_SESSION[name] = $_POST['user'];
}
if ($_SESSION[name] != $adminname){
	echo "Falscher Benutzername";
	session_destroy();
} else {
	if ($_SESSION[pass] != $admin_password){
		echo "Passwor falsch";
		session_destroy();
	} else {
		$recht= "ja";
		include 'news_funktionen.php';
		news_speichern();
		news_loeschen();
		kommentare_loeschen();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>News Admin</title>
<script type="text/javascript" src="js/pruefefelder.js"></script>
<script type="text/javascript" src="js/prototype.lite.js"></script>
<script type="text/javascript" src="js/moo.fx.js"></script>
<script type="text/javascript" src="js/moo.fx.pack.js"></script>
<script type="text/javascript">
function init(){
	var stretchers = document.getElementsByClassName('box');
	var toggles = document.getElementsByClassName('tab');
	var myAccordion = new fx.Accordion(
		toggles, stretchers, {opacity: false, height: true, duration: 100}
	);
	//hash functions
	var found = false;
	toggles.each(function(h3, i){
		var div = Element.find(h3, 'nextSibling');
			if (window.location.href.indexOf(h3.title) > 0) {
				myAccordion.showThisHideOpen(div);
				found = true;
			}
		});
		if (!found) myAccordion.showThisHideOpen(stretchers[0]);
}
</script>
<link href="css/newsadmin.css" rel="stylesheet" type="text/css" />
</head>

<body>

<div id="wrapper">
	<div id="content">
	<h3 class="tab" title="first"><div class="tabtxt"><a href="#">zeigen</a></div></h3>
   	<div class="tab"><h3 class="tabtxt" title="schreiben"><a href="#">schreiben</a></h3></div>
	<div class="tab"><h3 class="tabtxt" title="loeschen"><a href="#">l&ouml;schen</a></h3></div>
	<div class="tab"><h3 class="tabtxt" title="Kommentare"><a href="#">Kommentare</a></h3></div>
   	<h3 class="tabtxt" title="Kommentare"><a id="logout" href="?logout=ja">Logout</a></h3>
	<div class="boxholder">
		<div class="box">
			<?php news_zeigen($a); ?>
        </div>
		<div class="box">
			<?php news_schreiben() ?>
		</div>

		<div class="box">
			<?php news_loeschen_anzeigen()  ?>
		</div>

		<div class="box">
	        <?php
			news_zeigen_admin($a);
			?>
            <iframe name="komadmin" src="news_admin_kommentare.php?<?php echo SID ?>" height="300" width="590"></iframe>
		</div>
	</div>
</div>
</div>
<script type="text/javascript">
	Element.cleanWhitespace('content');
	init();
</script>
</body>
</html>
<?
	}
}
?>

[Snippet/Javascript] sendeAnfrage – Ajax leicht gemacht

1
1 year ago
by lotterfriends in , ,

Hier ist eine Beispielhafte, minimale Implementierung des HTTPRequestObjects.
Die Funktion kann schnell eingebunden werden um Inhalte nachzuladen oder
allgemein Ajax zu ermöglichen. Zusammen mit meiner Funktion sammleDaten()
steht dem Eisatz von Ajax nichts mehr im Weg und hat sich in Zahlreichen Projekten
bewert.

/**
 *
 * Sendet eine Ajax-Anfrage an einen Server
 *
 * @param  methode String POST oder GET / Wird etwas anderes übergeben wird GET verwendet
 * @param  zielUrl String An Was die Anfrage geschickt werden soll (z.B. ein Skript auf dem Server)
 * @param  verarbeiter CallBack Function JS-Funktion die die Rückgabe
 *         des Servers verarbeitet und die Rückgabe als Parameter bekommt
 *         (optional)
 * @param  parameter String / Array Parameter die an den Server geschickt
 *         werden sollen. Entweder einer als String Bsp.: "kekse=true" oder
 *         mehrere als Array Bsp.: ["kekse=true","kuchen=false"]
 *         (optional)
 * @return Rückgabe des verarbeiters, falls kein Verarbeiter gesetzt ist true
 *         bei Erfolg und false bei Fehlschlag
 *
 */
function sendeAnfrage(methode,zielUrl,parameter,verarbeiter) {
  if (parameter && parameter.constructor == Function) {
    verarbeiter = parameter;
    parameter = undefined;
  }

  methode = methode.toUpperCase();
  if (methode != "POST" && methode != "GET") methode = "GET";

  var request = null;
  if (window.XMLHttpRequest) request = new window.XMLHttpRequest();
  if (window.ActiveXObject) request = new window.ActiveXObject("Microsoft.XMLHTTP");
  if (request == null) return false;

  request.onreadystatechange = function() {
    if (request.readyState == 4) {
      var rueckgabe = request.responseText;
      if (request.status == 200) {
        if (verarbeiter != null) return verarbeiter(rueckgabe);
        return true;
      } return false;
    }
  }

  var uebertraeger = null;
  if(parameter!==undefined) {
    if (parameter.constructor == Array) {
      for (var i in parameter)  {
        if (i > 0) uebertraeger = uebertraeger + parameter[i] + "&";
        else uebertraeger = parameter[i] + "&";
      }
    } else uebertraeger = parameter;
  }

  if (methode == "GET" && uebertraeger != null) zielUrl = zielUrl + "?" + uebertraeger;
  request.open(methode, zielUrl, true);
  if (methode == "POST") request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  request.send(uebertraeger);

}

Beispiel für die Verwendung:


// Initialisieren
var initialisirenFunktionen = [];
onload = function() {
  for (var i in initialisirenFunktionen) initialisirenFunktionen[i]();
}

// Erstelle LoadBereich
initialisirenFunktionen.push(function () {
    var loadContent = document.createElement("DIV");
    loadContent.id = "loadContent";
    document.body.appendChild(loadContent);
});

// Reichere AjaxButton um Anfrage-Event an
initialisirenFunktionen.push(function () {
    var sendenButton = document.getElementById("senden");
    sendenButton.onclick = function () {
      sendeAnfrage("POST","MeinServlet",sammleDaten(document.meinForm),schreibeResponseInLoadBox);
    };
});

// CallbackFunktion für die Ajax-Anfrage (Ergebniss verarbeiten)
function schreibeResponseInLoadBox(r) {
  var loadContent = document.getElementById("loadContent");
  loadContent.innerHTML = r;
}

[Snippet/Javascript] sammleDaten

2
1 year ago
by lotterfriends in , ,

Wenn man ein Formular mit Ajax abschicken will kommt man schnell in die Situation,
dass man sich die Daten oder einen Datensatz selbst zusammenbauen muss.
Mit jQuery ist das kein Problem, ohne sieht die Sache da aber schon ganz anders aus.

Meine Funktion geht Rekursive das übergebene HTMLElement durch und guckt ob es ein
Typisches Formular Element ist (Textarea, Input und Selextbox). Ist das der Fall wird der
Value mit dem Namen in einem Array gespeichert und am Ende zurückgegeben.

/**
*
* Liefert alle Daten aus einem Formular in einem Array
*
* @param formular HTMLElement Formular in dem nach Daten gesucht werden soll
* @return Array Im Format ["key=value","key=value"]
*
*/
function sammleDaten(formular) {
	var daten = [];
	var ue = formular.childNodes;
	for (var i in ue) {
		if (ue[i].tagName && ue[i].name &&
		(ue[i].tagName == "INPUT" || ue[i].tagName == "TEXTAREA"
		|| ue[i].tagName == "SELECT")){
			var inhalt = null;
			if (ue[i].value) {
        		inhalt = ue[i].value;
    		}
			daten.push(ue[i].name+"="+inhalt);
		}
		daten = daten.concat(sammleDaten(ue[i]));
	}
	return daten;
}

[Snippet/Javascript] toggleClass ohne jQuery

1
1 year ago
by lotterfriends in , ,

Ich habe vor kurzem eine Javascript Funktion gebracht um schnell CSS KLassen zu Tauschen. In jQuery gibt es dafür die Funktion “toggleClass”. Leider stand mir in dieser Situation das Framework nicht zur Verfügung also habe ich mir die Funktion kurzerhand selber geschrieben.

Das Problem bei der Sache ist das man nicht einfach den Attribut Classname ersetzen darf da das HTML-Element vielleicht noch andere Klassen besitzt. In meiner Funktion können entweder zwei oder eine CSS-Klasse übergeben werden.
Bei zwei werden sie, falls vorhanden, getauscht, wenn noch keine von beiden vorhanden ist, wird die erste angefügt.
Bei dem Fall das nur eine Klasse übergeben wurde, wird zuerst geguckt ob die diese schon gesetzt ist. Falls ja wird sie mit nichts ersetzt andernfalls wird sie angefügt. Meine Funtion müsste sich also genauso wie das jQuery Pendant verhalten.

/**
*
* Wechselt die CSS-Klasse eines übergebenen Elements
*
* @param HTMLElement Element dessen Klasse gewechselt wird
* @param cls1 Klasse die gesetzt oder weg gemacht wird
* @param cls2 Klasse mit der getauscht wird. Falls dieser Parameter
*             nicht gesetzt ist wird cls1 durch nichts ersetzt
*/
function toggleClass(elm,cls1,cls2) {
    if (!cls2) cls2 = "";
    elm.ersetzeKlasse = function(haystack,needle) {
        var re = new RegExp(haystack,"g");
        this.className = this.className.replace(haystack,needle);
    }

    if (elm.className.indexOf(cls1) > -1) elm.ersetzeKlasse(cls1,cls2);
    else if (elm.className.indexOf(cls2) > -1) elm.ersetzeKlasse(cls2,cls1);
    else elm.className += " "+cls1;
}
Go to Top