Show card backs when observing the block games.

5 files changed, 27 insertions, 6 deletions

diff --git a/cards/card_back.svg b/cards/card_back.svg
index bd424c8..57233a1 100644
--- a/cards/card_back.svg
+++ b/cards/card_back.svg
@@ -4,11 +4,7 @@
 <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
  width="450" height="700" viewBox="0 0 512 512"
  preserveAspectRatio="xMidYMid meet">
-<metadata>
-Created by potrace 1.15, written by Peter Selinger 2001-2017
-</metadata>
-<g transform="translate(0.000000,512.000000) scale(0.100000,-0.100000)"
-fill="#000000" stroke="none">
+<g transform="translate(0.000000,512.000000) scale(0.100000,-0.100000)" fill="#422">
 <path d="M2087 4566 c-94 -34 -165 -107 -192 -199 -19 -63 -19 -117 -1 -187 8
 -30 12 -58 10 -61 -2 -4 -28 -13 -56 -19 -29 -7 -105 -31 -168 -53 -531 -185
 -847 -507 -979 -998 -30 -113 -60 -332 -68 -495 l-6 -144 431 0 c238 0 432 -3
diff --git a/info/f5.png b/info/f5.png
new file mode 100644
index 0000000..907eaa3
--- /dev/null
+++ b/info/f5.png
diff --git a/play.html b/play.html
index 3dd5173..4de6c2c 100644
--- a/play.html
+++ b/play.html
@@ -918,6 +918,11 @@ c50 53 55 80 28 143 -18 42 -21 62 -16 107 17 147 18 179 6 245 -15 91 -56
 <div id="card+23" class="card card_1"></div>
 <div id="card+24" class="card card_1"></div>
 <div id="card+25" class="card card_1"></div>
+<div id="back+1" class="card card_back"></div>
+<div id="back+2" class="card card_back"></div>
+<div id="back+3" class="card card_back"></div>
+<div id="back+4" class="card card_back"></div>
+<div id="back+5" class="card card_back"></div>
 </div>
 
 	</div>
diff --git a/rules.js b/rules.js
index 0fd3184..05e9cc8 100644
--- a/rules.js
+++ b/rules.js
@@ -2887,6 +2887,13 @@ exports.resign = function (state, current) {
 	return state;
 }
 
+function observer_hand() {
+	let hand = [];
+	hand.length = Math.max(game.e_hand.length, game.s_hand.length);
+	hand.fill(0);
+	return hand;
+}
+
 exports.view = function(state, current) {
 	game = state;
 
@@ -2899,7 +2906,7 @@ exports.view = function(state, current) {
 		s_vp: count_scottish_nobles(),
 		e_card: (game.show_cards || current === ENGLAND) ? game.e_card : 0,
 		s_card: (game.show_cards || current === SCOTLAND) ? game.s_card : 0,
-		hand: (current === ENGLAND) ? game.e_hand : (current === SCOTLAND) ? game.s_hand : [],
+		hand: (current === ENGLAND) ? game.e_hand : (current === SCOTLAND) ? game.s_hand : observer_hand(),
 		who: (game.active === current) ? game.who : null,
 		where: game.where,
 		known: {},
diff --git a/ui.js b/ui.js
index 66790c2..8d525ff 100644
--- a/ui.js
+++ b/ui.js
@@ -40,6 +40,7 @@ function toggle_blocks() {
 
 let ui = {
 	cards: {},
+	card_backs: {},
 	areas: {},
 	known: {},
 	secret: { England: {}, Scotland: {} },
@@ -348,6 +349,9 @@ function build_map() {
 		ui.cards[c].addEventListener("click", on_click_card);
 	}
 
+	for (let c = 1; c <= 5; ++c)
+		ui.card_backs[c] = document.getElementById("back+"+c);
+
 	for (let name in AREAS) {
 		let area = AREAS[name];
 		let element = svgmap.getElementById("area+"+name);
@@ -641,6 +645,15 @@ function update_cards() {
 			ui.cards[c].classList.remove('show');
 	}
 
+	if (player === 'Observer') {
+		let n = game.hand.length;
+		for (let c = 1; c <= 5; ++c)
+			if (c <= n)
+				ui.card_backs[c].classList.add("show");
+			else
+				ui.card_backs[c].classList.remove("show");
+	}
+
 	if (game.actions && game.actions.play) {
 		for (let c of game.actions.play)
 			ui.cards[c].classList.add('enabled');