Marcel Eichner // Ephigenia

  • Home
  • Illustration
  • Code
  • Kontakt

Aktuelle Projekte

Horrorblog.org
jQuery.slideShow
Franklin
code.marceleichner.de

This Blog-Website is built with Harrison!

Blogs & Freunde

Gimmixx
Martin Fleck
Torsten Bergler
Jens Franke
Robokid
Peter Kröner
Polycoder
Coding Horror
Lotterliebe
CodeBalancer
Pseudocoder
Migrador
Dachdeckermeister Peter Arold in Werda, Plauen, Hof und Umgebung La Petite Provence - Pension und Festsaal in Leisnig Piv-Berlin, Immobilienverwaltung Verwaltung Berlin blogoscoop

#507

04.07.2011 19:51
0 Kommentare
Share
  • php
  • apache
  • gd-lib
  • image
  • server
  • nginx
  • static
  • content
  • delivery
  • .htaccess
One problem when relaunching large projects with a ton of images is to re-create all the thumbnails that users have uploaded in the years. If you don’t use paperclip (ruby) or anything like it in PHP (is there any like it!?) where you can run run one command to re-create all the thumbnails in all specified sizes your can try to keep it flexible and create every image on demand.

Theory

The Webserver should serve the image if it exists. If the file does not exist, the request should be redirected to a PHP script that searches and creates the requested image file (in requested size) at exactly the location it was originally requested. The second request on the file will not be redirected to the PHP script and will server the image that now exists.

Practice

So the first thing to archive is to send the request of a not existing image to a PHP file. That’s easy if you’re familiar with all the nginx directives:

This rule can be combined with the anti-hotlinking rules for images with nginx I showed you last week.

After that we need to create a format that includes width and height of any requested image so that the
thumbnailer.php
knows which size the created image should have. A valid request for a resized file should always have all parameters (width, height) in it:
../img/public/9c4be029/438xauto/filename.jpg

This makes it easy to split up width, height with a regexp in
thumbnailer.php
. The following code is just an example. You’re surelly integrate the logic into your frameworks:

That’s it! After that you can request any image in any size on your webserver by only creating it once it’s requested.

There are some things you can add, like other parameters in the
$formatRegexp
string to add different resizing methods or even filters, or limitations on the
width
and
height
parameter.

Appendix: Apache

It’s almost the same thing with apache. Just add a few lines to your
.htaccess.
and all your image requests are redirected to the thumbnailer (or anything):

#506

28.06.2011 11:16
0 Kommentare
Share
  • config
  • facebook
  • server
  • nginx
  • hotlinking
  • referer
  • block
  • how-to
Almost two weeks ago I moved my personal blog-project horrorblog.org from a domainfactory managed hosting server to a JiffyBox which is a scalable cloud server solution also by domainfactory. I won’t talk about the setup for now (but later this or next week) but I want to show you an example for a nginx config file that prevents your images from beeing hotlinked but still enabling google and facebook.

Prevent hotlinking in nginx is really simple and some rules and examples can be found via google:
# apply this rule on any location that’s an image using Regexp
location ~* \.(png|gif|jpg|jpeg|swf|ico)(\?[0-9]+)?$ {
  # block empty blocked or whiteliste referers
  valid_referers none blocked horrorblog.org www.horrorblog.org;
  if ($invalid_referer) {
    return 403;
  }
}

This works fine, unless you won’t have your images displayed on facebook when anybody likes your stuff with the facebook share button (og:image) or in google image search. The solution that enables facebook to grab the images from your host is by adding
~\.facebook\.
and
~\.fbcdn\.
to the whitelist of hosts:
# apply this rule on any location that’s an image using Regexp
location ~* \.(png|gif|jpg|jpeg|swf|ico)(\?[0-9]+)?$ {
  # block empty blocked or whiteliste referers
  valid_referers none blocked horrorblog.org www.horrorblog.org ~\.google\. ~\.yahoo\. ~\.bing\. ~\.facebook\. ~\.fbcdn\.;
  if ($invalid_referer) {
    return 403;
  }
}

#505

30.03.2011 19:25
0 Kommentare
Share
  • google
  • filter
  • mail
  • notification
  • boolean
  • operator
