Herzlich willkommen
Ihr Browser unterstüzt entweder kein JavaScript oder sie haben es abgeschaltet.
Bitte aktualisieren Sie Ihren Browser oder aktivieren Sie JavaScript, um das komplette Angebot
unserer Internetseite nutzen zu können.
Moin, Moin!
Auf dieser Seite findet Ihr das, was ich in Sachen Perl und JavaScript so über die Jahre zusammengetragen habe und was eventuell auch für euch interessant bzw. nützlich sein könnte.
Unter anderem auch das Grundgerüst für diese Seite selbst. Mehr dazu hier .
Fragen, Anregungen und konstruktive Kritik zu allem, was hier veröffentlicht wird, sind ausdrücklich erwünscht.
Perl
Zu Perl bin ich eher zufällig gelang. Meinem VDR-Rechner (VDR ) fehlte eine für mich sehr wichtige Funktion, nämlich die, Aufnahmen zusammenzufügen. Um diese Aufgabe zu lösen, habe ich mich an den vorhandenen Skripten orientiert - und die waren nun mal in Perl geschrieben.
Inzwischen nutze ich Perl auch beruflich, hauptsächlich für administrative Aufgaben sowie für Webanwendungen. Dabei kommen mir die Recherchemöglichkeiten auf CPAN zugute, dem umfangreichen Perl-Archiv.
Für manche Probleme findet sich dort allerdings keine Lösung. Deshalb sind JavaScript::Packer , CSS::Packer und HTML::Packer entstanden.
HTML::Packer
HTML::Packer ist ein HTML-Code-Cleaner, ebenso wie HTML::Clean , allerdings mit einem deutlich geringeren, auf das Nötigste beschränkten Funktionsumfang. Der Vorteil gegenüber HTML::Clean besteht darin, dass JavaScript::Packer und CSS::Packer zum Komprimieren von JavaScript- und CSS-Abschnitten in HTML-Dateien verwendet werden können.
Je nach Anforderung sollte man sich also vorab überlegen, ob HTML::Clean nicht eine Alternative zu
HTML::Packer ist.
Ohne weitere Optionen entfernt HTML::Packer
alle Leerzeichen, die mit Sicherheit überflüssig sind, sowie alle Leerzeilen.
use HTML::Packer;
my $html = <<'END_OF_HTML';
<a href="/" >link
1 < /a>
<!-- comment -->
< a href="/"> link 2
< / a >
END_OF_HTML
HTML::Packer::minify( \$html );
print $html;
mit dem Ergebnis:
<a href="/">link
1 </a>
<!-- comment -->
<a href="/"> link 2
</a>
Mit der Option 'remove_newlines' werden zusätzlich alle Zeilenumbrüche entfernt.
use HTML::Packer;
my $html = <<'END_OF_HTML';
<a href="/" >link
1 < /a>
<!-- comment -->
< a href="/"> link 2
< / a >
END_OF_HTML
HTML::Packer::minify( \$html, { 'remove_newlines' => 1 } );
print $html;
mit dem Ergebnis:
<a href="/">link 1 </a><!-- comment --><a href="/"> link 2 </a>
Um Kommentare zu entfernen, kann die Option 'remove_comments' verwendet werden:
use HTML::Packer;
my $html = <<'END_OF_HTML';
<a href="/" >link
1 < /a>
<!-- comment -->
< a href="/"> link 2
< / a >
END_OF_HTML
HTML::Packer::minify( \$html, { 'remove_comments' => 1 } );
print $html;
mit dem Ergebnis:
<a href="/">link
1 </a>
<a href="/"> link 2
</a>
Die Option 'do_javascript' ermöglicht es den Kompressionsmodus für JavaScript-Abschnitte in der HTML-Datei festzulegen.
Mögliche Werte sind 'minify', 'shrink' and 'base62'. Das funktioniert natürlich nur, wenn
JavaScript::Packer
installiert ist.
Die Option 'do_stylesheet' legt den Kompressionsmodus für CSS-Abschnitte in der HTML-Datei fest.
Mögliche Werte sind 'pretty' und 'minify'. Auch das funktioniert nur, wenn
CSS::Packer
installiert ist.
Die aktuellste Version des Moduls ist auf CPAN verfügbar:
HTML::Packer
JavaScript::Packer
JavaScript::Packer ist die Perl-Version von Dean Edwards' Packer.js. Siehe http://dean.edwards.name/packer/ .
JavaScript::Packer ist ebenso wie JavaScript::Minifier und
JavaScript::Minifier::XS ein Perl-Modul zum Komprimieren von JavaScript-Dateien, arbeitet allerdings mit regulären Ausdrücken und ist dadurch deutlich schneller als JavaScript::Minifier und im Gegensatz zu JavaScript::Minifier::XS nur in Perl geschrieben.
Das Modul kann auch von HTML::Packer
verwendet werden, um Inhalte des Script-Elementes in HTML-Quelltexten zu komprimieren.
Als Kompressionsmodi können 'clean', 'shrink', 'obfuscate' und 'best'. verwendet werden.
Kompressionsmodus 'clean' ist die Standardeinstellung und entfernt überflüssige Leerzeichen, Leerzeilen und
Zeilenumbrüche.
use JavaScript::Packer;
my $js = <<'END_OF_JS';
function ( hmpf ) {
var argh = 'blah blubb';
var y = 3;
alert( argh );
var x = 1;//@a
var x = hmpf;/*@ abcd
var x = 1;@*/ abcd
/*a*/
/*
blah
*/
var z = $H(); // comment
};
// another comment
/*@ abcd
var x = 1;@*/
END_OF_JS
JavaScript::Packer::minify( \$js, { 'compress' => 'clean' } );
print $js;
mit dem Ergebnis:
function(hmpf){var argh='blah blubb';var y=3;alert(argh);var x=1;//@a
var x=hmpf;/*@abcd var x=1;@*/abcd var z=$H()};/*@abcd var x=1;@*/
Kompressionsmodus 'shrink' kürzt, wenn möglich, zusätzlich Variablennamen:
use JavaScript::Packer;
my $js = <<'END_OF_JS';
function ( hmpf ) {
var argh = 'blah blubb';
var y = 3;
alert( argh );
var x = 1;//@a
var x = hmpf;/*@ abcd
var x = 1;@*/ abcd
/*a*/
/*
blah
*/
var z = $H(); // comment
};
// another comment
/*@ abcd
var x = 1;@*/
END_OF_JS
JavaScript::Packer::minify( \$js, { 'compress' => 'shrink' } );
print $js;
mit dem Ergebnis:
function(a){var c='blah blubb';var y=3;alert(c);var x=1;//@a
var b=a;/*@abcd var x=1;@*/abcd var z=$H()};/*@abcd var x=1;@*/
Kompressionsmodus 'obfuscate' macht exakt das gleiche, wie Dean Edwards' Packer.js:
use JavaScript::Packer;
my $js = <<'END_OF_JS';
function ( hmpf ) {
var argh = 'blah blubb';
var y = 3;
alert( argh );
var x = 1;//@a
var b = hmpf;/*@ abcd
var x = 1;@*/ abcd
/*a*/
/*
blah
*/
var z = $H(); // comment
};
// another comment
END_OF_JS
JavaScript::Packer::minify( \$js, { 'compress' => 'obfuscate' } );
print $js;
mit dem Ergebnis:
eval(function(p,a,c,k,e,r){e=function(c){return c.toString(a)};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('9(a){0 c=\'d 8\';0 6=3;7(c);0 4=1;//@a \n0 b=a;/*@5 0 4=1;@*/5 0 e=$2()};',15,15,'var||H||x|abcd|y|alert|blubb|function||||blah|z'.split('|'),0,{}))
Wie unschwer zu erkennen ist, ist das Ergebnis deutlich länger als der ursprüngliche Code. Das widerspricht natürlich dem eigentlichen Bestreben, den JavaScript-Code zu komprimieren. Also gibt es noch einen weiteren Kompressionsmodus 'best'. Wie der Name schon andeutet, wält dieser Modus zwischen 'shrink' und 'obfuscate' den Modus, der das kürzere und somit beste Ergebnis liefert.
Die aktuellste Version des Moduls ist auf CPAN verfügbar:
JavaScript::Packer
CSS::Packer
CSS::Packer ist ebenso wie CSS::Minifier und CSS::Minifier::XS ein Perl-Modul zum Komprimieren von CSS-Dateien, arbeitet allerdings mit regulären Ausdrücken und ist dadurch deutlich schneller als CSS::Minifier und
im Gegensatz zu CSS::Minifier::XS nur in Perl geschrieben.
Das Modul kann auch von HTML::Packer
verwendet werden, um Inhalte des Style-Elementes in HTML-Quelltexten zu komprimieren.
Als Kompressionsmodi können 'pretty' und 'minify' verwendet werden.
Der Kompressionsmodus 'pretty' ist die Standardeinstellung und entfernt "nur" überflüssige Leerzeichen und -zeilen:
use CSS::Packer;
my $css = <<'END_OF_CSS';
a {
color: black
;} div
{ width:100px;
}
END_OF_CSS
CSS::Packer::minify( \$css, { 'compress' => 'pretty' } );
print $css;
mit dem Ergebnis:
a{
color:black;
}
div{
width:100px;
}
Kompressionsmodus 'minify' hingegen entfernt alle Leerzeichen und Zeilenumbrüche:
use CSS::Packer;
my $css = <<'END_OF_CSS';
a {
color: black
;} div
{ width:100px;
}
END_OF_CSS
CSS::Packer::minify( \$css, { 'compress' => 'minify' } );
print $css;
mit dem Ergebnis:
a{color:black;}div{width:100px;}
Die aktuellste Version des Moduls ist auf CPAN verfügbar:
CSS::Packer
cpan_watch.pl
cpan_watch.pl ist ein Skript, das ich täglich als Cronjob laufen lasse, um per CPAN installierte Module auf Updates zu überprüfen. Ist für ein Modul eine aktuellere Version auf CPAN verfügbar, wird automatisch ein E-Mail mit Informationen zur aktuellen sowie installierten Version generiert. Der Versand erfolgt standardmäßig an "root" und kann durch Anpassen der Variablen $MAILTO geändert werden.
Der Aufruf des Skriptes mit dem Parameter '-install' installiert eventuell vorhandene aktuellere Versionen. Auch hierzu wird eine Mitteilung versendet.
Download:
JavaScript
Um mir das Arbeiten mit JavaScript etwas zu vereinfachen, greife ich gerne auf zwei großartige Frameworks zurück: Das ist zum einen Prototype und zum anderen script.aculo.us , wobei script.aculo.us auf Prototype basiert. Nicht unerwähnt bleiben sollte auch Datejs und Really Simple History (RSH) .
Prototype halte ich persönlich inzwischen für unverzichtbar, die anderen Bibliotheken nutze ich nur zusätzlich bei Bedarf. Diese Seite würde beispielsweise ohne Prototype , script.aculo.us und Really Simple History (RSH) nicht funktionieren.
calendarpopup.js
Dass calendarpopup.js dem einen oder anderen bekannt vorkommen mag, ist kein Zufall. Ich habe Matt Kruses CalendarPopup.js umgeschrieben, sodass es mit Prototype und Datejs funktioniert.
Der Vorteil gegenüber Matt Kruses CalendarPopup.js ist der, dass Datejs für die Darstellung der Monats- und Tagesnamen und deren Abkürzungen verwendet wird. Die Funktionen "CP_setMonthNames()" etc. entfallen also. Einzig die Funktion "setTodayText()" musste bleiben, weil sie von Datejs nicht unterstützt wird.
Diejenigen, die weder Prototype noch Datejs benutzen möchten, sollten sich ernsthaft überlegen, das Original von Matt Kruse zu verwenden, da ansonsten die doch recht umfangreichen Bibliotheken zusätzlich einzubinden wären.
Alle andern müssen prototype.js , date.js und popupdiv.js einbinden.
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="date.js"></script>
<script type="text/javascript" src="popupdiv.js"></script>
<script type="text/javascript" src="calendarpopup.js"></script>
Der einfachste Kalender wird wie folgt erstellt:
var cal = new calendarPopup(
{
'anchorId' : 'div_id'
}
);
Dabei sollte 'div_id', oh Wunder, die id eines Div-Objektes sein.
Es können auch gleich mehrere Optionen übergeben werden. Es folgen alle Optionen mit ihren Standardwerten:
var cal = new calendarPopup(
{
'anchorId' : 'div_id,
'debug' : false,
'autohide' : true,
'xOffset' : -152,
'yOffset' : 25,
'returnFunction' : null,
'returnMonthFunction' : null,
'returnQuarterFunction' : null,
'returnYearFunction' : null,
'isShowYearNavigation' : false,
'displayType' : 'date',
'yearSelectStartOffset' : 2,
'todayText' : 'Today',
'cssPrefix' : '',
'isShowNavigationDropdowns' : false,
'isShowYearNavigationInput' : false
}
);
Alternativ können einige Optionen auch später gesetzt werden.
cal.setDisplayType( 'date|week-end|month|quarter|year' );
definiert was mit dem Kalender ausgewählt werden kann und letztendlich dadurch auch das Aussehen des Kalenders.
date -> Tag
week-end -> Wochenende
month -> Monat
quarter -> Quartal
year -> Jahr
cal.setReturnFunction( handler ); // date, week-end
cal.setReturnMonthFunction( handler ); // month
cal.setReturnQuarterFunction( handler ); //quarter
cal.setReturnYearFunction( handler ); // year
definiert die Return-Handler für die verschiedenen Kalendertypen.
cal.setIsShowYearNavigation( true|false );
Legt fest, ob in der Kalendernavigation ein Auswahlfeld für Jahre vorhanden sein soll.
cal.setIsShowNavigationDropdowns( true|false );
legt fest, ob in der Kalendernavigation Auswahlfelder für Jahres- und Monatsauswahl angezeigt werden sollen.
cal.setIsShowYearNavigationInput( true|false );
legt fest, ob in der Kalendernavigation ein Textfeld für die Eingabe eines Jahres angezeigt werden soll.
cal.setYearSelectStartOffset( number );
legt fest wie viele Jahre im Voraus ausgewählt werden dürfen, falls in der Kalendernavigation ein Auswahlfeld für Jahre vorhanden ist.
cal.setTodayText( string );
legt fest welcher Text für das Wort "Heute" angezeigt werden soll. Der Standardwert is "Today".
cal.setCssPrefix( string );
legt den Prefix für alle CSS-Klassen des Kalenders fest. So können eigene Styles für den Kalender benutzt werden.
cal.updateCalendar( date );
zeigt den Kalender an. Erwartet als Parameter ein Date-Objekt.
blendet den Kalender aus. Diese Methode ist eine Methode der Elternklasse "popupDiv".
cal.updateCalendarFromInput( { 'dateId' : 'date' } );
cal.updateCalendarFromInput( { 'dateId' : 'date', 'dateFormat' : 'dd.MM.yy' } );
cal.updateCalendarFromInput( { 'yearId' : 'year', 'monthId' : 'month', 'dayId' : 'day' } );
legt den angezeigten Zeitraum eines Kalenders anhand eines, zweier oder dreier Input-Felder fest.
cal.setDisabledWeekDays( [ 0, 'Tueday' ] );
deaktiviert bestimmte Wochentage im Kalender. Die Wochentage können als Nummer und/oder als Namen angegeben werden, wobei die Namen im "kulturspezifischen" Format angegeben werden müssen, so wie in der date.js angegeben.
var date = new Date.today();
cal.addDisabledDates( date );
deaktiviert einen einzelnen Tag.
var date = Date.today().last().monday();
cal.addDisabledDates( null, date );
deaktiviert alle Tage bis einschließlich des Datums, das im zweiten Parameter angegeben ist.
var date = Date.today().next().friday();
cal.addDisabledDates( date, null );
deaktiviert alle Tage ab einschließlich des Datums, das im ersten Parameter angegeben ist.
var start_date = new Date.march();
var end_date = new Date.april();
cal.addDisabledDates( start_date, end_date );
deaktiviert alle Tage ab einschließlich des Datums, das im ersten Parameter angegeben ist bis einschließlich des Datums, das im zweiten Parameter angegeben ist.
Download der aktuellsten Version:
popupdiv.js
Ein einfaches Pop-up wird wie folgt erstellt:
var popup = new popupDiv(
{
'anchorId' : 'div_id',
'debug' : false,
'autohide' : true,
'xOffset' : 50,
'yOffset' : 100,
'content' : null
}
);
Der einzig notwendige Parameter ist 'anchorId'. 'div_id' sollte dabei die ID eines Div-Objekts sein. Mit 'debug' legt man fest, ob eine Warnmeldung erscheinen soll, falls einem Parameter ein falscher Wert zugewiesen wurde. 'xOffset' und 'yOffset' legen die Position des Pop-ups fest, relativ zu dem Element mit der ID 'div_id'. 'autohide' legt fest, ob das Pop-up bei einem Klick außerhalb der Pop-up-Begrenzung automatisch geschlossen werden soll. 'content' ist der Pop-up-Inhalt.
popup.updatePopup( content );
aktualisiert den Pop-up-Inhalt bzw. öffnet das Pop-up, falls es geschlossen sein sollte. Diese Methode erwartet einen String oder ein HTML-Objekt.
schließt das Pop-up.
Download der aktuellsten Version:
Impressum & Rechtliches
Anschrift
E-Mail
Internet
www.aequinoctium.org
mit freundlicher Unterstützung bei der grafischen Gestaltung
www.grafischefreiheiten.de
Haftungshinweis
Trotz sorgfältiger inhaltlicher Kontrolle übernehme ich keine Haftung für die Inhalte
externer Links. Für den Inhalt der verlinkten Seiten sind ausschließlich deren
Betreiber verantwortlich.