jsw/flask_eindproject
1
0
Fork 0
Code Issues 2 Pull requests Projects 1 Releases Packages Wiki Activity Actions

Created base template. Updated forms. Added navbar. Added better scraping support for edit page.

Browse source
This commit is contained in:
Jurn Wubben 2025-06-24 09:45:17 +02:00
parent 13d63245ed
commit 89118c6d1d
11 changed files with 208 additions and 144 deletions
Download patch file Download diff file Expand all files Collapse all files

236
app/templates/edit.html
View file

@ -1,121 +1,125 @@
{% set cpath = url_for("edit", id=wishlist.editId) %}
<main>
<h1>Edit '{{wishlist.title}}'</h1>
<sub>Manage your wishlist details and items</sub>
<br>
<form action="{{ cpath }}" method="POST">
{{ form_wl_editinfo.hidden_tag() }}
{{ form_wl_editinfo.title.label }}
{{ form_wl_editinfo.title(placeholder=wishlist.title) }}
<!-- <br> -->
{{ form_wl_editinfo.description.label }}
{{ form_wl_editinfo.description(placeholder=wishlist.description) }}
<!-- <br> -->
{{ form_wl_editinfo.wl_edit_submit() }}
</form>
<br>
<h1>Urls</h1>
<ul>
<li>
View: <a href={{ url_for("view", id=wishlist.viewId) }}>{{ wishlist.viewId }}</a>
</li>
<li>
Edit: <a href={{ url_for("edit", id=wishlist.editId) }}>{{ wishlist.editId }}</a>
</li>
</ul>
<form action="{{ cpath }}" method="POST">
{{ form_wl_reseturls.hidden_tag() }}
{{ form_wl_reseturls.wl_reset_submit() }}
</form>
<br>
<h1>New item</h1>
<form action="{{ cpath }}" method="POST">
{{ form_it_new.hidden_tag() }}
<!-- <br> -->
{{ form_it_new.it_new_title.label }}
{{ form_it_new.it_new_title() }}
<!-- <br> -->
{{ form_it_new.description.label }}
{{ form_it_new.description() }}
<!-- <br> -->
{{ form_it_new.price.label }}
{{ form_it_new.price() }}
<!-- <br> -->
{{ form_it_new.url.label }}
{{ form_it_new.url() }}
<!-- <br> -->
{{ form_it_new.image.label }}
{{ form_it_new.image() }}
<!-- <br> -->
{{ form_it_new.it_new_submit() }}
<button id="scrape">Scrape</button>
</form>
<br>
<h1>Delete items</h1>
{% if wishlist.items|length == 0 %}<p>No items yet</p>{% endif %}
<ul>
{% for value in wishlist.items %}
<li>
<form action="{{ cpath }}" method="POST">
{{ form_it_delete.csrf_token }}
{{ form_it_delete.index(value=loop.index) }}
{{ form_it_delete.it_del_submit() }}
</form>
{{ value.title }}
</li>
{% endfor %}
</ul>
<br>
<h1>Delete wishlist</h1>
<form action="{{ cpath }}" method="POST">
{{ form_wl_delete.hidden_tag() }}
{{ form_wl_delete.wl_del_submit() }}
</form>
<style>
form {
display:grid;
grid-template-columns: max-content max-content;
grid-gap:5px;
}
form label { text-align:right; }
form label:after { content: ":"; }
</style>
</main>
{% extends "base.html" %}
<script>
const $q = (...i) => document.querySelector(...i);
const title = $q("#it_new_title")
const price = $q("#price")
const url = $q("#url")
const image = $q("#image")
// const description = $q("#description")
$q("#scrape").addEventListener("click", async e => {
e.preventDefault()
const tUrl = url.value.trim();
if (!tUrl) {
alert("Please provide a valid url.") //TODO: Replace with daisyui modal
return
}
const res = await fetch(
"/scrape?" + new URLSearchParams({
url: tUrl
}).toString(),
{
method: "get",
{% block content %}
<main class="bg-base-100">
<h1>Edit '{{wishlist.title}}'</h1>
<sub>Manage your wishlist details and items</sub>
<br>
<form action="{{ cpath }}" method="POST">
{{ form_wl_editinfo.hidden_tag() }}
{{ form_wl_editinfo.title.label }}
{{ form_wl_editinfo.title(placeholder=wishlist.title) }}
<!-- <br> -->
{{ form_wl_editinfo.description.label }}
{{ form_wl_editinfo.description(placeholder=wishlist.description) }}
<!-- <br> -->
{{ form_wl_editinfo.wl_edit_submit() }}
</form>
<br>
<h1>Urls</h1>
<ul>
<li>
View: <a href={{ url_for("view", id=wishlist.viewId) }}>{{ wishlist.viewId }}</a>
</li>
<li>
Edit: <a href={{ url_for("edit", id=wishlist.editId) }}>{{ wishlist.editId }}</a>
</li>
</ul>
<form action="{{ cpath }}" method="POST">
{{ form_wl_reseturls.hidden_tag() }}
{{ form_wl_reseturls.wl_reset_submit() }}
</form>
<br>
<h1>New item</h1>
<form action="{{ cpath }}" method="POST">
{{ form_it_new.hidden_tag() }}
<!-- <br> -->
{{ form_it_new.it_new_title.label }}
{{ form_it_new.it_new_title() }}
<!-- <br> -->
{{ form_it_new.description.label }}
{{ form_it_new.description() }}
<!-- <br> -->
{{ form_it_new.price.label }}
{{ form_it_new.price() }}
<!-- <br> -->
{{ form_it_new.url.label }}
{{ form_it_new.url() }}
<!-- <br> -->
{{ form_it_new.image.label }}
{{ form_it_new.image() }}
<!-- <br> -->
{{ form_it_new.it_new_submit() }}
<button id="scrape">Scrape</button>
</form>
<br>
<h1>Delete items</h1>
{% if wishlist.items|length == 0 %}<p>No items yet</p>{% endif %}
<ul>
{% for value in wishlist.items %}
<li>
<form action="{{ cpath }}" method="POST">
{{ form_it_delete.csrf_token }}
{{ form_it_delete.index(value=loop.index) }}
{{ form_it_delete.it_del_submit() }}
</form>
{{ value.title }}
</li>
{% endfor %}
</ul>
<br>
<h1>Delete wishlist</h1>
<form action="{{ cpath }}" method="POST">
{{ form_wl_delete.hidden_tag() }}
{{ form_wl_delete.wl_del_submit() }}
</form>
<style>
form {
display:grid;
grid-template-columns: max-content max-content;
grid-gap:5px;
}
)
form label { text-align:right; }
form label:after { content: ":"; }
</style>
</main>
if (res.status !== 200) {
alert("Failed to scrape site.")
return
}
<script>
const $q = (...i) => document.querySelector(...i);
const title = $q("#it_new_title")
const price = $q("#price")
const url = $q("#url")
const image = $q("#image")
// const description = $q("#description")
const json = await res.json()
title.value = json.name;
image.value = json.image;
price.value = json.price;
})
</script>
$q("#scrape").addEventListener("click", async e => {
e.preventDefault()
const tUrl = url.value.trim();
if (!tUrl) {
alert("Please provide a valid url.") //TODO: Replace with daisyui modal
return
}
const res = await fetch(
"/scrape?" + new URLSearchParams({
url: tUrl
}).toString(),
{
method: "get",
}
)
if (res.status !== 200) {
alert("Failed to scrape site.")
return
}
const json = await res.json()
title.value = json.name;
image.value = json.image;
price.value = json.price;
})
</script>
{% endblock content %}