Small changes on the Corpus page

app/corpora/routes.py

@@ -81,10 +81,18 @@ def corpus(corpus_id):
         db.session.commit()
         flash('Your changes have been saved')
         return redirect(url_for('.corpus', corpus_id=corpus.id))
+    # if corpus.following_users == [None]:
+    #     following_users = []
+    # else:
+    #     following_users = [
+    #         u.to_json_serializeable() for u
+    #         in corpus.following_users
+    #     ]
     return render_template(
         'corpora/corpus.html.j2',
         corpus_settings_form=corpus_settings_form,
         corpus=corpus,
+        # following_users=following_users,
         title='Corpus'
     )
 
@@ -277,10 +285,8 @@ def import_corpus():
 def export_corpus(corpus_id):
     abort(503)
 
-@bp.route('/<hashid:corpus_id>/follow')
+@bp.route('/<hashid:corpus_id>/follow', methods=['GET', 'POST'])
 @login_required
-# TODO: Wenn Query Paramter genutzt wird, prüfen, ob user_id ungleich current_user.id ist und dann gucken, ob es ein Admin ist.
-# Sonst 403.
 def follow_corpus(corpus_id):
     corpus = Corpus.query.get_or_404(corpus_id)
     user_hashid = request.args.get('user_id')
@@ -297,7 +303,7 @@ def follow_corpus(corpus_id):
     db.session.commit()
     return {}, 202
 
-@bp.route('/<hashid:corpus_id>/unfollow')
+@bp.route('/<hashid:corpus_id>/unfollow', methods=['GET', 'POST'])
 @login_required
 def unfollow_corpus(corpus_id):
     corpus = Corpus.query.get_or_404(corpus_id)

app/templates/corpora/corpus.html.j2

@@ -10,10 +10,15 @@
     <div class="col s12" data-corpus-id="{{ corpus.hashid }}" data-user-id="{{ corpus.user.hashid }}" id="corpus-display">
       <div class="row">
         <div class="col s8 m9 l10">
-          <h1 id="title"><span class="corpus-title"></span></h1>
+          {# <h1 id="title"><span class="corpus-title"></span></h1> #}
+          <h1 id="title">{{ corpus.title }}</h1>
           {% if not corpus.user == current_user %}
+          {% if current_user.is_following_corpus(corpus) %}
+          <a class="btn waves-effect waves-light" id="follow-corpus-request"><i class="material-icons left">add</i>Unfollow Corpus</a>
+          {% elif not current_user.is_following_corpus(corpus) %}
           <a class="btn waves-effect waves-light" id="follow-corpus-request"><i class="material-icons left">add</i>Follow Corpus</a>
           {% endif %}
+          {% endif %}
         </div>
         <div class="col s4 m3 l2 right-align">
           <p>&nbsp;</p>
@@ -90,6 +95,7 @@
             <br>
             <p></p>
             {{ wtf.render_field(corpus_settings_form.is_public) }}
+            <br>
           </div>
           <div class="card-action right-align">
             {{ wtf.render_field(corpus_settings_form.submit, material_icon='send') }}
@@ -98,6 +104,14 @@
       </form>
     </div>
     {% endif %}
+    <div class="col s12">
+      <div class="card">
+        <div class="card-content">
+          <span class="card-title" id="files">Corpus followers</span>
+          <div class="user-list no-autoinit"></div>
+        </div>
+      </div>
+    </div>
   </div>
 </div>
 {% endblock page_content %}
@@ -106,25 +120,56 @@
 {{ super() }}
 <script>
   let corpusDisplay = new CorpusDisplay(document.querySelector('#corpus-display'));
-  let followCorpusRequest = document.querySelector('#follow-corpus-request');
-
-  followCorpusRequest.addEventListener('click', function() {
-     return new Promise((resolve, reject) => {
-      fetch(`/corpora/${corpusId}/build`, {method: 'POST', headers: {Accept: 'application/json'}})
-        .then(
-          (response) => {
-            if (response.status === 403) {app.flash('Forbidden', 'error'); reject(response);}
-            if (response.status === 404) {app.flash('Not Found', 'error'); reject(response);}
-            if (response.status === 409) {app.flash('Conflict', 'error'); reject(response);}
-            app.flash(`Corpus "${corpus?.title}" marked for building`, 'corpus');
-            resolve(response);
-          },
-          (response) => {
-            app.flash('Something went wrong', 'error');
-            reject(response);
-          }
-        );
-    });
+  let corpusFollowingRequest = document.querySelector('#follow-corpus-request');
+  
+  {# let followingUserList = new UserList(document.querySelector('.user-list'));
+  followingUserList.add({{ following_users|tojson }}); #}
+  
+  corpusFollowingRequest.addEventListener('click', function() {
+    corpusFollowingRequest.innerHTML = '<i class="material-icons left">add</i>Unfollow Corpus';
+    if ("{{ current_user.is_following_corpus(corpus) }}" === "False") {
+      corpusFollowingRequest.lastChild.textContent = 'Unfollow Corpus';
+      return new Promise((resolve, reject) => {
+        fetch(`/corpora/{{ corpus.hashid }}/follow`, {method: 'POST', headers: {Accept: 'application/json'}})
+          .then(
+            (response) => {
+              if (response.status === 403) {app.flash('Forbidden', 'error'); reject(response);}
+              if (response.status === 404) {app.flash('Not Found', 'error'); reject(response);}
+              if (response.status === 409) {app.flash('Conflict', 'error'); reject(response);}
+              app.flash(`You follow "{{ corpus.title }}" now`, 'corpus');
+              window.location.href = '{{ url_for("corpora.corpus", corpus_id=corpus.id) }}'
+              resolve(response);
+            },
+            (response) => {
+              app.flash('Something went wrong', 'error');
+              reject(response);
+            }
+          );
+      });
+      
+    } else {
+      corpusFollowingRequest.innerHTML = '<i class="material-icons left">add</i>Unfollow Corpus';
+      return new Promise((resolve, reject) => {
+        fetch(`/corpora/{{ corpus.hashid }}/unfollow`, {method: 'POST', headers: {Accept: 'application/json'}})
+          .then(
+            (response) => {
+              if (response.status === 403) {app.flash('Forbidden', 'error'); reject(response);}
+              if (response.status === 404) {app.flash('Not Found', 'error'); reject(response);}
+              if (response.status === 409) {app.flash('Conflict', 'error'); reject(response);}
+              app.flash(`You are not following "{{ corpus.title }}" anymore`, 'corpus');
+              resolve(response);
+              window.location.href = '{{ url_for("corpora.corpus", corpus_id=corpus.id) }}'
+            },
+            (response) => {
+              app.flash('Something went wrong', 'error');
+              reject(response);
+            }
+          );
+      });
+      
+    }
   });
+
+  
 </script>
 {% endblock scripts %}