Nuova interfaccia grafica

Beh, intanto gli ho dato una rivestita. Adesso ha un aspetto un pochino meno povero. Anche la pagina di login è più curata. Poi ho dato un aspetto un pochino più gradevole anche alle icone del mare. Le prossime implementazioni saranno:

• zaino;
• raccolta degli oggetti;
• donazione degli oggetti;
• fondazione di un villaggio;

In particolare, per creare un villaggio un giocatore dovrà dichiarare di possedere un lotto di terra, o una cella che dir si voglia. Per poter sviluppare il villaggio, dovrà intervenire almeno un altro giocatore, il quale dovrà contribuire alla raccolta delle risorse necessarie per la costruizione. Automaticamente, verranno dichiarati i proprietari di questi territori.

La particolarità dello sviluppo del gioco, è che ricercando risorse ed esaurendole, verranno generate nuove celle di alveare. Per il momento non entro nel dettaglio, ma è interessante far notare che non esiste nessuna mappa prestabilita di questo mondo. Ho anche pensato che un domani la visuale dovrà necessariamente aumentare. Attualmente la visuale attuale è di 36 celle. Aumentando di uno il raggio di celle visibili si dovranno aggiungere altre 24 celle e complessivamente saranno 60 gli esagoni della visuale.

Incontro casuale

Che sfiga =( yago stava passeggiando per l’isoletta quando si è imbattuto in un oggetto prezioso. Purtroppo non accade nulla, perchè il personaggio non è ancora munito di uno zaino e quindi non può conservare oggetti. Nelle prossime features ci sarà la possibilità di avere uno zaino e di, in caso di ritrovamento, raccogliere degli oggetti.

Successivamente dovrò necessariamente occuparmi della fondazione di un villaggio. Al contrario di altri giochi non sarà un semplice fare click. Una volta che un giocatore deciderà di costruire un villaggio, darà ad altri giocatori di costruire il villaggio con lui. Non accadrà come in travian che basta fare click e si costruisce un edificio. In Yago tutti o parte degli abitanti dovranno contribuire.

Di fatto ora, ci sono una decina di giocatori. Introdurrò degli “incontri casuali” anche per loro nel caso non decidano di dormire in una locanda. La locanda dove si trova? Credo proprio che la dovranno costruire proprio i villeggiatori. Bene.

C’erano diverse ragioni per fare un giochino online. Fino a qualche tempo fa ero un animaletto da travian. Però travian ha un problema: costringe i giocatori a puntare la sveglia per difendere le proprie truppe da un attacco notturno. Poi c’era il fatto che in un gioco come quello puoi solo costruire il tuo villaggio. Di per se si tratta di un gioco molto ben fatto ed anche molto facile da usare. Però cercavo un giochino più elastico e mi sono detto che il giocatore deve poter decidere che cosa fare. Ci saranno giocatori che svilupperanno villaggi e giocatori che giocheranno come avventurieri. Non so se e quando sarà pronta una versione giocabile del gioco. Per ora vi mostro un paio di screenshot:

Anteprima Yago

Il “mondo” è fatto di celle esagonali e gli spostamenti si potranno fare usando quelle sei freccette direzionali che si vedono sulla sinistra. Un giocatore dispone di una serie di punteggi come magia, stamina, punti vita ed altro. I giocatori potranno girare per questo mondo liberamente. Chi vorrà potrà fare delle avventure, ma ci sarà anche la possibilità di costruire il proprio villaggio. La struttura esagonale sulla destra indica la visuale. L’esagono al centro è la posizione del proprio personaggio e mano a mano che aumenta la distanza le celle sono sempre meno nitide.

Se presenti, si potranno vedere gli altri giocatori che si trovano nella stessa cella del vostro personaggio. I giocatori potranno inviarsi messaggi. In oltre si potrà mettere mano al proprio profilo, magari modificando il background del proprio personaggio per rendere il gioco un po’ più interpretativo. I giocatori avranno a disposizione uno zaino e delle monete d’oro. Quindi si potranno mercanteggiare oggetti o donarli alle divinità e … beh insomma è ancora tutto da fare. Non è ne un clone di D&D ne un clone di travian. Spero che diventi figo come il primo e facile come il secondo.

Per non rimanerci male del fatto che nessuno si vuole registrare :-p… non rendo disponibile il link. Dimenticavo… ho usato il modello MVC ed il gioco è totalmente ad oggetti. Ho fatto un uso intensivo di jquery: c’è molto ma molto ajax.

Se leggete attentamente nel forum di skype (il primo post sull’argomento risale al 2 luglio del 2009), un amministratore vi dirà che si tratta di un’estensione per i nostri browser, che consente di riconoscere i numeri di telefono nelle pagine web e che quindi ci consente di telefonare con skype direttamente mentre stiamo navigando. Si tratta quindi di un aggiornamento della funzionalità “click-to-call” di skype.

Malware o aggiornamento? Onde evitare rischi, vi spiegherò come disabilitare l’opzione che riguarda questa estensione di skype per i browser. Malware o meno, non dovreste più ricevere seccature a riguardo. Cliccate sul menu start, pannello di controllo, e quindi su Programmi e funzionalità:

Disabilitare le funzionalità web di skype

Da qui potete disabilitare Skype Web Features. Fate semplicemente click con il tasto destro del mouse sul programma e quindi disabilitatelo. Io lo sto facendo in questo momento:

Disinstalliamo le web features di skype

Veniamo al dunque e partiamo con un’immgine eloquente, causata dalla corretta installazione di PHPUnit. Decisamente molto più semplice. Se avete letto il post precedente, non avrete bisogno di spiegazioni:

Corretta installazione di PHPUnit

Faccio un breve riassunto dell’accaduto:

1. Scarico XAMPP e lo installo.
2. Lancio alla rinfusa dei comandi come se stessi ancora operando con wampserver …
3. Ad un certo punto lancio “pear install phpunit/PHPUnit” e tutto funziona

In sostanza con XAMPP posso passare direttamente all’installazione di PHPUnit perchè, al contrario di wampserver, ha già PEAR installato. Molto bene. Adesso vediamo come posso usare PHPUnit per fare dei tests alle mie applicazioni php. Ne creerò una da zero, così potrete usufruire del mio sforzo =). (Speriamo che sia utile a qualcuno).

