source code commentary

pad-bis.py

@@ -7,7 +7,6 @@ import mwclient
 # BS to read the html table from the wiki
 from bs4 import BeautifulSoup
 
-
 # os and dotenv to store the mediawiki credentials in a safe place
 import os
 from dotenv import load_dotenv
@@ -42,69 +41,86 @@ class PrefixMiddleware(object):
 # create flask application
 app = Flask(__name__)
 
-
-# Url prefix for the soupboat and port
+# Get the URL prefix for the soupboat
+# and register the middleware to use our base_url as prefix on all the requests
 base_url = os.environ.get('BASE_URL', '')
-
-port = os.environ.get('FLASK_RUN_PORT', '')
+app.wsgi_app = PrefixMiddleware(app.wsgi_app, prefix=base_url)
 
 # Page of the wiki with the pads
 padliography = os.environ.get('PAGE', '')
 
 
-# register the middleware to prefix all the requests with our base_url
-app.wsgi_app = PrefixMiddleware(app.wsgi_app, prefix=base_url)
-
-
 def add_pad(link, title, overview, categories, date):
-
+    '''Add a new pad to the wiki page'''
+    
+    # 1. Connect to the wiki
     site = mwclient.Site('pzwiki.wdka.nl', path='/mw-mediadesign/')
 
+    # 2. Authenticate using the credential of a bot user registered in the wiki 
+    ###  This is necesary the edit the contents of the page
     site.login(
         username=os.environ.get('MW_BOT'),
         password=os.environ.get('MW_KEY')
     )
 
+    # 3. Select the page and get the contents
     page = site.pages[padliography]
     text = page.text()
 
+    # 4. Append the pad as new row in the table of pads
     new_row = f'|-\n| {link} || {title} || {overview} || {categories} || {date} \n|-\n' + '|}'
-
     text = text.replace('|}', new_row)
 
+    # 5. Apply the edit
     page.edit(text, f'New pad in the {padliography}: {title}')
 
 
 def get_pads():
+    '''Retrieve pads from the wiki'''
 
+    # 1. Connect to the wiki
     site = mwclient.Site('pzwiki.wdka.nl', path='/mw-mediadesign/')
+
+    # 2. Log in using the credential of a bot user registered in the wiki
     site.login(
         username=os.environ.get('MW_BOT'),
         password=os.environ.get('MW_KEY'),
 
     )
 
+    # 3. Use the MediaWiki API to get the wikitext contents in HTML
     html = site.api('parse', prop='text', page=padliography)
+
+    # 4. Parse the HTML with BeautifulSoup to extract data from the table of pads
     table = BeautifulSoup(html['parse']['text']['*'], features="html.parser").find(
         "table", attrs={"class": "padliography"})
 
+    # 5. Find the headers of the table
     headers = [header.text.lower().strip() for header in table.find_all('th')]
+    
+    # 6. Create a list of pad, using each header as property of the object pad
     pads = [
         {headers[i]: cell.text.rstrip('\n')
          for i, cell in enumerate(row.find_all('td'))}
         for row in table.find_all('tr')]
+
+    #7. Remove empty pads from the list
     pads = [pad for pad in pads if pad != {}]
-    return pads
 
+    return pads
 
 
 @app.route('/')
 def home():
+    '''Serve the homepage layout'''
     return render_template('home.html')
 
+
 @app.route('/api', methods=['GET', 'POST'])
 def api():
+    '''Manage the interaction with the MediaWiki API'''
 
+    # Add a new pad
     if request.method == 'POST':
         link = request.json.get('link', None)
         title = request.json.get('title', None)
@@ -112,11 +128,10 @@ def api():
         categories = request.json.get('categories', '')
         date = request.json.get('date', None)
 
-        # date = datetime.strftime(datetime.strptime(
-        #     date, '%Y-%m-%d'), '%d-%m-%Y')
         add_pad(link, title, overview, categories, date)
         redirect(url_for('home'))
 
+    # Return the pad list
     response = jsonify({
         'page': padliography,
         'pads': get_pads()
@@ -125,5 +140,5 @@ def api():
 
     return response
 
-
+port = os.environ.get('FLASK_RUN_PORT', '')
 app.run(port=port)

static/js/PadForm.js

@@ -36,7 +36,7 @@ export default {
 			};
 			PadStore.value.unshift(pad);
 
-			pad.categories.join(", ");
+			pad.categories = pad.categories.join(", ");
 
 			fetch("api", {
 				method: "POST",
@@ -79,7 +79,6 @@ export default {
 			<input class='date'  type="date" v-model="date" placeholder="Date" />
              
 			<button @click="submit" class="submit">Insert</button>
-
         </div>