Para usar, basta chamar o método toSource() em um objeto:

alert(objeto.toSource())

E você verá todos os argumentos da instância “objeto”.

function utf8_decode ( str_data ) {
    var tmp_arr = [], i = 0, ac = 0, c1 = 0, c2 = 0, c3 = 0;
    str_data += '';
    while ( i < str_data.length ) {
        c1 = str_data.charCodeAt(i);
        if (c1 < 128) {
            tmp_arr[ac++] = String.fromCharCode(c1);
            i++;
        } else if ((c1 > 191) &amp;&amp; (c1 < 224)) {
            c2 = str_data.charCodeAt(i+1);
            tmp_arr[ac++] = String.fromCharCode(((c1 &amp; 31) << 6) | (c2 &amp; 63));
            i += 2;
        } else {
            c2 = str_data.charCodeAt(i+1);
            c3 = str_data.charCodeAt(i+2);
            tmp_arr[ac++] = String.fromCharCode(((c1 &amp; 15) << 12) | ((c2 &amp; 63) << 6) | (c3 &amp; 63));
            i += 3;
        }
    }
    return tmp_arr.join('');
}

Esta função foi feita com base na função utf8_decode do PHP.

Retirado do site: PHPJS.org

Neste exemplo vamos usar um destino fixo e solicitar ao usuário o endereço de partida.

Antes de mais nada, precisamos adquirir a chave API do Google Maps digitando a URL em que sua página será hospedada (você consegue gerar chave para http://localhost também).

De posse da chave, vamos criar uma página HTML simples e incluir a API do google maps já com a nossa chave:

<script type="text/javascript" src=http://maps.google.com/maps?file=api&v=2.x&key=sua-chave"></script>

Agora vamos ao JavaScript com as funções necessárias para carregar o mapa e traçar a rota:

			// declaração de variáveis
			var map;
			var marker;

			// função que carrega o mapa inicial marcando o nosso ponto de chegada
			function load() {
				// verifica a compatibilidade do google maps
			  if (GBrowserIsCompatible()) {

				// Instancia o objeto e aplica na div 'mapa'
				map = new GMap2(document.getElementById("mapa"));
				// Especifica as coordenadas do centro do mapa e o zoom
				map.setCenter(new GLatLng(-20.339884,-40.287469), 14);
				// Especifica o div em que será exibido o detalhamento da rota
				directionsPanel = document.getElementById("route");
				gdir = new GDirections(map, directionsPanel);
				// Adiciona o evento de erros a função handleErrors
				GEvent.addListener(gdir, "error", handleErrors);

				//Adiciona barra de zoom e setas para movimentação no mapa
				map.addControl(new GSmallMapControl());

				//Adiciona um marcador nas coordenadas de chegada
				var point = new GLatLng(-20.339884, -40.287469);
				marker = new GMarker(point);
				map.addOverlay(marker);
				marker.title = "Shopping Vitória";

			  }
			}

			// Traça a Rota
			function setDirections(fromAddress, toAddress, locale){
				gdir.load("from: " + fromAddress + " to: " + toAddress,{"locale": "pt_BR"});
				// Remove o marcador inicial
				map.removeOverlay(marker);
			}

			// Especifica a origem e o destino
			function tracarRota() {
				setDirections(document.getElementById('from').value, "Fernando Ferrari, 514, Goiabeiras, Vitória, ES");
			}

			// Função com tratamentos de erros
			function handleErrors()
			{
			   if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS)
				 alert("Não foi possível achar o endereço. Isso pode ter ocorrido porque o endereço digitado ainda não está inserido no googlemaps ou porque foi digitado incorretamente.\nCódigo do Erro: " + gdir.getStatus().code);
			   else if (gdir.getStatus().code == G_GEO_SERVER_ERROR)
				 alert("A geocoding or directions request could not be successfully processed, yet the exact reason for the failure is not known.\n Código do Erro: " + gdir.getStatus().code);
			   else if (gdir.getStatus().code == G_GEO_MISSING_QUERY)
				 alert("The HTTP q parameter was either missing or had no value. For geocoder requests, this means that an empty address was specified as input. For directions requests, this means that no query was specified in the input.\n Código do Erro: " + gdir.getStatus().code);
			   else if (gdir.getStatus().code == G_GEO_BAD_KEY)
				 alert("Key inválida. Procure a key correta para este domínio no site do google. \n Código do Erro: " + gdir.getStatus().code);
			   else if (gdir.getStatus().code == G_GEO_BAD_REQUEST)
				 alert("A directions request could not be successfully parsed.\n Código do Erro: " + gdir.getStatus().code);
			   else alert("Ocorreu um erro inesperado.");
			}

