From: Steinar H. Gunderson <sgunderson@bigfoot.com>
Date: Wed, 17 Dec 2014 00:08:28 +0000 (+0100)
Subject: Support browser back/forward and URL sharing through pushState.
X-Git-Url: https://git.sesse.net/?a=commitdiff_plain;h=b00d64218b75a44b86f2fbc8529765d0cd8cc9d0;p=remoteglot-book

Support browser back/forward and URL sharing through pushState.
---

diff --git a/www/js/book.js b/www/js/book.js
index 2821ae1..8300be6 100644
--- a/www/js/book.js
+++ b/www/js/book.js
@@ -60,6 +60,12 @@ var update = function() {
 	fetch_analysis();
 }
 
+var get_history_url = function() {
+	var history = game.history({ verbose: true }).map(function(x) { return x.san; });
+	history.length = move_override;
+	return '/?' + history.join(',');
+}
+
 var fetch_analysis = function() {
 	var fen = current_display_fen();
 	$.ajax({
@@ -262,7 +268,7 @@ var set_includetransp = function(value) {
 }
 window['set_includetransp'] = set_includetransp;
 
-var make_move = function(move) {
+var make_move = function(move, do_update) {
 	var history = game.history({ verbose: true });
 	if (move_override < history.length && history[move_override].san == move) {
 		// User effectively only moved forward in history.
@@ -281,7 +287,11 @@ var make_move = function(move) {
 		fens.push(game.fen());
 		++move_override;
 	}
-	update();
+
+	if (do_update !== false) {
+		update();
+		window.history.pushState(null, null, get_history_url());
+	}
 }
 window['make_move'] = make_move;
 
@@ -289,6 +299,7 @@ var prev_move = function() {
 	if (move_override > 0) {
 		--move_override;
 		update();
+		window.history.replaceState(null, null, get_history_url());
 	}
 }
 window['prev_move'] = prev_move;
@@ -297,13 +308,17 @@ var next_move = function() {
 	if (move_override < game.history().length) {
 		++move_override;
 		update();
+		window.history.replaceState(null, null, get_history_url());
 	}
 }
 window['next_move'] = next_move;
 
-var set_move = function(n) {
+var set_move = function(n, do_update) {
 	move_override = n;
-	update();
+	if (do_update !== false) {
+		update();
+		window.history.replaceState(null, null, get_history_url());
+	}
 }
 window['set_move'] = set_move;
 
@@ -341,6 +356,29 @@ var onSnapEnd = function(source, target) {
 	make_move(pseudogame.history({ verbose: true }).pop().san);
 }
 
+var onpopstate = function() {
+	var old_moves = game.history({ verbose: true }).map(function(x) { return x.san; });
+	var new_moves = document.location.search.replace(/^\?/, "").split(",");
+
+	if (new_moves.length == 1 && new_moves[0] == "") {
+		new_moves = [];
+	}
+
+	var num_shared_moves;
+	for (num_shared_moves = 0; num_shared_moves < Math.min(old_moves.length, new_moves.length); ++num_shared_moves) {
+		if (old_moves[i] != new_moves[i]) {
+			break;
+		}
+	}
+
+	set_move(num_shared_moves, false);
+	for (var i = num_shared_moves; i < new_moves.length; ++i) {
+		make_move(new_moves[i], false);
+	}
+	update();
+	window.history.replaceState(null, null, get_history_url());
+}
+
 var init = function() {
 	// Create board.
 	board = new window.ChessBoard('board', {
@@ -350,7 +388,9 @@ var init = function() {
 		onDrop: onDrop,
 		onSnapEnd: onSnapEnd
 	});
-	update();
+
+	window.onpopstate = onpopstate;
+	onpopstate();
 
 	$(window).keyup(function(event) {
 		if (event.which == 39) {