Skip to content

P
Projet ISIS
Commit 39631691 authored by Okthane's avatar Okthane
Browse files
Options

okay

parent 46dc8baf
Hide whitespace changes
Inline Side-by-side
Showing with 111 additions and 108 deletions
index.php
View file @ 39631691
......@@ -10,11 +10,11 @@
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="style.css">
<script src="tensorflow.js"></script>
<script src="blazeface.js"></script>
<!-- <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"></script> -->
<!-- <script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/blazeface"></script> -->
<!-- Si souhaitez utiliser le code en local -->
<!-- <script src="tensorflow.js"></script> -->
<!-- <script src="blazeface.js"></script> -->
<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>
......@@ -58,7 +58,9 @@
<div id ="dropcontainer" class ="row d-flex justify-content-center div-ID div-photo" >
<div class="col-md-3 my-auto d-flex justify-content-center" >
<img name ="im-ID" id="img-ID" src="" height="150em"/>
<!-- <canvas id="ctx"></canvas> -->
</div>
<div id=conditions class="col-md-3 my-5 d-flex justify-content-center">
<ul class="list-group">
......@@ -87,9 +89,9 @@
</form>
<script>
const inpFile = document.getElementById("fileUpload");
const inpFile = document.getElementById("fileUpload");
const previewImage = document.getElementById("img-ID");
const file = inpFile.files[0];
const file = inpFile.files[0];
console.log("ok");
if (file){
const reader = new FileReader();
......
no-bg.png deleted 100644 → 0
View file @ 46dc8baf
{"errors":[{"title":"No image given","code":"missing_source","detail":"Please provide the source image in the image_url, image_file or image_file_b64 parameter."}]}
\ No newline at end of file
removeBackground2.php
View file @ 39631691
<?php
// phpinfo();
// die;
define('WHERE_TO_PUT','img_bg');
define('PATH_TO_BG', "img_bg");
define('TEMP','temp');
define('KEY','n6CkFXudANRCubRKMKG5hjNa');
define('PATH', "img_bg");
define('KEY' ,'n6CkFXudANRCubRKMKG5hjNa');
require_once "vendor/autoload.php";
......@@ -17,15 +14,15 @@ if($_SERVER["REQUEST_METHOD"] == "POST")
"jpg" => "image/jpeg",
"png" => "image/png"
);
$filename = $_FILES["photo"]["name"];
$filename = $_FILES["photo"]["name"];
$newfilename = $filename;
$filetype = $_FILES["photo"]["type"];
$filetype = $_FILES["photo"]["type"];
$ext = pathinfo($filename, PATHINFO_EXTENSION);
if(array_key_exists($ext, $allowed))
{
$client = new GuzzleHttp\Client(["verify"=>false]);
$res = $client->post('https://api.remove.bg/v1.0/removebg', [
$res = $client->post('https://api.remove.bg/v1.0/removebg', [
'multipart' => [
[
'name' => 'image_file',
......@@ -40,20 +37,22 @@ if($_SERVER["REQUEST_METHOD"] == "POST")
'X-Api-Key' => KEY
]
]);
// On supprime l'image intermédiaire
// $deletefile=unlink(TEMP.'/'.$newfilename);
$path = PATH.'/'.pathinfo($newfilename, PATHINFO_FILENAME)."NO-BG.png";
//On crée et stocke l'image détourée
$fp = fopen('img_bg/'.pathinfo($newfilename, PATHINFO_FILENAME)."NO-BG.png", "wb");
$fp = fopen($path, "wb");
fwrite($fp, $res->getBody());
fclose($fp);
$path = 'img_bg/'.pathinfo($filename, PATHINFO_FILENAME)."NO-BG.png";
$type = pathinfo($path, PATHINFO_EXTENSION);
$data = file_get_contents($path);
//On renvoie l'image détourée au front
// $path = 'img_bg'.'/'.pathinfo($filename, PATHINFO_FILENAME)."NO-BG.png";
$type = pathinfo($path, PATHINFO_EXTENSION);
$data = file_get_contents($path);
$base64 = 'data:image/' . $type . ';base64,' . base64_encode($data);
$data = array(
"témoin"=>"ok",
"src" => $base64
);
echo json_encode($data);
......
script.js
View file @ 39631691
// VARIABLES ===============================================================================
const URL_CHECK_ID = "upload.php";
const URL_DETOURAGE = "removeBackground2.php";
const URL_WEB_API = "web_server.php";
const URL_CHECK_ID = "upload.php";
const URL_DETOURAGE = "removeBackground2.php";
const URL_WEB_API = "web_server.php";
const URL_CHOOSE_MAIL = "io.php";
const URL_END = "byebye.html";
const URL_END = "byebye.html";
const timeout = 5000;
const ID = "img-ID"; var Img;
const ID = "img-ID"; var Img;
const ID_bg = "img-ID2"; var ImgBG;
const canva = "canvas";
// console.log($("#"+ID).attr('src'));
const idConsole = "span-status";var Console;
const idConsole = "span-status"; var Console;
var base64 = "";
const idFileUpload = "fileUpload"; var inputFileUpload;
const idFileUpload = "fileUpload"; var inputFileUpload;
const idCustomFileUpload = "custom-fileUpload"; var btnCustomFileUpload;
const idBtnSubmit = "btnSubmit";var btnSubmit;
const idBtnSubmit = "btnSubmit"; var btnSubmit;
const idStatut = "span-status";
//Variables concernant le bouton "Annuler"
const idCancel = "cancel"; var btnCancel;
var errorFormat = true;
var errorRemoveBackGround = true;
var unSeulVisage = false;
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;
const id_li_format = "li-format"; var li_format;
const id_li_taille = "li-taille"; var li_taille;
// SCRIPT ====================================================================================
......@@ -44,33 +39,34 @@ $(document).ready(function(){
console.log(getParameter(window.location.href));
//Variables des éléments du DOM.
inputFileUpload = $("#"+idFileUpload);
inputFileUpload = $("#"+idFileUpload);
btnCustomFileUpload = $("#"+idCustomFileUpload);
Img = $("#"+ID);
Img = $("#"+ID);
ImgBG = $("#"+ID_bg);
btnSubmit = $("#"+idBtnSubmit);
btnCancel = $("#"+idCancel);
Console = $("#"+idConsole);
Console = $("#"+idConsole);
li_OneFace = $("#"+id_li_OneFace);
li_format = $("#"+id_li_format);
li_taille = $("#"+id_li_taille);
li_format = $("#"+id_li_format);
li_taille = $("#"+id_li_taille);
//Si l'on change la photo,
inputFileUpload.change(function(){
unSeulVisage=false;
format_correct=false;
valide=false;
unSeulVisage = false;
format_correct = false;
valide = false;
ImgBG.attr("src","");
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");
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) {
if(valide==false)
if(valide == false)
{ event.preventDefault();
var formData = new FormData(this);
console.log(inputFileUpload.attr('filename'));
......@@ -78,15 +74,15 @@ $(document).ready(function(){
//Requête pour vérifier l'intégrité du fichier, ses dimensions
$.ajax({
url: URL_CHECK_ID,
method: 'POST',
enctype: 'multipart/form-data',
data: formData,
cache: false,
dataType: "json",
contentType: false,
processData: false
url : URL_CHECK_ID,
method : 'POST',
enctype : 'multipart/form-data',
data : formData,
cache : false,
dataType : "json",
contentType : false,
processData : false
})
.fail(function(error){
Console.empty();
......@@ -95,12 +91,13 @@ $(document).ready(function(){
.done(function(data){
errorFormat = data['error'];
if(data['errorMIME']){li_format.removeClass("list-group-item-secondary list-group-item-success").addClass("list-group-item-danger");}
else{li_format.removeClass("list-group-item-secondary list-group-item-danger").addClass("list-group-item-success");}
console.log(data['errorSize'])
if(data['errorSize']){console.log(2); li_taille.removeClass("list-group-item-secondary list-group-item-success").addClass("list-group-item-danger");}
else{console.log(1); li_taille.removeClass("list-group-item-secondary list-group-item-danger").addClass("list-group-item-success");}
if(!errorFormat){
if (data['errorMIME']) {li_format.removeClass("list-group-item-secondary list-group-item-success").addClass("list-group-item-danger");}
else {li_format.removeClass("list-group-item-secondary list-group-item-danger").addClass("list-group-item-success");}
console.log(data['errorSize']);
if (data['errorSize']) {console.log(2); li_taille.removeClass("list-group-item-secondary list-group-item-success").addClass("list-group-item-danger");}
else {console.log(1); li_taille.removeClass("list-group-item-secondary list-group-item-danger" ).addClass("list-group-item-success");}
if(!errorFormat)
{
format_correct = true;
photoDetourage(formData);
}
......@@ -123,9 +120,9 @@ $(document).ready(function(){
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 prenom = data['prenom'];
let nom = data['nom'];
let mailCalcule = data["mailCalcule"];
let mailsPossibles = data["mailsPossibles"];
if(mailsPossibles.length!=0){
......@@ -146,7 +143,7 @@ $(document).ready(function(){
<label for="${element}"> ${element}</label><br>`
);
});
$("#choix-email input").attr('checked')
$("#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">`
);
......@@ -154,12 +151,12 @@ $(document).ready(function(){
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>
<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>
<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>
`
);
......@@ -192,8 +189,8 @@ $(document).ready(function(){
function sendMail(){
console.log($("input[name=\"mail\"]:checked").val());
var mail = $("input[name=\"mail\"]:checked").val();
let mail = $("input[name=\"mail\"]:checked").val();
console.log("unSeulVisage: "+unSeulVisage+"\nformat_correct: "+format_correct);
if(unSeulVisage && format_correct){
$.ajax({
......@@ -202,7 +199,7 @@ function sendMail(){
data: 'mail='+mail,
dataType: "json"
});
setTimeout(function () {window.open(URL_END, '_self');}, timeout);
window.open(URL_END, '_self');
}
else{
alert("Oups...\nIl y a un problème avec votre photo :'(");
......@@ -222,15 +219,13 @@ async function photoDetourage(formData){
enctype: 'multipart/form-data' ,
data: formData,
cache: false,
dataType: "json",
contentType: false,
processData: false
cache: false,
dataType: "json",
contentType: false,
processData: false
})
.done(function(data){
console.log(data);
//Affichage de la photo
ImgBG.attr('src',data['src']);
})
......@@ -242,18 +237,25 @@ async function findFaces(idImage) {
// btnCustomFileUpload.prop('disabled',true);
$("body").css("cursor","wait");
btnSubmit.prop('disabled',true);
console.log('_findFaces()');
const model = await blazeface.load();
// const img = ID;
const img = document.getElementById(idImage);
const predictions = await model.estimateFaces(img, false);
console.log('_findFaces()');
const img = document.getElementById(idImage);
var returnTensors = false;
const predictions = await model.estimateFaces(img, returnTensors);
console.log(predictions.length+ " visage(s) trouvés.");
if (predictions.length > 0) {
console.log("faces found");
console.log(predictions.length);
// for (let i = 0; i < predictions.length; i++) {
// const start = predictions[i].topLeft;
// const end = predictions[i].bottomRight;
// const size = [end[0] - start[0], end[1] - start[1]];
// // 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){
if(predictions.length == 1){
li_OneFace.removeClass("list-group-item-secondary list-group-item-danger").addClass("list-group-item-success");
unSeulVisage = true;
}
......@@ -296,14 +298,13 @@ function getFile(filePath) {
function get_base64(src){
var string = src;
var k = 0;
var k = 0;
var base_64;
while (string.slice(k,k+7)!="base64," && k<100)
{
k=k+1;
}
base_64 = string.slice(k+7);
console.log(base_64)
return base_64;
}
......
upload.php
View file @ 39631691
......@@ -11,20 +11,21 @@ if($_SERVER["REQUEST_METHOD"] == "POST")
if(isset($_FILES["photo"]) && $_FILES["photo"]["error"] == 0)
{
$allowed = array(
"jpg" => "image/jpeg",
"jpg" => "image/jpeg",
"jpeg" => "image/jpeg",
"png" => "image/png",
"PNG" => "image/PNG",
"JPG" => "image/JPG"
"png" => "image/png",
"PNG" => "image/PNG",
"JPG" => "image/JPG"
);
$filename = htmlspecialchars(trim($_FILES["photo"]["name"]));// évite les noms de fichiers trop exotiques
$filename = htmlspecialchars(trim($_FILES["photo"]["name"]));// évite les noms de fichiers trop exotiques
$newfilename = $filename;
$filetype = $_FILES["photo"]["type"];
$filesize = $_FILES["photo"]["size"];
$message = "";
$error = true;
$errorSize = true;
$errorMIME = true;
$filetype = $_FILES["photo"]["type"];
$filesize = $_FILES["photo"]["size"];
$message = "";
$error = true;
$errorSize = true;
$errorMIME = true;
// Vérifie l'extension du fichier
$ext = pathinfo($filename, PATHINFO_EXTENSION);
......@@ -47,7 +48,7 @@ if($_SERVER["REQUEST_METHOD"] == "POST")
"errorMIME" => $errorMIME,
"errorSize" => $errorSize,
"error" => $error,//<----- Prend la valeur true (erreur!) ou false (ouf!)
"error" => $error,//<----- Prend la valeur true (erreur!) ou false (ouf!)
);
echo json_encode($data);
......
web_server.php
View file @ 39631691
......@@ -2,9 +2,10 @@
if($_SERVER["REQUEST_METHOD"]=="POST"){
$data = array(
"atraiter" => true,
"studentId" => $_POST['studentId'],
"prenom" => "jean-patrick",
"nom" => "doe.remifa.sollasi",
"studentId" => $_POST['studentId'],
"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")
......
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