Vývoj komplexních JavaScriptových aplikací

Vývoj komplexních JavaScriptových aplikací

Bojový plán

  1. Udržování stavu aplikace
  2. HTML5 File API
  3. JavaScript a FastRPC
  4. Oběd!

Udržování stavu aplikace

Problém

Udržování stavu aplikace

Řešení

Udržování stavu aplikace

Příklad

<a href="#obsah">Obsah</a>
<a href="#kapitola1">Kapitola 1</a>
<a href="#kapitola2">Kapitola 2</a>
Nyní zobrazujeme <span id="current">...</span>
/* když se změní hash, uživatelem nebo skriptem */
window.onhashchange = function() {
	$("current").innerHTML = location.hash.substring(1);
}
location.hash = "obsah"; /* explicitní změna stavu */

HTML5 File API

Problém

HTML5 File API

Řešení

HTML5 File API

Příklad

input.onchange = function() {
	var file = input.files[0];
	var data = ["První soubor:"];
	for (var p in file) { data.push(p + ": " + file[p]); }
	$("info").innerHTML = data.join("\n");
	
	var xhr = new XMLHttpRequest();
	xhr.open("post", "/upload", true);
	xhr.send(file);
}

JavaScript a FastRPC

Problém

JavaScript a FastRPC

Řešení

JavaScript a FastRPC

Příklad

var args = [
	555,
	null,
	{key: "value"},
	new Date()
];
var frpc = JAK.FRPC.serializeCall("test", args);
$("info").innerHTML += frpc; /* posloupnost bajtů */

var parsed = JAK.FRPC.parse(frpc);
$("info").innerHTML += "\n" + JSON.stringify(parsed);

Prostor pro otázky