Prettier logs with formatting and colors.

3 files changed, 47 insertions, 5 deletions

diff --git a/play.html b/play.html
index 0cbe894..176c4a0 100644
--- a/play.html
+++ b/play.html
@@ -16,13 +16,19 @@
 
 .grid_center { background-color: #788; }
 .grid_role { background-color: silver; }
-.grid_log { background-color: ghostwhite; }
 .grid_top { background-color: silver; }
 .grid_top.your_turn { background-color: orange; }
 .one .role_name { background-color: salmon; }
 .two .role_name { background-color: ghostwhite; }
 .turn_info { background-color: gainsboro; }
 
+#log { background-color: ghostwhite; }
+#log .st { background-color: steelblue; color: white; font-weight: bold; }
+#log .L { background-color: pink; }
+#log .Y { background-color: gainsboro; }
+#log .bs { background-color: lightsteelblue; }
+#log .br { font-style: italic; text-decoration: underline; }
+
 .battle_header { background-color: silver; }
 .battle_message { background-color: silver; }
 .battle_separator { background-color: silver; }
@@ -390,9 +396,7 @@ div.block {
 
 	</div>
 
-	<div class="grid_log">
-		<div class="log" id="log"></div>
-	</div>
+	<div id="log"></div>
 
 	<div class="grid_center">
 
diff --git a/rules.js b/rules.js
index 521aa46..ee604ef 100644
--- a/rules.js
+++ b/rules.js
@@ -1428,6 +1428,7 @@ states.play_card = {
 }
 
 function reveal_cards() {
+	log("");
 	log("Lancaster plays " + CARDS[game.l_card].name + ".");
 	log("York plays " + CARDS[game.y_card].name + ".");
 	game.show_cards = true;
@@ -1748,6 +1749,9 @@ states.action_phase = {
 		}
 	},
 	end_action_phase: function () {
+		if (game.moves > 0 && game.turn_log.length === 0 && game.recruit_log.length === 0)
+			logp("does nothing.");
+
 		if (game.turn_log.length > 0)
 			print_turn_log(game.active + " moves:");
 		game.turn_log = game.recruit_log;
@@ -2659,6 +2663,8 @@ states.regroup_to = {
 	},
 	area: function (to) {
 		if (is_sea_area(to)) {
+			log_move_start(game.where);
+			log_move_continue(to);
 			game.location[game.who] = to;
 			game.state = 'sea_regroup_to';
 		} else {
@@ -2684,7 +2690,8 @@ states.sea_regroup_to = {
 				gen_action(view, 'area', to);
 	},
 	area: function (to) {
-		logp("sea regroups to " + to + ".");
+		log_move_continue(to);
+		log_move_end();
 		game.location[game.who] = to;
 		game.who = null;
 		game.state = 'regroup'
@@ -2797,6 +2804,7 @@ states.enter_pretender_heir = {
 		game.who = null;
 	},
 	area: function (to) {
+		log("");
 		log(block_name(game.who) + " comes of age in " + to + ".");
 		--game.killed_heirs[game.active];
 		game.location[game.who] = to;
@@ -2879,6 +2887,7 @@ states.enter_royal_heir = {
 		game.who = null;
 	},
 	area: function (to) {
+		log("");
 		log(block_name(game.who) + " comes of age in " + to + ".");
 		--game.killed_heirs[game.active];
 		game.location[game.who] = to;
@@ -2940,6 +2949,7 @@ states.supply_limits_king = {
 function goto_political_turn() {
 	log("");
 	log("Start Political Turn.");
+	log("");
 
 	game.turn_log = [];
 
diff --git a/ui.js b/ui.js
index 62e676d..ff8e2d4 100644
--- a/ui.js
+++ b/ui.js
@@ -58,6 +58,34 @@ let ui = {
 	present: new Set(),
 }
 
+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(/\u2192 /g, "\u2192\xa0");
+
+	text = text.replace(/^([A-Z]):/, '<span class="$1"> $1 </span>');
+
+	if (text.match(/^~ .* ~$/))
+		p.className = 'br', text = text.substring(2, text.length-2);
+	else if (text.match(/^Start Lancaster turn/))
+		p.className = 'L';
+	else if (text.match(/^Start York turn/))
+		p.className = 'Y';
+	else if (text.match(/^Start /))
+		p.className = 'st';
+	else if (text.match(/^Battle in/))
+		p.className = 'bs';
+
+	if (text.match(/^Start /))
+		text = text.substring(6);
+
+	p.innerHTML = text;
+	return p;
+}
+
 function on_focus_area(evt) {
 	let where = evt.target.area;
 	let text = where;