Creazione di un progetto per testare php con PHPUnit

Dopo aver creato il progetto, ho creato una classe “Giorni”. Questo esempio, ha uno scopo “sintattico” e non “semantico”. Non so quanto senso abbia creare una classe di questo tipo, ma lo scopo di questo post è mostrare come si fanno test con PHPUnit e non come si programma ad oggetti =). Va da se che ora vi beccate la classe più inutile della storia (occhio che nell’immagine c’è un errore: manca la keyword “function” prima di getNomeGiorno. Se non correggete questo errore, ovviamente non potrete generare l’unità di test):

Classe Inutile =)

Potevo anche evitare di programmare ad oggetti per un esempio così banale … Fatto sta che adesso arriva il bello: come creo l’unità di test per questo file? Adesso dobbiamo fare click con il tasto destro del mouse sul nostro file, quindi …

Come creare un'unità di test per una classe PHP

Con questo comando verrà generata un po’ di roba. Vi spiego: come potete notare, il nostro progetto di Netbeans contiene una cartella Source files ed una Include Path. Dopo questa operazione, avremo anche la cartella Test files. Nel frattempo, ho creato il primo test. Il test ha il compito di verificare che la classe funzioni correttamente. Mi aspetto che getNomeGiorno di 3, mi restituisca “Mercoledì”. Ho deciso che il programma deve funzionare in questo modo o comunque mi aspetto che si comporti in questo modo quindi …

Un primo test sbagliato con PHPUnit

Accidenti è sbagliato. Ovviamente l’errore era voluto. Infatti noi abbiamo chiesto il giorno numero 3 fosse Mercoledì. Il test ci segnala che getNomeGiorno non funziona correttamente. Infatti 3, per la funzione, non è la posizione ma l’indice. Andiamo subito a correggere la classe in  … ”return $this->nomi[$IndiceGiorno-1];”. La posizione 3, infatti, è l’indice 2. Gli umani contano da uno mentre gli array di php partono da 0. Dopo aver riscritto il codice, rilanciamo il test premento Alt-F6. Ecco il risultato:

