| 
                 
                
                
                 
                
		 
	
		| Precedente :: Successivo   | 
	 
	
	
		| Autore | 
		Messaggio | 
	 
	
		kluster Dio maturo
  
 
  Registrato: 15/04/06 13:14 Messaggi: 2898
 
  | 
		
			
				 Inviato: 19 Nov 2006 22:48    Oggetto: * Le principali Javascript Libraries | 
				     | 
			 
			
				
  | 
			 
			
				Per velocizzare il proprio lavoro, chi è nel ramo della programmazione tende di solito ad utilizzare delle librerie, che non sono altro che una raccolta di funzioni utili pronte per essere utilizzate a richiamo.
 
Per quanto riguarda il client-scripting si tratta per lo + di uno o + file con estensione js che hanno un'insieme di proprieta' e di metodi che possono essere utilizzati ad esempio per far apparire/scomparire un elemento della pagina, creare una transizione, interagire con gli eventi della pagina, interrogare tramite Ajax (XML HTTP Request) una sezione interna al sito o proveniente addirittura da un'altro sito.
 
 
Le principali e migliori librarie utilizzate dagli sviluppatori sono le seguenti:
 
 
Prototype: http://prototype.conio.net/
 
Senz'altro la più completa, che fa da base a molte altre librerie.
 
Ottimizzata per  estendere proprio le funzionalita' del linguaggio stesso javascript
 
I metodi sono tanti ed utilissimi, dagli effetti animati, all'ajax, a vere e proprie "aggiunte" utili agli oggetti interni del linguaggio javascript.
 
Per uno studio approfondito vi rimando alla:
 
Guida per gli sviluppatori che utilizzano prototype.js (Versione 1.4.0)
 
 
Behaviour: http://bennolan.com/behaviour/
 
Un nuovo metodo per "collegare" un evento ad un elemento della pagina, mantenendolo separato dal markup html.
 
 
Moo.fx: http://moofx.mad4milk.net/
 
Derivata da prototype e sviluppata da un programmatore italiano, è ottimizzata per gli effetti grafici:
 
Basta dare un occhiata alla pagina di test, per rendersene conto.
 
La documentazione è disponibile qui:
 
http://docs.mootools.net/
 
http://www.avinashv.net/tutorials/moofx/ (The Idiot's Guide To moo.fx)
 
La libreria inoltre ha il peso di soli 3kb, veramente niente per i risultati che permette di ottenere. 
 
 
Scriptaculous: http://script.aculo.us/
 
Diciamo la migliore libreria per creare effetti di animazione, molto + pesante di Moo.fx ma senz'altro ha molte + feature.
 
Utile anche perchè è un add-on per prototype e quindi puo' essere allegata ad un progetto che usa prototype.
 
Per la documentazione vi rimando direttamente al wiki:
 
http://wiki.script.aculo.us/scriptaculous/
 
 
MochiKit: http://www.mochikit.com/
 
Anch'essa orientata agli effetti,(qui una demo degli effetti disponibili) molto utile e ben documentata:
 
http://www.mochikit.com/doc/html/MochiKit/index.html
 
 
WZ_DradDrop: http://www.walterzorn.com/dragdrop/dragdrop_e.htm
 
Tutte le librerie sopra includono ottime funzionalita' per creare script Drag&Drop (vedi questo articolo), ma diciamo una libreria dedicata per tale scopo è wz_dragdrop.
 
La documentazione dell'API la trovate qui.
 
http://www.walterzorn.com/dragdrop/api_e.htm
 
Qui, qualche esempio veramente carino: http://www.walterzorn.com/dragdrop/demos/demos.htm
 
 
Altre 2 libraries, molto + piccole ma non per questo meno utili che consiglio di studiare sono:
 
 
Nifty Cube, di Alessandro Fulciniti (di edit), che vi permette di arrotondare i layer delle vostre pagine:
 
Qui su html.it trovate articolo, documentazione ed il download dello script
 
 
e Lightbox, per creare delle bellissime gallerie fotografiche, tutto in maniera unobtrusive (non intrusiva) ossia in mancanza di js, il layout e le funzionalita' della pagina non ne vengono toccate.
 
