Actionscript 3.0 for beginners: lesson #4

Martedì 11 Novembre, 2008

Riprendiamo il nostro codice di esempio del TicTacToe (che trovate per intero su Google Code) e iniziamo ad analizzarlo in dettaglio.

Importare le definizioni

Con Actionscript 3.0 è stato fatto un grande lavoro di pulizia e sistemazione nell'alberatura delle classi (contenute nei pacchetti, package) utilizzate durante lo sviluppo. In altri linguaggi di programmazione, come il C ad esempio, quando si desidera utilizzare una funzionalità bisogna esplicitamente "importarla" nel codice. Questa operazione di "importazione" è necessaria per permettere al compilatore di avere tutti i codici e le definizioni legate alla funzionalità che vogliamo usare. In Actionscript 3.0, tuttavia, l'istruzione import non va confusa con l'equivalente C/C++ #include; Actionscript 3.0 mette a disposizione l'istruzione include che è identica all'#include del C/C++. Quest'ultima, infatti, "include" effettivamente del codice che, se usato o meno, viene compilato nell'eseguibile finale. L'istruzione import è di più alto livello e risulta più "intelligente" in fase di compilazione. Essa serve principalemente per accedere alle classi senza doverne specificare il nome completo. In alre parole invece di usare forme del tipo:

Actionscript:
  1. var myMC:flash.display.MovieClip = new flash.display.MovieClip();

Continua a leggere... »

Post correlati

Very short trick: versatilità delle classi CSS

Lunedì 10 Novembre, 2008

I più esperti lo sapranno già, tuttavia mi viene spesso chiesto che differenza c'è tra class e id nei fogli di stile CSS. Una panoramica su alcune differenze e avvertenze è possibile trovarla in Classi e ID nei CSS, tuttavia una caratteristica utile, che distingue class da id, è la possibilità di usare classi multiple. Ad esempio è possibile definire:

CSS:
  1. .bordoNero {border:2px solid #000}
  2. .coloreRosso {color:#f00}
  3. .bordoRosso {border:2px solid #f00}

e scrivire nell'HTML:

HTML:
  1. <div class="bordoNero coloreRosso">Bordo nero con caratteri rossi</div>
  2. <div class="bordoRosso coloreRosso">Bordo rosso con caratteri rossi</div>

class, a differenza di id, può contenere al suo interno più definizioni in qualsiasi sequenza!

Post correlati

Very short snippet: Wordpress administrator?

Lunedì 3 Novembre, 2008

Amministratore o sottoscrittore? Ecco un modo rapido per capirlo:

PHP:
  1. global $user_ID;
  2. //
  3. $capabilities = get_usermeta( $user_ID, 'wp_capabilities');
  4. //
  5. if ( is_array( $capabilities ) ) {
  6.     if( $capabilities['Administrator']==1 || $capabilities['administrator']==1 ) {
  7.         echo "Sei un amministratore";
  8.     }
  9. }

Oppure, in forma "contratta":

PHP:
  1. global $user_ID;
  2. //
  3. $capabilities = get_usermeta( $user_ID, 'wp_capabilities');
  4. // $admin è true se amministratore
  5. $admin = ( $capabilities['Administrator']==1 || $capabilities['administrator']==1 );

Si possono ovviamente controllare tutti i livelli messi a disposizione da Wordpress, come subscriber ad esempio.

Post correlati

Wordpress: rimuovere i menu dell’amministrazione

Sabato 1 Novembre, 2008

Può risultare utile, a volte, "oscurare" alcuni menu dell'amministrazione di Wordpress, soprattutto se si è sviluppato un sito/blog per un cliente e non si vuole permettere l'accesso a funzionalità particolarmente delicate. Esistono Plugin che svolgono questa già funzione ma, per avere un controllo personale e completo, vediamo come funziona in dettaglio questa caratteristica.
Come sempre sfruttiamo le utilissime Action messe a disposizione da Wordpress, in questo caso admin_menu. Tramite la variabile globale $menu possiamo accedere alla lista dei menu dell'amministrazione. Possiamo individuare il menu da "eliminare" in due modi: tramite l'etichetta o tramite il link a cui punta (vedi parti commentati nell'esempio qui sotto). Nell'esempio proposto vengono "oscurate" le voci di menu Design, Impostazioni e Plugins:

PHP:
  1. function remove_menu_item() {
  2.     global  $menu;
  3.     // tramite label
  4.     $removes = array( 'Design', 'Impostazioni', 'Plugins' );
  5.     // tramite link
  6.     // $removes = array( 'themes.php', 'options-general.php', 'plugins.php' );
  7.     foreach( $removes as $todel )
  8.         foreach($menu as $key => $sm) if($sm[0] == $todel ) { unset( $menu[$key] ); break; }
  9.         // tramite link
  10.         // foreach($menu as $key => $sm) if($sm[2] == $todel ) { unset( $menu[$key] ); break; } 
  11. }
  12. //
  13. add_action('admin_menu',    'remove_menu_item');

L'uso del link come chiave per la rimozione ($sm[2] nelle parti commentate nel codice qui sorpra), è utile quando non si ha certezza della lingua - localizzazione - con cui è stato installato Wordpress. Con questa tecnica, tuttavia, il menu è rimosso solo a livello di interfaccia, quindi sarà possibile ancora accedere alla pagina tramite una link diretto.

Post correlati

Very short snippet: PHP plain date

Venerdì 31 Ottobre, 2008

Converte una data dal formato yyyy-mm-dd hh:mm:ss a yyyymmddhhmmss. Utile per poter sfruttare le funzioni di ordinamento; tipo asort().

PHP:
  1. /**
  2. * Format from "yyyy-mm-dd hh:mm:ss" to "yyyymmddhhmmss"
  3. */
  4. function plainDate( $d ) {
  5.     return( preg_replace( '/(-|:|\040)/', '', $d ) );
  6. }

Sempre meglio di questo:

PHP:
  1. function plainDate( $d ) {
  2.     return( str_replace( ' ', '', str_replace('-','', str_replace(':', '', $d) ) ) );
  3. }

O addirittura di questo:

PHP:
  1. function plainDate( $d ) {
  2.     $pd = explode(' ', $d);
  3.     $dd = explode('-', $pd[0]);
  4.     $hp = explode(':', $pd[1]);
  5.     return( $dd[0].$dd[1].$dd[2].$hp[0].$hp[1].$hp[2] );
  6. }

Post correlati

jQuery: bordi rotondi sulle immagini per sovrapposizione

Giovedì 30 Ottobre, 2008

A causa dei diversi rendering tra i vari browser, che vedono sicuramente Microsoft Internet Explorer in testa, bisogna sempre ricorrere ad artifizi particolari per applicare effetti che, ormai, dovrebbero rappresentare uno standard. I pluri-discussi bordi arrotondati sono un classico esempio del "disastro" prodotto dalla completa incapacità di realizzare uno standard serio sul rendering delle pagine HTML/CSS. Esistono in rete numerosissime soluzioni che permettono di ottenere "effetti" (effetti che esonerano dall'HTML attuale come bordi arrotondati, effetti ombra, riflessioni, etc...) con patch sui fogli di stili, particolari trucchi con l'uso di div innestati, librerie Javascript, uso delle canvas, etc...
A titolo puramente didattico vorrei illustrare un'ulteriore tecnica (cross-browser) per applicare dei bordi arrotondati a delle immagini:

Demo e sorgenti

Continua a leggere... »

Post correlati

Creare applicazioni Desktop con Google Chrome e FireFox?

Martedì 28 Ottobre, 2008

Google Chrome permette di creare applicazioni Desktop a partire da una pagina Web? In realtà, come indicato nella voce di menu, è semplicemente permesso di creare una scorciatoia ad un collegamento che - a sua volta - apre una finestra senza barra degli indirizzi e senza tutti i "fronzoli" del browser. Con questo non significa che abbiamo creato un'applicazione Desktop; abbiamo solo creato un link allo stesso Google Chrome in modalità - per così dire- chrome-less.

Caratteristica simle, ma più ambiziosa, era già stata proposta dalla fondazione Mozilla nel 2007, tramite il progetto Prism. Questo è sicuramente più versatile ed articolato, corredato anche da un'utile estensione che permette di creare applicazioni desktop dal menu di FireFox, alla stregua di Google Chrome.

Tuttavia, entrambe le soluzioni, sono ben lontane dalla tecnologia Adobe AIR. Prima che qualcuno le confonda è bene sottolineare le differenze sostanziali tra un collegamento sul desktop, che apre una finestra senza menu, ed una applicazione desktop vero e propria.
Adobe AIR, infatti, a differenza delle soluzioni proposte da Google Chrome e Prism permette:

  • Accesso virtualmente completo al sistema su cui gira l'applicazione, con la possibilità di leggere e scrivere file. Possibilità di estendere le proprie funzionalità tramite dll (dynamic link library), estensioni e prodotti di terze parti come SHU Player (vedi Distribuire applicazioni Adobe AIR: da AIR Badge a SHU Player)
  • Gestisce l'applicazione come le altre applicazioni di sistema: installazione e disinstallazione

Post correlati

Wordpress: scrivere un logout personale

Lunedì 27 Ottobre, 2008

Partendo dal post Wordpress: come creare passo passo un proprio login, eseguita la procedura di login potrebbe essere utile indicare all'interno del nostro blog un link per effettuare la disconnessione, ovvero il logout. Non useremo anche in questo caso le procedure standard di Wordpress, ma vedremo come eseguire il logout a basso livello. Prima di tutto dobbiamo capire se un utente è loggato o meno. Questo è possibile interrogando semplicemente la variabile $user_ID di Wordpress. Ad esempio:

PHP:
  1. if( $user_ID != '' ) { // oppure if( is_user_logged_in() ) {
  2.     // un utente risulta "loggato" ...
  3. }

Una volta che sappiamo che un utente è "loggato" nel sistema, possiamo inserire un semplice link ad una nostra pagina di logout. Creiamo quindi una pagina, ad esempio logout.php, e inserendo il seguende codice:

PHP:
  1. /**
  2. * Esegue il logout
  3. *
  4. * @author            Giovambattista Fazioli
  5. * @email             g.fazioli@undolog.com
  6. * @web               http://www.undolog.com
  7. */
  8.  // Invoke WordPress bootstrap
  9. @require_once('wp-config.php');
  10. @require_once('wp-includes/pluggable.php');
  11. // wp logout
  12. wp_logout();
  13. // carico qualsiasi altra pagina
  14. header( "Location: /" );

E sufficiente quindi "linkare" alla nostra pagina per fornire una procedure di logout:

PHP:
  1. if( $user_ID != '' ) {
  2.     echo 'Esegui il <a href="logout.php">logout</a>';
  3. }

Post correlati

Wordpress: come creare passo passo un proprio login

Venerdì 24 Ottobre, 2008

In questo tutorial vedremo come creare una procedura di Login personale, utilizzando anche funzionalità Ajax tramite jQuery. Ci sono vari metodi per personalizzare il login di Wordpress, ad esempio tramite l'uso di hook e filtri (add_action(), add_filter()). Noi qui useremo una procedura più a basso livello, anche se ci interfacceremo comunque al Kernel di Wordpress. Inoltre faremo in modo di convalidare un utente tramite la dupla email/password.

Perchè realizzare un proprio login?

  • In alcuni contesti può ritornare uitle avere il massimo controllo sulla pagina di login, per proporre un layout personalizzato ai nostri utenti registrati. Inoltre si può arricchire la pagina con informazioni utili, dal un logo al classico "Password dimenticata?"
  • Per permettere l'accesso tramite l'email (come nell'esempio qui trattato) al posto dello user_login standard di Wordpress
  • Per avere la possibilità di inserire un pannello di login nella sidebar del nostro Blog
  • E infine, per avere uno scheletro - ed un'idea - per un ottimo Plugin :D

Ambiente

Nel nostro esempio/tutorial lavoreremo sulla root di Wordpress all'interno di una cartella mylogin. Creiamo due file php all'interno di questa cartella: index.php e logon.php. Il primo conterrà l'interfaccia del nostro login, con tutte le funzioni Javascript/jQuery che ci servono. Il secondo file, logon.php, conterrà il codice per la validazione dell'utente. Creiamo poi una cartella css e dentro questa un file layout.css e una cartella images. All'interno della cartella images inseriremo un classico Ajax loader: createlo online su AjaxLoad.info. Alla fine dovreste avere:

  • mylogin
    • index.php
    • logon.php
    • css
      • layout.css
      • images
        • ajax-loader.gif

Continua a leggere... »

Post correlati

FireFox: la gestione dei profili

Giovedì 23 Ottobre, 2008

Mozilla FireFox permette di gestire più profili, funzionalità utile a chi, come me, sviluppa siti web e necessita di tutta una serie di estensioni dedicate al debug e all'analisi delle pagine Web. Tramite l'uso dei profili è possibile configurare differenti impostazioni di FireFox:

Firefox salva le informazioni personali come i segnalibri, le password e le preferenze in un gruppo di file chiamato profilo situato in una posizione diversa rispetto ai file di programma di Firefox.

Su Windows Vista (vedi qui per altri sistemi operativi) è possibile accedere alla gestione dei profili dal comando Esegui usando:

CODE:
  1. firefox -ProfileManager

Gestione dei profili

Uno dei vantaggi nell'uso dei profili è quello di poter avere un FireFox per navigare, senza quindi tutte le toolbar e le estensioni per il debug e un FireFox per sviluppare, corredato da FireBug e tutti gli altri tool di sviluppo.

Post correlati