Esempio di un test corretto con PHPUnit e Netbeans

Il nostro programma è stato testato correttamente. Ovviamente l’argomento non si estingue qui. Ma sicuramente può dare spunti su come iniziare a programmare partendo dai test. Non ne so più di quello che leggete qui, spero però che sia abbastanza per aiutare qualcuno in difficoltà a partire. =)

Buoni test a tutti.

Divido l’articolo in due parti: nella prima la mia sfida sarà rivolta a PEAR e Windows. Nella seconda parte, il nemico da affrontare si chiamerà semplicemente PHPUnit.

Parte prima: installiamo PEAR con wampserver.

Una suite di test per php che si integra con Netbeans è PHPUnit. Però PHPUnit ha bisogno di PEAR. Ed ecco lo smacco. Premetto che ho windows in questo momento percui sono andato sul sito di PHPUnit, e da li alla pagina di installazione. PHPUnit ha bisogno di PEAR per essere installato. Molto bene… installiamo PEAR.

Come si installa PEAR? Beh, se andiamo nel blog ufficiale di PEAR, dove mi dicono che devo digitare a riga di comando “go-pear.bat”. Ovviamente non funziona nulla. Al che cerco in giro per la rete una marea di soluzioni diverse ma nessuna efficace. Mi suggeriscono di andare a modificare le path di windows. Non sapendo bene che cosa dovevo fare… ho semplicemente constato che il comando php -d phar.require_hash=0 go-pear.phar non poteva trovare go-pear.phar dalla cartella di php per la banale ragione che si trova dentro la cartella PEAR.

Quindi per riuscire ad installare PEAR, ho modificato leggermente quel comando che tutti segnalavano in php -d phar.require_hash=0 PEAR/go-pear.phar da dentro la cartella di php [nel mio caso c:\wamp\bin\php\php5.3.0]. Ho anche modificato go-pear.bat in questo modo:

@ECHO OFF
set PHP_BIN=c:\wamp\bin\php\php5.3.0\php.exe
%PHP_BIN% -d output_buffering=0 c:\wamp\bin\php\php5.3.0\PEAR\go-pear.phar
pause


Finalmente mi ha richiesto se volevo installare PEAR. E certo che lo voglio installare. Poi ho fatto l’installazione in locale. E poi ho proseguito dicendo si a tutto da bravo informatico. =) Non fate come me insomma. Adesso incrocio le dita e spero che l’installazione di PHPUnit sia più fortunata.

Parte seconda: installiamo PHPUnit.

Cerco di seguire le indicazioni che mi segnala questo blog che pare fare al caso mio: Installare PHPUnit su WAMP. Ovviamente non è andato a buon fine. In particolare quel blog dice di lanciare PEAR_ENV.reg ma la cosa non piace al mio pc. Poco male, non è che mi freghi più di tanto che pear si possa usare ovunque (o almeno spero).

Lancio il comando successivo: pear channel-discover pear.phpunit.de. Molto bene, canale registrato. Ed ora… pear install phpunit/PHPUnit. Secondo voi? Secondo voi niente … non è andato:

Errore durante l'installazione di PHPUnit

Ma perchè?!?!?! Ho cercato in giro per internet “parse error in Unknown on line 14″. 3 link sono usciti dai risultati di Google, andiamo un pochino a vedere che cosa ci dicono. Ah! sia chiaro. A parte il primo blocco di PEAR… quello che state leggendo lo scrivo mentre “agisco”. Pensate: il secondo risultato è di una pagina di supporto a tutt’altro: un errore sulle stringhe json con jQuery. Fatto stà… che in fondo alla pagina in questione ci sono dei thread simili e la vedo questo “PEAR-BUG] Bug #16596 [Opn]: parse error in Unknown on line 14″ ed ho quasi paura a cliccare. Molto bene… quel link porta ad una risposta che dice:

“This happens when running PEAR commands from the Windows
Command Prompt. It seems like the dialog box is being produced by the
Windows OS, perhaps at the behest of PHP or pear.bat.”

