mirror of
https://git.kittycat.homes/zoe/hugo-battheme.git
synced 2024-08-15 03:25:18 +00:00
random word shortcode
This commit is contained in:
parent
26372fdcca
commit
d267fc4356
10 changed files with 91 additions and 3 deletions
21
\
Normal file
21
\
Normal file
|
@ -0,0 +1,21 @@
|
|||
const buttons = document.getElementsByClassName("randomword-button");
|
||||
|
||||
export function randomizeWords() {
|
||||
registerButtons();
|
||||
}
|
||||
|
||||
function registerButtons() {
|
||||
for (let button of buttons) {
|
||||
button.addEventListener("click", function () {
|
||||
button.innerHTML = processWordlist(button.getAttribute("data-wordlist"));
|
||||
});
|
||||
button.click();
|
||||
}
|
||||
}
|
||||
|
||||
// takes all the words and returns only one
|
||||
function processWordlist(wordlist) {
|
||||
return wordlist;
|
||||
}
|
||||
|
||||
function stripSpaces() {}
|
|
@ -35,6 +35,25 @@ a {
|
|||
color: $dark-ln;
|
||||
}
|
||||
|
||||
.randomword-button{
|
||||
&.light {
|
||||
border-color: $light-fg;
|
||||
background-color: $light-bg;
|
||||
color: $light-fg;
|
||||
&:hover {
|
||||
color: $light-bg;
|
||||
background-color: $light-fg;
|
||||
}
|
||||
}
|
||||
border-color: $dark-fg;
|
||||
background-color: $dark-bg;
|
||||
color: $dark-fg;
|
||||
&:hover{
|
||||
color: $dark-bg;
|
||||
background-color: $dark-fg;
|
||||
}
|
||||
}
|
||||
|
||||
a.footer-nav-item.active,
|
||||
a.footer-nav-item:hover {
|
||||
&.light {
|
||||
|
|
|
@ -21,13 +21,19 @@ footer {
|
|||
margin-bottom: 84pt;
|
||||
}
|
||||
|
||||
.randomword-button {
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
#content p,
|
||||
#content ul,
|
||||
#content ol,
|
||||
#content table,
|
||||
code,
|
||||
.postdescription,
|
||||
hr
|
||||
hr,
|
||||
#content div .video-player
|
||||
{
|
||||
margin-right: 24%;
|
||||
margin-left: 24%;
|
||||
|
|
|
@ -108,3 +108,12 @@ ul a{
|
|||
padding: 0.12em;
|
||||
}
|
||||
}
|
||||
|
||||
.randomword-button {
|
||||
border-style: solid;
|
||||
padding: 0.12em;
|
||||
border-radius: 0;
|
||||
&::before {
|
||||
content: " ";
|
||||
}
|
||||
}
|
||||
|
|
|
@ -5,6 +5,5 @@
|
|||
{{- partial "header.html" . -}}
|
||||
<div id="content">{{- block "main" . }}{{- end }}</div>
|
||||
{{- partial "footer.html" . -}}
|
||||
<script type="module" src="/js/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -2,6 +2,7 @@
|
|||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>{{ .Title }}@{{ .Site.Title }}</title>
|
||||
<script type="module" src="/js/main.js"></script>
|
||||
{{ $css := resources.Get "scss/main.scss" }}
|
||||
{{ $css = $css | toCSS }}
|
||||
<link rel="stylesheet" href="{{ $css.RelPermalink }}">
|
||||
|
|
1
layouts/shortcodes/randomword.html
Normal file
1
layouts/shortcodes/randomword.html
Normal file
|
@ -0,0 +1 @@
|
|||
<button class="randomword-button colorswitch" data-wordlist="{{.Get 0}}"></button>
|
|
@ -12,7 +12,6 @@ function switchToLight() {
|
|||
function switchToDark() {
|
||||
button.innerHTML = "";
|
||||
for (let item of colorswitchers) {
|
||||
console.log(item);
|
||||
item.classList.remove("light");
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,7 +1,9 @@
|
|||
import { updateMode } from "./lightmode.js";
|
||||
import { activateHamburger } from "./hamburger.js";
|
||||
import { randomizeWords } from "./randomword.js";
|
||||
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
updateMode();
|
||||
activateHamburger();
|
||||
randomizeWords();
|
||||
});
|
||||
|
|
31
static/js/randomword.js
Normal file
31
static/js/randomword.js
Normal file
|
@ -0,0 +1,31 @@
|
|||
const buttons = document.getElementsByClassName("randomword-button");
|
||||
|
||||
export function randomizeWords() {
|
||||
registerButtons();
|
||||
}
|
||||
|
||||
function registerButtons() {
|
||||
for (let button of buttons) {
|
||||
button.addEventListener("click", function () {
|
||||
let new_word = processWordlist(button.getAttribute("data-wordlist"));
|
||||
// do this so people dont have to click twice
|
||||
if (button.innerHTML == new_word) {
|
||||
button.click();
|
||||
console.log("oh no!!! this was already the value!");
|
||||
} else {
|
||||
button.innerHTML = new_word;
|
||||
}
|
||||
});
|
||||
button.click();
|
||||
}
|
||||
}
|
||||
|
||||
// takes all the words and returns only one
|
||||
function processWordlist(wordlist) {
|
||||
let seperated = wordlist.split(",");
|
||||
return seperated.random();
|
||||
}
|
||||
|
||||
Array.prototype.random = function () {
|
||||
return this[Math.floor(Math.random() * this.length)];
|
||||
};
|
Loading…
Reference in a new issue