How to show and change Image inside a Flask Route?

32 views Asked by At

I am Trying to build a Library Management System using flask. The idea is there will be a homepage, where when clicked on a book, we will be redirected to a reader(also written in HTML), which will show the images of the pages of the book.

Home Page Reader Page, Image will be shown on the left

The Backend and Book Logic is written with python & Pandas.

In order to open the reader with the images of different books, I have to route each div through '/reader'+id, where each div's id is the id of the concerned pdf.

<main>
        {% for book in books %}
        <div class="container" >
            <div class="inner-containers" id="{{book['ID']}}" onclick="showReader('{{book['ID']}}')">
                <div class="image-container">
                    <img class="book-image" src="{{ url_for('static', filename='thumbnails/' + book['Image']) }}">
                </div>
                <div class="book-details">
                    <p class="name">{{ book['Name'] }}</p>
                    <p class="author">{{ book['Author'] }}</p>
                    <p class="details">{{ book['Date'] }} &#183; {{ book['Genre'] }}</p>
                </div>
            </div>
        </div>
        {% endfor %}
    </main>
@app.route('/reader/<book_id>')
def reader(book_id):
    book_row = books_df[books_df['ID'] == book_id]
    if not book_row.empty:
        last_page = book_row['Last_page'].idxmax()
        last_page_image_path =  str(pdf_to_image("Server/Books/"+str(book_row.iloc[0]['Name']+".pdf"), last_page, 150))
        print(f"Path to Image: {last_page_image_path}")
        return render_template('reader.html', book_id=book_id, last_page_image=last_page_image_path)
    else:
        return "Book not found"

I am attaching the link to all the files based on the way they are in my directory and a description of each file is given below. However the code is unable to find the image of the last read page and showing up this error "GET /reader/static/Images/1.png HTTP/1.1" 404 - Even when i make another folder called reader, it doesn't seem to be working. Link to my Project:

Backend_Scripts

 -rendered.py (contains logic to convert page into image)

 -Basic_logic.py (Contains Book and Library Classes)

Server

 -books(folder)

 -.lib (datafile, books table)

static

 -icons

  --icons files

 -Images

  --this is where i want to generate the pages

 -Thumbnails

  --Book Thumbnails

 -CSS Files

templates

 -main.html

 -reader.html

app.py

Please be gentle and Thank you

0

There are 0 answers