Traduco:

Questo accade quando si eseguono i comandi PEAR dal Prompt dei Comandi di Windows. Sembra che la finestra di dialogo venga prodotta da Windows, magari su richiesta di PHP o di pear.bat

Cioè, abbiamo a che fare con un genio. =). Vabè, per non saper ne leggere ne scrivere… proviamo a ficcare il naso dentro pear.bat. Mannaggia… nulla di chiaro. A riga 14 non c’è nulla di interessante. Faccio più attenzione agli errori che mi mostra il Prompt dei comandi e … sorpresa:

phpunit/PHPUnit requires PEAR Installer (version >= 1.8.1), installed version is
1.8.0

Per questo post, PHPUnit/Wamp/PEAR 1 demo 0. Ovvero vado a dormire. Domani è un altro giorno! Spero di non metterci troppo a scrivere un POST “FINALE” che sveli l’arcano sull’installazione di PHPUnit su Windows Vista.

Analizzando il codice, ho verificato che il bottone è un semplice submit e la soluzione va quindi ricercata nell’evento onsubmit del tag form. Andando a vedere, si vede come venga richiamata la funzione handleAddToCart. E’ questa la colpevole della creazione del popup. Non so se sia modificabile da amministrazione questo messaggio/popup. Fatto sta che ora vi indicherò il file in cui si trova e più precisamente cosa modificare di questa funzione. L’obiettivo dell’intervento chirurgico, farà si che quando gli utenti cliccheranno su “aggiungi”, aggiorneranno immediatamente la pagina.

C’è da dire un’altra cosa: il template in cui utilizzo il mio VirtueMart, mostra il carrello lateralmente ed è per questo che non voglio che alla pressione del tasto “aggiungi” si vada nel carrello. In questo modo, ad ogni acquisto, si può vedere il carrello aggiornato lateralmente.

Il colpevole di questo popup si trova nel file [sito]/components/com_virtuemart/theme/theme.js

Al suo interno c’è la funzione di cui vi ho parlato: handleAddToCart(); Ricercate “handleAddToCart” per trovarla.

A questo punto analizziamo velocemente il codice di questa funzione:


function handleAddToCart( formId, parameters ) {
formCartAdd = document.getElementById( formId );
var callback = function(responseText) {
updateMiniCarts();
if (document.boxB) {
document.boxB.close();
clearTimeout(timeoutID);
}
document.boxB = new MooPrompt(notice_lbl, responseText, {
buttons: 2,
width:400,
height:150,
overlay: false,
button1: ok_lbl,
button2: cart_title,
onButton2: handleGoToCart
});
setTimeout( 'document.boxB.close()', 3000 );
}

var opt = {
method: 'post',
data: $(formId),
onComplete: callback,
evalScripts: true
}
new Ajax(formCartAdd.action, opt).request();
}


Questo codice, fa si che venga aperto il popup e siccome non lo volevo, ho brutalmente commentato il codice che non mi interessava ottenendo questo risultato:


function handleAddToCart( formId, parameters ) {
formCartAdd = document.getElementById( formId );
var callback = function(responseText) {
updateMiniCarts();
setTimeout( document.location.reload() , 3000 );
}
var opt = {
method: 'post',
data: $(formId),
onComplete: callback,
evalScripts: true
}
new Ajax(formCartAdd.action, opt).request();
}


Come si può vedere, ho eliminato il codice di troppo. Eheheh a dire il veri ho fatto queste modifiche così tanto tempo fa che non sono nemmeno sicuro che siano giuste. Ho postato tutto su vmitalia. C’erano alcuni utenti che aspettavano questo mio post da tempo così ho pensato di farlo anche qui. Spero di aver aiutato qualcuno in giro per la rete.

Tanto per dare un’informazione il più completa possibile, vi mostor nientepopodimeno che:
tutti gli oscar del 1962

Questo componente per joomla serve per inviare una newsletter. La newsletter sarà in formato HTML e quindi molto gustosa. Ora torno a lavorare. Il pattern MVC di joomla! non mi piace per nulla, devo essere sincero… ma una volta imparato, da tante soddisfazioni =).

