Ajout de la fonctionnalité de recherche

This commit is contained in:
Éric Li 2021-04-27 18:43:14 +02:00
parent bf8c20da5a
commit ae3ed6476c
5 changed files with 136 additions and 44 deletions

View File

@ -4,7 +4,7 @@
{% include "navigation.html" %}
<div class="content">
<h1>{{data["ac"]}}</h1>
<h1>{{data["code"]}}</h1>
<p>{{data["titre"]}}</p>
</div>
{% include "navigation.html" %}

View File

@ -8,6 +8,7 @@
<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
<script src="https://unpkg.com/lunr/lunr.js"></script>
</head>
<body>
<!-- Barre de navigation -->
@ -32,17 +33,33 @@
<a class="navbar-item" href="ressourcesS2.html">Semestre 2</a>
</div>
<div class="navbar-end">
<!-- Barre de recherche -->
<div class="control has-icons-left">
<input id="rechercher" class="input" type="text" placeholder="Rechercher">
<span class="icon is-left">
<i class="fas fa-search"></i>
</span>
<div class="navbar-item">
<!-- Bouton pour afficher un boite de dialogue pour la recherche -->
<button id="rechercheBouton" class="button is-rounded is-primary">
<span class="icon">
<i class="fas fa-search"></i>
</span>
<span>Rechercher</span>
</button>
</div>
</div>
</div>
</div>
</nav>
<!-- Boite de dialogue pour la recherche -->
<div id="rechercheBoite" class="modal">
<div class="modal-background"></div>
<div class="modal-card">
<header class="modal-card-head">
<p class="modal-card-title has-text-centered">Rechercher</p>
<button id="rechercheBoite-fermer" class="modal-close"></button>
</header>
<section class="modal-card-body">
<input id="rechercher" type="text" class="input mb-4" placeholder="Rechercher..." >
<div id="rechercheResultats" class="content"></div>
</section>
</div>
</div>
<!-- Contenu de la page -->
<div class="container">
<div class="box">
@ -50,7 +67,7 @@
{% endblock %}
</div>
</div>
<!-- Script JQuery -->>
<script type="text/javascript" src="../base.js"></script>
<!-- Script JQuery -->
<script type="text/javascript" src="js/base.js"></script>
</body>
</html>

View File

@ -1,29 +0,0 @@
$("document").ready(function() {
// Affichage mobile du menu | affiche/cache le menu contenant la liste des catégories
// en appuyant sur le burger/les trois traits
$(".navbar-burger").click(function() {
$(".navbar-burger").toggleClass("is-active");
$(".navbar-menu").toggleClass("is-active");
});
$(".button").click(function() {
$(this).addClass("is-loading");
});
// Redirige vers la page tapé dans la barre de recherche | recheche brut, possible d'amélioration avec
// auto-complétion, créer une page web "page n'existe pas", recherche par motsclés, page avec une liste des
// pages web possibles en fonction de ce que entre l'utilisateur
// ex: "R101" -> ./HTML/R101.html
$("#rechercher").keyup(function(e) {
if(e.keyCode == 13) {location.href = $(this).val().toUpperCase() + ".html"}
});
});
// Permet l'affichage du LaTeX avec comme balise délimiteur "$"
// Le menu contextuel de MathJax a été désactivé
MathJax = {
tex: {
inlineMath: [['$', '$']]
},
options: {
enableMenu: false
}
};

72
html/baseTemplate.js Normal file
View File

