From 58b337a16e24f034df201caa92e4163cad4d01c2 Mon Sep 17 00:00:00 2001 From: Mischa Untaga <99098079+MischaU8@users.noreply.github.com> Date: Sat, 21 Oct 2023 16:55:37 +0200 Subject: layout ui --- data.js | 2 +- map.svg | 2 +- play.html | 23 ++++++++++--------- play.js | 68 +++++++++++++++++++++++++++----------------------------- tools/gendata.js | 2 +- tools/layout.svg | 2 +- 6 files changed, 50 insertions(+), 49 deletions(-) diff --git a/data.js b/data.js index bfc11e2..ffc6e20 100644 --- a/data.js +++ b/data.js @@ -1,2 +1,2 @@ -const data = {"locations":{"NONE":0,"DEPLOY":1,"ELIMINATED":2,"FRANCE":3,"TUNISIA":4,"MOROCCO":5,"I-1":6,"I-2":7,"I-3":8,"I-4":9,"CONSTANTINE":10,"II-1":11,"II-2":12,"II-3":13,"III-1":14,"III-2":15,"III-3":16,"ALGIERS":17,"IV-1":18,"IV-2":19,"ORAN":20,"V-1":21,"V-2":22,"V-3":23,"V-4":24,"V-5":25,"V-6":26,"V-7":27,"V-8":28,"VI-1":29,"VI-2":30},"areas":[{"loc":0,"id":"NONE","name":"None"},{"loc":1,"id":"DEPLOY","name":"Deployment"},{"loc":2,"id":"ELIMINATED","name":"Eliminated"},{"loc":3,"id":"FRANCE","name":"France","type":4,"zone":null},{"loc":4,"id":"TUNISIA","name":"Tunisia","type":4,"zone":"TUNISIA"},{"loc":5,"id":"MOROCCO","name":"Morocco","type":4,"zone":"MOROCCO"},{"loc":6,"id":"I-1","name":"Barika","type":1,"zone":"I"},{"loc":7,"id":"I-2","name":"Batna","type":3,"zone":"I"},{"loc":8,"id":"I-3","name":"Biskra","type":3,"zone":"I"},{"loc":9,"id":"I-4","name":"Tebessa","type":1,"zone":"I"},{"loc":10,"id":"CONSTANTINE","name":"Constantine","type":2,"zone":"II"},{"loc":11,"id":"II-1","name":"Setif","type":1,"zone":"II"},{"loc":12,"id":"II-2","name":"Phillippeville","type":1,"zone":"II"},{"loc":13,"id":"II-3","name":"Souk Ahras","type":1,"zone":"II"},{"loc":14,"id":"III-1","name":"Tizi Ouzou","type":1,"zone":"III"},{"loc":15,"id":"III-2","name":"Bordj Bou Arreridj","type":1,"zone":"III"},{"loc":16,"id":"III-3","name":"Bougie","type":1,"zone":"III"},{"loc":17,"id":"ALGIERS","name":"Algiers","type":2,"zone":"IV"},{"loc":18,"id":"IV-1","name":"Medea","type":1,"zone":"IV"},{"loc":19,"id":"IV-2","name":"Orleansville","type":1,"zone":"IV"},{"loc":20,"id":"ORAN","name":"Oran","type":2,"zone":"V"},{"loc":21,"id":"V-1","name":"Mecheria","type":3,"zone":"V"},{"loc":22,"id":"V-2","name":"Tlemcen","type":1,"zone":"V"},{"loc":23,"id":"V-3","name":"Sidi Bel Abbes","type":1,"zone":"V"},{"loc":24,"id":"V-4","name":"Mostaganem","type":1,"zone":"V"},{"loc":25,"id":"V-5","name":"Saida","type":3,"zone":"V"},{"loc":26,"id":"V-6","name":"Mascara","type":3,"zone":"V"},{"loc":27,"id":"V-7","name":"Ain Sefra","type":3,"zone":"V"},{"loc":28,"id":"V-8","name":"Laghouat","type":3,"zone":"V"},{"loc":29,"id":"VI-1","name":"Sidi Aissa","type":3,"zone":"VI"},{"loc":30,"id":"VI-2","name":"Ain Qussera","type":1,"zone":"VI"}],"zone_areas":{"TUNISIA":[4],"MOROCCO":[5],"I":[6,7,8,9],"II":[10,11,12,13],"III":[14,15,16],"IV":[17,18,19],"V":[20,21,22,23,24,25,26,27,28],"VI":[29,30]},"adjecents":{"4":[7,8,9,13],"5":[21,22,27],"6":[11,15,29],"7":[4],"8":[4,28,29],"9":[4,11,12,13],"11":[6,9,15,16],"12":[9],"13":[4,9],"14":[18],"15":[6,11,18,29],"16":[11],"18":[14,15,29,30],"19":[24,30],"21":[5],"22":[5],"24":[19,30],"26":[30],"27":[5],"28":[8,29,30],"29":[6,8,15,18,28],"30":[18,19,24,26,28]},"units":[{"side":1,"type":0,"name":"French 2nd division","class":"fr_xx_2","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 4th division","class":"fr_xx_4","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 9th division","class":"fr_xx_9","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 12th division","class":"fr_xx_12","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 13th division","class":"fr_xx_13","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 14th division","class":"fr_xx_14","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 19th division","class":"fr_xx_19","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 20th division","class":"fr_xx_20","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 21th division","class":"fr_xx_21","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 29th division","class":"fr_xx_29","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 27th division","class":"fr_xx_27","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 5th division","class":"fr_xx_5","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 7th division","class":"fr_xx_7","evasion_contact":1,"firepower":25},{"side":1,"type":1,"name":"French brigade","class":"fr_x","evasion_contact":1,"firepower":6},{"side":1,"type":1,"name":"French brigade","class":"fr_x","evasion_contact":1,"firepower":6},{"side":1,"type":1,"name":"French brigade","class":"fr_x","evasion_contact":1,"firepower":6},{"side":1,"type":1,"name":"French brigade","class":"fr_x","evasion_contact":1,"firepower":6},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_para","evasion_contact":2,"firepower":9},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_para","evasion_contact":2,"firepower":9},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_para","evasion_contact":2,"firepower":9},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_inf","evasion_contact":2,"firepower":9},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_marine","evasion_contact":2,"firepower":9},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_marine","evasion_contact":2,"firepower":9},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_marine","evasion_contact":2,"firepower":9},{"side":1,"type":3,"name":"Algerian brigade","class":"alg_x","evasion_contact":1,"firepower":5},{"side":1,"type":3,"name":"Algerian brigade","class":"alg_x","evasion_contact":1,"firepower":5},{"side":1,"type":3,"name":"Algerian brigade","class":"alg_x","evasion_contact":1,"firepower":5},{"side":1,"type":3,"name":"Algerian brigade","class":"alg_x","evasion_contact":1,"firepower":5},{"side":1,"type":3,"name":"Algerian brigade","class":"alg_x","evasion_contact":1,"firepower":5},{"side":1,"type":3,"name":"Algerian brigade","class":"alg_x","evasion_contact":1,"firepower":5},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3}]} +const data = {"locations":{"NONE":0,"DEPLOY":1,"ELIMINATED":2,"FRANCE":3,"TUNISIA":4,"MOROCCO":5,"I-1":6,"I-2":7,"I-3":8,"I-4":9,"CONSTANTINE":10,"II-1":11,"II-2":12,"II-3":13,"III-1":14,"III-2":15,"III-3":16,"ALGIERS":17,"IV-1":18,"IV-2":19,"ORAN":20,"V-1":21,"V-2":22,"V-3":23,"V-4":24,"V-5":25,"V-6":26,"V-7":27,"V-8":28,"VI-1":29,"VI-2":30},"areas":[{"loc":0,"id":"NONE","name":"None"},{"loc":1,"id":"DEPLOY","name":"Deployment"},{"loc":2,"id":"ELIMINATED","name":"Eliminated"},{"loc":3,"id":"FRANCE","name":"France","type":4,"zone":null},{"loc":4,"id":"TUNISIA","name":"Tunisia","type":4,"zone":"TUNISIA"},{"loc":5,"id":"MOROCCO","name":"Morocco","type":4,"zone":"MOROCCO"},{"loc":6,"id":"I-1","name":"Barika","type":1,"zone":"I"},{"loc":7,"id":"I-2","name":"Batna","type":3,"zone":"I"},{"loc":8,"id":"I-3","name":"Biskra","type":3,"zone":"I"},{"loc":9,"id":"I-4","name":"Tebessa","type":1,"zone":"I"},{"loc":10,"id":"CONSTANTINE","name":"Constantine","type":2,"zone":"II"},{"loc":11,"id":"II-1","name":"Setif","type":1,"zone":"II"},{"loc":12,"id":"II-2","name":"Philippeville","type":1,"zone":"II"},{"loc":13,"id":"II-3","name":"Souk Ahras","type":1,"zone":"II"},{"loc":14,"id":"III-1","name":"Tizi Ouzou","type":1,"zone":"III"},{"loc":15,"id":"III-2","name":"Bordj Bou Arreridj","type":1,"zone":"III"},{"loc":16,"id":"III-3","name":"Bougie","type":1,"zone":"III"},{"loc":17,"id":"ALGIERS","name":"Algiers","type":2,"zone":"IV"},{"loc":18,"id":"IV-1","name":"Medea","type":1,"zone":"IV"},{"loc":19,"id":"IV-2","name":"Orleansville","type":1,"zone":"IV"},{"loc":20,"id":"ORAN","name":"Oran","type":2,"zone":"V"},{"loc":21,"id":"V-1","name":"Mecheria","type":3,"zone":"V"},{"loc":22,"id":"V-2","name":"Tlemcen","type":1,"zone":"V"},{"loc":23,"id":"V-3","name":"Sidi Bel Abbes","type":1,"zone":"V"},{"loc":24,"id":"V-4","name":"Mostaganem","type":1,"zone":"V"},{"loc":25,"id":"V-5","name":"Saida","type":3,"zone":"V"},{"loc":26,"id":"V-6","name":"Mascara","type":3,"zone":"V"},{"loc":27,"id":"V-7","name":"Ain Sefra","type":3,"zone":"V"},{"loc":28,"id":"V-8","name":"Laghouat","type":3,"zone":"V"},{"loc":29,"id":"VI-1","name":"Sidi Aissa","type":3,"zone":"VI"},{"loc":30,"id":"VI-2","name":"Ain Qussera","type":1,"zone":"VI"}],"zone_areas":{"TUNISIA":[4],"MOROCCO":[5],"I":[6,7,8,9],"II":[10,11,12,13],"III":[14,15,16],"IV":[17,18,19],"V":[20,21,22,23,24,25,26,27,28],"VI":[29,30]},"adjecents":{"4":[7,8,9,13],"5":[21,22,27],"6":[11,15,29],"7":[4],"8":[4,28,29],"9":[4,11,12,13],"11":[6,9,15,16],"12":[9],"13":[4,9],"14":[18],"15":[6,11,18,29],"16":[11],"18":[14,15,29,30],"19":[24,30],"21":[5],"22":[5],"24":[19,30],"26":[30],"27":[5],"28":[8,29,30],"29":[6,8,15,18,28],"30":[18,19,24,26,28]},"units":[{"side":1,"type":0,"name":"French 2nd division","class":"fr_xx_2","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 4th division","class":"fr_xx_4","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 9th division","class":"fr_xx_9","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 12th division","class":"fr_xx_12","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 13th division","class":"fr_xx_13","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 14th division","class":"fr_xx_14","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 19th division","class":"fr_xx_19","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 20th division","class":"fr_xx_20","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 21th division","class":"fr_xx_21","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 29th division","class":"fr_xx_29","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 27th division","class":"fr_xx_27","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 5th division","class":"fr_xx_5","evasion_contact":1,"firepower":25},{"side":1,"type":0,"name":"French 7th division","class":"fr_xx_7","evasion_contact":1,"firepower":25},{"side":1,"type":1,"name":"French brigade","class":"fr_x","evasion_contact":1,"firepower":6},{"side":1,"type":1,"name":"French brigade","class":"fr_x","evasion_contact":1,"firepower":6},{"side":1,"type":1,"name":"French brigade","class":"fr_x","evasion_contact":1,"firepower":6},{"side":1,"type":1,"name":"French brigade","class":"fr_x","evasion_contact":1,"firepower":6},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_para","evasion_contact":2,"firepower":9},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_para","evasion_contact":2,"firepower":9},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_para","evasion_contact":2,"firepower":9},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_inf","evasion_contact":2,"firepower":9},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_marine","evasion_contact":2,"firepower":9},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_marine","evasion_contact":2,"firepower":9},{"side":1,"type":2,"name":"French elite brigade","class":"fr_elite_x_marine","evasion_contact":2,"firepower":9},{"side":1,"type":3,"name":"Algerian brigade","class":"alg_x","evasion_contact":1,"firepower":5},{"side":1,"type":3,"name":"Algerian brigade","class":"alg_x","evasion_contact":1,"firepower":5},{"side":1,"type":3,"name":"Algerian brigade","class":"alg_x","evasion_contact":1,"firepower":5},{"side":1,"type":3,"name":"Algerian brigade","class":"alg_x","evasion_contact":1,"firepower":5},{"side":1,"type":3,"name":"Algerian brigade","class":"alg_x","evasion_contact":1,"firepower":5},{"side":1,"type":3,"name":"Algerian brigade","class":"alg_x","evasion_contact":1,"firepower":5},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":1,"type":4,"name":"Algerian Police","class":"alg_police","evasion_contact":2,"firepower":2},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":5,"name":"FLN Failek","class":"fln_failek","evasion_contact":2,"firepower":4},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":6,"name":"FLN Band","class":"fln_band","evasion_contact":3,"firepower":2},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":7,"name":"FLN Cadre","class":"fln_cadre","evasion_contact":4,"firepower":1},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3},{"side":0,"type":8,"name":"FLN Front","class":"fln_front","evasion_contact":3,"firepower":3}]} if (typeof module !== 'undefined') module.exports = data diff --git a/map.svg b/map.svg index ad38182..11cd4d3 100644 --- a/map.svg +++ b/map.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/play.html b/play.html index c91b316..fd1386b 100644 --- a/play.html +++ b/play.html @@ -65,18 +65,21 @@ main { background-color: dimgray } fill-opacity: 0; fill: white; } -#map svg path.area.where { +#map svg path.area.action { fill-opacity: 0.4; - fill: darkslategray; + fill: var(--highlight-color); + stroke: white; + stroke-width: 10; + stroke-dasharray: 8 4; } -#map svg path.area.highlight { +#map svg path.area.target { cursor: pointer; fill-opacity: 0.4; - fill: white; + fill: var(--highlight-color); } #map svg path.area.tip { - stroke: yellow; - stroke-width: 40; + stroke: var(--tip-color); + stroke-width: 20; stroke-dasharray: 80 40; } @@ -339,13 +342,13 @@ main { background-color: dimgray } - + - + @@ -356,12 +359,12 @@ main { background-color: dimgray } - + - + diff --git a/play.js b/play.js index 4060e28..2b9505b 100644 --- a/play.js +++ b/play.js @@ -15,6 +15,7 @@ const ELIMINATED = 2 // const PTL = 2 // const OC = 3 // const BOXES = [UG, OPS, PTL, OC] +const BOX_NAMES = ["UG", "OPS", "PTL", "OC"] const area_count = 31 const unit_count = 120 @@ -148,11 +149,11 @@ const LAYOUT = { "Constantine-OPS": [1227, 204], "Constantine-UG": [1170, 204], "Constantine-MK": [1280, 151], - "Phillippeville-OC": [1244, 540], - "Phillippeville-PTL": [1251, 456], - "Phillippeville-OPS": [1306, 402], - "Phillippeville-UG": [1249, 344], - "Phillippeville-MK": [1306, 307], + "Philippeville-OC": [1244, 540], + "Philippeville-PTL": [1251, 456], + "Philippeville-OPS": [1306, 402], + "Philippeville-UG": [1249, 344], + "Philippeville-MK": [1306, 307], "Setif-OC": [1139, 541], "Setif-PTL": [1043, 523], "Setif-OPS": [1164, 376], @@ -418,33 +419,26 @@ function create_border_zone(i) { const COUNTRY = 4 -function create_area(i, area_id, type) { - let e = ui.areas[i] = document.createElement("div") - e.id = `area-${area_id}` +function create_area(i, area_id, area_name, type) { + let area_name_css = area_name.replaceAll(' ', '-') + let e = ui.areas[i] = document.querySelector(`#svgmap #areas #${area_name_css}`) e.dataset.loc = data.areas[i].loc - e.className = "space" e.addEventListener("mousedown", on_click_loc) - e.style.left = data.areas[i].x / SCALE + "px" - e.style.top = data.areas[i].y / SCALE + "px" - if (type !== COUNTRY) { - e.style.width = 193 / SCALE + "px" - e.style.height = 193 / SCALE + "px" - } else { - e.style.width = data.areas[i].w / SCALE + "px" - e.style.height = data.areas[i].h / SCALE + "px" - } - document.getElementById("areas").appendChild(e) } -function create_area_markers(i, area_id) { +function create_area_markers(i, area_id, area_name) { + const box_size = 95 / SCALE + console.log(i, area_id, area_name) + let [x, y] = LAYOUT[area_name + '-MK'] + let e = document.createElement("div") e.id = `area-marker-${area_id}` e.dataset.loc = data.areas[i].loc - e.className = "space stack s" - e.style.left = (data.areas[i].x + 175) / SCALE + "px" - e.style.top = (data.areas[i].y - 65) / SCALE + "px" - e.style.width = 65 / SCALE + "px" - e.style.height = 65 / SCALE + "px" + e.className = "space stack" + e.style.left = x - (box_size / 2) + "px" + e.style.top = y - (box_size / 2) + "px" + e.style.width = box_size + "px" + e.style.height = box_size + "px" document.getElementById("area_markers").appendChild(e) ui.area_markers[i] = {} @@ -452,21 +446,24 @@ function create_area_markers(i, area_id) { for (let marker of ['remote', 'fln_control', 'gov_control', 'terror', 'oas_active']) { let em = ui.area_markers[i][marker] = document.createElement("div") em.id = `area-marker-${i}-${marker}` - em.className = `counter ${marker} s` + em.className = `counter ${marker}` e.appendChild(em) } } -function create_box(i, area_id, box_id) { +function create_box(i, area_id, area_name, box_id) { + const box_size = 90 / SCALE + let [x, y] = LAYOUT[area_name + '-' + BOX_NAMES[box_id]] + let e = ui.boxes[i * 4 + box_id] = document.createElement("div") e.id = `ops-${area_id}-${box_id}` e.dataset.loc = data.areas[i].loc e.className = "space stack" e.addEventListener("mousedown", on_click_loc) - e.style.left = (data.areas[i].x + (box_id % 2) * 99) / SCALE + "px" - e.style.top = (data.areas[i].y + Math.floor(box_id / 2) * 99) / SCALE + "px" - e.style.width = 94 / SCALE + "px" - e.style.height = 94 / SCALE + "px" + e.style.left = x - (box_size / 2) + "px" + e.style.top = y - (box_size / 2) + "px" + e.style.width = box_size + "px" + e.style.height = box_size + "px" document.getElementById("boxes").appendChild(e) return e } @@ -501,20 +498,21 @@ function on_init() { // Areas for (let i = 0; i < data.areas.length; ++i) { let area_id = data.areas[i].id + let area_name = data.areas[i].name let type = data.areas[i].type if (type) { - create_area(i, area_id, type) + create_area(i, area_id, area_name, type) if (type !== COUNTRY) { // Area markers - create_area_markers(i, area_id) + create_area_markers(i, area_id, area_name) // Unit Boxes for (let box_id = 0; box_id < 4; ++box_id) { - create_box(i, area_id, box_id) + create_box(i, area_id, area_name, box_id) } } else { - let e = create_box(i, area_id, 0) + let e = create_box(i, area_id, area_name, 0) if (area_id === "FRANCE") { ui.area_markers[i] = {} diff --git a/tools/gendata.js b/tools/gendata.js index 4e10a79..e6dc4bc 100644 --- a/tools/gendata.js +++ b/tools/gendata.js @@ -43,7 +43,7 @@ def_area("I-4", "Tebessa", RURAL, "I") def_area("CONSTANTINE", "Constantine", URBAN, "II") def_area("II-1", "Setif", RURAL, "II") -def_area("II-2", "Phillippeville", RURAL, "II") +def_area("II-2", "Philippeville", RURAL, "II") def_area("II-3", "Souk Ahras", RURAL, "II") def_area("III-1", "Tizi Ouzou", RURAL, "III") diff --git a/tools/layout.svg b/tools/layout.svg index 00c43af..f5a7850 100644 --- a/tools/layout.svg +++ b/tools/layout.svg @@ -359,7 +359,7 @@ - + -- cgit v1.2.3