Nach dem ich am Montag Die Kunst der Mailminimierung - Hermetisches Schreiben von Sascha Lobo auf Webciety gelesen hatte, hab’ ich mich gestern Abend ran gemacht und meine Google Mail Filter überarbeitet. Der Vorteil daran, seine Mails direkt in Google Mail zu filtern, und nicht erst im Mail Client (Mail, Thunderbird) liegt darin, dass die E-Mails schon von Google gefiltert werden und so auf jedem Endgerät, auf dem man seine E-Mails lesen will, schon sauber sortiert ankommen.

Bestimmt hat jeder von euch irgendeinen kleinen Filter, der zum Beispiel Newsletter oder die Mails von der Familie in einen entsprechenden Ordner legt.
So lange man dabei mit der Benutzung der ersten drei Felder From, To und Subject, die später alle zu einer UND Verknüpfung werden, klar kommt, ist alles super. Nun ist es aber so, dass man, wenn man mehrere Kriterien die auf To und Subject mit ODER verknüpft werden sollen nur zwei Möglichkeiten hat:
Entweder man erstellt zwei Filter mit einmal dem gefüllten To Einstellungen und einmal mit gefüllten Subject Einstellungen oder man macht es auf die elegante Weise und benutzt das Has the Words Feld.

Dieses Has the Words sucht eigentlich in der gesamten E-Mail (auch in den Headern) nach dem Vorkommen der gewünschten Zeichenkette. Wenn man den Suchbegriff jedoch mit geschweiften Klammern {} einklammert kann man hier jede Menge coole Sachen machen:

Suche in E-Mails die an horrorblog.org gingen, dabei soll es egal sein ob sie direkt oder via cc an horrorblog.org gingen:
Abgekürzt geht’s auch so:

Der Clou dabei ist, wie oben schon erwähnt, das Google Mail jetzt in den Feldern mit ODER statt mit UND sucht. Hätte man einfach in die From, To Felder horrorblog.org eingetragen, hätte der Filter nur funktioniert, wenn die Mail von und an horrorblog.org geschickt worden wäre.

Die ganze Macht der Filter kommt auch in dem folgenden Beispiel zu tragen, mit dem man alle E-Mails die von so automatischen Services kommen gesammelt in einen Ordner Notifications packen lassen kann:

Die generelle Syntax für die UND oder ODER Verknüpfungen in den Filtern wird auch in Build advanced Gmail filters and persistent searches bei Lifehaker beschrieben wo es heisst, dass normale Klammern () immer UND bedeuten und geschweifte Klammern {} ein ODER. Diese Filter kann man übrigens am besten bearbeiten, wenn man sie vorher in einem Text-Editor (mit Syntax Highlighting) bearbeitet und dann in das Feld pastet. Die Filter funktionieren auch in der normalen Suche von Google Mail.

#503

14.07.2010 11:40
0 Kommentare
Share
  • firefox
  • tool
  • open
  • source
  • console
  • Nerd
  • extension
Screenshot vom Vimperator in Aktion
Auf dem LinuxTag 2010 hat Caspar die Vimperator Erweiterung für den Firefox Browser vorgestellt die ich mir zu Hause gleich zu Gemüte geführt habe.

Die Erweiterung ist total für Nerds gedacht. Man kann den kompletten Browser, alle Links und Befehle von der durch den Vimperator hinzugefügten Kommandozeile aufrufen. So bekommt man noch mal mindestens 100 Pixel in der Höhe Platz für die Websites und gerade auf Netbooks ist das eine Menge Platz!

Nach einer leichten Einführungsphase um die wichtigsten Befehle wie
o www.spon.de[ENTER]
für Seite aufrufen oder
t www.horrorblog.org[ENTER]
für Tab öffnen zu lernen hab ich mir mitlerweile die komplette Bedienung zugelegt und auch schon mein erstes "Plugin" geschrieben das mit die aktuelle URL mit Bitly als ShortURL in die Zwischenablage legt. Hier meine eigene
.vimperatorrc
Datei die noch ein paar mehr Sachen macht:
" only use with buftabs plugin
set showtabline=0
"
custom colorsheme
colorscheme darkness
" set textmate as editr

