format html template over multiple lines
[sc2-widget] / widget.html
1 <!DOCTYPE html>
2 <html>
3
4 <head>
5 <meta charset="utf-8" />
6 <title>StarCraft ][ Clan summary</title>
7 <link rel="stylesheet" type="text/css" href="/schtarr/battle.css" />
8 <meta name="theme-color" content="#000D1A" />
9 <meta name="viewport" content="width=device-width" />
10 </head>
11
12 <body>
13 <p id="clan">No clan data</p>
14 <script>
15         fetch('/schtarr/inno.json')
16         .then(res => res.json())
17         .then(json => {
18                 document.getElementById('clan').innerHTML = `
19                         <h1>${json.tag}</h1>
20                         <h2 title="Division ${json.division}" class="rank ${json.league}">
21                                 ${json.league} <small>#${json.rank}</small>
22                         </h2>
23                         ${json.members.map(member => `
24                                 <a href="${member.profileUrl}"><figure>
25                                         <img src="${member.avatarUrl}" title="${member.name}" />
26                                         <figcaption>${member.name}</figcaption>
27                                 </figure></a>
28                         `).join('')}
29                 `
30         })
31         .catch(error => console.log(error))
32 </script>
33 </body>
34
35 </html>