ek

Beiträge zum Thema JS, HTML, CSS & anderem Kram

Um ein bißchen Bewegung zu kriegen, habe ich heute beschlossen, die Rückgabe der DVD bei der Videothek mit einem Spaziergang zum Lindener Hafen zu verbinden, um den Industrie-Charme ein wenig auf mich wirken zu lassen. Und weil ich nicht einfach nur rumlaufen und Löcher in die Luft gucken wollte, habe ich die Kamera auch noch mitgenommen. Deshalb jetzt hier ein paar Impressionen:

Drei Stromkästen beim Lichtenberg-Kreisel in Hannover Linden-Mitte

Drei Stromkästen beim Lichtenberg-Kreisel in Hannover Linden-Mitte.

Hinterhaus in Hannover Linden-Mitte

Old School-Graffiti an verwinkelter Hinterhaus-Mélange.

Holzpoller am Fußweg

Ein paar Holzpoller am Wegesrand. Nichts spektakuläres, aber die perfekte Gelegenheit für ein bißchen DoF-Action.

Lieferanten-Zufahrt beim real-Markt Hannover-Linden

Lieferanten-Zufahrt beim Lindener real-Markt. Sehr geschmackvoll in dezentem Hellblau gehalten.

Raiffeisen-Hauptgenossenschaft am Lindener Hafen in Hannover

Die Raiffeisen-Hauptgenossenschaft vor dramatischem Himmel. Zu meinem Glück hat dieser an sich gehalten und keinen Sturzregen auf mich herab gelassen.

Gleise am Lindener Hafen in Hannover

Gleise am Lindener Hafen.

Fußweg im Industriegebiet Lindener Hafen in Hannover

Fußweg neben irgend einem Maschinenbauer am Westende des Lindener Hafens in Hannover.

Seit ich diesen Blog gestartet habe, zeige ich meine drei aktuellsten Twitter-Updates mit "Twitter for WordPress" in der Sidebar an. Und seitdem werden die Umlaute zerschossen. Das ist nicht sehr schön und endlich habe ich eine Lösung gefunden, das Problem zu beheben.

Und zwar mithilfe des Plug-Ins "WP-RSS Import" von Frank Bueltge. Dieses setzt genau wie das Plug-In "Twitter for WordPress" auf die WordPress-eigene Funktion fetch_rss(), welche wiederum die Probleme verursacht.

Die Lösung besteht nun aus zwei Arrays aus Franks Plug-In:

PHP
$umlaute = array('–', '—',…);
$htmlcode = array('–', '—',…);

Die kompletten Arrays kann ich hier nicht angeben, da sie viel zu umfangreich sind. Ihr findet sie aber im SVN-System des Plug-In Directory von WordPress. Die beiden gesuchten Arrays befinden sich in der Mitte und sind eigentlich nicht zu übersehen.

Diese kopiert ihr bspw. in Zeile 70 der Datei twitter.php von "Twitter for WordPress", vor die foreach-Schleife. Als nächstes kommt die Funktion, die dafür sorgt, dass alle Umlaute, die im Array $umlaute stehen, durch die entsprechenden Entitäten aus dem Array $htmlcode ersetzt werden:

PHP
$msg = str_replace($umlaute, $htmlcode, $msg);

Das tragt ihr in Zeile 76 der twitter.php ein und schon seid ihr fertig. Von nun an werden alle mit "Twitter for WordPress" eigebundenen Tweets sauber dargestellt.

An dieser Stelle noch einmal ein Dank an Frank Bueltge für das Erstellen dieser beiden monströsen Arrays. Wer genauso wie ich nach langer, erfolgloser Suche darin endlich die Lösung für das Umlaute-Problem gefunden hat, dem möchte ich den Spenden-Button auf seiner Seite nahelegen. Einen Euro oder mehr für gute Programmier-Arbeit zu spenden ist eine schöne Geste und sorgt dafür, dass die Entwicklung im Open-Source-Bereich weiter geht.

Wie euch vielleicht aufgefallen ist, habe ich in die Sidebar eine kurze Autoren-Info gepackt, damit die Leute wissen, wer hier schreibt. Und wer von euch mal mit dem Cursor über das Foto drüber gefahren ist, wird gemerkt haben, dass sich das Schwarzweiß-Foto dabei in ein Farb-Foto verwandelt. Das ist sicher kein Basis-Feature, aber eine nette jQuery-Spielerei. Und wie das geht, verrate ich jetzt.

