Archive for the ‘Javascript’ Category

Link Interessanti: Oracle e eseguire un MP3 con Javascript

gennaio 30, 2007

Cercando inforamazioni su una funzione di Oracle sul web ho trovato questa utile reference:

http://www.psoug.org/reference/builtin_functions.html

Mentre ieri su Ajaxian sono venuto a conoscenza di questo utile framework per eseguire file MP3 con Javascript:

http://www.schillmania.com/content/projects/soundmanager2/

Ho trovato molto interessante queso framework che veramente con semplicità permette di eseguire un file MP3 (appoggiandosi a Flash 8). Ecco un semplice esempio:

<script type=”text/javascript” src=”/script/soundmanager2.js”></script><script type=”text/javascript”>

soundManager.defaultOptions.debugMode = false;

soundManager.url = ‘/soundmanager2.swf’; // path to movie

soundManager.onload = function() {

soundManager.createSound({

id:’mySound1′,

url:’test.mp3′

});

}

</script>

</head>

<body>

<input type=”button” value=”test” onclick=”soundManager.play(‘mySound1’);”/>

</body>

</html>

Annunci

Ajax di prima mattina

novembre 24, 2006

Stamattina mentre facevo la mia visitina quotidiana a Ajaxian ho visto due interessanti news:

  • E’ stato rilasciato una nuova versione di qooxdoo framework e consigli a tutti di provarlo perchè è veramente carino
  • Open-jACOB Draw2D che è una libreria per la creazione di workflow che sembra ecceziunale veramente (esempio).

Per ora è tutto brava gente:D

Pushlet: Un modo semplice per un semplice server push

novembre 20, 2006

Chi sta seguendo da vicino l’evoluzione che è nata intorno al web da quando è stato introdotto AJAX avrà forse sentito parlare di COMET. Questa tecnologia è basata sull’HTTP Streaming, metodologia utilizzata solitamente dai plugin multimediale per l’invio in streaming di contenuti audio video. A differenza di una semplice richiesta HTTP la connessione non viene aperta e chiusa ogni volta che avviene, ma viene semplicemente aperta una prima volta per poi essere lasciata sempre aperta in modo da permettere un transito continuo di dati senza dover fare nuove richiesta, in parole povere: ad una sola richiesta corrispondono molteplici risposte. Se per esempio abbiamo un lettore di RSS che si aggiorna in automatico la soluzione che applicheremo solitamente è quella di leggere l’RSS ad intervalli di tempo regolari e controlleremo se è cambiato rispetto alla versione precedente. Questo approccio comporterà molte richieste e risposte inutili con un notevole dispendio di risorse. Non sarebbe meglio se fosse la nostra risorsa risorsa ad avvertire la nostra applicazione quando viene modificata e quindi quando effettivamente deve avvenire l’aggiornamento? Se la vostra risposta è SI allora continuate a leggere l’articolo, se invece avete risposto NO potete anche fermarvi qui.
Vedo che avete scelto SI, quindi torniamo a noi: quanto detto prima è possibile grazie al server push e le Pushlet inventate da un ingegnere olandese sono una semplice soluzione al nostro problema. Altra soluzione molto interessante, ma commercial è data anche da un server push creato da una ditta italiano, ma utilizzato in tutto il mondo, il suo nome è Lightstreamer.

La particolarità delle Pushlet è quella di fare un grosso utilizzo della tecnologia DHTML e AJAX, rendendo praticamente inutile la scrittura di codice java.

Una piccola parentesi sull’installazione:
Per prima cosa è necessario scaricare il progetto da SourceForge. Fatto questo creiamo una semplice web application e copiamo le seguenti definizioni all’interno del file web.xml:

<!– Define the pushlet servlet –>
<servlet>
<servlet-name>pushlet</servlet-name>
<servlet-class>nl.justobjects.pushlet.servlet.Pushlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<!– Define the Servlet Mappings. –>
<!– The pushlet –>
<servlet-mapping>
<servlet-name>pushlet</servlet-name>
<url-pattern>/pushlet.srv</url-pattern>
</servlet-mapping>

Fatto questo dobbiamo copiare all’interno della cartella contenente i nostri file sorgenti i due file di configurazione con estensione properties che si trovano nella cartella “pushlet-2.0.2\webapps\pushlet\WEB-INF\classes”. Questi file in fase di deploy andranno messi dentro la cartella “WEB-INF\classes” della nostra web application. Come ultimo passo dobbiamo copiare la libreria pushlet.jar presente nella cartella “pushlet-2.0.2\lib” nella cartella WEB-INF\lib della nostra web application. Svolte queste semplici operazioni preliminari siamo finalmente pronti a scrivere un po’ di codice!

Dalla teoria alla pratica:
Tralascio i dettagli tecnici riguardo il loro funzionamento e passo direttamente a una spiegazione molto pratica.

Il loro funzionamento si basa su un semplice principio:

“Io ho un messaggio che può essere modificato e quando questo viene modificato io devo avvertire tutte le risorse che ne sono in attesa”

Quindi il primo passo è definire un nome da dare a questo messaggio, nel nostro esempio sarà “/test”. Scelto il nome definiamo i campi che questo deve contenere, nel nostro caso conterrà solo “text”, ma può contenerere quanti messaggi vogliamo (o almeno quanti ne riusciamo a fare entrare in un array javascript). Nel nostro esempio il campo “text” conterrà la stringa presente in un campo di testo. L’invio della stringa avverrà alla pressione del tasto invia.

Scriviamo quindi la seguente pagina html e salviamola con nome server.html:

