Merge branch 'Ling' of https://github.com/EveSa/SummaryProject into Ling

Dockerfile

@@ -6,6 +6,18 @@ COPY requirements.txt .
 
 RUN pip install --no-cache-dir --upgrade -r requirements.txt
 
+RUN useradd -m -u 1000 user
+
+USER user
+
+ENV HOME=/home/user \
+    PATH=/home/user/.local/bin:$PATH
+
+
+WORKDIR $HOME/app
+
+COPY --chown=user . $HOME/app
+
 COPY . .
 
 CMD ["uvicorn", "src.api:app", "--host", "0.0.0.0", "--port", "7860"]

Documentation.md

@@ -1,3 +1,4 @@
+<<<<<<< HEAD
 # Les objectifs du projet
 
 L'objectif du projet est de mettre en place une <strong>plateforme de requête</strong> d'un modèle de langue permettant la <strong>génération de résumés d'articles de presse.</strong>
@@ -224,3 +225,157 @@ On aurait aimé avoir plus detemps pour aller plus loin et comprendre mieux enco
 ## Résultat du fine-tuning
 
 Les résumés générés ne sont pas grammaticalement corrects à 100% mais les informations importantes du texte sont bien présentes dans le résumé, et la longueur du résumé correspond bien à notre attente. Cependant, les résultats d'évaluation selon ROUGE sont très mauvais, malgré une amélioration de 0.007 à 0.06 pour rouge1, il n'est plus possible d'obtenir de meilleurs scores.
