From aeed1073cf5ecf19dc064b6d6169b20b3c292d62 Mon Sep 17 00:00:00 2001
From: Tor Andersson <tor@ccxvii.net>
Date: Mon, 4 Oct 2021 12:32:21 +0200
Subject: 300: Add tooltips to card numbers in game log.

---
 play.html |  6 ++++++
 rules.js  |  2 +-
 ui.js     | 19 +++++++++++++++++++
 3 files changed, 26 insertions(+), 1 deletion(-)

diff --git a/play.html b/play.html
index 8180fd1..7b70ca2 100644
--- a/play.html
+++ b/play.html
@@ -77,6 +77,12 @@
 	border-radius: 10px;
 }
 
+.log span.tip {
+	cursor: help;
+	text-decoration: underline;
+	color: blue;
+}
+
 #tooltip.card {
 	position: fixed;
 	z-index: 200;
diff --git a/rules.js b/rules.js
index 14f3e63..ddcca14 100644
--- a/rules.js
+++ b/rules.js
@@ -2167,7 +2167,7 @@ function can_play_ostracism() {
 function play_ostracism() {
 	let card = draw_card(game.greek.hand);
 	game.discard.push(card);
-	log("Card " + card + " is discarded.");
+	log("Persia discards Greek card " + card + ".");
 	end_persian_operation();
 }
 
diff --git a/ui.js b/ui.js
index d37adf6..a667fae 100644
--- a/ui.js
+++ b/ui.js
@@ -59,12 +59,31 @@ let ui = {
 	selected_fleets: null,
 };
 
+create_log_entry = function (text) {
+	let p = document.createElement("div");
+	text = text.replace(/&/g, "&amp;");
+	text = text.replace(/</g, "&lt;");
+	text = text.replace(/>/g, "&gt;");
+	text = text.replace(/card (\d+)/g,
+		'<span class="tip" onmouseenter="on_focus_card_tip($1)" onmouseleave="on_blur_card_tip()">card $1</span>');
+	p.innerHTML = text;
+	return p;
+}
+
 function remove_from_array(array, item) {
 	let i = array.indexOf(item);
 	if (i >= 0)
 		array.splice(i, 1);
 }
 
+function on_focus_card_tip(card_number) {
+	document.getElementById("tooltip").className = "card show card_" + card_number;
+}
+
+function on_blur_card_tip() {
+	document.getElementById("tooltip").classList = "card";
+}
+
 function on_focus_discard(evt) {
 	if (game.discard)
 		document.getElementById("tooltip").className = "card show card_" + game.discard;
-- 
cgit v1.2.3