From 2e0b9c97af457da5c6afda611d48e59047d4cdb8 Mon Sep 17 00:00:00 2001
From: JJ <nicetry@noemail.com>
Date: Mon, 31 Mar 2025 21:08:41 +0100
Subject: Basic AI functionality

---
 templates/pages/about.html         |  9 +++++++++
 templates/pages/account.html       | 21 +++++++++++++++++++--
 templates/pages/home.html          |  2 +-
 templates/pages/single-recipe.html | 14 +++++++++++---
 4 files changed, 40 insertions(+), 6 deletions(-)

(limited to 'templates/pages')

diff --git a/templates/pages/about.html b/templates/pages/about.html
index d719941..7aefc54 100644
--- a/templates/pages/about.html
+++ b/templates/pages/about.html
@@ -17,4 +17,13 @@ heading %}
   Yoast SEO Schema. If you have other websites that you would like us to index,
   then reach out <a href="/contact">here.</a>
 </p>
+
+<h2>Instructions</h2>
+
+<p>Using the website is very simple. Once you login go to <a href="/home>recipes</a>, this is your homepage. In the input box add URLs for your favourite recipes.</p>
+
+<p>URLs must be valid. E.g:</p> 
+
+<p><strong class="error">bad: </strong>www.example.com/awesome-recipe</p> 
+<p><strong class="success">good: </strong>https://www.example.com/awesome-recipes</p>
 {% endblock %}
diff --git a/templates/pages/account.html b/templates/pages/account.html
index 10a3789..063d924 100644
--- a/templates/pages/account.html
+++ b/templates/pages/account.html
@@ -1,6 +1,4 @@
 {% extends "base.html" %} {% block scripts %}
-
-<!-- Conditionally load index.js, as it's only needed on this page -->
 <script
   src="{{ url_for('static', filename='scripts/index.js') }}"
   defer
@@ -28,4 +26,23 @@
   <button hx-delete="/delete-account">yes</button>
   <button id="close-modal">cancel</button>
 </dialog>
+
+<h2>AI mode</h2>
+{% if session.isAiSubscriber %}
+  <p>Thanks for actvating AI mode. You can check your quota of AI requests remaining below</p>
+{% else %}
+  <p>The HTML markup for recipe websites differs greatly. Therefore, it's hard to extract all the HTML from all websites. You may find there are certain websites that we cannot extract recipe data from. To get around this, you have the option to use <strong>AI mode</strong>.</p>
+  <p>AI mode works by running the page's HTML through an LLM to extract the relevant recipe information.</p>
+  <p>As this process is not cheap, you can buy credits that will allow you to perform these extraction operations. $5 will get you 1,000 AI operations. Probably more than you will ever need</p>
+  <p>We will always try and extract website data using normal metadata before using AI, so it's unlikely you will get close to 1,000 operations.</p>
+  <button id="show-modal">Enable AI mode</button>
+  <dialog>
+    <p>
+      Are you sure you want to delete your account? This will erase all your data
+      including your recipes.
+    </p>
+    <button hx-delete="/delete-account">yes</button>
+    <button id="close-modal">cancel</button>
+  </dialog>
+  {% endif %}
 {% endblock %}
diff --git a/templates/pages/home.html b/templates/pages/home.html
index c44a017..6cb5935 100644
--- a/templates/pages/home.html
+++ b/templates/pages/home.html
@@ -11,7 +11,7 @@
   hx-target-5*="#form-error"
 >
 <div style="display: flex; align-items: center; margin-bottom: 15px;"}>
-  <input type="text" name="url" class="border-2 border-black" style="margin-bottom: 0px; margin-right: 10px;"/>
+  <input type="url" name="url" class="border-2 border-black" style="margin-bottom: 0px; margin-right: 10px;"/>
   <img src={{url_for("static", filename="images/bars.svg")}} class="htmx-indicator" id="spinner" alt="loading indicator "/>
 </div>
   <button type="submit" class="cursor-pointer">Submit</button>
diff --git a/templates/pages/single-recipe.html b/templates/pages/single-recipe.html
index d8c334d..ec2b4dd 100644
--- a/templates/pages/single-recipe.html
+++ b/templates/pages/single-recipe.html
@@ -1,12 +1,20 @@
-{% extends "base.html" %} {% block heading %} {{ single_recipe.title }} {%
+{% extends "base.html" %}
+
+{% block scripts %}
+
+<script src={{ url_for("static", filename="scripts/index.js") }} defer></script>
+
+{% endblock %}
+
+{% block heading %} {{ single_recipe.title }} {%
 endblock %} {% block content %}
 <article>
   <figure>
     <img src="{{ single_recipe.image }}" alt="{{ single_recipe.title }}" />
     <figcaption><a href="{{ single_recipe.url }}">Source</a></figcaption>
   </figure>
-  <h2>Ingredients</h2>
-  <ul>
+  <h2 class="inline-block">Ingredients<span id="copy-ingredients" class="cursor">📋</span></h2>
+  <ul id="ingredients">
     {% for ingredient in single_recipe.ingredients %}
     <li>{{ ingredient }}</li>
     {% endfor %}
-- 
cgit v1.2.3