From 5d2e01ec2e6d39852288a34c578d93a6c5da7b04 Mon Sep 17 00:00:00 2001
From: Taka <taka@vm-linux-dev>
Date: Sun, 5 May 2019 12:04:34 +0000
Subject: [PATCH] Include width/height attributes for player flag and
 vehicle/ordnance counter images in snippets.

---
 .../webapp/data/default-template-pack/atmm.j2 |  2 +-
 .../webapp/data/default-template-pack/baz.j2  |  2 +-
 .../extras/kgs/grenade-bundles.j2             |  3 ++-
 .../extras/kgs/molotov-cocktails.j2           |  3 ++-
 .../data/default-template-pack/mol-p.j2       |  2 +-
 .../webapp/data/default-template-pack/mol.j2  |  2 +-
 .../data/default-template-pack/ob_ma_notes.j2 |  2 +-
 .../data/default-template-pack/ob_setup.j2    |  2 +-
 .../default-template-pack/ob_vo.image.include |  5 ++++-
 .../data/default-template-pack/ob_vo.j2       |  2 +-
 .../data/default-template-pack/ob_vo_note.j2  |  2 +-
 .../webapp/data/default-template-pack/pf.j2   |  2 +-
 .../webapp/data/default-template-pack/piat.j2 |  2 +-
 .../default-template-pack/player_flag.include |  2 ++
 .../data/default-template-pack/players.j2     |  5 +++--
 .../webapp/data/default-template-pack/psk.j2  |  2 +-
 .../webapp/data/default-template-pack/thh.j2  |  2 +-
 vasl_templates/webapp/static/snippets.js      |  4 +++-
 .../webapp/tests/test_online_images.py        | 20 +++++++++----------
 19 files changed, 38 insertions(+), 28 deletions(-)
 create mode 100644 vasl_templates/webapp/data/default-template-pack/player_flag.include

diff --git a/vasl_templates/webapp/data/default-template-pack/atmm.j2 b/vasl_templates/webapp/data/default-template-pack/atmm.j2
index 21a5c97..1d7e72d 100644
--- a/vasl_templates/webapp/data/default-template-pack/atmm.j2
+++ b/vasl_templates/webapp/data/default-template-pack/atmm.j2
@@ -16,7 +16,7 @@
   padding: 2px 5px ;
   font-weight: bold ;
 ">
-    {%if PLAYER_FLAG%}<img src="{{PLAYER_FLAG}}">&nbsp;{%endif%}Anti-Tank Magnetic Mines
+    {{INCLUDE:player_flag}}Anti-Tank Magnetic Mines
 
 <tr>
 <td style="padding:2px 5px;">
diff --git a/vasl_templates/webapp/data/default-template-pack/baz.j2 b/vasl_templates/webapp/data/default-template-pack/baz.j2
index 13484e7..755a4b3 100644
--- a/vasl_templates/webapp/data/default-template-pack/baz.j2
+++ b/vasl_templates/webapp/data/default-template-pack/baz.j2
@@ -16,7 +16,7 @@
   padding: 2px 5px ;
   font-weight: bold ;
 ">
