tripoli: Naval bombardment and combat.

1 files changed, 87 insertions, 67 deletions

diff --git a/play.html b/play.html
index 11b74e7..f25e54a 100644
--- a/play.html
+++ b/play.html
@@ -88,6 +88,12 @@
 	opacity: 1
 }
 
+#map .harbor.where, #map .patrol_zone.where {
+	opacity: 1;
+	stroke: yellow;
+	fill: yellow;
+}
+
 #map .patrol_zone {
 	fill: white;
 	fill-opacity: 0.3;
@@ -100,6 +106,19 @@
 	opacity: 1
 }
 
+#map .us_frigate { fill: #0977bd; }
+#map .us_gunboat { fill: #0977bd; }
+#map .se_frigate { fill: #fdd527; }
+#map .tr_frigate { fill: #de333e; }
+#map .tr_corsair { fill: #de333e; }
+#map .al_corsair { fill: #f39331; }
+#map .us_marine { fill: #0977bd; }
+#map .ar_infantry { fill: #e0e0e0; }
+#map .tr_infantry { fill: #de333e; }
+
+#map .us_frigate.damaged { fill: #005577; }
+#map .tr_frigate.damaged { fill: #881111; }
+
 /* CARD ACTION POPUP MENU */
 
 #popup {
@@ -257,6 +276,7 @@
 </symbol>
 <symbol id="frigate" x="-20" y="-15" width="42.9" height="29.6" viewBox="0 0 428 296">
 <path d="M153.5 17.2c-.3.7-.6 42.7-.8 93.3l-.2 92-16.2.3c-9.3.1-16.3-.1-16.3-.7 0-.5 1.1-3.7 2.4-7.2 4-10.6 5.1-23.4 3.3-36.4-5.2-36.2-28-73.7-63.4-104.4-11.9-10.4-10.8-17.6-11.1 71.7L51 203h-9.6c-7.9 0-10.1.3-12.4 2-4.9 3.5-5.1 5.5-4.8 35.1.3 26.9.3 27.5 2.7 31.6 1.4 2.4 4.3 5.5 6.5 7 4 2.6 4.7 2.7 22.1 3.4 9.9.4 61.2.8 114 .8 101 .1 104 0 117-4.4 14-4.8 26.4-13.8 37-27.1 11.3-14 15.9-17.5 36.1-27.8 9.8-5.1 23.3-12 30-15.4 12.6-6.5 14.4-8.2 14.4-14.2 0-6.3-4.5-11-10.5-11-2.2 0-33.6 10.1-48.5 15.6-10.6 3.9-24 5.6-24 3.1 0-.7.4-1.7.9-2.3 1.9-1.9 5-13.7 6.2-23.3 1.3-10.6.3-24.7-2.7-37.6-4.9-21.7-19.8-50.7-37.4-72.7-6.8-8.6-29.4-30.8-31.3-30.8-.8 0-1.8.7-2.1 1.6-.3.9-.6 38.7-.6 84V203h-18c-9.9 0-18-.2-18-.5 0-.2 1.4-3.9 3-8.1 1.7-4.2 3.7-11.1 4.5-15.3 2.9-15.2 1.3-42.1-3.4-56.9-1.2-3.5-2.6-8.2-3.2-10.5-.6-2.3-3.1-8.9-5.5-14.6-11.7-27.2-26.7-49.6-48.1-71.9-8.7-9-10.9-10.5-11.8-8z" stroke-width="10"/>
+</symbol>
 <symbol id="infantry" x="-10" y="-10" width="21" height="21" viewBox="0 0 105 105">
 <path d="M8 53v44h89V9H8v44z" stroke-width="5"/>
 </symbol>
@@ -281,73 +301,73 @@
 <circle id="season" r="26" cx="893" cy="728"/>
 </g>
 <g stroke="black">
