Guardicchiando per un progetto mi sono imbattuto in HTML::CalendarMonth, un modulo perl interessante per la generazione di calendarietti in html.
Il tutto si basa sui moduli HTML::Element che creano degli oggetti per la gestione dei singoli elementi della pagina html. Segue un esempio particolarmente brutto, ma utile ai fini di capire la logica.
Il punto della questione è definire gli elementi HTML con l’apposito costruttore new(‘tag’, eventuale_attributo => ‘come hash’); gli elementi possono poi essere gestiti con una struttura parent-child attraverso il metodo push_content che ordina in un array gli elementi che lo compongono.
# HTML::Element crea oggetti con nomi/tag e attributi.
my $html = HTML::Element->new(‘html’);
my $head = HTML::Element->new(‘head’);
my $title = HTML::Element->new(‘title’);
$title->push_content(‘Titolo della pagina’);
my $body = HTML::Element->new(‘body’);
my $h1 = HTML::Element->new(‘h1′);
$h1->push_content(‘Header nel body’);
my $hlink = HTML::Element->new(‘a’, href => ‘http://www.simotrone.it’);
$hlink->push_content(‘il mio sito’);
my $p = HTML::Element->new(‘p’);
$p->push_content(‘Questo paragrafo ha un link: ‘, $hlink, ‘.’);
$head->push_content($title);
$body->push_content($h1, $p);
$html->push_content($head, $body);
print $html->as_HTML;
Per ottenere:
Ok, fin qui sembra una pompa, 150 righe per ottenerne 5. Non molto economico.
Comunque il punto della questione era far vedere HTML::CalendarMonth, che sfruttando i moduli suddetti ritorna cose interessanti con poco codice. 
Con queste poche righe…
use HTML::CalendarMonth;
my $cal = HTML::CalendarMonth->new( month => 10, year => 2009 );
$cal->item($cal->year, $cal->month)->attr(style => ‘background-color: wheat; font-size: 150%;’);
$cal->col(0)->attr(style => ‘font-weight: bold’);
print $cal->as_HTML;
possiamo ottenere questo:
| October | 2009 | |||||
| Sun | Mon | Tue | Wed | Thu | Fri | Sat |
| 1 | 2 | 3 | ||||
| 4 | 5 | 6 | 7 | 8 | 9 | 10 |
| 11 | 12 | 13 | 14 | 15 | 16 | 17 |
| 18 | 19 | 20 | 21 | 22 | 23 | 24 |
| 25 | 26 | 27 | 28 | 29 | 30 | 31 |
E con la semplice aggiunta di un ciclo for che genera i mesi e di una sub possiamo ottenere un calendario molto flessibile.
my ($mm,$yyyy) = @_;
my $cal = HTML::CalendarMonth->new( month => $mm, year => $yyyy );
$cal->item($cal->year, $cal->month)->attr(style => ‘background-color: wheat; font-size: 150%;’);
$cal->col(0)->attr(style => ‘font-weight: bold’);
print $cal->as_HTML;
print "\n";
}
for (1,2,3) {
mensile($_,1979);
}
Su Debian i pacchetti sono questi qua:
Desired=Unknown/Install/Remove/Purge/Hold
| Status=Not/Inst/Cfg-files/Unpacked/Failed-cfg/Half-inst/trig-aWait/Trig-pend
|/ Err?=(none)/Reinst-required (Status,Err: uppercase=bad)
||/ Name Version Description
+++-=================-=================-=======================
ii libhtml-calendarm 1.19-1 generate and manipulate
calandar months in HTML
ii libhtml-element-e 1.17-3 extended HTML::Element
classes
ii libhtml-tableextr 2.10-3 module for extracting
the content contained
in tab
Tempo addietro m’ero fatto uno script in bash per scrivermi rapidamente un layout html standard (coi tag html, head, body, il doctype, ecc.).
Aveva qualche opzione, ma era una cosa semplice e comunque utile.
Ora posso farlo semplicemente così:
<!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" lang="en-US" xml:lang="en-US">
<head>
<title>[% title %]</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
</body>
</html>
Il [% title %] è per preparare il campo a TT, niente di che.
Come “prendere” una selezione col mouse su una pagina html grazie a javascript?
Semplice: si scrive una funzione js che accatta la selezione. Il problema, come al solito, è capire QUALI oggetti danno la possibilità di prendere l’evento che ci interessa e COME questi oggetti operano.
(Odio i browser e javascript che sta in mezzo a ste cose.)
Nei vari browser mozzillari getSelection restituisce il testo della selezione, mentre in Exploder l’oggetto raccattato con selection è un TextRange che va manipolato ancora un pochetto.
var selected = ”;
var area = document.getElementById(‘name_area_dove_stampare’);
if (document.getSelection) {
selected = document.getSelection();
} else if (document.selection) {
// Parte per IE
selected = document.selection.createRange().text;
}
area.value = selected;
}
Per altro sui browser come FFox si puo’ fare anche un’altro numero:
var area = document.getElementById(elemento);
selected = area.value.substring(area.selectionStart, area.selectionEnd);
}
In questo caso stiamo ottenendo la substring che inizia nella posizione dove inizia la selezione, e finisce nella posizione dove finisce la selezione (in pratica estrapola la stessa porzione di testo, capendo la posizione degli estremi con selectionStart e selectionEnd).
Boh, che orticaria.
Ah, nota interessante: Opera (che è sempre un sacco avanti) supporta entrambi i metodi (document.getSelection e document.selection)
Molte info accattate su quirksmode.org.
Nota, se non si fosse capito: Il mio rapporto con javascript e coi CSS è decisamente conflittuale (più odi che amo, per intenderci).
Un indice di un resoconto di articoli sui css, da smashingmagazine.com.
Mastering CSS, Part 1: Styling Design Elements
- Layout and User Interface Techniques
- Navigation and Menu Techniques
- Image Styles and Galleries
- Typography Techniques
- Icons, Buttons and Links
Mastering CSS, Part 2: Advanced Techniques and Tools
- Calendars, Lists, Tables, and Timelines
- iPhone CSS Techniques
- Form and Search Techniques
- Visualization Techniques
- Other Handy Techniques and Tips
- CSS3 Techniques
- CSS Tools
- More Articles and Resources
Per ora ho usato i form, e letti gli articoli riguardanti le date (O_O), il testo sulle immagini, e gli angoli da sfogliare (bellissimo, provate il demo!). Molto carini anche gli articoli sulle liste visualizzabili in maniera diversa e riguardanti la validazione dei form.
Ho trovato un giochino bellissimo.
Inserite il testo. Date un’immagine a caso, e selezionate.
Hide an image in html
Genera anche il codice.
Bellissimo.
Ok, weekend nel marasma delle webapplication.
Ricapitolo un po’…
* Passaggi dati non numerici (potenzialmente massicci) in POST, ritorno in GET (per forza).
* Controllo in entrata di pagina (isset, is_numeric, blablabla, check di esistenza sul db).
* Funzioni di escape sui dati da inserire nel db. (pg_escape_string, mysql_real_escape)
* Funzioni di escape in output sul codice html (giusto per evitare scriptini e tag interpretabili): htmlentities.
* Funzioni stripslashes per togliere gli escape nel db in output.
* Check con regexp (preg_match) sulle stringhe inserite, ocio ai filename con rischio per gli header serviti.
Un po’ di storie dal php security consortium.
Scegliere i colori per fare un qualunque disegno o progetto grafico, è spesso un’impresa. Se non lo è per tutti, di sicuro lo è per me.
Credo che sia particolarmente difficile scegliere dei bei colori per le proprie pagine web, non banali ma coerenti (lasciate perdere qua, il sito di Ghost Rider senza catene, per ora).
Of course, ci si rifugia in templete già fatti… ma a me non concede una gran soddisfazione.
Tempo addietro ho sviluppato un progettino personale sfruttando alcune colorazioni tratte da un libro che mi piace molto.
Un titolo rosso
Una frase a caso, scritta verde su panna!
Posto su l’arco ed incoccato il dardo, traeva seduto, siccom’era, al petto con la man destra il nervo: indi la mira tra i ferrei cerchi prese, e spinse il telo, che, senza quinci devïare o quindi, passò tutti gli anelli alto ronzando.
Fatto sta che mi sono poi ritrovato a dover inventare altri schemi, e non sempre le scelte sono state facili.
Di recente ho scoperto 3 strumenti davvero notevoli, online e gratuiti.
- Color Blender Color Scheme Tool – permette di esplorare un range (1-10) di sfumature fra due colori (ie: l’ho trovato utile per i pulsani).
- Colormatch Remix Color Scheme Tool – dato un colore, estrae un pattern di 9 colori più o meno bilanciati.
- Colour Scheme Chooser – dato un colore ed una regola (complementari, monocromo, ecc.) estrae una gamma di colori utili.
A me questi strumenti son sembrati molto carini e utili, e il sito è ricco di guide sugli aspetti più vari del web design..
Non risolvoneranno tutti i problemi, ma aiutano.