tutorial 2, adding new lists/tables via form/client

app.py

@@ -22,7 +22,8 @@ app.config['SECRET KEY'] = 'this should be a secret random string'
 @app.route('/')
 def index():
     conn = get_db_connection()
-    todos = conn.execute('SELECT i.content, l.title FROM items i JOIN lists l \
+    todos = conn.execute('SELECT i.id, i.done, i.content, l.title \
+                          FROM items i JOIN lists l \
                           ON i.list_id = l.id ORDER BY l.title;').fetchall()
 
     lists = {}
@@ -43,6 +44,17 @@ def create():
         content = request.form['content']
         list_title = request.form['list']
 
+# --- create the new lists here as well ---
+        new_list = request.form['new_list']
+
+        # if a new title (list) is submitted add it to the database
+        if list_title == 'New List' and new_list:
+            conn.execute('INSERT INTO lists (title) VALUES (?)',
+                            (new_list,))
+            conn.commit()
+            #update list_title to refer to the newly added list
+            list_title = new_list
+            
         if not content:
             flash('Content is required!')
             return redirect(url_for('index'))
@@ -61,3 +73,59 @@ def create():
     return render_template('create.html', lists=lists)
 
 
+@app.route('/<int:id>/do/', methods=('POST',))
+def do(id):
+     conn = get_db_connection()
+     conn.execute('UPDATE items SET done = 1 WHERE id = ?', (id,))
+     conn.commit()
+     conn.close()
+     return redirect(url_for('index'))
+
+
+@app.route('/<int:id>/undo/', methods=('POST',))
+def undo(id):
+     conn = get_db_connection()
+     conn.execute('UPDATE items SET done = 0 WHERE id = ?', (id,))
+     conn.commit()
+     conn.close()
+     return redirect(url_for('index'))
+
+
+@app.route('/<int:id>/edit/', methods=('GET','POST'))
+def edit(id):
+    conn = get_db_connection()
+
+    todo = conn.execute('SELECT i.id, i.list_id, i.done, i.content, l.title \
+                         FROM items i JOIN lists l \
+                         ON i.list_id = l.id WHERE i.id = ?', (id,)).fetchone()
+
+    lists = conn.execute('SELECT title FROM lists;').fetchall()
+
+    if request.method == 'POST':
+        content = request.form['content']
+        list_title = request.form['list']
+    
+        if not content:
+            flash('Content is required!')
+            return redirect(url_for('edit', id=id))
+
+        list_id = conn.execute('SELECT id FROM lists WHERE title = (?);',
+                                (list_title,)).fetchone()['id']
+
+        conn.execute('UPDATE items SET content = ?, list_id = ? \
+                    WHERE id = ?',
+                    (content, list_id, id))
+        conn.commit()
+        conn.close()
+        return redirect(url_for('index'))
+
+    return render_template('edit.html', todo=todo, lists=lists)
+
+
+@app.route('/<int:id>/delete/', methods=('POST',))
+def delete(id):
+    conn = get_db_connection()
+    conn.execute('DELETE FROM items WHERE id = ?', (id,))
+    conn.commit()
+    conn.close()
+    return redirect(url_for('index'))

list_example.py

@@ -2,7 +2,8 @@ from itertools import groupby
 from app import get_db_connection
 
 conn = get_db_connection()
-todos = conn.execute('SELECT i.content, l.title FROM items i JOIN lists l \
+todos = conn.execute('SELECT i.id, i.done, i.content, l.title \
+                        FROM items i JOIN lists l \
                         ON i.list_id = l.id ORDER BY l.title;').fetchall()
 
 lists = {}
@@ -13,4 +14,5 @@ for k, g in groupby(todos, key=lambda t: t['title']):
 for list_, items in lists.items():
     print(list_)
     for item in items:
-        print('    ', item['content'])
+        print('    ', item['content'], '| id:',
+                item['id'], 'done:', item['done'])

schema.sql

@@ -12,5 +12,6 @@ CREATE TABLE items (
     list_id INTEGER NOT NULL,
     created TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
     content TEXT NOT NULL,
+    done INTEGER NOT NULL DEFAULT 0,
     FOREIGN KEY (list_id) REFERENCES lists (id)
 );

templates/create.html

@@ -14,6 +14,7 @@
     <div class="form-group">
         <label for="list">List</label>
         <select class="form-control" name="list">
+            <option value="New List" selected>New List</option>
             {% for list in lists %}
                 {% if list['title'] == request.form['list'] %}
                     <option value="{{ request.form['list'] }}" selected>
@@ -27,6 +28,14 @@
             {% endfor %}
         </select>
     </div>
+
+    <div class="form-group">
+        <label for="new_list">New List</label>
+        <input type="text" name="new_list"
+            placeholder="New list name" class="form-control"
+            value="{{ request.form['new_list'] }}"></input>
+    </div>
+
     <div class="form-group">
         <button type="submit" class="btn btn-primary">Submit</button>
     </div>

templates/edit.html

@@ -0,0 +1,41 @@
+{% extends 'base.html' %}
+
+{% block content %}
+
+<h1>{% block title %} Edit an Item {% endblock %}</h1>
+
+<form method="post">
+    <div class="form-group">
+        <label for="content">Content</label>
+        <input type="text" name="content"
+               placeholder="Todo content" class="form-control"
+               value="{{ todo['content'] or request.form['content'] }}"></input>
+    </div>
+
+    <div class="form-group">
+        <label for="list">List</label>
+        <select class="form-control" name="list">
+            {% for list in lists %}
+                {% if list['title'] == request.form['list'] %}
+                    <option value="{{ request.form['list'] }}" selected>
+                        {{ request.form['list'] }}
+                    </option>
+
+                {% elif list['title'] == todo['title'] %}
+                    <option value="{{ todo['title'] }}" selected>
+                        {{ todo['title'] }}
+                    </option>
+
+                {% else %}
+                    <option value="{{ list['title'] }}">
+                        {{ list['title'] }}
+                    </option>
+                {% endif %}
+            {% endfor %}
+        </select>
+    </div>
+    <div class="form-group">
+        <button type="submit" class="btn btn-primary">Submit</button>
+    </div>
+</form>
+{% endblock %}

templates/index.html

@@ -9,7 +9,43 @@
             </div>
             <ul class="list-group list-group-flush">
                 {% for item in items %}
-                    <li class="list-group-item">{{ item['content'] }}</li>
+                    <!-- <li class="list-group-item">{{ item['content'] }}</li> -->
+                    <li class="list-group-item"
+                    {% if item['done'] %}
+                    style="text-decoration: line-through;"
+                    {% endif %}
+                    >{{ item['content'] }}
+                    {% if not item ['done'] %}
+                        {% set URL = 'do' %}
+                        {% set BUTTON = 'Do' %}
+                    {% else %}
+                        {% set URL = 'undo' %}
+                        {% set BUTTON = 'Undo' %}
+                    {% endif %}
+
+
+
+                  <div class="row">
+                        <div class="col-12 col-md-3">
+                            <form action="{{ url_for(URL, id=item['id']) }}"
+                                method="POST">
+                                <input type="submit" value="{{ BUTTON }}"
+                                    class="btn btn-success btn-sm">
+                            </form>
+                        </div>
+                        <div class="col-12 col-md-3">
+                            <a class="btn btn-warning btn-sm"
+                            href="{{ url_for('edit', id=item['id']) }}">Edit</a>
+                        </div>
+                        <div class="col-12 col-md-3">
+                            <form action="{{ url_for('delete', id=item['id']) }}"
+                                method="POST">
+                                <input type="submit" value="Delete"
+                                    class="btn btn-danger btn-sm">
+                            </form>
+                        </div>
+                    </div>
+                    </li>
                 {% endfor %}
             </ul>
         </div>