Als erstes brauchen wir den entsprechenden HTML-Code:

HTML
<div id="image">
	<img src="image_bw.jpg" alt="Scharzweiß-Bild" />
</div>

Ein normales, von einem div-Element umschlossenes Bild. Im img-Element ist das Schwarzweiß-Foto eingebunden.

Als nächstes etwas CSS:

CSS
#image {
  width: …;
  height: …;
  background: url('image_color.jpg') 0 0 no-repeat;
}

Die Breite und Höhe des div-Elements entsprechen der Breite und Höhe eures Bildes. Als Hintergrund-Bild ist das Farb-Foto eingebunden. Es befindet sich also die ganze Zeit hinter dem Schwarzweiß-Foto und wird von diesem verdeckt.

Nun zum jQuery-Teil:

JavaScript
$(function () {
	$('#image img').hover(function() {
		$(this).stop().fadeTo('slow', 0);
	}, function() {
		$(this).stop().fadeTo('slow', 1);
	});
});

Fährt man mit dem Cursor über das Schwarzweiß-Foto, wird dieses ausgeblendet und offenbart das Farb-Foto. Geht man mit dem Cursor vom Foto runter, wird das Schwarzweiß-Foto wieder eingeblendet. Das ganze mit der Geschwindigkeitsangabe slow, damit es auch schön geschmeidig vonstatten geht.

Das war es auch schon. Bei Fragen oder Anregungen sei wie immer auf die Kommentar-Funktion verwiesen.

PS: Eine Demo des ganzen gibt es auf der Blog-Startseite!

Wo ist denn das Niemandsland von Hannover, wird sich der/die aufmerksame Leser/in wahrscheinlich fragen? Ganz einfach, beim Schützenplatz, der Landesbibliothek von Niedersachen und dem Stadion. Meiner Einschätzung nach gehört das Gebiet weder zu Linden oder der Calenberger Neustadt, noch zur Südstadt. Natürlich gebe ich keine Garantie auf die Richtigkeit dieser Einschätzung, aber ich muss zugeben, relativ sicher zu sein.

Wie dem auch sei, wer sich ins Niemandsland vorwagt, tu gut dran, eine Kamera dabei zu haben. Schließlich will die Expedition für die Nachwelt festgehalten werden. So will ich denn kurz ein paar Beweisfotos präsentieren:

Statue vor der AWD-Arena

Hier die Statue, die vor der AWD-Arena (vormals Niedersachsen-Stadion) steht.

Stadionbad Hannover

Das Stadionbad Hannover in der Dämmerung. Das geübte Auge erkennt sofort, dass es sich um ein HDR-Bild handelt.

Baustelle beim Bundesleistungszentrum Hannover

Ein unbedeutender Fußweg neben der Baustelle beim Bundesleistungszentrum. Wahrscheinlich entsteht da ein neues Massage-Zentrum für die künftige deutsche Sport-Elite. Vorne illuminiert der nahe Biergarten die Baustellenbegrenzung.

Alle Fotos wurden in Photoshop im Kontrast angezogen und entsättigt.

(Youtube - Infinite Mario AI - Long Level)

Hierbei handelt es sich um einen Beitrag zur Super Mario AI Competition von Robin Baumgarten.

Es geht darum eine künstliche Intelligenz zu erschaffen, die das Spiel Super Mario Bros. durchspielen kann. Bei obigem Versuch errechnet der Computer die möglichen Handlungen nur anhand des sichtbaren Bereichs und macht sie in Form der roten Linien sichtbar. Schon ganz passabel, würde ich sagen.

Gefunden bei bwl zwei null

Momentan richte ich einen WordPress-Blog auf 1und1-Webspace ein und wurde beim Hochladen von Bildern mit dem "HTTP Fehler" konfrontiert. Das Bild ist zwar auf dem Server gelandet, sogar da, wo es hin soll, doch konnte WordPress weder die Größe ermitteln, noch die obligatorischen Thumbnail- und 'Mittlere Größe'-Äquivalente anlegen.

Den "HTTP Fehler" gab es vor einiger Zeit schon einmal, beim Update auf die WordPress-Version 2.7. Damals lag es am Flash-Uploader, den man per PlugIn deaktivieren und das Problem somit lösen konnte.

In diesem Fall aber liegt es nicht am Flash-Uploader, sondern an dem Umstand, dass 1und1 die WordPress-Skripte als PHP4-Skripte parst. Richtigerweise werden diese jedoch als PHP5-Skripte geparst, was man durch folgenden Eintrag in die .htaccess-Datei erreichen kann:

