You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

52 lines
1.7 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="session.js" defer></script>
<script src="labels.js" defer></script>
<script src="picture.js" defer></script>
<script src="panels.js" defer></script>
<script src="text-export.js" defer></script>
<link rel="stylesheet" href="style.css" />
<title>Collecting Labels</title>
</head>
<body>
<main id="container">
<figure class="background-container">
<img id="background-image" draggable="false" src="assets/map_description_H.jpg" />
</figure>
<div id="editor"></div>
<div class="text-input">
<form class="modal">
<textarea id="input" placeholder="Describe this area" type="text"></textarea>
<button id="insert" type="submit">Insert</button>
<button id="cancel">x</button>
</form>
</div>
</main>
<nav>
<button id="show-transcription">Export</button>
<button id="show-info">?</button>
<button id="show-image">IMG</button>
<button id="load-labels">Load</button>
</nav>
<aside class="info" id="info-panel">
<button class="close">X</button>
<h1 class="title">Concrete 🎏 Label</h1>
<p>
What do we need to know: - text labels-contents - order - position - size - who
wrote it ? (random id? name? nothing at all?) - timestamp ? -
</p>
</aside>
<aside class="transcription" id="transcription-panel">
<button class="close">X</button>
<h1 class="title">Label Transcription</h1>
<ol class="labels-contents"></ol>
<button id="export-text">Export</button>
</aside>
</body>
</html>