Use compose tabs in book page

Fixes #144

fedireads/remote_user.py

@@ -75,13 +75,13 @@ def get_avatar(data):
 
 def get_remote_reviews(user):
     ''' ingest reviews by a new remote fedireads user '''
-    # TODO: use the server as the data source instead of OL
     outbox_page = user.outbox + '?page=true'
     response = requests.get(
         outbox_page,
         headers={'Accept': 'application/activity+json'}
     )
     data = response.json()
+    # TODO: pagination?
     for status in data['orderedItems']:
         if status.get('fedireadsType') == 'Review':
             create_review_from_activity(user, status)

fedireads/static/format.css

@@ -618,14 +618,14 @@ dd {
 input:checked ~ .compose-suggestion {
     display: block;
 }
-.compose-suggestion .book-preview {
+.compose .book-preview {
     background-color: #EEE;
     padding: 1em;
 }
-.compose-suggestion button {
+.compose button {
     margin: 0;
 }
-.compose-suggestion .stars {
+.compose .stars {
     text-align: left;
 }
 

fedireads/templates/book.html

@@ -49,15 +49,8 @@
             {% endif %}
 
             {% if request.user.is_authenticated %}
-            <div>
+            <div class="compose">
-                <h3>Leave a review</h3>
+                {% include 'snippets/create_status.html' with book=book hide_cover=True %}
-                <form class="review-form" name="review" action="/review/" method="post">
-                    {% csrf_token %}
-                    {% include 'snippets/rate_form.html' with book=book %}
-                    <input type="hidden" name="book" value="{{ book.fedireads_key }}"></input>
-                    {{ review_form.as_p }}
-                    <button type="submit">Post review</button>
-                </form>
             </div>
 
             <div>

fedireads/templates/snippets/covers_shelf.html

@@ -28,12 +28,19 @@
     {% for book in shelf.books %}
 <div class="compose-popout">
     <input name="book-popout" type="radio" id="book-{{ book.id }}-radio"></input>
-    <div class="compose-suggestion" id="compose-book-{{ book.id }}">
+    <div class="compose compose-suggestion" id="compose-book-{{ book.id }}">
         <label class="close icon icon-close" for="book-{{ book.id }}-radio-close" onclick="hide_element(this)">
             <span class="hidden-text">Close</span>
         </label>
         <input name="book-popout" type="radio" id="book-{{ book.id }}-radio-close"></input>
         <div class="content-container">
+            <h2>
+                {% include 'snippets/avatar.html' with user=user %}
+                Your thoughts on
+            a   <a href="/book/{{ book.fedireads_key }}">{{ book.title }}</a>
+                by {% include 'snippets/authors.html' with book=book %}
+            </h2>
+
             {% include 'snippets/create_status.html' with book=book user=request.user %}
         </div>
     </div>

fedireads/templates/snippets/create_status.html

@@ -1,13 +1,6 @@
 {% load humanize %}
 {% load fr_display %}
 
-<h2>
-    {% include 'snippets/avatar.html' with user=user %}
-    Your thoughts on
-a   <a href="/book/{{ book.fedireads_key }}">{{ book.title }}</a>
-    by {% include 'snippets/authors.html' with book=book %}
-</h2>
-
 <div class="tabs secondary">
     <div class="tab active" data-id="tab-review-{{ book.id }}" data-category="tab-option-{{ book.id }}">
         <a href="{{ book.absolute_id }}/review" onclick="tabChange(event)">Review</a>
@@ -21,9 +14,11 @@ a   <a href="/book/{{ book.fedireads_key }}">{{ book.title }}</a>
 </div>
 
 <div class="book-preview row">
+    {% if not hide_cover %}
     <div class="cover-container">
         {% include 'snippets/book_cover.html' with book=book %}
     </div>
+    {% endif %}
     <form class="tab-option-{{ book.id }} review-form" name="review" action="/review/" method="post" id="tab-review-{{ book.id }}">
         {% csrf_token %}
         <input type="hidden" name="book" value="{{ book.fedireads_key }}"></input>