+=======
+# Les objectifs du projet
+
+L'objectif du projet est de mettre en place une <strong>plateforme de requête</strong> d'un modèle de langue permettant la <strong>génération de résumé d'article de presse.</strong>
+
+# Une description du système ou des données auxquelles l’interface permet d’accéder
+
+## Les Données 💾
+
+Le projet utilisera pour l'entraînement du modèle de langue le corpus issu de 'Newsroom: A Dataset of 1.3 Million Summaries with Diverse Extractive Strategies' (Grusky et al., NAACL 2018) newsroom assemblé par Max Grusky et ses collègues en 2018. Newsroom est un corpus parallèle rassemblant 1,3 millions articles de presse et leur résumé en anglais. Les résumés sont réalisés en utilisant les méthodes d'extraction comme d'abstraction ainsi que des méthodes mixtes. Ce corpus est disponible sur HuggingFace mais necessite un téléchargement préalable pour des raisons de protection des données.
+
+Le corpus est nettoyé avant d'être utilisé pour l'entraînement du LSTM. Seule les parties 'text' et 'summary' du jsonl sont utilisées.
+
+## Le système 🖥️
+
+2 systèmes :
+- LSTM réalisé à partir du <a href="https://loicgrobol.github.io//neural-networks/slides/03-transformers/transformers-slides.py.ipynb">cours</a> et de cet <a href="https://www.kaggle.com/code/columbine/seq2seq-pytorch">exemple</a> et de beaucoup d'autres référence en ligne.
+- Fine-tuned transformers modèle lancé et pré-entrainé par Google :<a href="https://huggingface.co/google/mt5-small">google/mt5-small</a>, il s'agit d'une variance du <a href="https://huggingface.co/docs/transformers/v4.16.2/en/model_doc/mt5">mT5</a>. Le model est entrainé pour notre tâche en se basant sur la documentation sur <a href="https://huggingface.co/docs/transformers/tasks/summarization">Summarisation</a> proposé par Huggingface.
+
+
+# La méthodologie
+
+## Répartition du travail 👥
+Nous avons travaillé avec le logiciel de gestion de version Github en mettant en place une intégration continue envoyant directement les `pull request` sur l'espace Huggingface.
+Idéalement, les `pull request` doivent être validées par deux membres du projet avant d'être accéptées afin d'éviter les erreurs en production. Nous n'avons pas mis en place ces restrictions à cause de la difficulté à gérer Docker dans Huggingface qui nous a nécessité beaucoup de modification.
+
+## Problèmes rencontrés et résolution
+
+### Problème sur le corpus 📚
+
+- [x] Problème Mojibake depuis les fichiers jsonl :
+    - [x] encodage en cp1252 et decodage en utf-8 avec ignore pour éviter les erreurs sur les caractères utf-8 présents dans le fichier à l'encodage
+    - ❔Le problème ne se présente étrangement pas sur toutes les machines.
+- [x] Agglomération des pronoms et des verbes
+    - D'abord remplacement des `'` par des espaces avant le `split`
+    - Utilisation d'un dictionnaire de correspondance
+- [ ] Split des noms propres composés ('Ivory Coast', 'Inter Milan') :
+    - [ ] pas de résolution à ce jour
+- [ ] Problème des mots non disponibles dans le vocabulaire
+    - À terme, entraînement sur tout le corpus ?
+- [ ] Problème de la qualité du corpus :
+    - Résumés tronqués : "Did Tatum O'Neal's latest battle with ex-husband John McEnroe put her back on drugs? The \"Paper Moon\"star checked herself into L.A.'s Promises rehab facility after a friend caught her smoking crack, according to The National Enquirer. O'Neal emerged clean and sober from Promises' 34-day recovery program in late July, the tab reports. The actress is said to have plunged into her old habits because of" ...
+    - Résumés plus proche de titres que de résumés : "SAN DIEGO PADRES team notebook"
+    - [ ] pas de résolution à ce jour
+
+### Problème sur le Réseau de Neurone 🕸️
+
+- [x] Prise en compte du padding dans l'apprentissage :
+    - [ ] utilisation de la fonctionnalité ignore_index de NLLLoss avec un padding d'une valeur à -100
+- [ ] Temps d'apprentissage très long :
+    - [ ] essai de mise en place d'un entraînement par batch
+- [ ] Répetition des déterminants après entraînement du modèle - https://huggingface.co/blog/how-to-generate
+    - [x] mise en place d'un Beam Search - non fructueux
+    - [ ] Passage vers du Sampling
+
+### Problème sur le fine-tuning
+- [x] La fonction map ne peut pas s'appliquer :
+    - Dans le prétrainement des données, utilise Dataset.from_dict(dataframe) pour obtenir les donneés en Dataset au lieu de Dataframe
+- [x] Problème de la permission d'appel du model privé enregistré sur HuggingFace :
+    - Se connecter à l'aide de `huggingface-cli login` et mettre `use_auth_token=True` en appelant le model.
+- [x] Processus arrêté sans erruers détectées :
+    - Diminuer le nombre de données
+    - Modifier les paramètres d'entrainement en diminuant le nombre d'epoch d'entrainement
+- [ ] Warning message pour les tokens non identifiables causé par
+    la conversion de sentencepiece tokenizer en fast tokenizer:
+    - [ ] pas de résolution à ce jour
+- [ ] Les résultats d'évaluation selon ROUGE sont très mauvais, rouge2 à 0:
+    - [ ] pas de résolution à ce jour
+### Problème sur l'interface
+
+### Problème de l'Intégration continue
+
+- [x] Pas de lien possible entre Huggingface et un github dont l'history contient des fichier de plus de 10Mo
+    - 💣 Explosion du github
+- [ ] Docker qui fonctionne en local mais en sur Huggingface
+    - Problème de path de fichier
+
+
+## Les étapes du projet
+
+1. Initialisation du Github
+2. Premiers pas dans le réseau de neurone
+3. Réalisation de la plateforme
+4. Intégration à Huggingface
+5. Fine-tuning de modèle
+6. Finalisation
+
+# Implémentation
+## modélisation
+
+Nous avons décidé dans un premier temps de modéliser une LSTM pour le résumé automatique sur la base du réseau de neurone réalisé en cours.
+Pour ce faire nous nous sommes beaucoup inspirée du kaggle https://www.kaggle.com/code/columbine/seq2seq-pytorch ainsi que de la documentation de PyTorch https://pytorch.org/tutorials/beginner/nlp/sequence_models_tutorial.html#example-an-lstm-for-part-of-speech-tagging
+
+## modules et API utilisés
+###  Dataloader :
+- Data
+```
+    A class used to get data from file
+    ...
+
+    Attributes
+    ----------
+    path : str
+        the path to the file containing the data
+
+    Methods
+    -------
+    open()
+        open the jsonl file with pandas
+    clean_data(text_type)
+        clean the data got by opening the file and adds <start> and
+        <end> tokens depending on the text_type
+    get_words()
+        get the dataset vocabulary
+```
+- Vectoriser
+```
+```
+
+### Model :
+
+### train :
+
+### inference :
+
+### api :
+
+### templates :
+
+## Langages de programmation
+- 🐳 Docker
+- yaml
+- 🐍 et python evidemment
+
+# Les résultats (fichiers output, visualisations…)
+
+## Les metriques d'évaluation
+- ROUGE
+- BLEU
+
+
+# Discussion des résultats
+
+## Résultats du LSTM
+
+Les résultats du LSTM sont inutilisables mais ont permis au moins de se confronter à la difficulté de mettre en place des réseaux de neurones depuis pas grand chose.
+
+On aurait aimé avoir plus de temps pour aller plus loin et comprendre mieux encore : l'entraîement par batch, pourquoi les résultats sont si mauvais, mettre d'autres stratégies de génération en place, ...
+
+## Résultat du fine-tuning
+
+Les résumés générés ne sont pas grammaticalement corrects à 100% mais les informations importantes du texte sont bien présentes dans le résumé, et la longeur du résumé correspond bien à notre attente. Cependant les résultats d'évaluation selon ROUGE est très mauvais, malgré une amélioration de 0.007 à 0.06 pour rouge1, il n'ést plus possible d'obtenir de meilleurs scores.
+
+>>>>>>> 7f1c2ca2f0a0475d3903b3261a03b02bfaad7374

README.md

@@ -1,3 +1,4 @@
+<<<<<<< HEAD
 ---
 title: SummaryProject
 sdk: docker
@@ -76,3 +77,83 @@ Lingyun GAO
 ## License
 
 Copyright. All rights reserved.
+=======
+---
+title: SummaryProject
+sdk: docker
+app_file: src/api.py
+pinned: false
+---
+
+# Project Deep Learning - Text Summarisation tool and it's application programming interface
+
+As part of the master course "Neural Network",for this university project, our task is about creating a application, a interface or a python library in the use of NLP(Natural Language Processing) with the help of an artificial neural network system.
+
+
+## Description
+
+**Objectives of our project :**
+
+Create a interface which allows users to sammrize a long text like press article into a brief version.
+
+To achieve this general objective, for the algorithm part, we would like to test two different deep learning methods: setting up a LSTM model and fine tuning Transformer model.
+
+For the interface, having a interface building with fastAPI framework and putting the application on Huggingface.
+
+
+## Getting Started
+
+### Préparation
+
+* Open the link below directing towards our interface on huggingface.
+```
+https://huggingface.co/spaces/EveSa/SummaryProject
+```
+### The interface
+
+* 1- Choosing a model for your summarization task (LSTM/Fine-tuned T5) by clicking on the scroll-down list. And click the Select model botton.
+
+* 2- Enter your text to summarize in the left section.
+
+* 3- Click on 'Go!' botton and you will get your sammary!
+
+* 4- Dont forget to reset the App for your next try. The botton is at the right next to 'Go!'.
+
+## In case you want to try to execute our scripts :
+
+### Préparation
+* In order to run the script, you need:
+
+* 1- Create a virtual environment named .venv
+```
+python3 -m virtualenv .venv
+source .venv/bin/activate
+```
+* 2- Also install the dependencies
+```
+pip install -U -r requirements.txt
+```
+
+* You are now ready to execute the scripts ^^
+
+### The programme api.py
+
+* Run the script with the command below:
+```
+python3 api.py
+```
+* This code generate the same page as on Huggingface in your browser. To do the task your may follow the steps in the previous section.
+
+## Authors
+
+Eve Sauvage
+
+Estelle SALMON
+
+Lingyun GAO
+
+
+## License
+
+This project is licensed under the [M2 TAL] License
+>>>>>>> 7f1c2ca2f0a0475d3903b3261a03b02bfaad7374

src/api.py

@@ -1,82 +1,162 @@
 from fastapi import FastAPI, Form, Request
 from fastapi.staticfiles import StaticFiles
 from fastapi.templating import Jinja2Templates
+import re
+
 
 from src.inference_lstm import inference_lstm
 from src.inference_t5 import inference_t5
 
 
-# ------ INFERENCE MODEL --------------------------------------------------------------
-# appel de la fonction inference, adaptee pour une entree txt
 def summarize(text: str):
-    if choisir_modele.var == "lstm":
-        return " ".join(inference_lstm(text))
-    elif choisir_modele.var == "fineTunedT5":
+    """
+    Returns the summary of an input text.
+    Parameter
+    ---------
+    text : str
+        A text to summarize.
+    Returns
+    -------
+    :str
+        The summary of the input text.
+    """
+    if global_choose_model.var == "lstm":
+        text = " ".join(inference_lstm(text))
+        return re.sub("^1|1$|<start>|<end>", "", text)
+    elif global_choose_model.var == "fineTunedT5":
         text = inference_t5(text)
-
-
-# ----------------------------------------------------------------------------------
-
-
-def choisir_modele(choixModele):
-    print("ON A RECUP LE CHOIX MODELE")
-    if choixModele == "lstm":
-        choisir_modele.var = "lstm"
-    elif choixModele == "fineTunedT5":
-        choisir_modele.var = "fineTunedT5"
-    else:
-        "le modele n'est pas defini"
-
-
-# -------- API ---------------------------------------------------------------------
+        return re.sub("<extra_id_0> ", "", text)
+    elif global_choose_model.var == "":
+        return "You have not chosen a model."
+
+
+def global_choose_model(model_choice):
+    """This function allows to connect the choice of the
+    model and the summary function by defining global variables.
+    The aime is to access a variable outside of a function."""
+    if model_choice == "lstm":
+        global_choose_model.var = "lstm"
+    elif model_choice == "fineTunedT5":
+        global_choose_model.var = "fineTunedT5"
+    elif model_choice == "  ---  ":
+        global_choose_model.var = ""
+
+
+# definition of the main elements used in the script
+model_list = [
+    {"model": "  ---  ", "name": "  ---  "},
+    {"model": "lstm", "name": "LSTM"},
+    {"model": "fineTunedT5", "name": "Fine-tuned T5"},
+]
+selected_model = "  ---  "
+model_choice = ""
+
+
+# -------- API ---------------------------------------------------------------
 app = FastAPI()
 
-# static files pour envoi du css au navigateur
+# static files to send the css
 templates = Jinja2Templates(directory="templates")
 app.mount("/templates", StaticFiles(directory="templates"), name="templates")
 
 
 @app.get("/")
 async def index(request: Request):
-    return templates.TemplateResponse("index.html.jinja", {"request": request})
+    """This function is used to create an endpoint for the
+    index page of the app."""
+    return templates.TemplateResponse(
+        "index.html.jinja",
+        {
+            "request": request,
+            "current_route": "/",
+            "model_list": model_list,
+            "selected_model": selected_model,
+        },
+    )
 
 
 @app.get("/model")
-async def index(request: Request):
-    return templates.TemplateResponse("index.html.jinja", {"request": request})
+async def get_model(request: Request):
+    """This function is used to create an endpoint for
+    the model page of the app."""
+    return templates.TemplateResponse(
+        "index.html.jinja",
+        {
+            "request": request,
+            "current_route": "/model",
+            "model_list": model_list,
+            "selected_model": selected_model,
+        },
+    )
 
 
 @app.get("/predict")
-async def index(request: Request):
-    return templates.TemplateResponse("index.html.jinja", {"request": request})
+async def get_prediction(request: Request):
+    """This function is used to create an endpoint for
+    the predict page of the app."""
+    return templates.TemplateResponse(
+        "index.html.jinja", {"request": request, "current_route": "/predict"}
+    )
 
 
 @app.post("/model")
-async def choix_model(request: Request, choixModel: str = Form(None)):
-    print(choixModel)
-    if not choixModel:
-        erreur_modele = "Merci de saisir un modèle."
+async def choose_model(request: Request, model_choice: str = Form(None)):
+    """This functions allows to retrieve the model chosen by the user. Then, it
+    can end to an error message if it not defined or it is sent to the
+    global_choose_model function which connects the user choice to the
+    use of a model."""
+    selected_model = model_choice
+    # print(selected_model)
+    if not model_choice:
+        model_error = "Please select a model."
         return templates.TemplateResponse(
-            "index.html.jinja", {"request": request, "text": erreur_modele}
+            "index.html.jinja",
+            {
+                "request": request,
+                "text": model_error,
+                "model_list": model_list,
+                "selected_model": selected_model,
+            },
         )
     else:
-        choisir_modele(choixModel)
-        print("C'est bon on utilise le modèle demandé")
-        return templates.TemplateResponse("index.html.jinja", {"request": request})
+        global_choose_model(model_choice)
+        return templates.TemplateResponse(
+            "index.html.jinja",
+            {
+                "request": request,
+                "model_list": model_list,
+                "selected_model": selected_model,
+            },
+        )
 
 
-# retourner le texte, les predictions et message d'erreur si formulaire envoye vide
 @app.post("/predict")
 async def prediction(request: Request, text: str = Form(None)):
+    """This function allows to retrieve the input text of the user.
+    Then, it can end to an error message or it can be sent to
+    the summarize function."""
     if not text:
-        error = "Merci de saisir votre texte."
+        text_error = "Please enter your text."
         return templates.TemplateResponse(
-            "index.html.jinja", {"request": request, "text": error}
+            "index.html.jinja",
+            {
+                "request": request,
+                "text": text_error,
+                "model_list": model_list,
+                "selected_model": selected_model,
+            },
         )
     else:
         summary = summarize(text)
         return templates.TemplateResponse(
-            "index.html.jinja", {"request": request, "text": text, "summary": summary}
+            "index.html.jinja",
+            {
+                "request": request,
+                "text": text,
+                "summary": summary,
+                "model_list": model_list,
+                "selected_model": selected_model,
+            },
         )
 
 

src/dataloader.py

@@ -38,8 +38,6 @@ class Data(torch.utils.data.Dataset):
         <end> tokens depending on the text_type
     get_words()
         get the dataset vocabulary
-    make_dataset()
-        create a dataset with cleaned data
     """
 
     def __init__(self, path: str, transform=None) -> None:

src/fine_tune_T5.py

@@ -159,7 +159,9 @@ if __name__ == '__main__':
     # définition de device
     device = torch.device('cuda' if torch.cuda.is_available() else 'cpu')
     # faire appel au model à entrainer
-    tokenizer = AutoTokenizer.from_pretrained('google/mt5-small')
+
+    hf_token = "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"
+    tokenizer = AutoTokenizer.from_pretrained('google/mt5-small', use_auth_token=hf_token )
 
     mt5_config = AutoConfig.from_pretrained(
         "google/mt5-small",
@@ -167,6 +169,7 @@ if __name__ == '__main__':
         length_penalty=0.6,
         no_repeat_ngram_size=2,
         num_beams=15,
+        use_auth_token=hf_token
     )
 
     model = (AutoModelForSeq2SeqLM
@@ -242,7 +245,7 @@ if __name__ == '__main__':
 
     # faire appel au model en local
     model = (AutoModelForSeq2SeqLM
-             .from_pretrained("t5_summary")
+             .from_pretrained("t5_summary", use_auth_token=hf_token )
              .to(device))
 
 

src/inference_t5.py

@@ -3,6 +3,8 @@
 """
 import re
 import string
+import os
+os.environ['TRANSFORMERS_CACHE'] = './.cache'
 
 import contractions
 import torch
@@ -32,11 +34,11 @@ def inference_t5(text: str) -> str:
     # On défini les paramètres d'entrée pour le modèle
     text = clean_text(text)
     device = torch.device("cuda" if torch.cuda.is_available() else "cpu")
-
-    tokenizer = (AutoTokenizer.from_pretrained("Linggg/t5_summary",use_auth_token=True))
+    hf_token = "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"
+    tokenizer = AutoTokenizer.from_pretrained("Linggg/t5_summary", use_auth_token=hf_token )
     # load local model
     model = (AutoModelForSeq2SeqLM
-             .from_pretrained("Linggg/t5_summary",use_auth_token=True)
+             .from_pretrained("Linggg/t5_summary", use_auth_token = hf_token )
              .to(device))
 
 

templates/index.html.jinja

@@ -1,35 +1,19 @@
 <!DOCTYPE html>
-<html lang="fr">
+<html lang="en">
     <head>
         <title>Text summarization API</title>
         <meta charset="utf-8" />
 		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
-		<link rel="stylesheet" href="{{ url_for('templates', path='templates/site_style/css/main.css') }}" />
+		<style>html, body, div, h1, h2, p, blockquote,a, code, em, img, strong, u, ul, li,label, legend, caption, tr, th, td,header, menu, nav, section, summary{margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline}header, menu, nav, section{display: block}div{margin-bottom: 20px}body{line-height: 1}ul{list-style: none}body{-webkit-text-size-adjust: none}input::-moz-focus-inner{border: 0;padding: 0}html{box-sizing: border-box}*, *:before, *:after{box-sizing: inherit}body{color: #5b5b5b;font-size: 15pt;line-height: 1.85em;font-family: 'Source Sans Pro', sans-serif;font-weight: 300;background-image: url("templates/site_style/images/background.jpg");background-size: cover;background-position: center center;background-attachment: fixed}h1, h2, h3{font-weight: 400;color: #483949;line-height: 1.25em}h1 a, h2 a, h3 a{color: inherit;text-decoration: none;border-bottom-color: transparent}h1 strong, h2 strong, h3 strong{font-weight: 600}h2{font-size: 2.85em}h3{font-size: 1.25em}strong, b{font-weight: 400;color: #483949}em, i{font-style: italic}a{color: inherit;border-bottom: solid 1px rgba(128, 128, 128, 0.15);text-decoration: none;-moz-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;-webkit-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;-ms-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out}a:hover{color: #ef8376;border-bottom-color: transparent}p, ul{margin-bottom: 1em}p{text-align: justify}hr{position: relative;display: block;border: 0;top: 4.5em;margin-bottom: 9em;height: 6px;border-top: solid 1px rgba(128, 128, 128, 0.2);border-bottom: solid 1px rgba(128, 128, 128, 0.2)}hr:before, hr:after{content: '';position: absolute;top: -8px;display: block;width: 1px;height: 21px;background: rgba(128, 128, 128, 0.2)}hr:before{left: -1px}hr:after{right: -1px}ul{list-style: disc;padding-left: 1em}ul li{padding-left: 0.5em;font-size: 85%;list-style: none}textarea{border-radius: 10px;resize: none;padding: 10px;line-height: 20px;word-spacing: 1px;font-size: 16px;width: 85%;height: 100%}::-webkit-input-placeholder{font-size: 17px;word-spacing: 1px}table{width: 100%}table.default{width: 100%}table.default tbody tr:first-child{border-top: 0}table.default tbody tr:nth-child(2n 1){background: #fafafa}table.default th{text-align: left;font-weight: 400;padding: 0.5em 1em 0.5em 1em}input[type="button"],input[type="submit"],input[type="reset"],button,.button{position: relative;display: inline-block;background: #df7366;color: #fff;text-align: center;border-radius: 0.5em;text-decoration: none;padding: 0.65em 3em 0.65em 3em;border: 0;cursor: pointer;outline: 0;font-weight: 300;-moz-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;-webkit-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;-ms-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out}input[type="button"]:hover,input[type="submit"]:hover,input[type="reset"]:hover,button:hover,.button:hover{color: #fff;background: #ef8376}input[type="button"].alt,input[type="submit"].alt,input[type="reset"].alt,button.alt,.button.alt{background: #2B252C}input[type="button"].alt:hover,input[type="submit"].alt:hover,input[type="reset"].alt:hover,button.alt:hover,.button.alt:hover{background: #3B353C}#header{position: relative;background-size: cover;background-position: center center;background-attachment: fixed;color: #fff;text-align: center;padding: 5em 0 2em 0;cursor: default;height: 100%}#header:before{content: '';display: inline-block;vertical-align: middle;height: 100%}#header .inner{position: relative;z-index: 1;margin: 0;display: inline-block;vertical-align: middle}#header header{display: inline-block}#header header > p{font-size: 1.25em;margin: 0}#header h1{color: #fff;font-size: 3em;line-height: 1em}#header h1 a{color: inherit}#header .button{display: inline-block;border-radius: 100%;width: 4.5em;height: 4.5em;line-height: 4.5em;text-align: center;font-size: 1.25em;padding: 0}#header hr{top: 1.5em;margin-bottom: 3em;border-bottom-color: rgba(192, 192, 192, 0.35);box-shadow: inset 0 1px 0 0 rgba(192, 192, 192, 0.35)}#header hr:before, #header hr:after{background: rgba(192, 192, 192, 0.35)}#nav{position: absolute;top: 0;left: 0;width: 100%;text-align: center;padding: 1.5em 0 1.5em 0;z-index: 1;overflow: hidden}#nav > hr{top: 0.5em;margin-bottom: 6em}.copyright{margin-top: 50px}@media screen and (max-width: 1680px){body, input, select{font-size: 14pt;line-height: 1.75em}}@media screen and (max-width: 1280px){body, input, select{font-size: 12pt;line-height: 1.5em}#header{background-attachment: scroll}#header .inner{padding-left: 2em;padding-right: 2em}}@media screen and (max-width: 840px){body, input, select{font-size: 13pt;line-height: 1.65em}}#navPanel, #titleBar{display: none}@media screen and (max-width: 736px){html, body{overflow-x: hidden}body, input, select{font-size: 12.5pt;line-height: 1.5em}h2{font-size: 1.75em}h3{font-size: 1.25em}hr{top: 3em;margin-bottom: 6em}#header{background-attachment: scroll;padding: 2.5em 0 0 0}#header .inner{padding-top: 1.5em;padding-left: 1em;padding-right: 1em}#header header > p{font-size: 1em}#header h1{font-size: 1.75em}#header hr{top: 1em;margin-bottom: 2.5em}#nav{display: none}#main > header{text-align: center}div.copyright{margin-top: 10px}label, textarea{font-size: 0.8rem;letter-spacing: 1px;font-family: Georgia, 'Times New Roman', Times, serif}.buttons{display: flex;flex-direction: row;justify-content: center;margin-top: 20px}}
+        </style>
         <script>
             function customReset()
             {
-                document.getElementById("my_form").value = "";
+                document.getElementById("text_form").value = "";
                 document.getElementById("text").value = "";
                 document.getElementById("summary").value = "";
             }
         </script>
-        <script>
-        function submitBothForms()
-            {
-            document.getElementById("my_form").submit();
-            document.getElementById("choixModel").submit();
-            }
-        </script>
-        <script>
-            function getValue() {
-                var e = document.getElementById("choixModel");
-                var value = e.value;
-                var text = e.options[e.selectedIndex].text;
-                return text}
-        </script>
-        <script type="text/javascript">
-            document.getElementById('choixModel').value = "<?php echo $_GET['choixModel'];?>";
-        </script>
     </head>
     <body>
         <div id="header">
@@ -44,22 +28,29 @@
             <hr/>
             </nav>
 
-            <div class="choixModel">
-                <form id="choixModel" method="post" action="/model">
+            <div class="model_choice">
+                <form id="model_choice" method="post" action="/model">
                     <label for="selectModel">Choose a model :</label>
-                    <select name="choixModel" class="selectModel" id="choixModel">
-                        <option value="lstm">LSTM</option>
-                        <option value="fineTunedT5">Fine-tuned T5</option>
+                    <select name="model_choice" class="selectModel" id="model_choice">
+                        <!--A for jinja loop to retrieve option buttons from the api
+                        and to keep them selected when a choice is made. -->
+                        {% for x in model_list %}
+                            {%if selected_model == x.model%}
+                                <option value="{{x.model}}" selected>{{x.name}}</option>
+                            {%else%}
+                                <option value="{{x.model}}">{{x.name}}</option>
+                            {%endif%}
+                        {%endfor%}
                     </select>
                 </form>
-                <button form ="choixModel" class='search_bn' type="submit" class="btn btn-primary btn-block btn-large" rows="1" cols="50">Select model</button>
+                <button form ="model_choice" class='search_bn' type="submit" class="btn btn-primary btn-block btn-large" rows="1" cols="50">Select model</button>
             </div>
 
             <div>
                 <table>
                     <tr>
                         <td>
-                            <form id = "my_form" action="/predict"  method="post" class="formulaire">
+                            <form id = "text_form" action="/predict"  method="post" class="formulaire">
                                 <textarea id="text" name="text" placeholder="Enter your text here!" rows="15" cols="75">{{text}}</textarea>
                                 <input type="hidden" name="textarea_value" value="{{ text }}">
                             </form>
@@ -71,9 +62,13 @@
                 </table>
             </div>
             <div class="buttons">
-                <!-- <button id="submit" type="submit" onclick=submitBothForms()>SUBMIT</button> -->
-                <button form ="my_form" class='search_bn' type="submit" class="btn btn-primary btn-block btn-large" rows="1" cols="50">Go !</button>
-                <button form ="my_form" type="button" value="Reset" onclick="customReset();">Reset</button>
+                <!--A if loop to disable Go and Reset button for the index page.-->
+                {% if current_route == "/" %}
+                <button>Please select a model</button>
+                {% else %}
+                <button form ="text_form" class='search_bn' type="submit" class="btn btn-primary btn-block btn-large" rows="1" cols="50">Go !</button>
+                <button form ="text_form" type="button" value="Reset" onclick="customReset();">Reset</button>
+                {% endif %}
             </div>
 
             <div class="copyright">
@@ -81,7 +76,7 @@
                         <li>&copy; Untitled. All rights reserved.</li>
                     </ul>
                     <ul>
-                        <li>Projet mené dans le cadre des cours du master 2 TAL (Traitement Automatique des Langues)</li>
+                        <li>University project as part of the NLP (Natural Language Processing) Master's program</li>
                         <li>Lingyun GAO -- Estelle SALMON -- Eve SAUVAGE</li>
                     </ul>
             </div>

templates/site_style/css/main.css

@@ -246,6 +246,7 @@ textarea {
 				background: #3B353C;
 			}
 
+
 /* Header */
 
 	#header {
@@ -469,4 +470,5 @@ textarea {
 		justify-content: center;
 		margin-top: 20px;
 	  }
+
 	}