.htaccess
AddType x-mapp-php5 .php
AddHandler x-mapp-php5 .php

Solltet ihr noch keine .htaccess-Datei haben, legt lokal bei euch eine leere htaccess.txt-Datei an, ladet sie ins root-Verzeichnis eurer WordPress-Installation hoch, entfernt das Suffix ".txt" und fügt einen Punkt an den Anfang des Dateinamens. Daraufhin wird die Datei wahrscheinlich verschwinden. Um sie wieder zu sehen, müsst ihr in eurem FTP-Programm das Anzeigen versteckter Dateien aktivieren.

Nun sollte der "HTTP Fehler" Vergangenheit sein.

Quelle: 1&1 Hilfe-Center

Ich habe tr.im immer gern genutzt, wenn ich meine Tweets mit einer Short URL anreichern wollte. Ich fand die Adresse toll und ebenso die Möglichkeit, die Statistiken bereits existierender Short URLs direkt auf der Startseite ablesen zu können, ohne vorher einen Account anlegen zu müssen.

Allerdings hat tr.im dicht gemacht, da die Macher nicht mehr die Mittel haben, das System weiter zu entwickeln, geschweige denn, es am Leben zu erhalten. Laut Angabe auf der tr.im-Homepage, war es auch nicht möglich, einen Käufer zu finden, was in Anbetracht der Sättigung des Short-URL-Service-Marktes nicht weiter verwunderlich ist. Dort tummeln sich mittlerweile wirklich eine Menge Akteure.

Nun gut, tr.im ist also tot. Welche Alternative nimmt man nun?

Ich persönlich wechsele zu mug.im. Das ist ein Service, den mein Freund Rocu ins Leben gerufen hat. Dieser arbeitet für YiGG.de, und YiGG selbst nutzt auch nur noch mug.im. Scheinbar wollten sie so die Abhängigkeit von externen Anbietern verringern, was keine schlechte Idee ist, wie das Beispiel tr.im zeigt.

Umgekehrt bedeutet das, dass der Service von mug.im wohl sicher ist, solange es YiGG gibt. Außerdem kann ich an dieser Stelle gleich noch die Integration einer BackUp-Lösung anregen. Vielleicht verknüpft mit dem YiGG-Account??!

Ansonsten noch ein paar Eckdaten zu mug.im:

  1. Macht URLs kurz
  2. Bietet eine API mit Statistik-Funktion

Nicht mehr, und nicht weniger.

Ist das Internet ein rechtsfreier Raum?

www.istdasinterneteinrechtsfreierraum.de

Ich habe mir einen lange gehegten Traum erfüllt und eine Single-Page-Website mit grotesk langer Adresse und einem knackigen Statement aufgemacht. Es geht um das unsägliche Mantra, das Internet dürfe kein rechtsfreier Raum sein. Allerdings liegt es nicht in meinem Interesse zu sagen, die Behauptung stimmt nicht, Ende der Diskussion.

Das Thema ist etwas komplexer und weder die Dramatisierung noch die Verharmlosung in dieser Sache zielführend. Vielmehr ist eine differenzierte Herangehensweise wünschenswert und die Würdigung der Tatsache, dass manche Rechte im Netz viel besser durchsetzbar sind, als in der Realität, manche genauso gut, und manche schlechter. Ebenfalls – man beachte die Parallelen zur Realität – braucht es im Netz nicht immer gleich neue Gesetze, sondern oftmals lediglich die konsequente Durchsetzung der bestehenden.

Und aufgrund dieser Komplexität und – ein Stück weit auch – Sensibilität dieses Themas, habe ich mich entschlossen ein paar erläuternde Artikel zu verlinken. Natürlich von mir ausgesucht, so dass die Auswahl massiv subjektiv gefärbt ist. Dieser Umstand wiederum hat mich dazu verleitet, eine Kommentar-Funktion zu integrieren, auf dass wir die "inhaltliche Färbung" der Auswahl gemeinsam ein Stück in Richtung Inter-Subjektivität drücken können.

Schlussendlich habe ich noch ein Impressum eingebaut, da das Internet wie oben angedeutet kein rechtsfreier Raum ist. Soviel zum Thema "Single-Page-Website mit grotesk langer Adresse und knackigem Statement". Naja, vielleicht klappts ja beim nächsten mal.