https-ibrahwebdevwithpythiinandjs.github.io/book.html at master · Ibrah-55/https-ibrahwebdevwithpythiinandjs.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
Skip to content
Search or jump to…

Pull requests
Issues
Marketplace
Explore

@Ibrah-55
marcorichetta
/
cs50w-project1
1
1024
 Code
 Issues 0
 Pull requests 0 Actions
 Projects 0
 Wiki
 Security 0
 Insights
cs50w-project1/templates/book.html
@marcorichetta marcorichetta Updated for deployment on Heroku
a633abe on 19 Feb 2019
Executable File  81 lines (74 sloc)  3.17 KB

{% extends "layout.html" %}

{% block title %}
    {{bookInfo[0]['title']}}
{% endblock %}

{% block content %}

    <div class="row book-container">
        <div class="col-sm-4">
            <img src="http://covers.openlibrary.org/b/isbn/{{bookInfo[0]['isbn']}}-M.jpg" width="130px">
        </div>
        <div class="col-sm-4">
            <h1>{{bookInfo[0]['title']}}</h1>
            <h5>Author: {{bookInfo[0]['author']}}</h5>
            <h5>Published: {{bookInfo[0]['year']}}</h5>
            <h5>ISBN-10: {{bookInfo[0]['isbn']}}</h5>
        </div>

        <!--GOODREADS REVIEWS -->
        <div class="col-sm-4">
            <img class="mb-3" src="../static/goodreads.jpg" alt="Goodreads" width="200" height="45">
            <h5>Nº of Ratings: {{bookInfo[1]['work_ratings_count']}}</h5>
            <h5>Average Rating: {{bookInfo[1]['average_rating']}}</h5>
            <h5>
                <a href="https://www.goodreads.com/search?q={{bookInfo[0]['title']}}">Goodreads page</a>
            </h5>
        </div>
    </div>
    <div class="dropdown-divider"></div>

    <h4 class="alert alert-warning">Users Reviews</h4>
    <h5>Make your own review!</h5>

    <div>
        <!-- REVIEW FORM -->
        <form method="POST" class="form-border">
            <div class="form-row">
                <div class="form-group col-sm">
                    <label for="rating">Rate this book</label>
                    <select id="rating" name="rating" class="form-control" required>
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option selected value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                    </select>
                </div>
                <div class="form-group col-sm-6">
                    <div class="input-group">
                        <div class="input-group-prepend">
                            <span class="input-group-text">Say something</span>
                        </div>
                        <textarea name="comment" id="comment" class="form-control" rows="1" required></textarea>
                    </div>
                </div>
                <div class="form-group col-sm">
                    <button class="btn btn-success" type="submit">Submit</button>
                </div>
            </div>
        </form>

        <!-- REVIEW LIST -->
        <div id="userReviews">
            <h2></h2>
            {% for review in reviews %}
            <div class="list-group">
                <a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
                    <div class="d-flex w-100 justify-content-between">
                        <h6 class="mb-1" style="color:burlywood">{{review['username']}} said...</h6>
                        <small>{{review['time']}}</small>
                    </div>
                    <p class="mb-1">{{review['comment']}}</p>
                    <small>Rated: {{review['rating']}}</small>
                </a>
                <div class="dropdown-divider"></div>
            </div>
            {% endfor %}
        </div>
    </div>
{% endblock %}