-<use id="us_frigate_1" href="#frigate" x="0" y="0" fill="#0977bd"/>
-<use id="us_frigate_2" href="#frigate" x="0" y="0" fill="#0977bd"/>
-<use id="us_frigate_3" href="#frigate" x="0" y="0" fill="#0977bd"/>
-<use id="us_frigate_4" href="#frigate" x="0" y="0" fill="#0977bd"/>
-<use id="us_frigate_5" href="#frigate" x="0" y="0" fill="#0977bd"/>
-<use id="us_frigate_6" href="#frigate" x="0" y="0" fill="#0977bd"/>
-<use id="us_frigate_7" href="#frigate" x="0" y="0" fill="#0977bd"/>
-<use id="us_frigate_8" href="#frigate" x="0" y="0" fill="#0977bd"/>
-<use id="tr_frigate_1" href="#frigate" x="0" y="0" fill="#de333e"/>
-<use id="tr_frigate_2" href="#frigate" x="0" y="0" fill="#de333e"/>
-<use id="se_frigate_1" href="#frigate" x="0" y="0" fill="#fdd527"/>
-<use id="se_frigate_2" href="#frigate" x="0" y="0" fill="#fdd527"/>
-<use id="us_gunboat_1" href="#corsair" x="0" y="0" fill="#0977bd"/>
-<use id="us_gunboat_2" href="#corsair" x="0" y="0" fill="#0977bd"/>
-<use id="us_gunboat_3" href="#corsair" x="0" y="0" fill="#0977bd"/>
-<use id="tr_corsair_1" href="#corsair" x="0" y="0" fill="#de333e"/>
-<use id="tr_corsair_2" href="#corsair" x="0" y="0" fill="#de333e"/>
-<use id="tr_corsair_3" href="#corsair" x="0" y="0" fill="#de333e"/>
-<use id="tr_corsair_4" href="#corsair" x="0" y="0" fill="#de333e"/>
-<use id="tr_corsair_5" href="#corsair" x="0" y="0" fill="#de333e"/>
-<use id="tr_corsair_6" href="#corsair" x="0" y="0" fill="#de333e"/>
-<use id="tr_corsair_7" href="#corsair" x="0" y="0" fill="#de333e"/>
-<use id="tr_corsair_8" href="#corsair" x="0" y="0" fill="#de333e"/>
-<use id="tr_corsair_9" href="#corsair" x="0" y="0" fill="#de333e"/>
-<use id="al_corsair_1" href="#corsair" x="0" y="0" fill="#f39331"/>
-<use id="al_corsair_2" href="#corsair" x="0" y="0" fill="#f39331"/>
-<use id="al_corsair_3" href="#corsair" x="0" y="0" fill="#f39331"/>
-<use id="al_corsair_4" href="#corsair" x="0" y="0" fill="#f39331"/>
-<use id="al_corsair_5" href="#corsair" x="0" y="0" fill="#f39331"/>
-<use id="al_corsair_6" href="#corsair" x="0" y="0" fill="#f39331"/>
-<use id="al_corsair_7" href="#corsair" x="0" y="0" fill="#f39331"/>
-<use id="al_corsair_8" href="#corsair" x="0" y="0" fill="#f39331"/>
-<use id="al_corsair_9" href="#corsair" x="0" y="0" fill="#f39331"/>
-<use id="us_marine_1" href="#infantry" x="0" y="0" fill="#0977bd"/>
-<use id="us_marine_2" href="#infantry" x="0" y="0" fill="#0977bd"/>
-<use id="us_marine_3" href="#infantry" x="0" y="0" fill="#0977bd"/>
-<use id="us_marine_4" href="#infantry" x="0" y="0" fill="#0977bd"/>
-<use id="ar_infantry_1" href="#infantry" x="0" y="0" fill="#e0e0e0"/>
-<use id="ar_infantry_2" href="#infantry" x="0" y="0" fill="#e0e0e0"/>
-<use id="ar_infantry_3" href="#infantry" x="0" y="0" fill="#e0e0e0"/>
-<use id="ar_infantry_4" href="#infantry" x="0" y="0" fill="#e0e0e0"/>
-<use id="ar_infantry_5" href="#infantry" x="0" y="0" fill="#e0e0e0"/>
-<use id="ar_infantry_6" href="#infantry" x="0" y="0" fill="#e0e0e0"/>
-<use id="ar_infantry_7" href="#infantry" x="0" y="0" fill="#e0e0e0"/>
-<use id="ar_infantry_8" href="#infantry" x="0" y="0" fill="#e0e0e0"/>
-<use id="ar_infantry_9" href="#infantry" x="0" y="0" fill="#e0e0e0"/>
-<use id="ar_infantry_10" href="#infantry" x="0" y="0" fill="#e0e0e0"/>
-<use id="tr_infantry_1" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_2" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_3" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_4" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_5" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_6" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_7" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_8" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_9" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_10" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_11" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_12" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_13" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_14" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_15" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_16" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_17" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_18" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_19" href="#infantry" x="0" y="0" fill="#de333e"/>
-<use id="tr_infantry_20" href="#infantry" x="0" y="0" fill="#de333e"/>
+<use id="us_frigate_1" href="#frigate" x="0" y="0" class="us_frigate"/>
+<use id="us_frigate_2" href="#frigate" x="0" y="0" class="us_frigate"/>
+<use id="us_frigate_3" href="#frigate" x="0" y="0" class="us_frigate"/>
+<use id="us_frigate_4" href="#frigate" x="0" y="0" class="us_frigate"/>
+<use id="us_frigate_5" href="#frigate" x="0" y="0" class="us_frigate"/>
+<use id="us_frigate_6" href="#frigate" x="0" y="0" class="us_frigate"/>
+<use id="us_frigate_7" href="#frigate" x="0" y="0" class="us_frigate"/>
+<use id="us_frigate_8" href="#frigate" x="0" y="0" class="us_frigate"/>
+<use id="tr_frigate_1" href="#frigate" x="0" y="0" class="tr_frigate"/>
+<use id="tr_frigate_2" href="#frigate" x="0" y="0" class="tr_frigate"/>
+<use id="se_frigate_1" href="#frigate" x="0" y="0" class="se_frigate"/>
+<use id="se_frigate_2" href="#frigate" x="0" y="0" class="se_frigate"/>
+<use id="us_gunboat_1" href="#corsair" x="0" y="0" class="us_gunboat"/>
+<use id="us_gunboat_2" href="#corsair" x="0" y="0" class="us_gunboat"/>
+<use id="us_gunboat_3" href="#corsair" x="0" y="0" class="us_gunboat"/>
+<use id="tr_corsair_1" href="#corsair" x="0" y="0" class="tr_corsair"/>
+<use id="tr_corsair_2" href="#corsair" x="0" y="0" class="tr_corsair"/>
+<use id="tr_corsair_3" href="#corsair" x="0" y="0" class="tr_corsair"/>
+<use id="tr_corsair_4" href="#corsair" x="0" y="0" class="tr_corsair"/>
+<use id="tr_corsair_5" href="#corsair" x="0" y="0" class="tr_corsair"/>
+<use id="tr_corsair_6" href="#corsair" x="0" y="0" class="tr_corsair"/>
+<use id="tr_corsair_7" href="#corsair" x="0" y="0" class="tr_corsair"/>
+<use id="tr_corsair_8" href="#corsair" x="0" y="0" class="tr_corsair"/>
+<use id="tr_corsair_9" href="#corsair" x="0" y="0" class="tr_corsair"/>
+<use id="al_corsair_1" href="#corsair" x="0" y="0" class="al_corsair"/>
+<use id="al_corsair_2" href="#corsair" x="0" y="0" class="al_corsair"/>
+<use id="al_corsair_3" href="#corsair" x="0" y="0" class="al_corsair"/>
+<use id="al_corsair_4" href="#corsair" x="0" y="0" class="al_corsair"/>
+<use id="al_corsair_5" href="#corsair" x="0" y="0" class="al_corsair"/>
+<use id="al_corsair_6" href="#corsair" x="0" y="0" class="al_corsair"/>
+<use id="al_corsair_7" href="#corsair" x="0" y="0" class="al_corsair"/>
+<use id="al_corsair_8" href="#corsair" x="0" y="0" class="al_corsair"/>
+<use id="al_corsair_9" href="#corsair" x="0" y="0" class="al_corsair"/>
+<use id="us_marine_1" href="#infantry" x="0" y="0" class="us_marine"/>
+<use id="us_marine_2" href="#infantry" x="0" y="0" class="us_marine"/>
+<use id="us_marine_3" href="#infantry" x="0" y="0" class="us_marine"/>
+<use id="us_marine_4" href="#infantry" x="0" y="0" class="us_marine"/>
+<use id="ar_infantry_1" href="#infantry" x="0" y="0" class="ar_infantry"/>
+<use id="ar_infantry_2" href="#infantry" x="0" y="0" class="ar_infantry"/>
+<use id="ar_infantry_3" href="#infantry" x="0" y="0" class="ar_infantry"/>
+<use id="ar_infantry_4" href="#infantry" x="0" y="0" class="ar_infantry"/>
+<use id="ar_infantry_5" href="#infantry" x="0" y="0" class="ar_infantry"/>
+<use id="ar_infantry_6" href="#infantry" x="0" y="0" class="ar_infantry"/>
+<use id="ar_infantry_7" href="#infantry" x="0" y="0" class="ar_infantry"/>
+<use id="ar_infantry_8" href="#infantry" x="0" y="0" class="ar_infantry"/>
+<use id="ar_infantry_9" href="#infantry" x="0" y="0" class="ar_infantry"/>
+<use id="ar_infantry_10" href="#infantry" x="0" y="0" class="ar_infantry"/>
+<use id="tr_infantry_1" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_2" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_3" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_4" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_5" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_6" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_7" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_8" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_9" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_10" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_11" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_12" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_13" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_14" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_15" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_16" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_17" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_18" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_19" href="#infantry" x="0" y="0" class="tr_infantry"/>
+<use id="tr_infantry_20" href="#infantry" x="0" y="0" class="tr_infantry"/>
 </g>
 </svg>