diff options
| -rw-r--r-- | play.css | 59 | ||||
| -rw-r--r-- | play.js | 76 | ||||
| -rw-r--r-- | rules.js | 6 |
3 files changed, 125 insertions, 16 deletions
@@ -9,10 +9,45 @@ header.your_turn { background-color: orange; } #turn_info { background-color: gainsboro; } .role_vp { float: right; } -header.your_turn.player_red { background-color: salmon; } -header.your_turn.player_blue { background-color: skyblue; } -header.your_turn.player_yellow { background-color: khaki; } -header.your_turn.player_green { background-color: darkseagreen; } +body.Red header.your_turn { background-color: salmon; } +body.Blue header.your_turn { background-color: skyblue; } +body.Yellow header.your_turn { background-color: khaki; } +body.Green header.your_turn { background-color: darkseagreen; } + +#log { background-color: whitesmoke; } +#log .h1 { background-color: silver; font-weight: bold; padding-top:2px; padding-bottom:2px; margin: 8px 0; text-align: center; } +#log .h1.p_red { background-color: salmon; } +#log .h1.p_blue { background-color: skyblue; } +#log .h1.p_yellow { background-color: khaki; } +#log .h1.p_green { background-color: darkseagreen; } +#log .h2 { background-color: gainsboro; padding-top:2px; padding-bottom:2px; text-align: center; } +#log .h3 { text-decoration: underline; } +#log div { padding-left: 20px; text-indent: -12px; } +#log div.indent { padding-left: 32px; text-indent: -12px; } + +#log .white, #log .black { + display: inline-block; + vertical-align: -2px; + width: 12px; + height: 12px; + border-radius: 0px; + box-shadow: none; + border: none; + background-size: 600% 100%; + background-repeat: no-repeat; +} + +#log .white { + background-image: url(images/die_black_pips.svg); + background-color: #fff; + border: 1px solid #444; +} + +#log .black { + background-image: url(images/die_white_pips.svg); + background-color: #666; + border: 1px solid #222; +} .action { cursor: pointer; @@ -62,8 +97,6 @@ body.p3 #crisis_table { left: 50px; } -body.Solo #.role { display: none } - svg { position: absolute; } @@ -155,13 +188,13 @@ body svg .sea.action { background-repeat: no-repeat; } -.dice.d0 { background-position: -100% 0 } -.dice.d1 { background-position: 0% 0; } -.dice.d2 { background-position: 20% 0; } -.dice.d3 { background-position: 40% 0; } -.dice.d4 { background-position: 60% 0; } -.dice.d5 { background-position: 80% 0; } -.dice.d6 { background-position: 100% 0; } +.d0 { background-position: -100% 0 } +.d1 { background-position: 0% 0; } +.d2 { background-position: 20% 0; } +.d3 { background-position: 40% 0; } +.d4 { background-position: 60% 0; } +.d5 { background-position: 80% 0; } +.d6 { background-position: 100% 0; } .dice.black { background-image: url(images/die_white_pips.svg); @@ -3,6 +3,23 @@ // TODO: battle dialog popup for rolling and assigning hits! // TODO: show killed leaders taken for bonus purchase +const DICE = { + B0: '<span class="black d0"></span>', + B1: '<span class="black d1"></span>', + B2: '<span class="black d2"></span>', + B3: '<span class="black d3"></span>', + B4: '<span class="black d4"></span>', + B5: '<span class="black d5"></span>', + B6: '<span class="black d6"></span>', + W0: '<span class="white d0"></span>', + W1: '<span class="white d1"></span>', + W2: '<span class="white d2"></span>', + W3: '<span class="white d3"></span>', + W4: '<span class="white d4"></span>', + W5: '<span class="white d5"></span>', + W6: '<span class="white d6"></span>', +} + // === SYNC with rules.js === const LEGION_COUNT = 33 @@ -1304,5 +1321,64 @@ function on_update() { action_button("undo", "Undo") } +function sub_region_name(match, p1) { + let x = p1 | 0 + return REGION_NAME[x] +} + +function sub_dice_image(match) { + return DICE[match] +} + +function on_log(text) { + let p = document.createElement("div") + + if (text.match(/^>/)) { + text = text.substring(1) + p.className = 'i' + } + + text = text.replace(/&/g, "&") + text = text.replace(/</g, "<") + text = text.replace(/>/g, ">") + + text = text.replace(/S(\d+)/g, sub_region_name) + text = text.replace(/\b[BW]\d\b/g, sub_dice_image) + + if (text.match(/^.turn/)) { + text = text.substring(6) + p.className = 'turn ' + text + } + + if (text.match(/^\.h1/)) { + text = text.substring(4) + p.className = "h1" + } + else if (text.match(/^\.h2 Red/)) { + text = text.substring(4) + p.className = "h2 p_red" + } + else if (text.match(/^\.h2 Blue/)) { + text = text.substring(4) + p.className = "h2 p_blue" + } + else if (text.match(/^\.h2 Yellow/)) { + text = text.substring(4) + p.className = "h2 p_yellow" + } + else if (text.match(/^\.h2 Green/)) { + text = text.substring(4) + p.className = "h2 p_green" + } + if (text.match(/^\.h3/)) { + text = text.substring(4) + p.className = "h3" + } + + p.innerHTML = text + return p +} + + on_init() scroll_with_middle_mouse("main") @@ -990,7 +990,7 @@ function roll_dice(count, target) { summary.push("W" + die) } } - log("Rolled " + summary.join(" ")) + logi(summary.join(" ")) count = sixes } return hits @@ -1008,7 +1008,7 @@ function roll_dice_no_reroll(count, target) { summary.push("W" + die) } } - log("Rolled " + summary.join(" ")) + logi(summary.join(" ")) return hits } @@ -1336,7 +1336,7 @@ function goto_barbarian_invasion(tribe, black, white) { logi("Invasion!") game.count = game.dice[2] - // Ardashir: ALL active Sassanids invade! + // Ardashir: All active Sassanids invade! if (tribe === SASSANIDS) { if (get_barbarian_location(ARDASHIR) === SASSANIDS_HOMELAND) game.count = count_active_barbarians_at_home(tribe) |