Ecco la versione 1, e la successiva e + spettacolare versione 2 (che utilizza tra l'altro moo.fx per le animazioni). Qui trovate inoltre alcuni derivati di Nifty Cube, ed alcuni di Lightbox.
 
 
infine vi rimando ad un Javascript Libraries Roundup, dove trovate i link alle principali librerie js e dove disponibile anche il link alla documentazione:
 
http://edevil.wordpress.com/2005/11/14/javascript-libraries-roundup/
  L'ultima modifica di kluster il 31 Mar 2007 12:02, modificato 2 volte | 
			 
		  | 
	 
	
		| Top | 
		 | 
	 
	
		  | 
	 
	
		kluster Dio maturo
  
 
  Registrato: 15/04/06 13:14 Messaggi: 2898
 
  | 
		
			
				 Inviato: 20 Nov 2006 13:29    Oggetto:  | 
				     | 
			 
			
				
  | 
			 
			
				Altre librerie dedicate agli effetti animati:
 
 
MiniKit: http://candyscript.com/projects/minikit/
 
Anche questa pesca parte delle funzionalita' da moo.fx e da Nifty Corners
 
 
Bernie's better animator class: http://berniecode.com/writing/animator.html
 
 
Run: http://run.aka-fotos.de/index.php
 
la documentazione: http://run.aka-fotos.de/documentation.php
 
Gli esempi vederla all'opera: http://run.aka-fotos.de/examples.php
 
 
Byte Fx: http://www.devpro.it/bytefx/
 
documentazione: http://www.devpro.it/bytefx/#api
 
 
EJ: Essential JavaScript.
 
http://www.robertnyman.com/2006/11/07/ej-the-only-javascript-library-youll-ever-need/
 
A detta dell'autore una libreria dove trovate l'essenziale per essere utilizzato nei vostri progetti. Tutto a 2 kb.
 
Sottolineo: a detta dell'autore. | 
			 
		  | 
	 
	
		| Top | 
		 | 
	 
	
		  | 
	 
	
		kluster Dio maturo
  
 
  Registrato: 15/04/06 13:14 Messaggi: 2898
 
  | 
		
			
				 Inviato: 24 Nov 2006 18:31    Oggetto:  | 
				     | 
			 
			
				
  | 
			 
			
				MudCube:
 
http://www.mudcube.com/code/
 
si va da DatePicker, al Drag&Drop, Scroller, Fader etc.
 
 
DHTML Goodies
 
http://www.dhtmlgoodies.com/
 
anche qui una bella raccolta di scripts, librerie varie per effetti, ajax, scroller, social bookmarks etc. Ognuno con il suo demo e la reference per la personalizzazione | 
			 
		  | 
	 
	
		| Top | 
		 | 
	 
	
		  | 
	 
	
		kluster Dio maturo
  
 
  Registrato: 15/04/06 13:14 Messaggi: 2898
 
  | 
		
			
				 Inviato: 26 Nov 2006 15:32    Oggetto:  | 
				     | 
			 
			
				
  | 
			 
			
				Dojo - The Javascript Toolkit
 
Diciamo un po' complessa ma permette la creazione di applicazioni complete stile web 2.0 (vedi le demo nella pagina)
 
http://dojotoolkit.org/
 
l'api:
 
http://dojotoolkit.org/api
 
 
JSOC Framework - An Object Cache Framework for JavaScript
 
http://dev.webframeworks.com/projects | 
			 
		  | 
	 
	
		| Top | 
		 | 
	 
	
		  | 
	 
	
		kluster Dio maturo
  
 
  Registrato: 15/04/06 13:14 Messaggi: 2898
 
  | 
		
			
				 Inviato: 28 Dic 2006 18:57    Oggetto:  | 
				     | 
			 
			
				
  | 
			 
			
				Questa library di dithered è da un 1k! non tiene in considerazione ajax ma è una library DHTML che contempla questi metodi:
 
 
gE(NomeLayer)  (Get Element)
 
ritorna un riferimento all'oggeto (anche nel caso dei layer annidati di Netscape)
 
 
sE(RefLayer) (Show Element)
 
Mostra un livello
 
 
hE(e) (Hide Element)
 
Nasconde un livello
 
 
sZ(e,v) (Set Z-Index)
 
Imposta lo z-index di un elemento
 
 
sX(e,x) (Set X)
 
Cambia il posizionamento orizzontale del layer
 
 
sY(e,x) (Set Y)
 
Cambia il posizionamento veticale del layer
 
 
sW(e,w) (Set Width)
 
Cambia la larghezza del layer
 
 
sH(e,h) (Set Height)
 
Cambia l'altezza del layer
 
 
sC(e,t,r,b,l) (Set Clip)
 
Imposta la clip del layer secondo i valori t=top,r=left,b=bottom
 
Non supportata in Opera 7 e in Internet Explorer 4.x per Mac
 
 
wH(e,html) (Write Html)
 
Sovrascrive il contenuto html di un layer
 
Non supportata in Opera 7 e mal funzionante in Internet Explorer 4.x per Mac 
 
 
Ecco la library, veramente compatta:
 
 	  | Codice: | 	 		  
 
<script type="text/javascript">
 
d=document;l=d.layers;op=navigator.userAgent.indexOf('Opera')!=-1;px='px';
 
function gE(e,f){if(l){f=(f)?f:self;var V=f.document.layers;if(V[e])return V[e];for(var W=0;W<V.length;)t=gE(e,V[W++]);return t;}if(d.all)return d.all[e];return d.getElementById(e);}
 
function sE(e){l?e.visibility='show':e.style.visibility='visible';}
 
function hE(e){l?e.visibility='hide':e.style.visibility='hidden';}
 
function sZ(e,z){l?e.zIndex=z:e.style.zIndex=z;}
 
function sX(e,x){l?e.left=x: op ? e.style.pixelLeft=x:e.style.left=x+px;}
 
function sY(e,y){l?e.top=y: op ? e.style.pixelTop=y:e.style.top=y+px;}
 
function sW(e,w){l?e.clip.width=w : op ? e.style.pixelWidth=w:e.style.width=w+px;}
 
function sH(e,h){l?e.clip.height=h : op ? e.style.pixelHeight=h:e.style.height=h+px;}
 
function sC(e,t,r,b,x){l?(X=e.clip,X.top=t,X.right=r,X.bottom=b,X.left=x):e.style.clip='rect('+t+px+' '+r+px+' '+b+px+' '+x+px+')';}
 
function wH(e,h){if(l){Y=e.document;Y.open();Y.write(h);Y.close();}if(e.innerHTML)e.innerHTML=h;}
 
</script>
 
 | 	  
 
Per un esempio date un occhiata qui. | 
			 
		  | 
	 
	
		| Top | 
		 | 
	 
	
		  | 
	 
	
		kluster Dio maturo
  
 
  Registrato: 15/04/06 13:14 Messaggi: 2898
 
  | 
		
			
				 Inviato: 28 Mar 2007 10:19    Oggetto:  | 
				     | 
			 
			
				
  | 
			 
			
				Altre 2 librerie/framework js:
 
 
DED|Chain, l'esempio di codice con l'animazione è veramente molto carino e con un codice molto intuitivo.
 
 
Yet Another JavaScript Library Without Documentation con il relativo post del blog che non fa altro che confermare una regola dell'ambiente informatico: un programmatore puo' scrivere in una giornata migliaia di righe di codice senza battere ciglio, ma chiedetegli di scrivere una sola riga di commento al suo codice e si mettera' a piangere. | 
			 
		  | 
	 
	
		| Top | 
		 | 
	 
	
		  | 
	 
	
		kluster Dio maturo
  
 
  Registrato: 15/04/06 13:14 Messaggi: 2898
 
  | 
		 | 
	 
	
		| Top | 
		 | 
	 
	
		  | 
	 
	
		 | 
	 
 
  
	 
	    
	   | 
	
Non puoi inserire nuovi argomenti Non puoi rispondere a nessun argomento Non puoi modificare i tuoi messaggi Non puoi cancellare i tuoi messaggi Non puoi votare nei sondaggi
  | 
   
 
  
 
		 |