Bubble_Prompter / index.html
pols's picture
Update index.html
22705dc verified
<!DOCTYPE html>
<html>
<head>
<title>Bubble Prompter</title>
<meta name="license" content="CC BY-NC 4.0" />
<meta name="author" content="pols" />
<meta name="attribution" content="pols" />
<link rel="attribution" href="https://huggingface.co/pols" />
<link rel="license" href="http://creativecommons.org/licenses/by-nc/4.0/" />
<link rel="stylesheet" type="text/css" href="styles.css">
<link href='https://fonts.googleapis.com/css?family=Signika' rel='stylesheet'>
<meta charset="UTF-8">
</head>
<body>
<div>
<div class="Searchers">
<div class="Group-tags">
<button id="category-dropdown-button" title="Tags classified by categories" class="buttons">๐Ÿ—ƒ๏ธ</button>
<div id="category-dropdown" class="category-dropdown hidden">
<!-- The categories and words will be loaded here dynamically -->
</div>
<button id="random-word-button" title="Add random tag" class="buttons">๐ŸŽฒ</button>
</div>
<div class="autocomplete-container">
<input type="text" id="autocomplete-input" placeholder="๐Ÿ”Ž...">
<div id="autocomplete-list" class="autocomplete-items"></div>
</div>
</div>
<div class="container">
<textarea id="input-text" placeholder="Write, paste or drop your .txt here" class="text-container"></textarea>
</div>
<table>
<tbody>
<tr>
<td><button id="replace-spaces-button" title="Divide text into bubbles
Replace ' ' with ', '
and ',' with ', '" class="buttons">๐Ÿ’”</button></td>
<td><button id="revert-spaces-button" title="Combine all
Replace ', ' with ' '" class="buttons">๐Ÿฉน</button></td>
</tr>
<tr>
<td><button id="revert-underscore-button" title="Recall underscores
Replace ' ' with '_'" class="buttons">๐Ÿ”ฎ</button></td>
<td><button id="replace-underscore-button" title="Exile underscores from tags
Replace '_' with ' '" class="buttons">๐Ÿ‘ป</button></td>
</tr>
<tr>
<td><button id="literal-parenthesis-button" title="Make parenthesis literal" class="buttons">๐Ÿชถ</button></td>
<td><button id="fictional-parenthesis-button" title="Make parenthesis fictional" class="buttons">โœ’๏ธ</button></td>
</tr>
<tr>
<td><button id="replace-commas-button" title="Clean up orphan commas" class="buttons">๐Ÿงผ</button></td>
<td><button id="replace-linebreaks-button" title="Repair linebreaks" class="buttons">๐Ÿ”ง</button></td>
</tr>
<tr>
<td><button id="load-text-file-button" title="Import text from .txt" class="buttons">๐Ÿ“Ž</button></td>
<td><button id="remove-duplicates-button" title="Merge duplicate bubbles" class="buttons">๐Ÿงฒ</button></td>
</tr>
<tr>
<td><button id="download-text-file-button" title="Save text to .txt" class="buttons">๐Ÿ’พ</button></td>
<td><button id="copy-button" title="Copy text to clipboard" class="buttons">๐Ÿ“‹</button></td>
</tr>
</tbody>
</table>
<div class="center">
<button id="undo-button" title="Undo" class="buttons">โ†ฉ</button>
<button id="mitigate-mode-button" title="Mitigate Mode
Click on the bubbles to decrease the emphasis" class="buttons">๐ŸงŠ</button>
<button id="delete-mode-button" title="Delete Mode
Click on the bubbles to remove them" class="buttons">โ™ป๏ธ</button>
<button id="emphasis-mode-button" title="Emphasis Mode
Click on the bubbles to increase the emphasis" class="buttons">๐Ÿ”ฅ</button>
<button id="redo-button" title="Redo" class="buttons">โ†ช</button>
</div>
<div class="center" id="bubble-container">
</div>
<script src="Sortable.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Sortable/1.13.0/Sortable.min.js"></script>
<script src="script.js"></script>
</body>
</html>