set editor="mate -w"
" show hover links in status bar

set showstatuslinks=2
js document.getElementById("status-bar").setAttribute("moz-collapsed", false);
" no error sound, just flash display

set errorbells visualbell
" alternative tab navigation

map b gt
map v gT
" tab navigation via arrow keys

map <Left> <C-p>
map <Right> <C-n>
map h <C-p>
map l <C-n>
" bit.ly shortener.

javascript <<EOF
shortenURLIsGd = function (url) {
  var req = new XMLHttpRequest();
  " get your username and api key from bit.ly!!!

  req.open("GET", "http://api.bit.ly/v3/shorten?login=[Username]&apiKey=[API_KEY]&format=txt&longUrl=" + escape(url), true)
  req.onreadystatechange = function (ev) {
    if (req.readyState == 4) {
      if (req.status == 200) {
        util.copyToClipboard(req.responseText, true);
      } else {
        liberator.echo(req.responseText);
      }
    }
  }
  req.send(null);
}
EOF
map <silent> short :javascript shortenURLIsGd(buffer.URL);<CR>
map <silent> bitly :javascript shortenURLIsGd(buffer.URL);<CR>

Des weiteren sei noch erwähnt, dass man noch weitere ColorShemes oder Vimperator Plugins im Internet findet. Ein super Plugin ist auch das Buftabs Plugin, dass sogar die Tableiste überflüssig macht.

