start working towards better GUI, implementing "download once" protocol

app/models.py

@@ -1,5 +1,5 @@
 import requests
-import re
+import os
 
 from bs4 import BeautifulSoup
 from app import db, login
@@ -89,11 +89,25 @@ class Episode(db.Model):
         "Section", backref="episode", lazy="dynamic"
     )  # sections of quotes under this episode
 
+    @property
+    def links(self):
+        return f"http://officequotes.net/no{self.season_id}-{str(self.number).zfill(2)}.php"
+
+    @property
+    def path(self):
+        return os.path.join('app', 'data', f'{self.season_id}-{self.number}')
+
+    @property
+    def downloaded(self):
+        return os.path.exists(self.path)
+
+    def download(self):
+        """downloads data"""
+        data = requests.get(link).text
+        open(self.path, "w+", encoding="utf-8").write(data)
+
     def build(self):
         """downloads, processes, and automatically creates Sections and Quotes"""
-        link = f"http://officequotes.net/no{self.season_id}-{str(self.number).zfill(2)}.php"
-        data = requests.get(link).text
-        open("test.html", "w+", encoding="utf-8").write(data)
         soup = BeautifulSoup(data, "html.parser")
 
         sections = soup.find_all(attrs={"class": "quote"})

app/templates/content.html

@@ -25,14 +25,18 @@
 {{ super() }}
 <div class="container" style="text-align: center; margin-top: 30rem;">
     <div class="row">
-        <div class="column column-20"></div>
-        <div class="column column-60">
+        <div class="column column-25">
+            <div class="card">
+                Test
+            </div>
+        </div>
+        <div class="column column-40">
             <div class="card">
                 {% block content %}
                 {% endblock content %}
             </div>
         </div>
-        <div class="column column-20"></div>
+{#        <div class="column column-20"></div>#}
     </div>
 </div>
 {% endblock body %}

app/templates/episode.html

@@ -4,6 +4,7 @@
 <style>
     .quote {
         text-align: left;
+        color: black;
     }
 </style>
 {% endblock head %}
@@ -15,7 +16,7 @@
 <br>
 {% for section in episode.sections %}
 <div style="padding: 2rem 1rem 1rem 2rem;">
-    <p>
+    <p class="quote">
         {% for quote in section.quotes %}
         <span class="quote"><b>{{ quote.speaker }}:</b> {{ quote.text }}</span>
         <br>