Add database and subscribe button

pug/channel.pug

@@ -1,6 +1,11 @@
-extends includes/layout.pug
+extends includes/layout
 
-include includes/video-list-item.pug
+include includes/video-list-item
+include includes/subscribe-button
+
+block head
+  title= `${data.author} - CloudTube`
+  script(type="module" src=getStaticURL("html", "/static/js/channel.js"))
 
 block content
   main.channel-page
@@ -18,8 +23,7 @@ block content
         .about
           .name= data.author
           .subscribers= data.second__subCountText || `${data.subCount} subscribers`
-        form(method="post" action=`/formapi/subscribe/${data.authorId}`).subscribe
-          button.subscribe-button.base-border-look Subscribe
+        +subscribe_button(data.authorId, subscribed, `/channel/${data.authorId}`).subscribe-button.base-border-look
       .description!= data.descriptionHtml
 
     .videos

pug/home.pug

@@ -1,5 +1,8 @@
 extends includes/layout.pug
 
+block head
+  title Home - CloudTube
+
 block content
   main.home-page
     h1.top-header CloudTube

pug/includes/subscribe-button.pug

@@ -0,0 +1,6 @@
+mixin subscribe_button(ucid, isSubscribed, referrer)
+  - const subscribePath = !subscribed ? "subscribe" : "unsubscribe"
+  form(method="post" action=`/formapi/${subscribePath}/${ucid}`).subscribe-form
+    if referrer
+      input(type="hidden" name="referrer" value=referrer)
+    button(data-subscribed=(+isSubscribed) data-ucid=ucid)&attributes(attributes)#subscribe= !subscribed ? "Subscribe" : "Unsubscribe"

pug/search.pug

@@ -2,8 +2,11 @@ extends includes/layout.pug
 
 include includes/video-list-item.pug
 
+block head
+  title= `${query} (search) - CloudTube`
+
 block content
   main.search-page
     each result in results
       .search-result
-        +video_list_item(result)
+        +video_list_item(result)

pug/video.pug

@@ -1,9 +1,10 @@
-extends includes/layout.pug
+extends includes/layout
 
-include includes/video-list-item.pug
+include includes/video-list-item
+include includes/subscribe-button
 
 block head
-  title= video.title
+  title= `${video.title} - CloudTube`
   script(type="module" src=getStaticURL("html", "/static/js/player.js"))
   script const data = !{JSON.stringify(video)}
 
@@ -36,21 +37,20 @@ block content
       #audio-loading-display
 
       .video-button-container
-        button.border-look#subscribe Subscribe
-        button.border-look#theatre Theatre
+        +subscribe_button(video.authorId, subscribed, `/watch?v=${video.videoId}`).border-look
+        //- button.border-look#theatre Theatre
         select(autocomplete="off").border-look#quality-select
           each f in sortedFormatStreams
             option(value=f.itag)= `${f.qualityLabel} ${f.container}`
           each f in sortedVideoAdaptiveFormats
             option(value=f.itag)= `${f.qualityLabel} ${f.container} *`
-
-      .video-button-container
-        a(href="/subscriptions").border-look
-          img(src="/static/images/search.svg" width=17 height=17 alt="").button-icon
-          | Search
-        button.border-look#share Share
-        a.border-look YouTube
-        a.border-look Iv: Snopyta
+        //-
+          a(href="/subscriptions").border-look
+            img(src="/static/images/search.svg" width=17 height=17 alt="").button-icon
+            | Search
+        //- button.border-look#share Share
+        a(href=`https://www.youtube.com/watch?v=${video.videoId}`).border-look YouTube
+        a(href=`https://invidio.us/watch?v=${video.videoId}`).border-look Invidious
 
       .description!= video.descriptionHtml