Lembrando que na Tag “Body” é necessários chamarmos a função Load() para carregar o mapa inicial com nosso ponto de chegada marcado:

Para finalizar, o nosso formulário HTML deverá chamar a função tracarRota() como no código abaixo:

					Endereço de partida: 


				

Confira o exemplo funcional

No entanto, a maioria dos plugins que encontrei eram já desenhados pensando em imagens. Os que eram mais genéricos, eram grandes, de difícil personalização.

Perdi tanto tempo testando que nem me lembrei de como é fácil fazer as coisas com jQuery. Foi aí que resolvi escrever um código simples que resolvesse o meu problema.

E a seguir está o código. Simples, fácil de personalizar e que resolveu a situação.

var tamCarrosel = ($("#carroselEfeito li").length-1);

$('#carrosel_proximo').click(function() {
	if(i == 0)
		$('#seta_esquerda a').css({'backgroundPosition':'0 0'});
	if(i < tamCarrosel){
		$('#carroselEfeito li').eq(i).animate({ left : "-"+700}, function() {
			$('#carroselEfeito li').eq(i+1).css({ left: "700px"});
			$('#carroselEfeito li').eq(i).hide();
			$('#carroselEfeito li').eq(i+1).animate({left: "-"+0});
			i++;
			if(i == tamCarrosel)
				$('#seta_direita a').css({'backgroundPosition':'0 75px'});
		});
	}
});
$('#carrosel_anterior').click(function(){
	if(i == tamCarrosel)
		$('#seta_direita a').css({'backgroundPosition':'0 0'});
	if(0 < tamCarrosel && i>0){
		$('#carroselEfeito li').eq(i).animate({left : "+"+700}, function(){
			$('#carroselEfeito li').eq(i-1).css({right: "700px"});
			$('#carroselEfeito li').eq(i).hide();
			$('#carroselEfeito li').eq(i-1).animate({left: "-"+0});
			i--;
			if(i == 0)
				$('#seta_esquerda a').css({'backgroundPosition':'0 75px'});
		});
	}
});

E o HTML, mais simples ainda:

ítem 01
ítem 02
ítem n

Vou sempre postar os plugins mais interessantes que já testei para que outros economizem o tempo que já gastei pesquisando sobre. Obviamente que algumas cada caso é um caso.

Index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
	<head>
	<link rel="stylesheet" type="text/css" href="/igs/includes/ext/resources/css/ext-all.css">
	<script type="text/javascript" src="/igs/includes/ext/adapter/ext/ext-base.js"></script>
	<script type="text/javascript" src="/igs/includes/ext/ext-all.js"></script>
	<script type="text/javascript" src="login.js"></script>
	</head>
	<body></body>
</html>

Obviamente, modifique os paths de acordo com seu diretório EXT. Veremos o código do Login.js a seguir

Login.js

A seguir vem o login.js. Ele cria o formulário, renderiza uma janela popup, exibe a janela ao usuário, submete os dados via AJAX, e lida com o sucesso e o fracasso de resposta dependendo se o usuário inseriu os dados com sucesso.

