73 lines
3.0 KiB
HTML
73 lines
3.0 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en" xmlns:x-on="http://www.w3.org/1999/xhtml" xmlns:x-bind="http://www.w3.org/1999/xhtml">
|
||
<head>
|
||
|
||
<!-- Basic Page Needs –––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||
<meta charset="utf-8">
|
||
<title>Steam Workshop Viewer</title>
|
||
<meta name="description" content="">
|
||
<meta name="author" content="">
|
||
|
||
<!-- Mobile Specific Metas –––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
|
||
<!-- FONT –––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||
<link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css">
|
||
|
||
<!-- CSS –––––––––––––––––––––––––––––––––––––––––––––––––– -->
|
||
<link rel="icon" type="image/png" href="images/favicon.png">
|
||
|
||
<script src="steam.js"></script>
|
||
</head>
|
||
<body>
|
||
|
||
|
||
<div class="container" x-data="workshopList">
|
||
<template x-if="loading">
|
||
<div class="loader"></div>
|
||
</template>
|
||
<div class="row">
|
||
<div class="colum">
|
||
<h1>Steam Workshop Items Viewer</h1>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="column">
|
||
<label for="taWorkshopId">WorkshopIDs</label>
|
||
<textarea id="taWorkshopId" class="u-full-width" x-model="ids"></textarea>
|
||
<button x-on:click="getModDescription()">load mod descriptions</button>
|
||
<button @click="copyToClipboard()" x-bind:disabled="checkedItems.length == 0">Copy selected</button>
|
||
</div>
|
||
</div>
|
||
<template x-if="items.length > 0">
|
||
<div class="row">
|
||
<div class="column">
|
||
<table class="u-full-width">
|
||
<thead>
|
||
<tr>
|
||
<th>
|
||
<input type="checkbox" x-on:click="checkItems" />
|
||
</th>
|
||
<th>Workshop ID</th>
|
||
<th>Titel</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<template x-for="item in items" :key="item.id">
|
||
<tr>
|
||
<td>
|
||
<input type="checkbox" x-model="checkedItems" x-bind:value="item.id" class="checkbox" />
|
||
</td>
|
||
<td x-text="item.id"></td>
|
||
<td x-text="item.title"></td>
|
||
</tr>
|
||
</template>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
</div>
|
||
</body>
|
||
</html>
|