-
Notifications
You must be signed in to change notification settings - Fork 0
/
shakesperian.html
65 lines (54 loc) · 2.59 KB
/
shakesperian.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<!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">
<title>Shakesperian Insult Generator</title>
<link href="project-shakespeare.css" rel="stylesheet">
<div class = "menu">
<h2>
WELCOME TO:
</h2>
<h1 class = 'title'>
The Shakesperian Insult Generator
</h1>
<H5> <a href="project.html">
regular mode =></a>
</h5>
<hr class = "top-line">
</section>
<section class="insults"> <!-- The insult Gen Section/ Where the insults are written-->
<form id="numInputForm"> <!-- Form to input the number of insults wanted -->
<h3 class = 'numInput'>Input the number of Insults to generate: <input required type="number" class = number min='1' max='20' id="numberIn" placeholder="Enter a number" value="10">
<input type="button" value="Submit" id="enterButton">
</form>
<script type="module" src="https://raw.githubusercontent.com/CrispyMerchant/insult-generator/master/content/insults.js"></script>
<script src="js/script-shakespeare.js" type="text/javascript"></script>
<h2 class="listPrefix">Thou art a:<br><span id='insult-display'></span>COWARD!</h2> <!-- prints insult with template -->
</p>
<p id="showInputHere"></p> <!-- Enter Key presses Button -->
<script>
var input = document.getElementById("numberIn");
// Execute a function when the user presses a key on the keyboard
input.addEventListener("keypress", function(event) {
// If the user presses the "Enter" key on the keyboard
if (event.key === "Enter") {
// Cancel the default action, if needed
event.preventDefault();
// Trigger the button element with a click
document.getElementById("enterButton").click();
}
});
</script>
<p></p>
<!--<h2>Insults: <span id='insult'></span></h2>-->
</section>
</div>
<!-- <script type = 'module'src="js/script-shakespeare.js">
import insultOne from 'https://raw.githubusercontent.com/CrispyMerchant/insult-generator/master/content/insults.js'
console.log( insultOne )
document.getElementById('insult-display').innerText = insultOne;
</script> Fetches the insult -->
</head>
</html>