updates to grid and list view

app/forms.py

@@ -3,7 +3,7 @@ from wtforms import StringField, FileField, validators
 from wtforms.validators import InputRequired, DataRequired
 from wtforms import FieldList
 from wtforms import Form as NoCsrfForm
-from wtforms.fields import StringField, FormField, SubmitField, SelectField
+from wtforms.fields import StringField, FormField, SubmitField, SelectField, RadioField
 from app.models import Book, BookSchema, Author, Stack, StackSchema
 
 # - - - Forms - - -
@@ -49,9 +49,12 @@ class SearchForm(FlaskForm):
                ('Author', 'Author'),
                ('Category', 'Category'),
                ('Stack', 'Stack')]
-    select = SelectField('', choices=choices)
+    select = SelectField('', choices=choices, default='All')
     search = StringField('', validators=[InputRequired()])
     grid = SubmitField('Grid')
     listview = SubmitField('List')
+    randomize = SubmitField('Order differently')
+
+
 
 

app/templates/results.html

@@ -9,7 +9,7 @@
       {{ render_field(form.search) }} </div>
       <button type="submit" class="button">browse</button>
      <p><br>
-      {{ form.grid(style="font-size:20px")}}{{ form.listview(style="font-size:20px")}}</p>      
+      {{ form.grid(style="font-size:20px")}}{{ form.listview(style="font-size:20px")}}</p>    
     </form>
     </div>
 
@@ -33,7 +33,7 @@
 
   <table class="library_table" id="table" style="width:100%">
     <tr id="header">
-      <th>Cover</th>
+      <th width="70px;">Cover</th>
       <th>Title</th>
       <th width="400px;">Author</th>
       <th width="100px;">Filetype</th>
@@ -45,7 +45,7 @@
         {% for book in books %}
     <tr>
     <td style= "padding: 5px;">
-<img class="no_cover" id="{{ book.title }}" src="/uploads/cover/{{ book.cover }}" width="80" onerror="if (this.src != '//uploads/cover/{{ book.cover }}') this.src = '/static/img/default_cover.gif';"></td>
+<img class="no_cover" id="{{ book.title }}" src="/uploads/cover/{{ book.cover }}" width="70" onerror="if (this.src != '//uploads/cover/{{ book.cover }}') this.src = '/static/img/default_cover.gif';"></td>
       <td><a href="{{url_for('show_book_by_id', id=book.id)}}">{{ book.title }}</a></td>
 
       <td>  {% for author in book.authors %}
@@ -75,7 +75,7 @@
 
   <table class="library_table" id="table" style="width:100%">
     <tr id="header">
-      <th>Cover</th>
+      <th width="70px;">Cover</th>
       <th>Title</th>
       <th width="400px;">Author</th>
       <th width="100px;">Filetype</th>

app/templates/results_grid.html

@@ -36,7 +36,7 @@
 
 
 <div class="gridbox">
-<a href="books/{{ book.id }}">
+<a href="/books/{{ book.id }}">
 <img class="no_cover" id="{{ book.title }}" src="/uploads/cover/{{ book.cover }}" width="100%" onerror="if (this.src != '//uploads/cover/{{ book.cover }}') this.src = '/static/img/default_cover.gif';"></a> 
 <p>
 <tbody>

app/templates/show_books.html

@@ -9,7 +9,7 @@
       {{ render_field(form.search) }} </div>
       <button type="submit" class="button">browse</button>
        <p><br>
-      {{ form.grid(style="font-size:20px")}}{{ form.listview(style="font-size:20px")}}</p>  
+      {{ form.grid(style="font-size:20px")}}{{ form.listview(style="font-size:20px")}}</p>
  </form>
 
   <h1 class="page-header">All Books</h1>
@@ -28,7 +28,7 @@
   <table class="library_table" id="table" style="width:100%">
     <thead>
     <tr id="header">
-      <th>Cover</th>
+      <th width="70px;">Cover</th>
       <th>Title</th>
       <th width="400px;">Author</th>
       <th width="100px;">Filetype</th>
@@ -38,11 +38,11 @@
     </tr>
     </thead>
     <tbody>
-        {% for book in books|sort(attribute='title', reverse = False) %}
+        {% for book in books %}
     <tr>
       <td style= "padding: 5px;">
 
-        <img class="no_cover" id="{{ book.title }}" src="/uploads/cover/{{ book.cover }}" width="80" onerror="if (this.src != '//uploads/cover/{{ book.cover }}') this.src = '/static/img/default_cover.gif';">
+        <img class="no_cover" id="{{ book.title }}" src="/uploads/cover/{{ book.cover }}" width="70" onerror="if (this.src != '//uploads/cover/{{ book.cover }}') this.src = '/static/img/default_cover.gif';">
       <!--  <object class="no_cover" data="../static/img/default_cover.png" type="image/png" width="65">
           <p hidden="True"></p>
 

app/templates/show_books_grid.html

@@ -9,13 +9,27 @@
       {{ render_field(form.search) }} </div>
       <button type="submit" class="button">browse</button>
            <p><br>
-      {{ form.grid(style="font-size:20px")}}{{ form.listview(style="font-size:20px")}}</p>  
+      {{ form.grid(style="font-size:20px")}}{{ form.listview(style="font-size:20px")}}</p> 
  </form>
     </div>
 
+
+  <h1 class="page-header">All Books</h1>
+  {% with messages = get_flashed_messages() %}
+    {% if messages %}
+      <div class="alert alert-success">
+        <ul>
+        {% for message in messages %}
+          <li>{{ message }}</li>
+        {% endfor %}
+        </ul>
+      </div>
+    {% endif %}
+  {% endwith %}
+
 <div class="grid">
 
-        {% for book in books|sort(attribute='title', reverse = False) %}
+        {% for book in books %}
 
 
 <div class="gridbox">