Commit 179ce411 authored by Okthane's avatar Okthane

Commit Final Partie Code

parent 39631691
......@@ -8,6 +8,6 @@
<title>Merci pour votre participation</title>
</head>
<body>
<img src="img/.jpg" height="400px" >
<img src="img/.jpg" height="400px" >
</body>
</html>
\ No newline at end of file
......@@ -16,7 +16,7 @@
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/blazeface"></script>
<script src="jquery.js"></script>
<script src="script.js"></script>
<title>Formulaire d'upload de fichiers</title>
<!-- API TenserFlow -->
</head>
......@@ -64,9 +64,9 @@
</div>
<div id=conditions class="col-md-3 my-5 d-flex justify-content-center">
<ul class="list-group">
<li id="li-oneface" class="list-group-item list-group-item-secondary">Un seul visage<span></span></li>
<li id="li-format" class="list-group-item list-group-item-secondary">Format (jpg/png)<span></span></li>
<li id="li-taille" class="list-group-item list-group-item-secondary">Poids (< 1 Mo)<span></span></li>
<li id="li-oneface" class="list-group-item list-group-item-secondary">Un seul visage <span></span></li>
<li id="li-format" class="list-group-item list-group-item-secondary">Format (jpg/png)<span></span></li>
<li id="li-taille" class="list-group-item list-group-item-secondary">Poids (< 1 Mo) <span></span></li>
</ul>
</div>
<div class="col-md-3 my-auto d-flex justify-content-center">
......@@ -77,7 +77,7 @@
<div class ="row d-flex justify-content-center" >
<div class="div-form">
<form id ="form" action="" method="" enctype="multipart/form-data">
<form id ="form" action="" method="POST" enctype="multipart/form-data">
<!-- <label for="fileUpload">Fichier:</label> -->
<div class="div-btn-form">
<input type="file" name="photo" id="fileUpload" required="required" class="btn-form" accept="image/png, image/jpeg" >
......@@ -92,7 +92,7 @@
const inpFile = document.getElementById("fileUpload");
const previewImage = document.getElementById("img-ID");
const file = inpFile.files[0];
console.log("ok");
console.log(file);
if (file){
const reader = new FileReader();
console.log("ok");
......@@ -105,7 +105,7 @@
}
inpFile.addEventListener("change", function (){
const file = inpFile.files[0];
console.log("ok");
console.log(file);
if (file){
const reader = new FileReader();
console.log("ok");
......@@ -125,6 +125,7 @@
// defaultBtn.click();
// }
</script>
<script src="script.js"></script>
</div>
</div>
......
<?php
// phpinfo();
define('PATH', "img_bg");
define('KEY' ,'n6CkFXudANRCubRKMKG5hjNa');
define('PATH', 'img_bg');
define('KEY' , 'n6CkFXudANRCubRKMKG5hjNa');
require_once "vendor/autoload.php";
......@@ -21,7 +21,7 @@ if($_SERVER["REQUEST_METHOD"] == "POST")
$ext = pathinfo($filename, PATHINFO_EXTENSION);
if(array_key_exists($ext, $allowed))
{
$client = new GuzzleHttp\Client(["verify"=>false]);
$client = new GuzzleHttp\Client(["verify" => false]);
$res = $client->post('https://api.remove.bg/v1.0/removebg', [
'multipart' => [
[
......
......@@ -27,6 +27,7 @@ var errorRemoveBackGround = true;
var unSeulVisage = false;
var format_correct = false;
const id_li_OneFace = "li-oneface"; var li_OneFace;
const id_li_format = "li-format"; var li_format;
const id_li_taille = "li-taille"; var li_taille;
......@@ -35,9 +36,6 @@ const id_li_taille = "li-taille"; var li_taille;
$(document).ready(function(){
// console.log(inputFileUpload.val());
console.log(getParameter(window.location.href));
//Variables des éléments du DOM.
inputFileUpload = $("#"+idFileUpload);
btnCustomFileUpload = $("#"+idCustomFileUpload);
......@@ -52,6 +50,71 @@ $(document).ready(function(){
li_taille = $("#"+id_li_taille);
//Récupération des données concernant l'étudiant & proposition des différentes addresses mail.
studentId = getParameter(window.location.href);
$.ajax({
url: URL_WEB_API,
method: 'POST',
data: 'studentId='+studentId,
dataType: "json"
})
.done(function(response){
// let data = JSON.stringify(response);
// $("div#res").append(data);
// if(!data["atraiter"]){window.open(URL_END, '_self');
let data = response;
if(!data["atraiter"]){window.open(URL_END, '_self');}
console.log(data);
let prenom = data['prenom'];
let nom = data['nom'];
let mailCalcule = data["mailCalcule"];
let mailsPossibles = data["mailsPossibles"];
if(mailsPossibles.length != 0)
{
$("body").append(
`<div class = "container grayarea">
<h2 class="text-center">Choix de l'adresse électronique</h2>
<div class = "form-container div-form" id="email-container" >
<div class="title-container"><h3>Veuillez choisir votre prochaine adresse électronique</h3></div>
<form id ="choix-email" name="mail" class="div-form form-emails" action="" method="" onsubmit="event.preventDefault();sendMail()">
</form>
</div>
</div>`
);
mailsPossibles.forEach(element => {
$('#choix-email').append(
`<input type="radio" id="${element}" name="mail" value="${element}" required>
<label for="${element}"> ${element}</label><br>`
);
});
$("#choix-email input").attr('checked');
$("#choix-email").append(
`<input type="submit" id="valide-mail" value="Ok c'est bon !" class="btn btn-secondary" style="background-color:#00b8de">`
);
}
else
{
$("body").append(`
<div class = "container grayarea text-center">
<h3>Votre adresse électronique sera ${mailCalcule}, vous recevrez votre mot de passe dans les 24 heures.</h3>
</div>
<div class = "container">
<form action="" method="" onsubmit="event.preventDefault();sendMail()">
<input type="submit" id="valide-mail" value="Ok c'est bon !" class="btn btn-secondary" style="background-color:#00b8de">
</form>
</div>
`
);
}
})
//====EVENEMENTS========================================================
//Si l'on change la photo,
inputFileUpload.change(function(){
unSeulVisage = false;
......@@ -61,15 +124,21 @@ $(document).ready(function(){
li_format.removeClass (" list-group-item-success list-group-item-danger ").addClass(" list-group-item-secondary ");
li_OneFace.removeClass(" list-group-item-success list-group-item-danger ").addClass(" list-group-item-secondary ");
li_taille.removeClass (" list-group-item-success list-group-item-danger ").addClass(" list-group-item-secondary ");
});
//Requête pour les vérifications de sécurité & de format
$("#form").on("submit",function (event) {
$("#form").on("submit", function (event) {
if(valide == false)
{ event.preventDefault();
var formData = new FormData(this);
console.log(inputFileUpload.attr('filename'));
{
event.preventDefault();
const file = inpFile.files[0];
const extension = file.name.substring(file.name.lastIndexOf('.')+1, file.name.length) || file.name;
// La photo se nomme avec l'ID.
const formData = new FormData();
formData.set("photo",file,studentId+"."+extension);
//Requête pour vérifier l'intégrité du fichier, ses dimensions
$.ajax({
......@@ -104,83 +173,6 @@ $(document).ready(function(){
})}
});
//Récupération des données concernant l'étudiant & proposition des différentes addresses mail.
studentId = getParameter(window.location.href);
$.ajax({
url: URL_WEB_API,
method: 'POST',
data: 'studentId='+studentId,
dataType: "json"
})
.done(function(response){
// let data = JSON.stringify(response);
// $("div#res").append(data);
// if(!data["atraiter"]){window.open(URL_END, '_self');
let data = response;
if(!data["atraiter"]){window.open(URL_END, '_self');}
console.log(data);
let prenom = data['prenom'];
let nom = data['nom'];
let mailCalcule = data["mailCalcule"];
let mailsPossibles = data["mailsPossibles"];
if(mailsPossibles.length!=0){
$("body").append(
`<div class = "container grayarea">
<h2 class="text-center">Choix de l'adresse électronique</h2>
<div class = "form-container div-form" id="email-container" >
<div class="title-container"><h3>Veuillez choisir votre prochaine adresse électronique</h3></div>
<form id ="choix-email" name="mail" class="div-form form-emails" action="" method="" onsubmit="event.preventDefault();sendMail()">
</form>
</div>
</div>`
);
let required = 0;
mailsPossibles.forEach(element => {
$('#choix-email').append(
`<input type="radio" id="${element}" name="mail" value="${element}" required>
<label for="${element}"> ${element}</label><br>`
);
});
$("#choix-email input").attr('checked');
$("#choix-email").append(
`<input type="submit" id="valide-mail" value="Ok c'est bon !" class="btn btn-secondary" style="background-color:#00b8de">`
);
}
else{
$("body").append(`
<div class = "container grayarea text-center">
<h3>Votre adresse électronique sera ${mailCalcule}, vous recevrez votre mot de passe dans les 24 heures.</h3>
</div>
<div class = "container">
<form action="" method="" onsubmit="event.preventDefault();sendMail()">
<input type="submit" id="valide-mail" value="Ok c'est bon !" class="btn btn-secondary" style="background-color:#00b8de">
</form>
</div>
`
);
}
})
$("#dropcontainer").ondragover = $("#dropcontainer").ondragenter = function(evt) {
evt.preventDefault();
};
$("#dropcontainer").ondrop = function(evt) {
evt.preventDefault()
// pretty simple -- but not for IE :(
idFileUpload.files = evt.dataTransfer.files;
// If you want to use some of the dropped files
const dT = new DataTransfer();
dT.items.add(evt.dataTransfer.files[0]);
dT.items.add(evt.dataTransfer.files[3]);
fileInput.files = dT.files;
evt.preventDefault();}
});
......@@ -194,10 +186,11 @@ function sendMail(){
console.log("unSeulVisage: "+unSeulVisage+"\nformat_correct: "+format_correct);
if(unSeulVisage && format_correct){
$.ajax({
url: URL_CHOOSE_MAIL,
method: 'POST',
data: 'mail='+mail,
dataType: "json"
url : URL_CHOOSE_MAIL,
method : 'POST',
data : 'mail='+mail,
dataType : "json"
});
window.open(URL_END, '_self');
}
......@@ -210,17 +203,15 @@ function sendMail(){
async function photoDetourage(formData){
await findFaces(ID);
if(unSeulVisage){
// if (true){
$.ajax({
//url de la requête
url: URL_DETOURAGE,
method: 'POST',
enctype: 'multipart/form-data' ,
data: formData,
cache: false,
dataType: "json",
url : URL_DETOURAGE,
method : 'POST',
enctype : 'multipart/form-data',
data : formData,
cache : false,
dataType : "json",
contentType: false,
processData: false
})
......@@ -230,7 +221,6 @@ async function photoDetourage(formData){
ImgBG.attr('src',data['src']);
})
}
}
async function findFaces(idImage) {
......@@ -253,13 +243,17 @@ async function findFaces(idImage) {
// // Render a rectangle over each detected face.
// ctx.fillRect(start[0], start[1], size[0], size[1]);
// }
$("#"+idStatut).empty();
$("#"+idStatut).append(predictions.length+" face(s) found!");
if(predictions.length == 1){
$("#"+ idStatut).empty();
$("#"+ idStatut).append(predictions.length+" face(s) found!");
if(predictions.length == 1)
{
li_OneFace.removeClass("list-group-item-secondary list-group-item-danger").addClass("list-group-item-success");
unSeulVisage = true;
}
else{li_OneFace.removeClass("list-group-item-secondary list-group-item-success").addClass("list-group-item-danger");}
else
{
li_OneFace.removeClass("list-group-item-secondary list-group-item-success").addClass("list-group-item-danger");
}
}
else {
li_OneFace.removeClass("list-group-item-secondary list-group-item-success").addClass("list-group-item-danger");
......@@ -267,7 +261,6 @@ async function findFaces(idImage) {
btnSubmit.prop('disabled',false);
btnCustomFileUpload.prop('disabled',false);
$("body").css("cursor","");
// return predictions.length;
}
function getParameter(url){
......@@ -300,7 +293,7 @@ function get_base64(src){
var string = src;
var k = 0;
var base_64;
while (string.slice(k,k+7)!="base64," && k<100)
while (string.slice(k,k+7) != "base64," && k<100)
{
k=k+1;
}
......
<?php
//dossier temporaitre pour les images
define('PATH_TO_TEMP', "temp");
define('PATH_TO_TEMP', "temp" );
// Vérifier si le formulaire a été soumis
if($_SERVER["REQUEST_METHOD"] == "POST")
{
// Vérifie si le fichier a été uploadé sans erreur.
//format de la réponse
// Format de la réponse
if(isset($_FILES["photo"]) && $_FILES["photo"]["error"] == 0)
{
$allowed = array(
"jpg" => "image/jpeg",
"jpeg" => "image/jpeg",
"jpeg" => "image/jpeg",
"png" => "image/png",
"PNG" => "image/PNG",
"JPG" => "image/JPG"
......@@ -44,7 +42,7 @@ if($_SERVER["REQUEST_METHOD"] == "POST")
}
}
$error = $errorMIME || $errorSize;
$data = array(
$data = array(
"errorMIME" => $errorMIME,
"errorSize" => $errorSize,
......
......@@ -7,8 +7,8 @@ if($_SERVER["REQUEST_METHOD"]=="POST"){
"prenom" => "jean-patrick",
"nom" => "doe.remifa.sollasi",
"mailCalcule" => "patrick.doe.remifa.sollasi@ext.imt-nord-europe.fr",
// "mailsPossibles" => array()
"mailsPossibles"=>array("jean-patrick.doe@ext.imt-nord-europe.fr","jean.doe@ext.imt-nord-europe.fr","patrick.doe@ext.imt-nord-europe.fr","jean.remifa.sollasi@ext.imt-nord-europe.fr","jp.doeremifasollasi@ext.imt-nord-europe.fr")
"mailsPossibles" => array()
// "mailsPossibles"=>array("jean-patrick.doe@ext.imt-nord-europe.fr","jean.doe@ext.imt-nord-europe.fr","patrick.doe@ext.imt-nord-europe.fr","jean.remifa.sollasi@ext.imt-nord-europe.fr","jp.doeremifasollasi@ext.imt-nord-europe.fr")
);
echo json_encode($data);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment