ability to remove videos from playlist

5 files changed, 50 insertions, 43 deletions

diff --git a/youtube/common.py b/youtube/common.py
index e4ab39a..46dfc8d 100644
--- a/youtube/common.py
+++ b/youtube/common.py
@@ -82,7 +82,7 @@ medium_video_item_template = Template('''
                         <span class="description">$description</span>
                         <span class="badges">$badges</span>
                     </div>
-                    <input class="item-checkbox" type="checkbox" name="video_info_list" value="$video_info" form="playlist-add">
+                    <input class="item-checkbox" type="checkbox" name="video_info_list" value="$video_info" form="playlist-edit">
                 </div>
 ''')
 
@@ -99,7 +99,7 @@ small_video_item_template = Template('''
                         <span class="views">$views</span>
                         
                     </div>
-                    <input class="item-checkbox" type="checkbox" name="video_info_list" value="$video_info" form="playlist-add">
+                    <input class="item-checkbox" type="checkbox" name="video_info_list" value="$video_info" form="playlist-edit">
                 </div>
 ''')
 
@@ -298,13 +298,12 @@ header_template = Template('''
                 </form>
             </div>
             <div id="header-right">
-                <form id="playlist-add" action="/youtube.com/edit_playlist" method="post" target="_self">
-                    <input type="hidden" name="action" value="add">
+                <form id="playlist-edit" action="/youtube.com/edit_playlist" method="post" target="_self">
                     <input name="playlist_name" id="playlist-name-selection" list="playlist-options" type="text">
                     <datalist id="playlist-options">
 $playlists
                     </datalist>
-                    <button type="submit" id="playlist-add-button">Add to playlist</button>
+                    <button type="submit" id="playlist-add-button" name="action" value="add">Add to playlist</button>
                     <button type="reset" id="item-selection-reset">Clear selection</button>
                 </form>
                 <a href="/youtube.com/playlists" id="local-playlists">Local playlists</a>
diff --git a/youtube/local_playlist.py b/youtube/local_playlist.py
index 926c93f..5da3b4d 100644
--- a/youtube/local_playlist.py
+++ b/youtube/local_playlist.py
@@ -40,30 +40,18 @@ def get_playlist_names():
         if ext == '.txt':
             yield name
 
-'''
-            main{
-                display:grid;
-                grid-template-columns: 3fr 1fr;
-            }
-
-            header{
-                grid-template-columns: 3fr 1fr;
-            }
-
-            #left{
-                grid-column: 1;
-                grid-row: 1;
-                
-                display: grid;
-                grid-template-columns: 1fr 800px;
-                grid-template-rows: 0fr 1fr 0fr;
-            }
+def remove_from_playlist(name, video_info_list):
+    ids = [json.loads(video)['id'] for video in video_info_list]
+    with open(os.path.join(playlists_directory, name + ".txt"), 'r', encoding='utf-8') as file:
+        videos = file.read()
+    videos_in = videos.splitlines()
+    videos_out = []
+    for video in videos_in:
+        if json.loads(video)['id'] not in ids:
+            videos_out.append(video)
+    with open(os.path.join(playlists_directory, name + ".txt"), 'w', encoding='utf-8') as file:
+        file.write("\n".join(videos_out) + "\n")
 
-            #right{
-                grid-column: 2;
-                grid-row: 1;
-            }
-'''
 def get_playlists_list_page():
     page = '''<ul>\n'''
     list_item_template = Template('''    <li><a href="$url">$name</a></li>\n''')
diff --git a/youtube/shared.css b/youtube/shared.css
index dc1d121..670a1b3 100644
--- a/youtube/shared.css
+++ b/youtube/shared.css
@@ -74,7 +74,7 @@ address{
     grid-template-rows: 1fr;
     width: 550px;
 }
-    #playlist-add{
+    #playlist-edit{
         display:contents;
     }
         #playlist-name-selection{
diff --git a/youtube/youtube.py b/youtube/youtube.py
index aa23d06..a9bd3c4 100644
--- a/youtube/youtube.py
+++ b/youtube/youtube.py
@@ -57,8 +57,20 @@ def youtube(env, start_response):
             fields = urllib.parse.parse_qs(env['wsgi.input'].read().decode())
             if fields['action'][0] == 'add':
                 local_playlist.add_to_playlist(fields['playlist_name'][0], fields['video_info_list'])
-                
-            start_response('204 No Content', ())
+                start_response('204 No Content', ())
+            elif fields['action'][0] == 'remove':
+                try:
+                    playlist_name = fields['playlist_page'][0]
+                except KeyError:
+                    playlist_name = fields['playlist_name'][0]
+                local_playlist.remove_from_playlist(playlist_name, fields['video_info_list'])
+                start_response('200 OK', ())
+                return local_playlist.get_playlist_page(playlist_name).encode() 
+            else:
+                start_response('400 Bad Request', ())
+                return b'400 Bad Request'
+
+            
         else:
             start_response('404 Not Found', ())
             return b'404 Not Found' 
diff --git a/yt_local_playlist_template.html b/yt_local_playlist_template.html
index 49df5ed..52836a6 100644
--- a/yt_local_playlist_template.html
+++ b/yt_local_playlist_template.html
@@ -20,12 +20,28 @@
                 grid-row: 1;
                 
                 display: grid;
-                grid-template-columns: 1fr 800px;
+                grid-template-columns: 1fr 800px auto;
                 grid-template-rows: 0fr 1fr 0fr;
             }
                 .playlist-title{
                     grid-column:2;
                 }
+                #playlist-remove-button{
+                    grid-column:3;
+                    align-self: center;
+                    white-space: nowrap;
+                }
+                #results{
+                    
+                    grid-row: 2;
+                    grid-column: 2 / span 2;
+                    
+                    
+                    display: grid;
+                    grid-auto-rows: 0fr;
+                    grid-row-gap: 10px;
+                    
+                }
                 .page-button-row{
                     grid-row: 3;
                     grid-column: 2;
@@ -38,17 +54,7 @@
                 grid-row: 1;
 
             }
-            #results{
-                
-                grid-row: 2;
-                grid-column: 2;
-                
-                
-                display: grid;
-                grid-auto-rows: 0fr;
-                grid-row-gap: 10px;
-                
-            }
+
         </style>
     </head>
     <body>
@@ -56,6 +62,8 @@ $header
         <main>
             <div id="left">
                 <h2 class="playlist-title">$title</h2>
+                <input type="hidden" name="playlist_page" value="$title" form="playlist-edit">
+                <button type="submit" id="playlist-remove-button" name="action" value="remove" form="playlist-edit">Remove from playlist</button>
                 <div id="results">          
 $videos
                 </div>