Merge pull request #378 from shreyasvedpathak/main

Generate certificate - Flask web app using PILLOW

Author: pawangeek

certificate_generator/README.md

@@ -0,0 +1,45 @@
+# Certificate Generator
+
+## Table of Contents
+
+- [Folder Structure](#folder-structure)
+- [Requirements](#requirements)
+- [Approach](#approach)
+
+## Folder Structure
+
+```plain
+│   README.md
+│   requirements.txt
+│   run.py                                             # To run the web app
+│
+└───app
+    │   routes.py                                      # Contains routes
+    │   utils.py                                       # Contains generate_certifcate() function
+    │   __init__.py
+    │
+    ├───static                                         # Contains necessary static files
+    │   └───certificates
+    │       ├───generated                              # Stores generated certificates
+    │       │       Shreyas Vedpathak.png              # sample certificate
+    │       │
+    │       └───template                               # Contains neccesary required files
+    │               Sanchez-Regular.ttf                # Font
+    │               template.png                       # Template for certificate
+    │
+    └───templates                                      # HTML files for frontend
+            certificate.html
+            download.html
+            home.html
+```
+
+## Requirements
+
+- Flask==1.1.2
+- Pillow==8.3.1
+
+## Approach
+
+1. We get the user name and pr number from the form in `certificate.html`.
+2. We use the received information to generate and save the certificate using `generate_certificate()` function in `app/utils.py`.
+3. Finally, we render that certificate using `download.html` and we provide the option of downloading, and generate again.

certificate_generator/app/__init__.py

@@ -0,0 +1,6 @@
+from flask import Flask
+
+app = Flask(__name__)
+app.config['SEND_FILE_MAX_AGE_DEFAULT'] = 0
+
+from app import routes

certificate_generator/app/routes.py

@@ -0,0 +1,52 @@
+# External Imports
+import os
+from flask import render_template, request, send_file
+
+# Internal Imports
+from app import app
+from app.utils import generate_certificate
+
+
+@app.after_request
+def add_header(r):
+    """
+    Prevents caching, which will make sure old files are not sent.
+    """
+    r.headers["Cache-Control"] = "no-cache, no-store, must-revalidate"
+    r.headers["Pragma"] = "no-cache"
+    r.headers["Expires"] = "0"
+    r.headers['Cache-Control'] = 'public, max-age=0'
+    return r
+
+
+@app.route('/', methods=['GET', 'POST'])
+def home():
+    '''home
+    Renders home page
+    '''
+    return render_template("certificate.html")
+
+
+@app.route('/render', methods=['POST'])
+def render_certificate():
+    """
+    Get's information from user and generates
+    the certificate using generate_certificate function
+    """
+    if request.method == "POST":
+        file_name = generate_certificate(
+            request.form['name'],
+            request.form['pr_num'])
+        return render_template('download.html', file_name=file_name)
+
+
+@app.route('/download_certificate', methods=['GET'])
+def download():
+    """
+    Download the generated certificate
+    """
+    if request.method == "GET":
+        filename = request.args.get("filename")
+        filepath = os.path.join("static/certificates/generated", filename)
+        return send_file(filepath, as_attachment=True, cache_timeout=0,
+                         attachment_filename=filename)

certificate_generator/app/static/certificates/generated/Shreyas Vedpathak.png

@@ -0,0 +1,23 @@
+{% extends 'home.html' %}
+
+{% block content %}
+<div class="container w-50">
+    <form action="/render" method="post">
+        <div class="form-floating mb-3">
+            <input name="name" type="text" class="form-control" id="floatingInput" placeholder="Enter Name">
+            <label for="floatingInput">Enter Name</label>
+        </div>
+        <div class="input-group mb-3">
+            <span class="input-group-text" id="basic-addon1">#</span>
+            <input name="pr_num" type="number" class="form-control" placeholder="PR number" aria-label="PR number"
+                aria-describedby="basic-addon1">
+        </div>
+        <div class="my-4">
+            <a href="/render">
+                <button type="submit" class="btn btn-primary btn-lg">Submit</button>
+            </a>
+        </div>
+    </form>
+</div>
+
+{% endblock content %}

certificate_generator/app/static/certificates/template/Sanchez-Regular.ttf

@@ -0,0 +1,17 @@
+{% extends 'home.html' %}
+
+{% block content %}
+    <div class="container w-50">
+        <div>
+            <img src="{{url_for('static', filename='certificates/generated/' + file_name)}}" class="img-fluid rounded shadow" alt="certificate">
+        </div>
+        <div class="d-flex justify-content-evenly my-4">
+            <a href="/download_certificate?filename={{file_name}}">
+                <button type="button" class="btn btn-success">Download</button>                
+            </a>
+            <a href="/">
+                <button type="button" class="btn btn-dark">Generate again</button>                
+            </a>
+        </div>
+    </div>
+{% endblock content %}

certificate_generator/app/static/certificates/template/template.png

@@ -0,0 +1,31 @@
+<!doctype html>
+<html lang="en">
+
+<head>
+    <!-- Required meta tags -->
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <!-- Bootstrap CSS -->
+    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
+        integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
+
+    <title>Certificate Generator</title>
+</head>
+
+<body>
+    <div class="container text-center w-70 my-4">
+        <h1>Certificate Generator</h1>
+    </div>
+    
+    {% block content %}
+        
+    {% endblock content %}
+
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
+        integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
+        crossorigin="anonymous"></script>
+
+</body>
+
+</html>

certificate_generator/app/templates/certificate.html

@@ -0,0 +1,61 @@
+# External Imports
+from PIL import Image, ImageFont, ImageDraw
+import os
+
+# Internal Imports
+from app import app
+
+
+def generate_certificate(name, pr_num):
+    '''generate_certificate Generates certificate using base template
+
+    Args:
+        name (string): Name to be displayed on certificate
+        pr_num (integer): PR number to be displayed on certificate
+    '''
+    # Path to template certificate
+    template_dir = os.path.join(app.root_path, "static/certificates/template")
+    template_filename = "template.png"
+
+    # Path to save the certificate
+    output_dir = os.path.join(app.root_path, "static",
+                              "certificates/generated/")
+    output_filename = f"{name}.png"
+
+    # Load the template file
+    img = Image.open(os.path.join(template_dir, template_filename))
+    draw = ImageDraw.Draw(img)
+
+    # Text to put on the certificate
+    event_name = "Hacktoberfest"
+    contributed_at = "Automation scripts"
+    msg = f"""for taking part in {event_name} and
+contribution in #{pr_num} at {contributed_at}.
+"""
+    # Load fonts
+    name_font = ImageFont.truetype(os.path.join(
+        template_dir, "Sanchez-Regular.ttf"), 150)
+    msg_font = ImageFont.truetype(os.path.join(
+        template_dir, "Sanchez-Regular.ttf"), 70)
+
+    # Insert text (Name)
+    draw.text((1000, 1390), name, (51, 213, 172), font=name_font)
+    # Insert text (Message)
+    draw.text((1000, 1650), msg, (14, 69, 115), font=msg_font)
+
+    # Calculate the width of the texts. We will need it to
+    # draw the underline. As the pr number width can vary we cannot
+    # hardcode the coordinates of the text to be underlined.
+    # So we find the width of the pr_num and then calculate
+    # the starting position of the underlined text.
+    twidth, theight = draw.textsize(contributed_at, font=msg_font)
+    prwidth, prheight = draw.textsize(pr_num, font=msg_font)
+
+    lx = 1560 + prwidth + 120
+    ly = 1810
+    draw.line((lx, ly, lx + twidth, ly), fill=(14, 69, 115), width=5)
+
+    # Save certificate
+    img.save(os.path.join(output_dir, output_filename))
+    # Return filename, required for rendering the certificate
+    return output_filename