-    {%if PLAYER_FLAG%}<img src="{{PLAYER_FLAG}}">&nbsp;{%endif%}Bazooka {%if BAZ_TYPE%} ('{{BAZ_TYPE}}) {%endif%}
+    {{INCLUDE:player_flag}}Bazooka {%if BAZ_TYPE%} ('{{BAZ_TYPE}}) {%endif%}
 
 <tr>
 
diff --git a/vasl_templates/webapp/data/default-template-pack/extras/kgs/grenade-bundles.j2 b/vasl_templates/webapp/data/default-template-pack/extras/kgs/grenade-bundles.j2
index 5069b54..af1eeee 100644
--- a/vasl_templates/webapp/data/default-template-pack/extras/kgs/grenade-bundles.j2
+++ b/vasl_templates/webapp/data/default-template-pack/extras/kgs/grenade-bundles.j2
@@ -14,7 +14,8 @@ td { margin: 0 ; padding: 0 ; }
 
 <tr>
 <td colspan="2" style="background: {{PLAYER_COLORS["german"][0]}} ; border-bottom: 1px solid {{PLAYER_COLORS["german"][2]}} ; padding: 2px 5px ; font-weight: bold ;">
-    {%if PLAYER_FLAGS["german"]%}<img src="{{PLAYER_FLAGS["german"]}}">&nbsp;{%endif%}Grenade Bundles
+    {# Some versions of Java require <img> tags to have the width and height specified!?! #}
+    {%if PLAYER_FLAGS["german"]%}<img src="{{PLAYER_FLAGS["german"]}}" {{PLAYER_FLAG_SIZE}}>&nbsp;{%endif%}Grenade Bundles
 
 <tr>
 <td style="padding:2px 5px;">
diff --git a/vasl_templates/webapp/data/default-template-pack/extras/kgs/molotov-cocktails.j2 b/vasl_templates/webapp/data/default-template-pack/extras/kgs/molotov-cocktails.j2
index 7817327..95b73d5 100644
--- a/vasl_templates/webapp/data/default-template-pack/extras/kgs/molotov-cocktails.j2
+++ b/vasl_templates/webapp/data/default-template-pack/extras/kgs/molotov-cocktails.j2
@@ -15,7 +15,8 @@ ul { margin: 0 0 0 10px ; padding: 0 ; }
 
 <tr>
 <td colspan="2" style="background: {{PLAYER_COLORS["german"][0]}} ; border-bottom: 1px solid {{PLAYER_COLORS["german"][2]}} ; padding: 2px 5px ; font-weight: bold ;">
-    {%if PLAYER_FLAGS["german"]%}<img src="{{PLAYER_FLAGS["german"]}}">&nbsp;{%endif%}Molotov Cocktails
+    {# Some versions of Java require <img> tags to have the width and height specified!?! #}
+    {%if PLAYER_FLAGS["german"]%}<img src="{{PLAYER_FLAGS["german"]}}" {{PLAYER_FLAG_SIZE}}>&nbsp;{%endif%}Molotov Cocktails
 
 <tr>
 <td style="padding:0 5px;">
diff --git a/vasl_templates/webapp/data/default-template-pack/mol-p.j2 b/vasl_templates/webapp/data/default-template-pack/mol-p.j2
index cf0bc5a..37dee2e 100644
--- a/vasl_templates/webapp/data/default-template-pack/mol-p.j2
+++ b/vasl_templates/webapp/data/default-template-pack/mol-p.j2
@@ -16,7 +16,7 @@
   padding: 2px 5px ;
   font-weight: bold ;
 ">
-    {%if PLAYER_FLAG%}<img src="{{PLAYER_FLAG}}">&nbsp;{%endif%}MOL Projector
+    {{INCLUDE:player_flag}}MOL Projector
 
 <tr>
 
diff --git a/vasl_templates/webapp/data/default-template-pack/mol.j2 b/vasl_templates/webapp/data/default-template-pack/mol.j2
index 0d12f42..c639f45 100644
--- a/vasl_templates/webapp/data/default-template-pack/mol.j2
+++ b/vasl_templates/webapp/data/default-template-pack/mol.j2
@@ -16,7 +16,7 @@
   padding: 2px 5px ;
   font-weight: bold ;
 ">
-    {%if PLAYER_FLAG%}<img src="{{PLAYER_FLAG}}">&nbsp;{%endif%}Molotov Cocktail
+    {{INCLUDE:player_flag}}Molotov Cocktail
 
 <tr>
 <td style="padding:0 5px;">
diff --git a/vasl_templates/webapp/data/default-template-pack/ob_ma_notes.j2 b/vasl_templates/webapp/data/default-template-pack/ob_ma_notes.j2
index 54796e7..415de81 100644
--- a/vasl_templates/webapp/data/default-template-pack/ob_ma_notes.j2
+++ b/vasl_templates/webapp/data/default-template-pack/ob_ma_notes.j2
@@ -28,7 +28,7 @@
   padding: 2px 5px ;
   font-weight: bold ;
 ">
-    {%if PLAYER_FLAG%}<img src="{{PLAYER_FLAG}}">&nbsp;{%endif%}{{PLAYER_NAME}} {{VO_TYPE}} Notes
+    {{INCLUDE:player_flag}}{{PLAYER_NAME}} {{VO_TYPE}} Notes
 
 {%if OB_MA_NOTES%}
 <tr> <td style="padding: 0 5px;">
diff --git a/vasl_templates/webapp/data/default-template-pack/ob_setup.j2 b/vasl_templates/webapp/data/default-template-pack/ob_setup.j2
index 5d1d4a5..616caf6 100644
--- a/vasl_templates/webapp/data/default-template-pack/ob_setup.j2
+++ b/vasl_templates/webapp/data/default-template-pack/ob_setup.j2
@@ -17,7 +17,7 @@
   font-weight: bold ;
   {%if OB_SETUP_WIDTH%} width: {{OB_SETUP_WIDTH}} ; {%endif%}
 ">
-    {%if PLAYER_FLAG%}<img src="{{PLAYER_FLAG}}">&nbsp;{%endif%}{{OB_SETUP}}
+    {{INCLUDE:player_flag}}{{OB_SETUP}}
 
 </table>
 
diff --git a/vasl_templates/webapp/data/default-template-pack/ob_vo.image.include b/vasl_templates/webapp/data/default-template-pack/ob_vo.image.include
index 826ca32..c5ed57c 100644
--- a/vasl_templates/webapp/data/default-template-pack/ob_vo.image.include
+++ b/vasl_templates/webapp/data/default-template-pack/ob_vo.image.include
@@ -1 +1,4 @@
-{%if vo.image%} <img src="{{vo.image}}"> {%endif%}
+{# Some versions of Java require <img> tags to have the width and height specified!?! #}
+{%if vo.image%} <img src="{{vo.image}}"
+    {%if vo.small_piece%} width="48" height="48" {%else%} width="60" height="60" {%endif%}
+> {%endif%}
diff --git a/vasl_templates/webapp/data/default-template-pack/ob_vo.j2 b/vasl_templates/webapp/data/default-template-pack/ob_vo.j2
index f7170b2..994388d 100644
--- a/vasl_templates/webapp/data/default-template-pack/ob_vo.j2
+++ b/vasl_templates/webapp/data/default-template-pack/ob_vo.j2
@@ -22,7 +22,7 @@
       padding: 2px 5px 0 5px ;
       font-weight: bold ;
     ">
-        <nobr>{%if PLAYER_FLAG%}<img src="{{PLAYER_FLAG}}">&nbsp;{%endif%}{{PLAYER_NAME|nbsp}}&nbsp;{{VO_TYPES}}</nobr>
+        <nobr>{{INCLUDE:player_flag}}{{PLAYER_NAME|nbsp}}&nbsp;{{VO_TYPES}}</nobr>
 
 {%for vo in OB_VO%}
 
diff --git a/vasl_templates/webapp/data/default-template-pack/ob_vo_note.j2 b/vasl_templates/webapp/data/default-template-pack/ob_vo_note.j2
index 91a9869..1f374f6 100644
--- a/vasl_templates/webapp/data/default-template-pack/ob_vo_note.j2
+++ b/vasl_templates/webapp/data/default-template-pack/ob_vo_note.j2
@@ -17,7 +17,7 @@
       padding: 2px 5px ;
       font-weight: bold ;
     ">
-        {%if PLAYER_FLAG%}<img src="{{PLAYER_FLAG}}">&nbsp;{%endif%}{{VO_NAME}}
+        {{INCLUDE:player_flag}}{{VO_NAME}}
 
 <tr>
     <td style="padding-top:2px;"> {{VO_NOTE_HTML}}
diff --git a/vasl_templates/webapp/data/default-template-pack/pf.j2 b/vasl_templates/webapp/data/default-template-pack/pf.j2
index ec8e890..9f9640b 100644
--- a/vasl_templates/webapp/data/default-template-pack/pf.j2
+++ b/vasl_templates/webapp/data/default-template-pack/pf.j2
@@ -16,7 +16,7 @@
   padding: 2px 5px ;
   font-weight: bold ;
 ">
-    {%if PLAYER_FLAG%}<img src="{{PLAYER_FLAG}}">&nbsp;{%endif%}Panzerfaust
+    {{INCLUDE:player_flag}}Panzerfaust
 
 <tr>
 
diff --git a/vasl_templates/webapp/data/default-template-pack/piat.j2 b/vasl_templates/webapp/data/default-template-pack/piat.j2
index 1fcac02..b18a9bb 100644
--- a/vasl_templates/webapp/data/default-template-pack/piat.j2
+++ b/vasl_templates/webapp/data/default-template-pack/piat.j2
@@ -16,7 +16,7 @@
   padding: 2px 5px ;
   font-weight: bold ;
 ">
-    {%if PLAYER_FLAG%}<img src="{{PLAYER_FLAG}}">&nbsp;{%endif%}PIAT
+    {{INCLUDE:player_flag}}PIAT
 
 <tr>
 
diff --git a/vasl_templates/webapp/data/default-template-pack/player_flag.include b/vasl_templates/webapp/data/default-template-pack/player_flag.include
new file mode 100644
index 0000000..fbc38c7
--- /dev/null
+++ b/vasl_templates/webapp/data/default-template-pack/player_flag.include
@@ -0,0 +1,2 @@
+{# Some versions of Java require <img> tags to have the width and height specified!?! #}
+{%if PLAYER_FLAG%}<img src="{{PLAYER_FLAG}}" {{PLAYER_FLAG_SIZE}}>&nbsp;{%endif%}
diff --git a/vasl_templates/webapp/data/default-template-pack/players.j2 b/vasl_templates/webapp/data/default-template-pack/players.j2
index d068057..44962d5 100644
--- a/vasl_templates/webapp/data/default-template-pack/players.j2
+++ b/vasl_templates/webapp/data/default-template-pack/players.j2
@@ -13,8 +13,9 @@
 ">
 
 <td style="font-weight:bold;">
-     {%if PLAYER_FLAG_1%}<img src="{{PLAYER_FLAG_1}}">&nbsp;{%endif%}{{PLAYER_1_NAME}}: <br>
-     {%if PLAYER_FLAG_2%}<img src="{{PLAYER_FLAG_2}}">&nbsp;{%endif%}{{PLAYER_2_NAME}}:
+    {# Some versions of Java require <img> tags to have the width and height specified!?! #}
+    {%if PLAYER_FLAG_1%}<img src="{{PLAYER_FLAG_1}}" {{PLAYER_FLAG_SIZE}}>&nbsp;{%endif%}{{PLAYER_1_NAME}}: <br>
+    {%if PLAYER_FLAG_2%}<img src="{{PLAYER_FLAG_2}}" {{PLAYER_FLAG_SIZE}}>&nbsp;{%endif%}{{PLAYER_2_NAME}}:
 
 <td style="padding-left:2px;">
     ELR: {{PLAYER_1_ELR}} <br>
diff --git a/vasl_templates/webapp/data/default-template-pack/psk.j2 b/vasl_templates/webapp/data/default-template-pack/psk.j2
index d67a2b5..d1efb27 100644
--- a/vasl_templates/webapp/data/default-template-pack/psk.j2
+++ b/vasl_templates/webapp/data/default-template-pack/psk.j2
@@ -16,7 +16,7 @@
   padding: 2px 5px ;
   font-weight: bold ;
 ">
-    {%if PLAYER_FLAG%}<img src="{{PLAYER_FLAG}}">&nbsp;{%endif%}Panzerschrek
+    {{INCLUDE:player_flag}}Panzerschrek
 
 <tr>
 
diff --git a/vasl_templates/webapp/data/default-template-pack/thh.j2 b/vasl_templates/webapp/data/default-template-pack/thh.j2
index 4f2eaab..f70286f 100644
--- a/vasl_templates/webapp/data/default-template-pack/thh.j2
+++ b/vasl_templates/webapp/data/default-template-pack/thh.j2
@@ -16,7 +16,7 @@
   padding: 2px 5px ;
   font-weight: bold ;
 ">
-    {%if PLAYER_FLAG%}<img src="{{PLAYER_FLAG}}">&nbsp;{%endif%}Tank-Hunter Heroes
+    {{INCLUDE:player_flag}}Tank-Hunter Heroes
 
 <tr>
 
diff --git a/vasl_templates/webapp/static/snippets.js b/vasl_templates/webapp/static/snippets.js
index 04df056..2157bd0 100644
--- a/vasl_templates/webapp/static/snippets.js
+++ b/vasl_templates/webapp/static/snippets.js
@@ -130,6 +130,8 @@ function make_snippet( $btn, params, extra_params, show_date_warnings )
         APP_URL_BASE + gImagesBaseUrl ;
     if ( gUserSettings["custom-list-bullets"] )
         params.CUSTOM_LIST_BULLETS = true ;
+    // some versions of Java require <img> tags to have the width and height specified!?!
+    params.PLAYER_FLAG_SIZE = "width='11' height='11'" ;
 
     // set player-specific parameters
     var player_no = get_player_no_for_element( $btn ) ;
@@ -382,7 +384,7 @@ function make_snippet( $btn, params, extra_params, show_date_warnings )
     for ( var key in gTemplatePack.css )
         templ = strReplaceAll( templ, "{{CSS:"+key+"}}", gTemplatePack.css[key] ) ;
     for ( key in gTemplatePack.includes )
-        templ = strReplaceAll( templ, "{{INCLUDE:"+key+"}}", gTemplatePack.includes[key] ) ;
+        templ = strReplaceAll( templ, "{{INCLUDE:"+key+"}}", gTemplatePack.includes[key].trim() ) ;
     var func ;
     try {
         func = jinja.compile( templ ).render ;
diff --git a/vasl_templates/webapp/tests/test_online_images.py b/vasl_templates/webapp/tests/test_online_images.py
index 0292915..a4b8d03 100644
--- a/vasl_templates/webapp/tests/test_online_images.py
+++ b/vasl_templates/webapp/tests/test_online_images.py
@@ -48,8 +48,8 @@ def test_online_images( webapp, webdriver ):
 
     # test player flags
     do_test( "players",
-        re.compile( r'<img src="http://vasl-templates.org/.+/flags/german.png">' ),
-        re.compile( r'<img src="http://[a-z0-9.]+:\d+/flags/german">' )
+        re.compile( r'<img src="http://vasl-templates.org/.+/flags/german.png"' ),
+        re.compile( r'<img src="http://[a-z0-9.]+:\d+/flags/german"' )
     )
 
     # test custom list bullets
@@ -61,8 +61,8 @@ def test_online_images( webapp, webdriver ):
     # test VASL counter images
     select_tab( "ob1" )
     do_test( "ob_vehicles_1",
-        re.compile( r'<img src="https://raw.githubusercontent.com/.+/ge/veh/pzivh.gif">' ),
-        re.compile( r'<img src="http://[a-z0-9.]+:\d+/counter/2584/front">' )
+        re.compile( r'<img src="https://raw.githubusercontent.com/.+/ge/veh/pzivh.gif"' ),
+        re.compile( r'<img src="http://[a-z0-9.]+:\d+/counter/2584/front"' )
     )
 
 # ---------------------------------------------------------------------
@@ -95,7 +95,7 @@ def test_multiple_images( webapp, webdriver ):
     btn = find_child( "button[data-id='ob_vehicles_1']" )
     btn.click()
     wait_for_clipboard( 2,
-        re.compile( r'<img src="https://raw.githubusercontent.com/.+/br/vehicles/portee.gif">')
+        re.compile( r'<img src="https://raw.githubusercontent.com/.+/br/vehicles/portee.gif"')
     )
 
     # select the second image for the vehicle
@@ -114,7 +114,7 @@ def test_multiple_images( webapp, webdriver ):
     btn = find_child( "button[data-id='ob_vehicles_1']" )
     btn.click()
     wait_for_clipboard( 2,
-        re.compile( r'<img src="https://raw.githubusercontent.com/.+/br/vehicles/portee0.gif">')
+        re.compile( r'<img src="https://raw.githubusercontent.com/.+/br/vehicles/portee0.gif"')
     )
 
 # ---------------------------------------------------------------------
@@ -152,11 +152,11 @@ def test_extensions( webapp, webdriver ):
     btn = find_child( "button[data-id='ob_vehicles_1']" )
     btn.click()
     wait_for_clipboard( 2, re.compile(
-        '<img src="http://vasl-templates.org/.+/f97/matii2-4cmg.gif">'
+        '<img src="http://vasl-templates.org/.+/f97/matii2-4cmg.gif"'
         '.+'
-        '<img src="http://vasl-templates.org/.+/f97/matii2-6cmg.gif">'
+        '<img src="http://vasl-templates.org/.+/f97/matii2-6cmg.gif"'
         '.+'
-        '<img src="https://raw.githubusercontent.com/.+/ru/veh/T60M40.gif">'
+        '<img src="https://raw.githubusercontent.com/.+/ru/veh/T60M40.gif"'
         '.+'
-        '<img src="http://vasl-templates.org/.+/f97/T60M40.gif">'
+        '<img src="http://vasl-templates.org/.+/f97/T60M40.gif"'
     , re.DOTALL ) )