Non vedo l’ora di completarlo e di rendere disponibile un vero e proprio installer per tutti coloro che vorranno usufruire di questo componente.

Così ho deciso di creare un componente per conto mio, basandomi si tutta una serie di fonti che documentereò. Sto creando un semplice tutorial di poche pagine ma scritto sufficentemente bene, per far capire persino ad un niubbo cosa sia il MVC e come si adopera in joomla.

Ora torno al mio componente e spero di potervi raccontare prest ed in modo chiaro e semplice, come si gioca con joomla.

La cosa è assurda. Fatto sta che sono andato a scavare il codice che invia le email e sorpresa, phpmailer non riesce a costruire correttamente l’header. Ho provato a registrarmi sia con un indirizzo di gmail ottenendo questo:

Date: Tue, 12 Jan 2010 03:22:20 +0100 Return-Path: From: Registrazione utenti <> Reply-To: Registrazione utenti Message-ID: <44ffffbc0197cce7915279957c5a8734@www.oragiovane.it> X-Priority: 3 X-Mailer: PHPMailer (phpmailer.sourceforge.net) [version 2.0.0 rc3] MIME-Version: 1.0 Content-Transfer-Encoding: 8bit Content-Type: text/plain; charset=”UTF-8″

E con quello alice.it invece:

Date: Tue, 12 Jan 2010 03:22:20 +0100 Return-Path: From: Registrazione utenti <> Reply-To: Registrazione utenti Message-ID: X-Priority: 3 X-Mailer: PHPMailer (phpmailer.sourceforge.net) [version 2.0.0 rc3] MIME-Version: 1.0 Content-Transfer-Encoding: 8bit Content-Type: text/plain; charset=”UTF-8″

Ho scavato un altro pochino nel codice e viene fuori che per ragioni che ignoro e che voglio scoprire domani… non riesce a costruire correttamente il “Message-ID”. Non ho trovato nulla su bug, o forum o altro. E’ anche facile che pochi abbiamo riscontrato problemi con alice.it e con joomla e con community builder contemporaneamente.

Fatto sta che per il momento ho risolto il “bug” semplicemente non inserendo l’header quando viene inviata la mail. Il file in questione è di phpmailer e trattandosi di una libreria opensource, credo che mi dovro sbrigare a segnalarlo agli sviluppatori. La cosa buffa, è che se faccio un var_dump di mail(); restituisce bool(true) ma la mail non viene mai inviata.

Gli interventi da fare sono due e sono sul codice html e su quello javascript. Analizziamo prima il codice HTML, e …

definiamo il “contenitore”, ovvero un div, delle immagini ed assegnamo un id a questo elemento.
<div id=”la_galleria”></div>

Al suo interno, inseriremo le immagini.
<div id=”la_galleria”>

<img src=”[...]” /div>
<img src=”[...]” /div>
…
<img src=”[...]” /div>

</div>

Facciamo si che ogni immagine sia anche un collegamento nel modo seguente
<div id=”la_galleria”>

<a href=”…”><img src=”…” alt=”" /></a>
<a href=”…”><img src=”…” alt=”" /></a>
…
<a href=”…”><img src=”…” alt=”" /></a>

</div>

Ed ora la seconda parte: come intervenire nel codice javascript:

Cosa fare nel codice Javascript:
$(‘#la_galleria a’).ligntBox();

Ovviamente il selettore “#id_galleria a” sta ad indicare tutti i collegamenti che si trovano dento l’elemento con id=”la_galleria”.

Molto bene: il mio esempio era generico. Ora se volete potete scaricare il codice di esempio che potete trovare direttamente nella pagina del plugin. Qui di seguito, mi elenco anche qualche altro link interessante su altri articoli che riguardano jQuery LightBox. Non limitatevi a questo post, osservate anche come il resto della rete ha fatto uso di questo fantastico elemento di jQuery.

Pagina ufficiale di jQuery LighjtBox

Integrazione con drupal

I migliori scripts di LinghtBox, facebook ed altri esempi

Un sacco di esempi, nell’edizione di balupton.com

Download di GoogleCode

Una marea di cloni di LightBox