@ -0,0 +1,72 @@
$("document").ready(function() {
// Affichage mobile du menu | affiche/cache le menu contenant la liste des catégories
// en appuyant sur le burger/les trois traits
$(".navbar-burger").click(function() {
$(".navbar-burger").toggleClass("is-active");
$(".navbar-menu").toggleClass("is-active");
// Détails visuel du bouton recherche
$("#rechercheBouton").toggleClass("is-rounded is-fullwidth is-primary")
});
// Bouton suivant et précédent qui s'affiche en loading lorsque l'utilisateur change de page
$("a.button").click(function() {
$(this).addClass("is-loading");
});
// Redirige vers la page tapé dans la barre de recherche | recheche brut, possible d'amélioration avec
// auto-complétion, créer une page web "page n'existe pas", recherche par motsclés, page avec une liste des
// pages web possibles en fonction de ce que entre l'utilisateur
// ex: "R101" -> ./HTML/R101.html
$("#rechercheBouton").click(function() {
$("#rechercheBoite").addClass("is-active")
});
// Gestion de la fermeture de la boite de recherche
$(".modal-background").click(function() {
$("#rechercheBoite").removeClass("is-active")
});
$("#rechercheBoite-fermer").click(function() {
$("#rechercheBoite").removeClass("is-active")
});
$("#rechercher").keyup(function(e) {
var recherche = $(this).val();
if(recherche.length != 0) {
var resultats = idx.search(recherche);
if(resultats.length != 0) {
$("#rechercheResultats").empty();
resultats.forEach(function(res) {
$("#rechercheResultats").append('<a href="' + documents[res.ref]["url"] + '"><p class="title">' + documents[res.ref]["titre"] + '</p></a>')
$("#rechercheResultats").append('<p class="subtitle">' + documents[res.ref]["code"] + '</p>')
});
} else {$("#rechercheResultats").html('<p class="has-text-centered">Pas de résultats</p>')}
} else {
$("#rechercheResultats").html('<p class="has-text-centered">Pas de résultats</p>')
}
});
});
// Documents avec toutes les informations nécessaire pour la recherche
var documents = {{documents}}
var idx = lunr(function() {
this.ref("code")
this.field("code")
this.field("motscles")
this.field("diminutif")
this.field("titre")
for(var cle in documents) {
this.add(documents[cle])
}
})
// Permet l'affichage du LaTeX avec comme balise délimiteur "$"
// Le menu contextuel de MathJax a été désactivé
MathJax = {
tex: {
inlineMath: [['$', '$']]
},
options: {
enableMenu: false
}
};

View File