<html>
<head>
<script type="text/javascript" src="lib/ajax-pushlet-client.js"></script>
<SCRIPT type="text/javascript">
function send(msg){
p_publish('/test', 'text', msg);
}
</SCRIPT>
</head>
<body onload="p_join('/test');">
<INPUT type="text" id="textField" value="test"/>
<INPUT type="button" onclick="send(document.getElementById('textField').value);" id="invia" value="invia" />
</body>
</html>

Creaiamo ora il file client.html con il seguente codice al suo interno:
<html>
<head>
<script type="text/javascript" src="lib/ajax-pushlet-client.js"></script>
<SCRIPT type="text/javascript">
function onData(event) {
var text = event.get('text');
document.getElementById("textField").value = text;
}
</SCRIPT>
</head>
<body onload="p_join_listen('/test');">
<INPUT type="text" id="textField" />
</body>
</html>

Creati i due file copiamoli dentro la cartella root del nostro progetto, e colleghiamoci a http://localhost:XXXX/nomeProgetto/server.html e http://localhost:XXXX/nomeProgetto/client.html.

Scrivendo un testo all’interno di serverl.html e premento il tasto “invia” la textbox presente in client.html verrà “magicamente” aggiornata.

Conclusioni:
Le pushlet sono ancora in evoluzione e ad oggi presentano ancora qualche piccolo difetto, ma il suo realizzatore insieme alla comunità OpenSource sta lavorando assiduamente per realizzare un sistema sempre più affidabile.
Attualmente questo sistema è in utilizzo presso diverse applicazioni commerciali citate dallo stesso autore sul sito del progetto. Inoltre sul sito del progetto e nell’archivio che avete scaricato trovate molti esempi da studiare.

Spero di aver stuzzicato la vostra curiosità su questo argomento senza dubbio molto interessante e di cui, a mio parere, sentiremo parlare nel tempo che verrà.

Chi desidera scaricare l’esempio qui descritto può cliccare qui.

Grazie per l’attenzione.

Lettura consigliata sul web che verrà…

ottobre 29, 2006

Se avete un po’ di tempo vi consiglio la visione di queste slide di Brendan Eich della Mozilla Corporation su Javascript 2 ed il futuro del Web legate soprattutto alle novità che la massiccia introduzione di Ajax e delle Rich Application nel mondo web potrebbe portare.

Io personalmente inizio sempre più a pensare che ormai le Rich Application per il web non siano semplicemente una moda ma qualcosa di veramente fattibile ed interessante. Sicuramente per alcune applicazioni il solito approccio risulterà vincente, ma molte altre applicazioni possono ora nascere sul web senza eccessive complicazioni, prendendo spunto da un intervento fatto da un ragazzo del Moonlab  durante il JavaDay di Verona direi che finalmente una applicazione web si potrà considera multithread!

Ecco i sorgenti di JRemoteCaller

ottobre 27, 2006

Ecco la prima versione (anche se grezza e poco commentata) di JRemoteCaller. Nel fine settimana vedrò di lavorarci ancora un po’ su e presentare qualcosa di più decente. Buon download

JRemoteCaller

ottobre 24, 2006

Nonostante l’ora ecco una piccola anteprima di:

JREMOTECALLER

Per il momento è ancora una versione meno che alpha perchè devo ancora decidere come gestire gli errori, ma credo sia la soluzione che adotterò nello sviluppo di applicazioni basate su Ajax.

Articolo interessante su Prototype

ottobre 23, 2006

Girando per il web alla ricerca di informazioni su Prototype ho trovato questo interessante articolo che spulcia letteralmente al suo interno. Leggete con attenzione gente, c’è veramente da imparare.

Per chi poi desidera una interessante introduzione a questo framework javascript consiglio:

http://www.sergiopereira.com/articles/prototype.js.html

oppure:

http://www.sitepoint.com/article/painless-javascript-prototype

Beh gente, credo ce ne sia per tutti i gusti:D

Annunciatemi al pubblico prima di subito con espressioni di giubilo!!!

ottobre 22, 2006

Ajax, quanto se ne sente parlare in questo periodo…beh, ho deciso di mettermici a lavorare su anche io e dopo una prima svista con Dojo (troppo intrusivo secondo me) sono passato a Prototype + Scriptaculus e devo dire che mi ci trovo molto bene. Rimane però il problema dell’architettura da utilizzare, quelle vecchie non sono più molto comode. A tal fine ho creato con l’aiuto di prototype + beanshell un sistema per fare l’eval di codice java all’interno di codice javascript tramite le seguenti tre funzioni javascript:

  • objectToString(exp): fa il toString dell’operazione da eseguire
  • serializeBean(exp ): da usare quando come risultato ci si aspetta un bean. Questa funzione restituirà un oggetto di tipo json
  • addImport(path): aggiunge una libreria al contesto.

In questo modo sarà possibile scrivere in javascript cose del tipo:

addImport(“java.math.BigDecimal”);
objectToString(“new BigDecimal(5).add(15)”);

Nei prossimi giorni seguirà una piccola applicazione di esempio, il codice di esempio e una spiegazione più dettagliata…

Buona attesa gente…

Lavagna

ottobre 18, 2006

Una lavagna dove l’insegnate puç disegnare e scrivere dei messaggi che appariranno in tempo reale allo studente, in modo da simulare una lezione sincrona. Tutto questo tramite un semplice broser web, senza l’installazione di plug-in. Potrebbe dare qualche problema con IE. Con Firefox ed Opera sembra funzionare bene. (in realizzazione)

Email

ottobre 18, 2006

Questo script crea una specie di override di un normale mailto: inserito all’interno di un link visualizzando una finestrina per l’invio di una mail al sito desiderato. Vedete il codice html per capire come questa cosa sia trasparente ed anche adatta a siti per disabili o con javascript disabilitato. Inoltre per includere questa funzionalità basta includere i js in cima alla pagina e basta. (in realizzazione)