fix: Render templates correctly when serving from bundled

This commit is contained in:
ptrcnull 2022-06-20 14:46:39 +02:00
parent c7f52ff8fe
commit 378ae1fdbc
Signed by: ptrcnull
GPG key ID: 411F7B30801DD9CA
4 changed files with 32 additions and 23 deletions

2
dist/common.js vendored
View file

@ -14,7 +14,7 @@ const $ = (...args) => {
const $$ = document.querySelectorAll.bind(document) const $$ = document.querySelectorAll.bind(document)
function initTemplate(template, data) { function initTemplate(template, data) {
const fragment = template.content.cloneNode(true) const fragment = template.cloneNode(true)
Object.keys(data).forEach(key => { Object.keys(data).forEach(key => {
const field = fragment.querySelector('.' + key) const field = fragment.querySelector('.' + key)
const value = data[key] const value = data[key]

26
dist/runner.html vendored
View file

@ -41,24 +41,26 @@
<tbody></tbody> <tbody></tbody>
</table> </table>
<template> <div class="template">
<tr> <table>
<td class="pipeline"><a target="_blank"></a></td> <tr>
<td class="name"><a target="_blank"></a></td> <td class="pipeline"><a target="_blank"></a></td>
<td class="created_at"></td> <td class="name"><a target="_blank"></a></td>
<td class="status"></td> <td class="created_at"></td>
<td class="project"><a target="_blank"></a></td> <td class="status"></td>
<td class="runner"></td> <td class="project"><a target="_blank"></a></td>
<td class="retry">retry</td> <td class="runner"></td>
</tr> <td class="retry">retry</td>
</template> </tr>
</table>
</div>
<script src="common.js"></script> <script src="common.js"></script>
<script> <script>
const runnerId = new URLSearchParams(window.location.search).get('id') const runnerId = new URLSearchParams(window.location.search).get('id')
// $('h2').textContent = runnerId // $('h2').textContent = runnerId
const template = $('template') const template = $('.template')
const table = $('tbody') const table = $('tbody')
let notifications = true let notifications = true

22
dist/runners.html vendored
View file

@ -22,16 +22,18 @@
</table> </table>
<a href="runner.html">Show all runners</a> <a href="runner.html">Show all runners</a>
<template> <div class="template">
<tr> <table>
<td class="id"></td> <tr>
<td class="desc"></td> <td class="id"></td>
</tr> <td class="desc"></td>
</template> </tr>
</table>
</div>
<script src="common.js"></script> <script src="common.js"></script>
<script> <script>
const template = $('template') const template = $('.template')
const table = $('tbody') const table = $('tbody')
listRunners() listRunners()
@ -41,11 +43,11 @@
id: runner.id, id: runner.id,
desc: runner.description desc: runner.description
}) })
fragment.querySelector('tr').addEventListener('click', ev => { const row = $(fragment, 'tr')
console.log('cock') row.addEventListener('click', ev => {
document.location.href = 'runner.html?id=' + runner.id document.location.href = 'runner.html?id=' + runner.id
}) })
table.appendChild(fragment) table.appendChild(row)
}) })
}) })
.catch(err => { .catch(err => {

5
dist/style.css vendored
View file

@ -15,6 +15,11 @@ body {
justify-content: center; justify-content: center;
} }
/* workaround for https://github.com/tauri-apps/tauri/issues/4410 */
div.template {
display: none;
}
table { table {
border: 1px solid #f0f0f0; border: 1px solid #f0f0f0;
} }