Ext.onReady(function(){
    Ext.QuickTips.init();

	// Crie uma variável para armazenar nosso EXT Form Panel 
	// Assinamos várias opções de configuração	 
    var login = new Ext.FormPanel({
        labelWidth:80,
        url:'login.asp',
        frame:true,
        title:'Entre com seu Login',
        defaultType:'textfield',
	monitorValid:true,
	// Atributos específicos para os campos de usuário/senha. 
	// O atributo "name" define o nome da variável que será enviada do servidor.
        items:[{
                fieldLabel:'Usuário',
                name:'loginUsername',
                allowBlank:false
            },{
                fieldLabel:'Senha',
                name:'loginPassword',
                inputType:'password',
                allowBlank:false
            }],

	// Toda a mágica que acontece depois que o usuário clique no botão     
        buttons:[{
                text:'Login',
                formBind: true,
                // Função que é executada quando o usuário clicar no botão 
                handler:function(){
                    login.getForm().submit({
                        method:'POST',
                        waitTitle:'Conectando',
                        waitMsg:'Enviando dados...',

			// Função que executa (sucesso ou falha) quando o servidor responder. 
			// A que será executada é determinada pela 
			// responsta que virá do login.asp como mostrado abaixo. O servidor responde 
			// um JSON válido. 
			// Algo como: response.write "{ success: true}" ou
			// responde.write "{ success: false, errors: { reason: 'Falha no Login. Tente novamente.' }}" 
			// dependendo da lógica que contiver no código de retorno do servidor.
			// Se o sucesso ocorrer, o usuário será notificado com uma mensagem de alerta messagebox, 
			// e quando ele clicar em "Ok", então será redirecionado a qualquer página
			// que você tenha definido para redirecionamento. 

                        success:function(){
                        	Ext.Msg.alert('Status', 'Login Successful!', function(btn, text){
				   if (btn == 'ok'){
		                        var redirect = 'test.php';
		                        window.location = redirect;
                                   }
			        });
                        },

			// Função de falha, veja comentário sobre re: sucesso e falha. 
			// Você poderá ver aqui, se o login falhar, chama uma messagebox
			// com detalhes da falha  

                        failure:function(form, action){
                            if(action.failureType == 'server'){
                                obj = Ext.util.JSON.decode(action.response.responseText);
                                Ext.Msg.alert('Login Failed!', obj.errors.reason);
                            }else{
                                Ext.Msg.alert('Warning!', 'Authentication server is unreachable : ' + action.response.responseText);
                            }
                            login.getForm().reset();
                        }
                    });
                }
            }]
    });

	// Aqui é criado uma janela para agregar o formulário. 
	// O objeto login é passado como ítem desta janela.       
    var win = new Ext.Window({
        layout:'fit',
        width:300,
        height:150,
        closable: false,
        resizable: false,
        plain: true,
        border: false,
        items: [login]
	});
	win.show();
});

Login.php

<?php
$loginUsername = isset($_POST["loginUsername"]) ? $_POST["loginUsername"] : "";

if($loginUsername == "f"){
    echo "{success: true}";
} else {
    echo "{success: false, errors: { reason: 'Falha no login. Tente novamente.' }}";
}
?>

Ou, você pode usar PHP avançado com array associativo e a função json_encode, e renderizar a resposta em JSON. Isso pode ser útil para não ter trabalho braçal caso esteja utilizando um JSON mais complexo.

<?php
$loginUsername = isset($_POST["loginUsername"]) ? $_POST["loginUsername"] : "";

if($loginUsername == "f"){
    $result["success"] = true;
} else {
    $result["success"] = false;
    $result["errors"]["reason"] = "Falha no Login. Tente novamente.";
}
echo json_encode($result);
?>

Você vai notar uma linha no login.js que redireciona para text.php caso um login bem sucedido aconteça. Esta pode ser, obviamente, qualquer que seja a página principal de sua aplicação.

Baseado no original de David Fitch: Tutorial: Basic Login

Após uma pesquisa encontrei o SWFUpload. Calma! não é um sistema em Flash de upload de arquivos, no entando, ele utiliza um SWF para fazer parte da mecânica do processo de upload sem que o Flash seja visível ao usuário (analisando com calma pude perceber que ele insere um flash transparente de 1px em algum canto da tela). O restante do processo é realizado por métodos JavaScript que lhe permitem muitas possibilidades de personalização.

Uma das grandes vantagens que vejo é a barra de progresso. Não há nada pior do que ficar aguardando um arquivo ser enviado sem saber quando vai acabar. Outra coisa interessante é a possibilidade de enviar diversos arquivos de uma só vez e deixar que o SWFU gerencie a fila e execute a ação que você quiser ao finalizar o envio (de um único e/ou de todos os arquivos).

O SWFU não dispensa o uso de uma linguagem server-side, mas lhe dá a liberdade de trabalhar com a linguagem que quiser. Ao baixar o SWFU você irá perceber alguns exemplos em PHP e ASP.

A desvantagem é a necessidade de se ter o plugin do Flash instalado no navegador, se bem que hoje em dia isso não é mais um problema visto que até mobile já possuem a versão Flash Light (não cheguei a testar).

Atualmente o SWFU está na versão 2.2.0. Eu utilizo desde sua versão 1.x.x, e nas atualizações dos plugins do Flash de meu navegador, sempre funcionou bem, até que foi lançado a versão 10 do Flash. O SWFU parou de funcionar no Flash 10 para Internet Exploder (pra variar ele!), problema esse que foi corrigido na atual versão e não promete ter novos problemas, visto que o Flash 10 realmente teve mudanças agressivas em sua estrutura.

Vale a pena dar uma olhada nos exemplos que estão no site.