[UPDATE #1] Dank der Aktualisierung von Geshi, das das Code-Highlighting hier im Blog erledigt sieht das Vim-Script jetzt auch schön bunt aus.

#496

27.05.2010 03:49
0 Kommentare
Share
  • osx
  • usa
  • software
  • windows
  • game
  • Case
  • Sensitive
  • Steam
  • Valve
  • Spiele
  • Plattform
Es ist schon erstaunlich und lobenswert, dass VALVE nach Jahren der Abstinenz auf -nix-basierten Systemen endlich seine STEAM-Plattform auch für Macs anbietet. Dumm nur wenn man, wie ich, den kram runterlädt, starten will, aber nur mit dieser lapidaren Meldung abgespeist wird die ihr oben sehen könnt. Anscheinend kann man STEAM nur benutzen, wenn man seine Festplatte richtig formatiert hat.

Nach dem ich Google befragt habe, finde ich ein paar Anleitungen wie man STEAM auch auf einem Case-Insensitiven System zum laufen bekommen kann. Ich bin aber gar nicht davon angetan, meine volle Fesplatte noch weniger, dass ich eine weitere Partition nur für STEAM, in case-sensitive anlegen soll! Das kann ja eigentlich auch nicht hinhauen. Ich bin selbst Programmierer und bin der Meinung, dass die Jungs bei VALVE mal ihren Code aufräumen müssen, nicht ich meine Platte umgestalten!

#490

22.11.2009 21:33
0 Kommentare
Share
  • Web
  • osx
  • virtual
  • box
  • google
  • os
  • preview
  • test
  • screenshots
Das Horrorblog in Chrome OS
Letzte Woche Freitag Nacht wurde von Google der Source Code aka Quellcode zu deren Online-Betriebssystem Chrome OS released. Ein paar Videos und noch mehr Infos gibt’s in dem dazugehörigen Blog-Post im Chrome-Blog.

Wer es drauf hatte auf Ubuntu seinen eigene Version zu compilieren kann sich glücklich schätzen und kennt sich wahrscheinlich gut damit aus. Ich musste mich mit dem Versuch begnügen das ganze mit einem Festplatten-Image von GDGT in Virtual Box (3.0.12 r54655) auf Snow Leopard (10.6.2) zum Laufen zu bekommen. Nachdem ich den Netzwerkadapter auf Desktop umgestellt habe, Linux - Ubuntu - Other Linux wie in der Anleitung angegeben hatte zeigte sich auch endlich der Login-Screen! So, jetzt noch die Tücken der englischen Tastatur besiegen und nachdem das "z" im Passwort auch hübsch als "y" auf der Tastatur eingegeben wurde komm ich auch mit meinem Google Account rein! (Manchmal geht das wohl nicht weil die Server überlastet waren?)

Ja, wie ist es? Ganz nett - es kann noch nich’ viel, alles läuft quasi im "Browser". Das Schachspiel das man schon gesehen hat vielleicht läuft in Flash und ich glaube nativ installiert, auf einem Netbook, ist Chrome OS superschnell! Frisch hochgefahren mit 3 Fensterchen offen, verbrauchte Chrome OS nur ca. 50MB!

Ich bin gespannt wie das fertige System aussehen wird. In einem Jahr wird sich ja hoffentlich noch viel Ändern und noch mehr "Programme" geboten werden. Zum Websites-Testen braucht man Chromium auf jeden Fall nicht - da reicht auch der Chrome-Browser.

#474

21.07.2009 09:32
0 Kommentare
Share
  • code
  • Web
  • tip
  • cake
  • links
Jetzt fang ich glaub ich auch an alle paar Tage mal ein paar Links zu posten die sich so ansammeln. Quer durch den Gemüsegarten wie man das von anderen Blogs auch gewohnt ist:

* Online RegExp Teste (PHP)
* iphone werbung die man nie sehen wird :D
* Wieso man Login-Versuche begrenzen sollte
* Streetfiles feiert 1-Jähriges! Herzlichen Glückwunsch!
* Google Visualization API
* msn live mail captcha cracked (via Instant-Thinking)
* Cakefest Berlin Sheets (Danke Oli!)
* Yahoo Pipes CakePHP Super Feed

#464

19.06.2009 16:27
0 Kommentare
Share
  • code
  • php
  • google
  • tool
  • cron
  • job
  • statistic
  • graph
  • seo
  • open
  • source
  • franklin
Franklin ist ein kleines Tool das Werte über eine Website (mit Hilfe von Google oder API’s) ausliest, abspeichert. Diese kann man sich später in einem Graphen anzeigen lassen.
Der Funktionsumfang ist noch nicht wirklich immens, aber für die kleine Überwachung für den SEO Profi oder aus eigenem Interesse vielleicht einen Blick Wert.
Als Beispiel, damit man sich eine Vorstellung von der Ausgabe machen kann hab ich eine Demo online gestellt, die auch schon eine Weile läuft: franklin.marceleichner.de.
Achso ganz nebenbei großen Dank an die Sourceforge Leute die einen echt feinen Service haben!

#454

19.05.2009 13:32
0 Kommentare
Share
  • google
  • telekom
  • router
  • 404
  • fehler
  • dns
  • routing
  • ads
[[480x|zuYL26xN.png]]
Seit Mitte April sendet die Deutsche Telekom bei nicht gefunden Seiten falsche DNS Einträge an seine Kunden um Ihnen eine Navigationshilfe zu bieten. Ich dachte erst es sei sowas die Domain-Parken mit Werbung aber die Telekom verdient sich warscheinlich ein kleines Sümmchen aus den Einnahmen der Google-Ads die auf den Seiten geschalten sind.
Ein Beispiel für die Anzeige (für alle Nicht-Telekom-Kunden) gibt es hier: Beispiellink bei domain ebayde Wie das Technisch funktioniert kann man im Nexem Blog nachlesen.

#449

31.03.2009 14:14
0 Kommentare
Share
  • osx
  • tip
  • tool
  • apple
  • quartz
  • filter
  • pdf
  • print
Ich hatte gerade das Problem das ich ein gescanntes PDF mit mehreren Seiten verkleinern wollte. Leider kann man das ohne die Adobe Acrobat Professional Version in der man einfach als PDF drucken kann nicht so mir nichts dir nichts am mac erledigen.
Ein paar Minuten mit Google verbracht und schon gibt es die Lösung! Einfach die Quartz Filter aus diesem Zip hier in ~/Library/Filters packen und schon kann man sehr einfach Dateien in der Vorschau als PDF mit weniger DPI speichern.
  • 1
  • 2
  • weiter »
marceleichner HTML5 Harrison Theme (Validate Source), © 2010 by Ephigenia M. Eichner, Impressum