random-mirrors/based.cooking
1
0
Fork 0
mirror of https://github.com/LukeSmithxyz/based.cooking.git synced 2025-12-21 18:09:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added random recipe button (#325)

Browse Source
This commit is contained in:
M4x1m3
2023-02-20 22:54:35 +01:00
parent 2d8642ec41
commit f627fee917
2 changed files with 38 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
content/_index.md
View File

@@ -6,10 +6,15 @@ layout: single
## What do you want to cook?
<div class="search js-only">
<input type="text" id="search" placeholder="Search ALL Recipes...">
<button id="clear-search">
<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><title>Backspace</title><path d="M135.19 390.14a28.79 28.79 0 0021.68 9.86h246.26A29 29 0 00432 371.13V140.87A29 29 0 00403.13 112H156.87a28.84 28.84 0 00-21.67 9.84v0L46.33 256l88.86 134.11z" fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="32"></path><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M336.67 192.33L206.66 322.34M336.67 322.34L206.66 192.33M336.67 192.33L206.66 322.34M336.67 322.34L206.66 192.33"></path></svg>
<div class="search-container js-only">
<div class="search">
<input type="text" id="search" placeholder="Search ALL Recipes...">
<button id="clear-search">
<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><title>Backspace</title><path d="M135.19 390.14a28.79 28.79 0 0021.68 9.86h246.26A29 29 0 00432 371.13V140.87A29 29 0 00403.13 112H156.87a28.84 28.84 0 00-21.67 9.84v0L46.33 256l88.86 134.11z" fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="32"></path><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M336.67 192.33L206.66 322.34M336.67 322.34L206.66 192.33M336.67 192.33L206.66 322.34M336.67 322.34L206.66 192.33"></path></svg>
</button>
</div>
<button id="random">
Random
</button>
</div>
@@ -26,6 +31,13 @@ document.addEventListener("DOMContentLoaded", () => {
const oldheading = document.getElementById("newest-recipes");
const clearSearch = document.getElementById("clear-search");
const artlist = document.getElementById("artlist");
const random = document.getElementById("random");
random.addEventListener("click", () => {
const recipe = recipes[Math.floor(Math.random() * recipes.length)];
const url = recipe.getElementsByTagName("a")[0].href
window.location.href = url;
})
search.addEventListener("input", () => {
// grab search input value