@ -188,6 +188,18 @@ def formatHTML(string):
i += 1
return texte[:-1] # On enlève le dernier \n
def defineSearchTerm(dictio, url, documents):
""" Retourne un dictionnaire d'une ressource compatible Lunr pour la recherche de cette élément """
document = {}
document["code"] = dictio["code"]
document["url"] = url
if "titre" in dictio: document["titre"] = dictio["titre"]
else: document["titre"] = dictio["nom"]
if "motscles" in dictio: document["motscles"] = dictio["motscles"]
if "diminutif" in dictio: document["diminutif"] = dictio["diminutif"]
documents[document["code"]] = document
return
#Créer un fichier contenant la liste des saes
datas = {"data" : saes, "title": "SAE"} # "data" contient un tableau des saes
template_List.stream(datas).dump(REPERTOIRE_HTML + "/SAE.html")
@ -196,6 +208,9 @@ template_List.stream(datas).dump(REPERTOIRE_HTML + "/SAE.html")
datas = {"data" : ressources, "title": "Ressources"}
template_List.stream(datas).dump(REPERTOIRE_HTML + "/ressources.html")
# Définition d'un liste de document contenant les informations nécessaires pour la recherche
documents = {}
# Création des pages individuelles ressources, saes, exemples
for indexSem, sem in enumerate(ressources):
for i, ressource in enumerate(ressources[sem]):
@ -214,7 +229,10 @@ for indexSem, sem in enumerate(ressources):
if(i < len(ressources[sem]) - 1): datas["suivant"] = "R" + str(int(ressource.ressource["code"][1:])+1) + ".html"
elif(indexSem < len(ressources) - 1): datas["suivant"] = "R" + str((int(sem[-1:])+1)*100+1) + ".html"
# Créer un fichier html depuis un TemplateStream créer à partir du template et des données dans "data" qui remplace les variables
template.stream(datas).dump(REPERTOIRE_HTML + "/" + data["code"] + ".html")
url = data["code"] + ".html"
# Ajout des informations de ressource pour la recherche dans une liste
defineSearchTerm(data, url, documents)
template.stream(datas).dump(REPERTOIRE_HTML + "/" + url)
#Créer un fichier contenant la liste des ressources du semestre
data = {"data" : ressources[sem],"sem" : sem} # "data" contient un tableau des ressources du semestre
@ -235,7 +253,9 @@ for indexSem, sem in enumerate(ressources):
elif(indexSem > 0): datas["precedent"] = "SAE" + saes[list(saes.keys())[indexSem - 1]][-1].sae["code"][3:] + ".html" # saes[list(saes.keys())[indexSem - 1]][-1].sae["code"][3:] -> "code" du dernier sae du semestre précédent
if(i < len(saes[sem]) - 1): datas["suivant"] = "SAE" + str(int(sae.sae["code"][3:])+1) + ".html"
elif(indexSem < len(saes) - 1): datas["suivant"] = "SAE" + str((int(sem[-1:])+1)*10+1) + ".html"
template.stream(datas).dump(REPERTOIRE_HTML + "/" + data["code"].replace("É","E") + ".html")
url = data["code"].replace("É","E") + ".html"
defineSearchTerm(data, url, documents)
template.stream(datas).dump(REPERTOIRE_HTML + "/" + url)
for sae in exemples[sem]:
i = 1 # Nommage des fichiers exemple sae peut être modifier
@ -248,7 +268,8 @@ for indexSem, sem in enumerate(ressources):
datas = {"data":data, "rename": rename}
if(j > 0): datas["precedent"] = "SAE" + data["code"][-2:] + "_exemple" + str(i-1) + ".html"
if(j < len(exemples[sem][sae]) - 1): datas["suivant"] = "SAE" + data["code"][-2:] + "_exemple" + str(i+1) + ".html"
template.stream(datas).dump(REPERTOIRE_HTML + "/" + data["code"].replace("É","E") + "_exemple" + str(i) + ".html")
url = data["code"].replace("É","E") + "_exemple" + str(i) + ".html"
template.stream(datas).dump(REPERTOIRE_HTML + "/" + url)
i+=1
# Création des pages individuelles ACs, Compétences
@ -257,14 +278,16 @@ for indexRt, rt in enumerate(acs.getInfo()):
# ACs
for i, (ac, desc) in enumerate(acs.getInfo()[rt].items()):
data = {}
data["ac"] = ac
data["code"] = ac
data["titre"] = desc
datas = {"data":data}
if i > 0: datas["precedent"] = list(acs.getInfo()[rt].keys())[i-1] + ".html"
elif indexRt > 0: datas["precedent"] = list(acs.getInfo()["RT" + str(int(rt[-1])-1)].keys())[-1] + ".html"
if i < len(acs.getInfo()[rt])-1: datas["suivant"] = list(acs.getInfo()[rt].keys())[i+1] + ".html"
elif indexRt < len(acs.getInfo())-1: datas["suivant"] = list(acs.getInfo()["RT" + str(int(rt[-1])+1)].keys())[0] + ".html"
template_AC.stream(datas).dump(REPERTOIRE_HTML + "/" + ac + ".html")
url = ac + ".html"
defineSearchTerm(data, url, documents)
template_AC.stream(datas).dump(REPERTOIRE_HTML + "/" + url)
# Compétences
data = {}
@ -274,4 +297,13 @@ for indexRt, rt in enumerate(acs.getInfo()):
datas = {"data": data, "rt": rt}
if indexRt > 0: datas["precedent"] = "RT" + str(indexRt) + ".html"
if indexRt <= len(competences.getInfo()): datas["suivant"] = "RT" + str(indexRt + 2) + ".html"
template_Competence.stream(datas).dump(REPERTOIRE_HTML + "/" + rt + ".html")
url = rt + ".html"
template_Competence.stream(datas).dump(REPERTOIRE_HTML + "/" + url)
data["code"] = rt
defineSearchTerm(data, url, documents)
# Envoie des informations des documents pour la recherche
template_recherche = env.get_template("baseTemplate.js")
if not os.path.exists(REPERTOIRE_HTML + "/js"):
os.makedirs(REPERTOIRE_HTML + "/js")
template_recherche.stream(documents=documents).dump(REPERTOIRE_HTML + "/js/base.js")