update repo

Merge branch 'add-htaccess' of DTux/avion-poeme into master
feat: add htacces to redirect php file
2021-12-14 22:33:54 +01:00 · 2021-11-24 21:58:21 +00:00 · 2021-11-24 22:57:51 +01:00 · 2021-11-24 21:51:56 +00:00 · 2021-11-24 22:48:28 +01:00 · 2021-11-11 15:18:01 +01:00
28 changed files with 55452 additions and 1028 deletions
@@ -0,0 +1,2 @@
 .DS_Store
 .history/
@@ -0,0 +1,9 @@
 RewriteEngine On
 # browser requests PHP
 RewriteCond %{THE_REQUEST} ^[A-Z]{3,9}\ /([^\ ]+)\.php
 RewriteRule ^/?(.*)\.php$ /$1 [L,R=301]
 # check to see if the request is for a PHP file:
 RewriteCond %{REQUEST_FILENAME}\.php -f
 RewriteRule ^/?(.*)$ /$1.php [L]
@@ -1,37 +1,31 @@
 <?php
-	require_once 'session_init.php';
+require_once 'session_init.php';
-	require_once 'config.inc.php';
+require_once 'config.inc.php';
-	require_once 'db.class.php';
+require_once 'db.class.php';
-	require_once 'log.php';
+require_once 'log.php';
-	require_once 'fonctions.inc.php';
+require_once 'fonctions.inc.php';
-	$table=array("message", "expeMail", "expeKnown", "expeLang", "destLang", "startLat", "startLon", "startName", "startTime", "startTZ", "destMail", "destLat", "destLon", "destName", "public", "color", "deliveryTime", "deliveryTZ", "deliveryTimeServer", "deliveryMethod");
+$table = array("message", "expeMail", "expeKnown", "expeLang", "destLang", "startLat", "startLon", "startName", "startTime", "startTZ", "destMail", "destLat", "destLon", "destName", "public", "color", "deliveryTime", "deliveryTZ", "deliveryTimeServer", "deliveryMethod");
-	$db = new db();
+$db = new db();
-	//$db->open();
+//$db->open();
-	foreach ($table as $var)
+foreach ($table as $var) {
-	{
+	if (getpost($var) != null) {
-		if ( getpost( $var ) != null )
+		$r = getpost($var);
 		{
 			$r = getpost( $var );
 		/*if ( $r == "true")
 			{
 				$r = 1;
 			}elseif( $r ="false")*/
 		$db->$var = trim($r, ' \"');
-		}else
+	} else {
 		{
 		$erreur[] = $var;
 	}
-	}
+}
-	if (!empty ($erreur))
+if (!empty($erreur)) {
 	{
 	echo json_encode($erreur);
 	log_error("erreur lors de l'acquisition des données:" . EOLH . print_r($erreur, true));
-	}else
+} else {
 	{
 	$db->newPlane();
-	}
+}
-	$db->close();
+$db->close();
 ?>
@@ -16,7 +16,9 @@
 	peripeties();
 	print "Envoi des arrivées" . EOLH;
 	arrivee();
 	anonymisation();
 	###################################   FONCTIONS #################################""
 	function peripetieDatee()
 	{
 		global $db;
@@ -130,7 +132,7 @@
 		$query = "SELECT * FROM avionpoeme WHERE atteri = 0 AND TIMEDIFF(CONCAT_WS(' ',CURDATE(),CURTIME()),deliveryTimeServer) > '00:00'";
 		$db->query($query);
 		$avionArrive = $db->result->fetch_all(MYSQLI_ASSOC);
-		var_dump($avionArrive);
+		//var_dump($avionArrive);
 		foreach ($avionArrive as $avion)
 		{
 			print "avion poème n° " . $avion['idAvion'] . "a atterri" . EOLH;
@@ -196,5 +198,18 @@
 			print json_last_error_msg() .EOLH;
 		}
 	}
 	function anonymisation()
 	{
 		global $db;
 		$query = "SELECT idAvion FROM avionpoeme WHERE atteri = 1 AND public = 0 AND DATEDIFF(CONCAT_WS(' ',CURDATE(),CURTIME()),deliveryTimeServer) > '7'";
 		$db->query($query);
 		$avionArrive = $db->result->fetch_all(MYSQLI_ASSOC);
 		//print_r($avionArrive);
 		foreach($avionArrive as $avion)
 		{
 			$query = "UPDATE avionpoeme SET message='', expeMail='', destMail='' WHERE idAvion='" . $avion['idAvion'] ."'";
 			$db->query($query);
 		}
 	}
 	$db->close();
 ?>
@@ -67,15 +67,22 @@ function verifPeripetieAvion()
 	$db->query($query);
 	$avions = $db->result->fetch_all(MYSQLI_ASSOC);
 	$avionsId = array_column($avions, 'expeMail', 'idAvion');
-	print_r($avionsId);
+	//print_r($avionsId);
 	$flag = false;
 	foreach($peripeties as $peripetie)
 	{
-		print "Péripétie " . $peripetie["idAP"] . EOLH;
+		//print "Péripétie " . $peripetie["idAP"] . EOLH;
 		$idAvion = $peripetie["idAvion"];
 		if ( empty($avionsId[$idAvion]) )
 		{
 			print "Péripétie " . $peripetie["idAP"] . " n'a pas d'avion poème idAvion=>" . $idAvion . EOLH;
 			$flag = true;
 		}
 	}
 	if ( ! $flag )
 	{
 		print "Aucune erreur détectée";
 	}
 	$db->close();
 }
@@ -30,6 +30,7 @@
 </head>
 <body>
 <a href="stats.php">Statistiques</a><br>
 <a href="lang.php">Générer les fichiers de langue</a><br>
 <a href="logs.php">Lire les logs</a><br>
 <a href="gestionDB.php">Vérifier la base de données</a><br>
@@ -14,6 +14,7 @@
 		$result = $db->result->fetch_assoc();
 		return $result['Auto_increment']-1;
 	}
 	function total()   			//nombre d'avions poèmes présents dans la base
 	{
 		global $db;
@@ -27,26 +28,42 @@
 	function totalenvol()   	//nombre d'avions poèmes en vol
 	{
 		global $db;
-		$query = "SELECT COUNT(*) as n FROM avionpoeme WHERE public!=2";
+		$query = "SELECT COUNT(*) as n FROM avionpoeme WHERE atteri!=1";
 		$db->query($query);
 		$result = $db->result->fetch_assoc();
 		return $result["n"];
 	}
-	function alea()
+	function alea($nAvionEnvoye)
 	{
 		global $db;
-		$query = "SELECT COUNT(*) as nAvion FROM avionpoeme WHERE ";
+		$query = "SELECT DISTINCT deliveryMethod FROM avionpoeme";
 		$db->query($query);
 		$result = $db->result->fetch_all(MYSQLI_ASSOC);
 		//var_dump($result);
 		foreach ( $result as $method )
 		{
 			$query = "SELECT COUNT(*) as nAvion FROM avionpoeme WHERE deliveryMethod='" . $method["deliveryMethod"] . "'";
 			$db->query($query);
 			$result = $db->result->fetch_assoc();
-		return $result["n"];
+			echo "Méthode => " . $method["deliveryMethod"] . " nombre d'avion poèmes => " . $result["nAvion"] . " => " . round($result["nAvion"]/$nAvionEnvoye*100,2) . "%" . EOLH;
-
+		}
 	}
 	function anonymous()		//nombre d'avions poèmes envoyés anonymement
 	{
 		global $db;
-		$query = "SELECT COUNT(*) as n FROM avionpoeme WHERE expemail=''";
+		$query = "SELECT COUNT(*) as n FROM avionpoeme WHERE expeknown='0'";
 		$db->query($query);
 		$result = $db->result->fetch_assoc();
 		return $result["n"];
 	}
 	function deleted()
 	{
 		global $db;
 		$query = "SELECT COUNT(*) as n FROM avionpoeme WHERE public='2'";
 		$db->query($query);
 		$result = $db->result->fetch_assoc();
 		return $result["n"];
@@ -63,11 +80,14 @@
 		echo "Nombre total d'avions-poème : " . $nAvionEnvoye . EOLH;
 		$total = total();
 		$avionSupp = $nAvionEnvoye-$total;
-		echo "Nombre d'avion supprimés : " . $avionSupp . " => " . round($avionSupp/$nAvionEnvoye*100,3) . "%" . EOLH;
+		echo "Nombre d'avion supprimés : " . $avionSupp . " => " . round($avionSupp/$nAvionEnvoye*100,2) . "%" . EOLH;
 		$nAvionenvol = totalenvol();
-		echo "Nombre d'avions-poème en vol : " . $nAvionenvol . " => " . round($nAvionenvol/$nAvionEnvoye*100) . "%" .  EOLH;
+		echo "Nombre d'avions-poème en vol : " . $nAvionenvol . " => " . round($nAvionenvol/$nAvionEnvoye*100,2) . "%" .  EOLH;
 		$anonymous = anonymous();
-		echo "Nombre d'envois anonymes : " . $anonymous . " => " . round($anonymous/$nAvionEnvoye*100) . "%" . EOLH;
+		echo "Nombre d'envois anonymes : " . $anonymous . " => " . round($anonymous/$nAvionEnvoye*100,2) . "%" . EOLH;
 		$deleted = deleted();
 		echo "Nombre d'avions anonymisés(effacés) : " . $deleted  . " => " . round($deleted/$nAvionEnvoye*100,2) . "%" . EOLH;
 		alea($nAvionEnvoye);
 	}
@@ -1,31 +1,29 @@
 <?php
-define( 'EOL', "\n" );
+define('EOL', "\n");
-define( 'EOLH', "<br>\n" );
+define('EOLH', "<br>\n");
-define( 'LF', "\r\n" );
+define('LF', "\r\n");
-define( 'TAB', "\t" );
+define('TAB', "\t");
 //constantes des niveaux de log
-define( "INFO", 1 );
+define("INFO", 1);
-define( "ALERT", 2 );
+define("ALERT", 2);
-define( "ERROR", 3 );
+define("ERROR", 3);
-define( "RESULTS_BY_PAGE", 20 );    //Nombre de ligne d'anthologie par page
+define("RESULTS_BY_PAGE", 20);    //Nombre de ligne d'anthologie par page
-define( "DATE_MYSQL", "Y-m-d H:i:s" );
+define("DATE_MYSQL", "Y-m-d H:i:s");
 //variables diverses
 $admin 			= "Daniel";
 $webmaster		= "dtux@free.fr";
 $site 			= "Avion Poème";
 $dossier 		= "/www";
-$basedir 		= dirname( $_SERVER['DOCUMENT_ROOT'] ) . $dossier;
+$basedir 		= dirname($_SERVER['DOCUMENT_ROOT']) . $dossier;
-$base_url 		= "http://avion-poe.me";
+$base_url 		= "https://avion-poe.me";
 $base_path 		=  "/flex/storage/avion-poe.me/site/www/";
 $url_admin		= $base_url . "/gestion";
 $accueil		= $base_url . "/index.html";
-if (empty( $_SERVER["PHP_AUTH_USER"]))
+if (empty($_SERVER["PHP_AUTH_USER"])) {
 {
 	$_SERVER["PHP_AUTH_USER"] = 'script';
 }
 ?>
@@ -1,8 +1,7 @@
 <?php
-if ( !isset($site) )
+if (!isset($site)) {
-{
+	require_once("config.inc.php");
-    require_once( "config.inc.php" );
+	header('Location:  ' . $accueil);
 	header( 'Location:  ' . $accueil );
 }
 require_once "config.inc.php";
@@ -59,12 +58,10 @@ class db
 	function open()
 	{
-		if ( !$this->connect )
+		if (!$this->connect) {
-		{
+			$this->connect = new mysqli($this->server, $this->user, $this->passwd, $this->database);
-			$this->connect = new mysqli( $this->server, $this->user, $this->passwd, $this->database );
+			if ($this->connect->connect_errno) {
-			if ( $this->connect->connect_errno )
+				log_error("Échec de la connexion : => " . $this->connect->connect_error . "<br />" . __file__ . ' ligne ' . __line__, false, false);
 			{
 				log_error( "Échec de la connexion : => " . $this->connect->connect_error . "<br />" . __file__ . ' ligne ' . __line__, false,false);
 				return false;
 			}
 		}
@@ -78,26 +75,30 @@ class db
 		$this->connect = 0;
 	}
-    function protect( $string )
+	function protect($string)
 	{
-		return $this->connect->real_escape_string( $string );
+		return $this->connect->real_escape_string($string);
 	}
-	function query( $string )
+	function query($string)
 	{
 		//log_write( $string );
-		if ( empty( $this->connect ) )		$this->open();
+		if (empty($this->connect))		$this->open();
-		$this->result = $this->connect->query( $string ) ;
+		$this->result = $this->connect->query($string);
-		if ( $this->connect->errno > 0 )  log_error( "Échec de la commande query => " . $this->connect->error . "<br />" . __file__ . ' ligne ' . __line__ . "\n" . $string, true, false);
+		if ($this->connect->errno > 0)  log_error("Échec de la commande query => " . $this->connect->error . "<br />" . __file__ . ' ligne ' . __line__ . "\n" . $string, true, false);
 		//print_r( $this );
 	}
 	function newPlane()				//return 0 on error
 	{
 		global $base_url;
 		if (round($this->startLat, 3, PHP_ROUND_HALF_DOWN) == round($this->destLat, 3, PHP_ROUND_HALF_DOWN) && round($this->startLon, 3, PHP_ROUND_HALF_DOWN) == round($this->destLon, 3, PHP_ROUND_HALF_DOWN)) {
 			$this->destLon += 0.001;
 			$this->destLat += 0.001;
 		}
 		$query = "INSERT INTO avionpoeme VALUES ('0','";
 		$query .= $this->protect($this->message) . "', '";
 		$query .= $this->protect($this->expeMail) . "', ";
@@ -123,18 +124,17 @@ class db
 		$this->query($query);
 		$this->uid = $this->connect->insert_id;
 		echo "{'uid':'" . $this->uid . "'}";
-		$this->startTimeRFC822 = formatteDate( $this->expeLang, $this->startTime, $this->startTZ);
+		$this->startTimeRFC822 = formatteDate($this->expeLang, $this->startTime, $this->startTZ);
-		$this->deliveryTimeRFC822 = formatteDate( $this->destLang, $this->deliveryTime, $this->deliveryTZ );
+		$this->deliveryTimeRFC822 = formatteDate($this->destLang, $this->deliveryTime, $this->deliveryTZ);
 		$this->urlAvion = $base_url . "/?avionpoeme=" . $this->uid;
 		$this->newPeripetie();
 		courrielEnvoi($this);
 	}
 	function getPlane($uid)
 	{
 		global $base_url;
-		$query = "SELECT idAvion, message, expeMail, expeKnown, expeLang, destLang, startLat, startLon, startName, UNIX_TIMESTAMP(startTime) as startTime, startTZ, destMail, destLat, destLon, destName, color, UNIX_TIMESTAMP(deliveryTime) as deliveryTime, deliveryTZ, UNIX_TIMESTAMP(deliveryTimeServer) as deliveryTimeServer, deliveryMethod, public FROM avionpoeme WHERE idAvion='" . $uid  ."'";
+		$query = "SELECT idAvion, message, expeMail, expeKnown, expeLang, destLang, startLat, startLon, startName, UNIX_TIMESTAMP(startTime) as startTime, startTZ, destMail, destLat, destLon, destName, color, UNIX_TIMESTAMP(deliveryTime) as deliveryTime, deliveryTZ, UNIX_TIMESTAMP(deliveryTimeServer) as deliveryTimeServer, deliveryMethod, public FROM avionpoeme WHERE idAvion='" . $uid  . "'";
 		$this->query($query);
 		$plane = $this->result->fetch_array(MYSQLI_ASSOC);
 		$this->message = $plane["message"];
@@ -147,7 +147,7 @@ class db
 		$this->startName = $plane["startName"];
 		$this->startTime = $plane["startTime"];
 		$this->startTZ = $plane["startTZ"];
-		$this->startTimeRFC822 = formatteDate( $this->expeLang, $this->startTime, $this->startTZ);
+		$this->startTimeRFC822 = formatteDate($this->expeLang, $this->startTime, $this->startTZ);
 		$this->destMail = $plane["destMail"];
 		$this->destLat = $plane["destLat"];
 		$this->destLon = $plane["destLon"];
@@ -155,7 +155,7 @@ class db
 		$this->color = $plane["color"];
 		$this->deliveryTime = $plane["deliveryTime"];
 		$this->deliveryTZ = $plane["deliveryTZ"];
-		$this->deliveryTimeRFC822 = formatteDate( $this->destLang, $this->deliveryTime, $this->deliveryTZ );
+		$this->deliveryTimeRFC822 = formatteDate($this->destLang, $this->deliveryTime, $this->deliveryTZ);
 		$this->deliveryTimeServer = $plane["deliveryTimeServer"];
 		$this->deliveryMethod = $plane["deliveryMethod"];
 		$this->public = $plane["public"];
@@ -165,7 +165,7 @@ class db
 	function getCurrentPlanes()
 	{
-		$query = "SELECT idAvion as uid, UNIX_TIMESTAMP(deliveryTime) as deliveryTime, deliveryTZ, destLat, destLon, destName, UNIX_TIMESTAMP(startTime) as startTime, startTZ, startLon, startLat, startName, color FROM avionpoeme WHERE deliveryTimeServer>NOW()";
+		$query = "SELECT idAvion as uid, UNIX_TIMESTAMP(deliveryTime) as deliveryTime, deliveryTZ, destLat, destLon, destName, destMail, message, expeMail, deliveryTimeServer, deliveryMethod, UNIX_TIMESTAMP(startTime) as startTime, startTZ, startLon, startLat, startName, color, message FROM avionpoeme WHERE deliveryTimeServer>NOW()";
 		$this->query($query);
 		$planes = $this->result->fetch_all(MYSQLI_ASSOC);
 		print json_encode($planes);
@@ -173,20 +173,20 @@ class db
 		return $planes;
 	}
-	function getAnthology($page=0)
+	function getAnthology($page = 0)
 	{
 		$query = "SELECT COUNT(*) as count FROM avionpoeme WHERE deliveryTimeServer<NOW() AND public='1'";
 		$this->query($query);
 		$result = $this->result->fetch_assoc();
-		$n_pages = floor(($result["count"] / RESULTS_BY_PAGE))+1;
+		$n_pages = floor(($result["count"] / RESULTS_BY_PAGE)) + 1;
 		if ($page <= 0) //renvoie le nombre de ligne d'anthologie
 		{
-			print '{"nAnthology":"' . $result["count"] . '","nPages":"' . $n_pages .'"}';
+			print '{"nAnthology":"' . $result["count"] . '","nPages":"' . $n_pages . '"}';
 			return $n_pages;
-		}else  //renvoie les lignes d'anthologie
+		} else  //renvoie les lignes d'anthologie
 		{
-			if ($page > $n_pages) $page=$n_pages;
+			if ($page > $n_pages) $page = $n_pages;
-			$query = "SELECT UNIX_TIMESTAMP(startTime) as startTime, startTZ, startName, message, UNIX_TIMESTAMP(deliveryTime) as deliveryTime , deliveryTZ, destName FROM avionpoeme WHERE deliveryTimeServer<NOW() AND public='1' ORDER BY deliveryTime DESC LIMIT " . ($page-1)*RESULTS_BY_PAGE . "," . RESULTS_BY_PAGE;
+			$query = "SELECT UNIX_TIMESTAMP(startTime) as startTime, startTZ, startName, message, UNIX_TIMESTAMP(deliveryTime) as deliveryTime , deliveryTZ, destName FROM avionpoeme WHERE deliveryTimeServer<NOW() AND public='1' ORDER BY deliveryTime DESC LIMIT " . ($page - 1) * RESULTS_BY_PAGE . "," . RESULTS_BY_PAGE;
 			$this->query($query);
 			$planes = $this->result->fetch_all(MYSQLI_ASSOC);
 			print json_encode($planes, JSON_FORCE_OBJECT);
@@ -212,10 +212,9 @@ class db
 	{
 		$query = "SELECT *, DATEDIFF(quand,CURDATE()) as datePeripetie FROM peripeties WHERE quand IS NULL";
 		$this->query($query);
-		while ( ($result = $this->result->fetch_assoc()) )
+		while (($result = $this->result->fetch_assoc())) {
 		{
 			$this->idPeripetie =  $result["idPeripetie"];
-			if ((mt_rand(0,100) <= $result["probabilite"]))   //calcul de la probabilité de la péripétie
+			if ((mt_rand(0, 100) <= $result["probabilite"]))   //calcul de la probabilité de la péripétie
 			{
 				log_write("newPeripetie");
 				$this->datePeripetie = mt_rand($this->startTime, $this->deliveryTime);        //ajustement de l'effet
@@ -234,6 +233,3 @@ class db
 		return $this->avionJournalier;
 	}
 }
 ?>
@@ -13,6 +13,31 @@
 	<canvas id="blankCanvas2" width="400" height="400" style="border:1px solid #d3d3d3; display:none"></canvas>
 	<img style="display:none;" id="front" src="src/img/front.jpg" />
 	<img style="display:none;" id="back" src="src/img/back-FF5555.jpg" />
 	<?php
 	if (isset($_GET['avionpoeme']) && $_GET['avionpoeme'] !== '') { ?>
 		<script id="planeFoldScript.txt" type="not-javascript"> <!-- From https://github.com/RemiKoutcherawy/OriSim3D-JS  was fun to code -->
 			d -200 200 -200 -200 200 -200 200 200
 			c 0 1 c 0 3 c 0 2 c 1 3
 			c 0 8 c 8 3 c 0 4 c 4 1
 			c 6 0 c 6 1 c 6 2 c 6 3
 			iad t 0 ty 6 tx -3)
 			t 0 r 48 -179.99 21 0 10 r 55 -179.99 17 3 19 )
 			t 0 r 43 160 1 4 0 21 24 12 11 13 9 10)
 			t 0 ty -80)
 			t 0 tx -60)
 			t 0 r 27 -80 3 19 5 22 2 a 3)
 			t 0 r 23 -80 0 21 4 24 1 a 0)
 			t 500 r 23 80 0 21 4 24 1 a 0)
 			t 0 r 23 -90 0 a 0)
 			t 500 r 27 80 3 19 5 22 2 a 3)
 			t 0 r 27 -90 3 a 3)
 			t 700 tx 60)
 			t 700 ty 80)
 			t 750 r 43 -160 1 4 0 21 24 12 11 13 9 10)
 			t 750 r 48 179.99 21 0 10 r 55 179.99 17 3 19 )
 			iad t 1200 ty -6 tx 3)
 		</script>
 	<?php } else { ?>
 		<script id="planeFoldScript.txt" type="not-javascript"> <!-- From https://github.com/RemiKoutcherawy/OriSim3D-JS  was fun to code -->
 			d -200 200 -200 -200 200 -200 200 200
 			c 0 1 c 0 3 c 0 2 c 1 3
@@ -26,6 +51,8 @@
 			t 500 r 23 -80 0 21 4 24 1 a 0)
 			t 1000 tx -35 z 0 0 0 il 100 100)
 		</script>
 	<?php }
 	?>
 	<!-- Modal new plane-->
 	<div class="modal fade" id="newPlaneModal" tabindex="-1" role="dialog" aria-labelledby="newPlaneModal" aria-hidden="true">
 		<div class="modal-dialog modal-lg" role="document">
@@ -54,6 +81,13 @@
 									<br>
 									<div class="form-control rounded-0" id="messageTextArea"></div>
 								</div>
 								<div class="form-group">
 									<label class="bold" id="labelAttachment"></label>
 									<div class="custom-file">
 										<input type="file" class="custom-file-input" id="attachmentPlane" aria-describedby="inputGroupFileAddon01">
 										<label class="custom-file-label" for="attachmentPlane" id="attachmentPlaneLabel"></label>
 									</div>
 								</div>
 								<div class="form-group">
 									<label class="bold" for="selectTime" id="flightTime">Temps de vol</label>
 									<select class="form-control" id="selectTime">
@@ -99,13 +133,14 @@
 			</div>
 		</div>
 	</div>
 	<div id="closePlane"></div>
 	<div id="downloadPlaneMessage" class="btn btn-outline-primary">Télécharger l'avion-poème</div>
 	<script src="src/map.js"></script>
 	<script src="src/geocoder.js"></script>
 	<script src="src/paperPlaneAnimation.js"></script>
 	<script src="src/formValidation.js"></script>
 	<script src="src/newPlane.js"></script>
 	<script src="src/translation.js"></script>
 	<script src="src/anthology.js"></script>
 </body>
 </html>
@@ -74,3 +74,5 @@ AvionPoeme_epuise|100 avions-poèmes ont déjà été lancés aujourd'hui, veuil
 NB_AvionPoeme_restant|$NB_avion_poeme avions-poèmes  peuvent encore être lancés aujourd'hui! A votre plume!|$NB_avion_poeme flight-poems can still be launched today! Get out your pens!|$NB_avion_poeme Gedichte-Flieger können noch heute losgeschickt werden! An Ihrem Stift!|$NB_avion_poeme самолет–поеми могат да стартират днес! Хващайте писалката!|$NB_avion_poeme 詩作紙飞机今天仍然可发送 。拿起笔來吧！|$NB_avion_poeme 今日も飛行機の詩を飛ばしていただくことができます！あなたが書いたものを！|$NB_avion_poeme  aviones-poemas  todavía se pueden lanzar hoy. ¡En tu pluma!|$NB_avion_poeme  aviões-poemas ainda podem ser lançados hoje! Na sua caneta!|لا يزال من الممكن إطلاق $NB_avion_poeme الطائرات-القصائد  اليوم! أحضروا أقلامكم
 Soutenez_avionpoeme|Offrez-nous un verre de vin  |Offer us a beer |Schenken Sie uns ein Bier!|Почерпете ни с ракия!|请给我们倒茶|お酒をください|¡Ofrécenos una cerveza! |Ofereça-nos uma cerveja|من فضلك اعطنا الشاي
 AvionPoeme_free_independent|Avion-poe.me est gratuit, libre (open source) et indépendant|Avion-poe.me is free (as in freedom), free (as in free beer) and independent|Avion-poe.me ist kostenlos, frei (open source) und unabhängig |Avion-poe.me е безплатен, свободен (с отворен код) и независим |Avion-poe.me 是免费、开源和独立的 |Avion-poe.me は無料で、オープンソースで独立しています |Avion-poe.me es gratuito, libre (de código abierto) e independiente |Avion-poe.me é gratuito, libre (de código aberto) e independente |عملنا مجاني وحر (مفتوح المصدر) ومستقل 
 PJ_Parcourir|Parcourir|Browse|Durchsuchen|Прегледаване|浏览|ブラウズ |Navegar|Navegar|تصفح
 PJ_Ajouter|Ajouter un pièce jointe (max. 2 Mo)|Attach file (2 MB max.)|Datei anhängen (2 MB max.)|Прикачване на файл (2 MB макс.)|附加文件 (最大 2 MB )|ファイルを添付する (最大2MB)|Adjuntar archivo (2 MB máx. )|Anexar arquivo (2 MB máx.)|إرفق ملف (2MB max)
@@ -33,4 +33,5 @@
    <script src="dist/rasterizeHTML/rasterizeHTML.allinone.js"></script>
    <script src="dist/leaflet-locatecontrol/L.Control.Locate.min.js"></script>
    <script src='dist/leaflet-fullscreen/Leaflet.fullscreen.min.js'></script>
    <script src='dist/html2pdf/html2pdf.bundle.min.js'></script>
 </head>
@@ -1,79 +1,136 @@
-function flightTime(a,b){
+function flightTime(a, b) {
-	var days = Math.round((b-a)/86400 * 100) / 100
+  var days = Math.round(((b - a) / 86400) * 100) / 100;
-	var months = Math.round(days/30)
+  var months = Math.round(days / 30);
-	var years = Math.round(months/12)
+  var years = Math.round(months / 12);
-	if (days < 30){
+  if (days < 30) {
-		return ""+days+" "+dictionnary.jours
+    return "" + days + " " + dictionnary.jours;
  } else if (days >= 30 && days < 365) {
    if (months > 1) {
      return "" + months + " " + dictionnary.mois_pluriel;
    } else {
      return "" + months + " " + dictionnary.mois;
    }
-	else if (days >= 30 && days < 365){
+  } else if (days >= 365) {
-		if(months>1){
+    if (years > 1) {
-			return ""+months+" "+dictionnary.mois_pluriel
+      return "" + years + " " + dictionnary.ans;
-		}
+    } else {
-		else{
+      return "" + years + " " + dictionnary.an;
 			return ""+months+" "+dictionnary.mois
 		}
 	}
 	else if (days >= 365){
 		if(years>1){
 			return ""+years+" "+dictionnary.ans
 		}
 		else{
 			return ""+years+" "+dictionnary.an
    }
  }
 }
 //load
 var nPages;
-var nPagesLoaded = 1
+var nPagesLoaded = 1;
-$.post( "getAnthology.php", function(pages) {
+$.post("getAnthology.php", function (pages) {
-	pages = $.parseJSON(pages)
+  pages = $.parseJSON(pages);
-	nPages = Number(pages.nPages)
+  nPages = Number(pages.nPages);
-})
+});
-function displayAnthology(){ // clean and display first page
+function displayAnthology() {
-	$("#anthologyItems").html('')
+  // clean and display first page
-	nPagesLoaded = 1
+  $("#anthologyItems").html("");
-	$.post( "getAnthology.php?page=1", function(result) {
+  nPagesLoaded = 1;
-		results = $.parseJSON(result)
+  $.post("getAnthology.php?page=1", function (result) {
    results = $.parseJSON(result);
    var momentLocale = lang;
-		if (momentLocale == 'zh'){momentLocale = 'zh-cn'} //troubleshot for chinese
+    if (momentLocale == "zh") {
-		moment.locale(momentLocale)
+      momentLocale = "zh-cn";
-		for (var i in results){
+    } //troubleshot for chinese
-			addAnthologyLine(results[i])
+    moment.locale(momentLocale);
    for (var i in results) {
      addAnthologyLine(results[i]);
    }
-	})
+  });
 }
-$( "#anthology" ).scroll(function() {
+$("#anthology").scroll(function () {
-   if($("#anthology").scrollTop() + 700 > $("#anthologyItems").height()){
+  if ($("#anthology").scrollTop() + 700 > $("#anthologyItems").height()) {
-	   if (nPagesLoaded < nPages){
+    if (nPagesLoaded < nPages) {
-		   nPagesLoaded++
+      nPagesLoaded++;
-		    console.log('Loading anthology page '+nPagesLoaded+'/'+nPages)
+      console.log("Loading anthology page " + nPagesLoaded + "/" + nPages);
-		   $.post( "getAnthology.php?page="+nPagesLoaded+"", function(result) {
+      $.post("getAnthology.php?page=" + nPagesLoaded + "", function (result) {
-			results = $.parseJSON(result)
+        results = $.parseJSON(result);
        var momentLocale = lang;
-			if (momentLocale == 'zh'){momentLocale = 'zh-cn'} //troubleshot for chinese
+        if (momentLocale == "zh") {
-			moment.locale(momentLocale)
+          momentLocale = "zh-cn";
-			for (var i in results){
+        } //troubleshot for chinese
-				addAnthologyLine(results[i])
+        moment.locale(momentLocale);
        for (var i in results) {
          addAnthologyLine(results[i]);
        }
-		})
+      });
    }
  }
 });
-function addAnthologyLine(results){
+function addAnthologyLine(results) {
-	if (lang == 'ar'){ // arabic : rtl + add <br>
+  if (lang == "ar") {
    // arabic : rtl + add <br>
    $("#anthologyItems").append(
-		'<small style="float:right">'+dictionnary.origine+': <b>'+results.startName+'</b> &bull; '+dictionnary.destination+': <b>'+results.destName+'</b> &bull; '+dictionnary.date_arrivee+': <b>'+moment(Number(results.deliveryTime)*1000).format('LL')+'</b> &bull; '+dictionnary.temps_de_vol+': <b>'+flightTime(Number(results.startTime),Number(results.deliveryTime))+'</b></small><br><br>'+results.message+'<br><hr><br>'
+      '<small style="float:right">' +
-		)
+        dictionnary.origine +
-	}
+        ": <b>" +
-	else{
+        results.startName +
        "</b> &bull; " +
        dictionnary.destination +
        ": <b>" +
        results.destName +
        "</b> &bull; " +
        dictionnary.date_arrivee +
        ": <b>" +
        moment(Number(results.deliveryTime) * 1000).format("LL") +
        "</b> &bull; " +
        dictionnary.temps_de_vol +
        ": <b>" +
        flightTime(Number(results.startTime), Number(results.deliveryTime)) +
        "</b></small><br><br>" +
        results.message +
        "<br><hr><br>"
    );
  } else {
    $("#anthologyItems").append(
-		'<small>'+dictionnary.origine+': <b>'+results.startName+'</b> &bull; '+dictionnary.destination+': <b>'+results.destName+'</b> &bull; '+dictionnary.date_arrivee+': <b>'+moment(Number(results.deliveryTime)*1000).format('LL')+'</b> &bull; '+dictionnary.temps_de_vol+': <b>'+flightTime(Number(results.startTime),Number(results.deliveryTime))+'</b></small><br><br>'+results.message+'<br><hr><br>'
+      "<small>" +
-		)
+        dictionnary.origine +
        ": <b>" +
        results.startName +
        "</b> &bull; " +
        dictionnary.destination +
        ": <b>" +
        results.destName +
        "</b> &bull; " +
        dictionnary.date_arrivee +
        ": <b>" +
        moment(Number(results.deliveryTime) * 1000).format("LL") +
        "</b> &bull; " +
        dictionnary.temps_de_vol +
        ": <b>" +
        flightTime(Number(results.startTime), Number(results.deliveryTime)) +
        "</b></small><br><br>" +
        results.message +
        "<br><hr><br>"
    );
  }
 }
 $.post("avionJournalier.php", function (result) {
  result = result.replace(/'/g, '"');
  result = $.parseJSON(result);
  nbPlane = Number(result.nAvion);
  console.log(result);
  $("#buttonNewPlane").val(
    "Lancer un avion-poème " + Number(result.nAvion) + "/100"
  );
  $("#buttonNewPlane").on("click", () => {
    window.location.replace("/");
  });
 });
 $(document).ready(function () {
  $.getJSON("lang/" + lang + "", function (s) {
    displayAnthology();
    $("#anthologyTitle").html(s.anthologie);
    $("#anthologyDisclaimer").html(s.suppr_message_public);
    $("#closeAnthologyAbout").html(s.retour_carte);
  });
 });
@@ -299,13 +299,13 @@ a#navbarDropdownLang.nav-link.dropdown-toggle::after {
  content: "\f0fc";
 }
-#donationElt #donationButton .btn.ar:before,
+#donationElt #donationButton .btn.ar:before {
 #donationElt #donationButton .btn.bg:before {
  content: "\f875";
 }
 #donationElt #donationButton .btn.zh:before,
-#donationElt #donationButton .btn.ja:before {
+#donationElt #donationButton .btn.ja:before,
 #donationElt #donationButton .btn.bg:before {
  content: "\f7a0";
  font-size: 13px;
  font-weight: normal;
@@ -336,3 +336,50 @@ a#navbarDropdownLang.nav-link.dropdown-toggle::after {
    text-align: center;
  }
 }
 .custom-file-label {
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  padding-right: 9em;
  white-space: nowrap;
 }
 .custom-file-label::after {
  content: attr(data-after);
 }
 #closePlane {
  position: fixed;
  top: 70px;
  right: 40px;
  visibility: hidden;
  opacity: 0;
  cursor: pointer;
  z-index: 10000;
 }
 #closePlane:before {
  content: "\f00d";
  font-family: "Font Awesome 5 Pro";
  color: white;
  font-size: 3em;
 }
 #downloadPlaneMessage {
  position: fixed;
  z-index: 10000;
  bottom: 5%;
  left: 50%;
  transform: translateX(-50%);
  color: var(--primary);
  background-color: white;
  opacity: 0;
  visibility: hidden;
 }
 #downloadPlaneMessage:before {
  content: "\f019";
  font-family: "Font Awesome 5 Pro";
  color: var(--primary);
  margin-right: 10px;
 }
@@ -1,25 +1,43 @@
-var validExpeMail = false
+var validExpeMail = false;
-var validExpeLoc = false  //turned to true in geocoder.js
+var validExpeLoc = false; //turned to true in geocoder.js
-var validDestMail = false
+var validDestMail = false;
-var validDestLoc = false  //turned to true in geocoder.js
+var validDestLoc = false; //turned to true in geocoder.js
-function validateEmail(email) {  //from https://stackoverflow.com/questions/46155/how-to-validate-an-email-address-in-javascript
+function validateEmail(email) {
-    const re = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+  //from https://stackoverflow.com/questions/46155/how-to-validate-an-email-address-in-javascript
  const re =
    /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
  return re.test(String(email).toLowerCase());
 }
-$("#expeMail").change(function() {
+$("#expeMail").change(function () {
-	validExpeMail = validateEmail($("#expeMail").val())
+  validExpeMail = validateEmail($("#expeMail").val());
-	checkFormValid()
+  checkFormValid();
-})
+});
-$("#destMail").change(function() {
+$("#destMail").change(function () {
-	validDestMail = validateEmail($("#destMail").val())
+  validDestMail = validateEmail($("#destMail").val());
-	checkFormValid()
+  checkFormValid();
-})
+});
-function checkFormValid(){
+document
-	if(validExpeMail && validExpeLoc && validDestMail && validDestLoc){
+  .querySelector(".custom-file-input")
-		$('#sendNewPlane').prop("disabled", false)
+  .addEventListener("change", function (e) {
    const file = e.target.files[0];
    const fileName = file.name;
    var nextSibling = e.target.nextElementSibling;
    nextSibling.innerText = fileName;
    const filesize = (file.size / 1024 / 1024).toFixed(4); // MB
    if (filesize >= 2.2) {
      e.target.classList.add("is-invalid");
    } else {
      e.target.classList.remove("is-invalid");
    }
  });
 function checkFormValid() {
  if (validExpeMail && validExpeLoc && validDestMail && validDestLoc) {
    $("#sendNewPlane").prop("disabled", false);
  }
 }
@@ -1,146 +1,168 @@
 var loader = new PIXI.Loader();
-var colors = ['66FF00','FF5555','FFE419','2A7FFF','BC5FD3','C8AB37','ECECEC','FF6600'];
+var colors = [
-for (var i in colors){
+  "66FF00",
-	loader.add('marker'+colors[i]+'', 'src/img/plane-'+colors[i]+'.png');
+  "FF5555",
  "FFE419",
  "2A7FFF",
  "BC5FD3",
  "C8AB37",
  "ECECEC",
  "FF6600",
 ];
 for (var i in colors) {
  loader.add("marker" + colors[i] + "", "src/img/plane-" + colors[i] + ".png");
 }
 //global variable
-var nbPlane = 0
+var nbPlane = 0;
 loader.add('shadow', 'src/img/shadow.png');
 loader.load(function(loader, resources) {
 loader.add("shadow", "src/img/shadow.png");
 loader.load(function (loader, resources) {
  var pixiContainer = new PIXI.Container();
-	var map = L.map('map',{ 
+  var map = L.map("map", {
    zoomControl: false,
-		minZoom:2,
+    minZoom: 2,
    maxZoom: 16,
    maxBounds: [
      [-Infinity, -360],
-			[Infinity, 360]
+      [Infinity, 360],
    ],
    //worldCopyJump: true,
-		attributionControl: false
+    attributionControl: false,
-	})
+  });
  //zoom controls
-	L.control.zoom({position: 'bottomright'}).addTo(map);
+  L.control.zoom({ position: "bottomright" }).addTo(map);
  //Locate user
-	L.control.locate({position: 'bottomright'}).addTo(map);
+  L.control.locate({ position: "bottomright" }).addTo(map);
  //fullscreen
-	map.addControl(new L.Control.Fullscreen({position: 'bottomright'}));
+  map.addControl(new L.Control.Fullscreen({ position: "bottomright" }));
  // Licence Icon
  L.Control.Watermark = L.Control.extend({
-		onAdd: function(map) {
+    onAdd: function (map) {
-			var img = L.DomUtil.create('img');
+      var img = L.DomUtil.create("img");
-			img.src = 'src/img/licence.svg';
+      img.src = "src/img/licence.svg";
-			img.style.width = '100px';
+      img.style.width = "100px";
      return img;
-		}
+    },
  });
-	L.control.watermark = function(opts) {
+  L.control.watermark = function (opts) {
    return new L.Control.Watermark(opts);
-	}
+  };
-	L.control.watermark({ position: 'bottomleft' }).addTo(map);
+  L.control.watermark({ position: "bottomleft" }).addTo(map);
  //scale
  L.control.scale().addTo(map);
  //disabling send plane button if alreada 100 planes sent the current day
-	
+  $.post("avionJournalier.php", function (result) {
 	$.post("avionJournalier.php", function(result) {
    result = result.replace(/'/g, '"');
-		result = $.parseJSON(result)
+    result = $.parseJSON(result);
-		nbPlane = Number(result.nAvion)
+    nbPlane = Number(result.nAvion);
-		$("#buttonNewPlane").val("Lancer un avion-poème "+Number(result.nAvion)+"/100")
+    $("#buttonNewPlane").val(
-		if (nbPlane > 99){
+      "Lancer un avion-poème " + Number(result.nAvion) + "/100"
-			$("#buttonNewPlane").prop("disabled",true);
+    );
    if (nbPlane > 99) {
      $("#buttonNewPlane").prop("disabled", true);
    } else {
    }
-		else{
+    translateUI(lang);
-			
+  });
 		}
 		translateUI(lang)
 	})
  //background
-	L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
+  L.tileLayer(
-		attribution: '',
+    "https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}",
    {
      attribution: "",
      //minZoom:8,
      maxZoom: 16,
-	}).addTo(map);
+    }
  ).addTo(map);
  //adding terminator
-	var terminator = L.terminator()
+  var terminator = L.terminator().addTo(map);
-	.addTo(map);
+  setInterval(function () {
 	 setInterval(function() {
    terminator.setTime();
  }, 1000);
  //center map on sun by default
-	function centerOnSun(){
+  function centerOnSun() {
-		var equator = turf.lineString([[-1000, 0], [1000, 0]])
+    var equator = turf.lineString([
      [-1000, 0],
      [1000, 0],
    ]);
    var intersects = turf.lineIntersect(equator, terminator.toGeoJSON());
    //console.log(intersects)
-		var lonCenter = ((intersects.features[1].geometry.coordinates[0])+(intersects.features[2].geometry.coordinates[0]))/2
+    var lonCenter =
      (intersects.features[1].geometry.coordinates[0] +
        intersects.features[2].geometry.coordinates[0]) /
      2;
    //console.log(lonCenter)
-		return lonCenter
+    return lonCenter;
  }
-	map.setView([30,0], 2);
+  map.setView([30, 0], 2);
  //could layer from GBIS NASA  - always 1 day of delay
-	var twoDaysAgo = moment(new Date()).subtract(2, "days").format('YYYY-MM-DD')
+  var twoDaysAgo = moment(new Date()).subtract(2, "days").format("YYYY-MM-DD");
-	L.tileLayer('https://map1.vis.earthdata.nasa.gov/wmts-webmerc/VIIRS_SNPP_CorrectedReflectance_TrueColor/default/'+twoDaysAgo+'/GoogleMapsCompatible_Level9/{z}/{y}/{x}.jpg', {
+  L.tileLayer(
-		attribution: '',
+    "https://map1.vis.earthdata.nasa.gov/wmts-webmerc/VIIRS_SNPP_CorrectedReflectance_TrueColor/default/" +
      twoDaysAgo +
      "/GoogleMapsCompatible_Level9/{z}/{y}/{x}.jpg",
    {
      attribution: "",
      maxZoom: 8,
-		opacity:0.4
+      opacity: 0.4,
-	})
+    }
-	.addTo(map);
+  ).addTo(map);
  //Bluring the terminator | Source: https://stackoverflow.com/questions/28235792/leaflet-polygon-with-fuzzy-outline
  var svg = map.getPanes().overlayPane.firstChild,
-	svgFilter = document.createElementNS('http://www.w3.org/2000/svg', 'filter'),
+    svgFilter = document.createElementNS(
-    svgBlur = document.createElementNS('http://www.w3.org/2000/svg', 'feGaussianBlur');
+      "http://www.w3.org/2000/svg",
-	svgFilter.setAttribute('id', 'blur');
+      "filter"
-	svgFilter.setAttribute('x', '-100%');
+    ),
-	svgFilter.setAttribute('y', '-100%');
+    svgBlur = document.createElementNS(
-	svgFilter.setAttribute('width', '500%');
+      "http://www.w3.org/2000/svg",
-	svgFilter.setAttribute('height', '500%');
+      "feGaussianBlur"
-	svgBlur.setAttribute('stdDeviation', 15);
+    );
  svgFilter.setAttribute("id", "blur");
  svgFilter.setAttribute("x", "-100%");
  svgFilter.setAttribute("y", "-100%");
  svgFilter.setAttribute("width", "500%");
  svgFilter.setAttribute("height", "500%");
  svgBlur.setAttribute("stdDeviation", 15);
  svgFilter.appendChild(svgBlur);
  svg.appendChild(svgFilter);
-	terminator._path.setAttribute('filter', 'url(#blur)'); 
+  terminator._path.setAttribute("filter", "url(#blur)");
  //geojson for arclines
  //travel
  var arcTravelStyle = {
-		"color": "#00ff00",
+    color: "#00ff00",
-		"weight": 2.5,
+    weight: 2.5,
-		"dashArray": "10 5",
+    dashArray: "10 5",
-		"opacity": 0.65
+    opacity: 0.65,
  };
-	var arcTravel = L.geoJSON([],{style: arcTravelStyle}).addTo(map);
+  var arcTravel = L.geoJSON([], { style: arcTravelStyle }).addTo(map);
  //travelled
  var arcTravelledStyle = {
-		"color": "#00ff00",
+    color: "#00ff00",
-		"weight": 2.5,
+    weight: 2.5,
-		"opacity": 0.65
+    opacity: 0.65,
  };
-	var arcTravelled = L.geoJSON([],{style: arcTravelledStyle}).addTo(map);
+  var arcTravelled = L.geoJSON([], { style: arcTravelledStyle }).addTo(map);
-	var pulsatingMarker = L.layerGroup([]).addTo(map) 	
+  var pulsatingMarker = L.layerGroup([]).addTo(map);
-	var originMarker = L.layerGroup([]).addTo(map) 	
+  var originMarker = L.layerGroup([]).addTo(map);
  var firstDraw = true;
  var prevZoom;
-    var pixiOverlay = L.pixiOverlay(function(utils, event) {
+  var pixiOverlay = L.pixiOverlay(function (utils, event) {
    var zoom = utils.getMap().getZoom();
    var container = utils.getContainer();
    var renderer = utils.getRenderer();
@@ -148,73 +170,90 @@ loader.load(function(loader, resources) {
    var scale = utils.getScale();
    if (firstDraw) {
      //get planes
-			$.post( "getCurrentPlanes.php", function(result) {
+      $.post("getCurrentPlanes.php", function (result) {
        // console.log(result)
-			  var planes = $.parseJSON(result)
+        var planes = $.parseJSON(result);
-			  console.log(planes)
+        console.log(planes);
-			  function formatResults(data){
+        function formatResults(data) {
-				  data.deliveryTime = Number(data.deliveryTime)*1000
+          data.deliveryTime = Number(data.deliveryTime) * 1000;
-				  data.startTime = Number(data.startTime)*1000
+          data.startTime = Number(data.startTime) * 1000;
-				  return data
+          return data;
        }
-			  function displayPlane(data){
+        function displayPlane(data) {
-					var line = turf.greatCircle(turf.point([Number(data.startLon),Number(data.startLat)]), turf.point([Number(data.destLon),Number(data.destLat)]),{offset:20})
+          var line = turf.greatCircle(
-					var lineDistance = turf.length(line);
+            turf.point([Number(data.startLon), Number(data.startLat)]),
-					var dateStart = moment(data.startTime)
+            turf.point([Number(data.destLon), Number(data.destLat)]),
-					var dateEnd = moment(data.deliveryTime)
+            { offset: 20 }
 					var dateNow = moment(new Date())
 					var totalSeconds = dateEnd.diff(dateStart,'seconds');
 					var travelledSeconds = dateNow.diff(dateStart,'seconds')
 					var travelRatio = travelledSeconds/totalSeconds
 					var travelledDistance = lineDistance*travelRatio  // getting the travelled distance
 					var segment;
 					if(line.geometry.type == "MultiLineString"){ // if the arc is cutting the dateline, well it's a mess.
 						var l1 = turf.lineString(line.geometry.coordinates[0]) // creating a line from first segment
 						var l2 = turf.lineString(line.geometry.coordinates[1]) // creating a line from second segment
 						var l1Length = turf.length(l1) // calculating length of first segment
 						if (travelledDistance < l1Length){ // if the travelled distance is inferior to segment 1 line, the point is somewhere in it
 							segment = l1
 							data.position = 1
 						}
 						else{
 							segment = l2  // otherwise on segment 2
 							data.position = 2
 							travelledDistance = Number(travelledDistance)-Number(l1Length) // we remove the travel distance done in s1
 						}
 					}
 					else{
 						segment = line
 						data.position = 0						
 					}
 					var currentPosition = turf.along(segment, travelledDistance,{units: 'kilometers'})
 					if(currentPosition.geometry.coordinates[0] < -180){currentPosition.geometry.coordinates[0] = currentPosition.geometry.coordinates[0]+360}
 					if(currentPosition.geometry.coordinates[0] > 180){currentPosition.geometry.coordinates[0] = currentPosition.geometry.coordinates[0]-Number(360)}
 				    //calculating bearing based on two points, one just before and one just after
 					var positionBefore = turf.along(segment, (travelledDistance)-0.00001,{units: 'kilometers'})
 					var positionAfter = turf.along(segment, (travelledDistance)+0.00001,{units: 'kilometers'})
 					var rotation = turf.bearing(
 						positionBefore,
 						positionAfter
          );
          var lineDistance = turf.length(line);
          var dateStart = moment(data.startTime);
          var dateEnd = moment(data.deliveryTime);
          var dateNow = moment(new Date());
          var totalSeconds = dateEnd.diff(dateStart, "seconds");
          var travelledSeconds = dateNow.diff(dateStart, "seconds");
          var travelRatio = travelledSeconds / totalSeconds;
          var travelledDistance = lineDistance * travelRatio; // getting the travelled distance
          var segment;
          if (line.geometry.type == "MultiLineString") {
            // if the arc is cutting the dateline, well it's a mess.
            var l1 = turf.lineString(line.geometry.coordinates[0]); // creating a line from first segment
            var l2 = turf.lineString(line.geometry.coordinates[1]); // creating a line from second segment
            var l1Length = turf.length(l1); // calculating length of first segment
            if (travelledDistance < l1Length) {
              // if the travelled distance is inferior to segment 1 line, the point is somewhere in it
              segment = l1;
              data.position = 1;
            } else {
              segment = l2; // otherwise on segment 2
              data.position = 2;
              travelledDistance = Number(travelledDistance) - Number(l1Length); // we remove the travel distance done in s1
            }
          } else {
            segment = line;
            data.position = 0;
          }
          var currentPosition = turf.along(segment, travelledDistance, {
            units: "kilometers",
          });
          if (currentPosition.geometry.coordinates[0] < -180) {
            currentPosition.geometry.coordinates[0] =
              currentPosition.geometry.coordinates[0] + 360;
          }
          if (currentPosition.geometry.coordinates[0] > 180) {
            currentPosition.geometry.coordinates[0] =
              currentPosition.geometry.coordinates[0] - Number(360);
          }
          //calculating bearing based on two points, one just before and one just after
          var positionBefore = turf.along(
            segment,
            travelledDistance - 0.00001,
            { units: "kilometers" }
          );
          var positionAfter = turf.along(segment, travelledDistance + 0.00001, {
            units: "kilometers",
          });
          var rotation = turf.bearing(positionBefore, positionAfter);
          //plane
-					var iconColor = 'marker'+data.color
+          var iconColor = "marker" + data.color;
          var markerTexture = resources[iconColor].texture;
          var marker = new PIXI.Sprite(markerTexture);
          marker.anchor.set(0.5, 0.5);
-					var markerCoords = project([currentPosition.geometry.coordinates[1],currentPosition.geometry.coordinates[0]]);
+          var markerCoords = project([
            currentPosition.geometry.coordinates[1],
            currentPosition.geometry.coordinates[0],
          ]);
          marker.x = markerCoords.x;
          marker.y = markerCoords.y;
          marker.angle = rotation;
          marker.scale.set(5);
          marker.interactive = true;
-					marker.cursor = 'pointer'
+          marker.cursor = "pointer";
-					marker.data  = data
+          marker.data = data;
-					marker.data.line = line
+          marker.data.line = line;
-					marker.data.currentPosition = currentPosition
+          marker.data.currentPosition = currentPosition;
          //shadow
          var shadowTexture = resources.shadow.texture;
@@ -224,72 +263,96 @@ loader.load(function(loader, resources) {
          shadow.y = markerCoords.y + 0.5;
          shadow.angle = rotation;
          shadow.scale.set(0.00025);
-					shadow.alpha = 0.3
+          shadow.alpha = 0.3;
-					shadow.visible = false
+          shadow.visible = false;
          //popup
-					marker.popup = L.popup({className: 'pixi-popup'})
+          marker.popup = L.popup({ className: "pixi-popup" });
          pixiContainer.addChild(shadow);
          pixiContainer.addChild(marker);
-					renderer.render(container)	
+          renderer.render(container);
          //adapting scale based on zoom level. Max zoom = writting visible
-					map.on('zoomend', function() {
+          map.on("zoomend", function () {
-						marker.scale.set((1/(utils.getScale(map.getZoom())*20))+(Math.pow(map.getZoom(),2)/100*2*(1/(utils.getScale(map.getZoom())*20))))
+            marker.scale.set(
-						if(map.getZoom() == 16){
+              1 / (utils.getScale(map.getZoom()) * 20) +
-							shadow.visible = true
+                (Math.pow(map.getZoom(), 2) / 100) *
-						}
+                  2 *
-						else{
+                  (1 / (utils.getScale(map.getZoom()) * 20))
-							shadow.visible = false
+            );
            if (map.getZoom() == 16) {
              shadow.visible = true;
            } else {
              shadow.visible = false;
            }
          });
          //animating moving plane
-					setInterval(function() {
+          setInterval(function () {
            animate();
-					}, 1000)
+          }, 1000);
          function animate() {
-				      if (map.getZoom()	> 12){ // we animate only starting zoom 12
+            if (map.getZoom() > 12) {
-						  var bounds = map.getBounds()
+              // we animate only starting zoom 12
-						  var bbox = [bounds._southWest.lng, bounds._southWest.lat, bounds._northEast.lng, bounds._northEast.lat];  
+              var bounds = map.getBounds();
              var bbox = [
                bounds._southWest.lng,
                bounds._southWest.lat,
                bounds._northEast.lng,
                bounds._northEast.lat,
              ];
              var extentPoly = turf.bboxPolygon(bbox);
-						  var planeInExtent = turf.booleanWithin(marker.data.currentPosition, extentPoly);
+              var planeInExtent = turf.booleanWithin(
-							  if(planeInExtent == true){ // we animate only the planes in map extent 
+                marker.data.currentPosition,
-							  var dateNow = moment(new Date())
+                extentPoly
-							  var totalSeconds = dateEnd.diff(dateStart,'seconds');
+              );
-							  var travelledSeconds = dateNow.diff(dateStart,'seconds')
+              if (planeInExtent == true) {
-							  var travelRatio = travelledSeconds/totalSeconds
+                // we animate only the planes in map extent
                var dateNow = moment(new Date());
                var totalSeconds = dateEnd.diff(dateStart, "seconds");
                var travelledSeconds = dateNow.diff(dateStart, "seconds");
                var travelRatio = travelledSeconds / totalSeconds;
                var lineDistance = turf.length(line);
                var segment;
-							  var travelledDistance = lineDistance*travelRatio  // getting the travelled distance
+                var travelledDistance = lineDistance * travelRatio; // getting the travelled distance
-								if(line.geometry.type == "MultiLineString"){ // if the arc is cutting the dateline
+                if (line.geometry.type == "MultiLineString") {
-									var l1 = turf.lineString(line.geometry.coordinates[0]) // creating a line from first segment
+                  // if the arc is cutting the dateline
-									var l2 = turf.lineString(line.geometry.coordinates[1]) // creating a line from second segment
+                  var l1 = turf.lineString(line.geometry.coordinates[0]); // creating a line from first segment
-									var l1Length = turf.length(l1) // calculating length of first segment
+                  var l2 = turf.lineString(line.geometry.coordinates[1]); // creating a line from second segment
-									if (travelledDistance < l1Length){ // if the travelled distance is inferior to segment 1 line, the point is somewhere in it
+                  var l1Length = turf.length(l1); // calculating length of first segment
-										segment = l1
+                  if (travelledDistance < l1Length) {
-										marker.data.position = 1  // we store it, usefull for popup event
+                    // if the travelled distance is inferior to segment 1 line, the point is somewhere in it
                    segment = l1;
                    marker.data.position = 1; // we store it, usefull for popup event
                  } else {
                    segment = l2; // otherwise on segment 2
                    marker.data.position = 2;
                    travelledDistance =
                      Number(travelledDistance) - Number(l1Length); // we remove the travel distance done in s1
                  }
-									else{
+                } else {
-										segment = l2  // otherwise on segment 2
+                  segment = line;
 										marker.data.position = 2
 										travelledDistance = Number(travelledDistance)-Number(l1Length) // we remove the travel distance done in s1
                }
-								}
+                var currentPosition = turf.along(segment, travelledDistance, {
-								else{
+                  units: "kilometers",
-									segment = line	
+                });
 								}
 							  var currentPosition = turf.along(segment, travelledDistance,{units: 'kilometers'})
                //troubleshooting extreme lons
-							  if(currentPosition.geometry.coordinates[0] < -180){currentPosition.geometry.coordinates[0] = currentPosition.geometry.coordinates[0]+360}
+                if (currentPosition.geometry.coordinates[0] < -180) {
-							  if(currentPosition.geometry.coordinates[0] > 180){currentPosition.geometry.coordinates[0] = currentPosition.geometry.coordinates[0]-Number(360)}
+                  currentPosition.geometry.coordinates[0] =
-							  marker.data.currentPosition = currentPosition
+                    currentPosition.geometry.coordinates[0] + 360;
-							  var markerCoords = project([currentPosition.geometry.coordinates[1],currentPosition.geometry.coordinates[0]]);
+                }
                if (currentPosition.geometry.coordinates[0] > 180) {
                  currentPosition.geometry.coordinates[0] =
                    currentPosition.geometry.coordinates[0] - Number(360);
                }
                marker.data.currentPosition = currentPosition;
                var markerCoords = project([
                  currentPosition.geometry.coordinates[1],
                  currentPosition.geometry.coordinates[0],
                ]);
                marker.x = markerCoords.x;
                marker.y = markerCoords.y;
                shadow.x = markerCoords.x;
@@ -301,159 +364,319 @@ loader.load(function(loader, resources) {
          //if parameter in URL, zoom on it
          var queryString = window.location.search;
-					queryString = queryString.split('=')[1]
+          queryString = queryString.split("=")[1];
-					if(Number(queryString)==data.uid){
+          if (Number(queryString) == data.uid) {
-						setTimeout(
+            $("#back").attr("src", "src/img/back-" + data.color + ".jpg");
-						  function() 
+            html = data.message;
-						  {
+            var canvas1 = document.getElementById("blankCanvas1");
-								map.setView([data.currentPosition.geometry.coordinates[1],data.currentPosition.geometry.coordinates[0]], 15);
+            rasterizeHTML
-								openPopup(marker)
+              .drawHTML(html, canvas1, { zoom: 0.7 })
              .then(function success(renderResult) {
                var canvas2 = document.getElementById("blankCanvas2");
                var ctx = canvas2.getContext("2d");
                ctx.fillStyle = "#" + data.color;
                ctx.fillRect(0, 0, 400, 400);
                ctx.drawImage(canvas1, 0, 0, 400, 400);
                ctx.font = "9px Courier";
                $("#front").attr(
                  "src",
                  document.getElementById("blankCanvas2").toDataURL()
                );
                $("#canvas3d").css("opacity", 0);
                $("#canvas3d").css("display", "block");
                animePlane();
                setTimeout(function () {
                  $("#canvas3d").css("opacity", 1);
                }, 0);
                const startDate = new Date(data.startTime);
                const deliveryDate = new Date(data.deliveryTime);
                const diffTime = Math.abs(deliveryDate - startDate);
                const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
                setTimeout(function () {
                  $("#closePlane").css("opacity", 1);
                  $("#closePlane").css("visibility", "visible");
                  $("#downloadPlaneMessage").css("opacity", 1);
                  $("#downloadPlaneMessage").css("visibility", "visible");
                  $("#closePlane").on("click", function () {
                    $("#canvas3d").css("display", "none");
                    $(this).css("display", "none");
                  });
                  $("#downloadPlaneMessage").on("click", function () {
                    const htmlRender =
                      "<div>" +
                      "<div><u>Métadonnées du message :</u></div>" +
                      "<ul>" +
                      "<li>" +
                      data.startName +
                      " - " +
                      data.destName +
                      "</li>" +
                      "<li>" +
                      data.expeMail +
                      " - " +
                      data.destMail +
                      "</li>" +
                      "<li>" +
                      diffDays +
                      " days" +
                      "</li>" +
                      "<li>" +
                      moment(deliveryDate).format("DD/MM/YYYY") +
                      "</li>" +
                      "</ul><br>" +
                      "<div><u>Champs message :</u></div><br>" +
                      html +
                      "</div>";
                    const opt = {
                      margin: 10,
                      filename: "peome.pdf",
                      image: { type: "jpeg", quality: 1 },
                      html2canvas: {
                        scale: 2,
                        removeContainer: false,
                        logging: true,
                      },
                      pagebreak: { avoid: "img" },
                    };
                    html2pdf().set(opt).from(htmlRender).save();
                  });
                }, 5000);
              });
            setTimeout(function () {
              map.setView(
                [
                  data.currentPosition.geometry.coordinates[1],
                  data.currentPosition.geometry.coordinates[0],
                ],
                15
              );
              openPopup(marker);
            }, 100);
          }
        }
-				for (var i in planes){
+        for (var i in planes) {
-					displayPlane(formatResults(planes[i]),0)		
+          displayPlane(formatResults(planes[i]), 0);
        }
      });
-			function openPopup(target){
+      function openPopup(target) {
        //drawing arcs
-					arcTravel.clearLayers()
+        arcTravel.clearLayers();
-					arcTravelled.clearLayers()
+        arcTravelled.clearLayers();
-					arcTravelStyle.color = '#'+target.data.color
+        arcTravelStyle.color = "#" + target.data.color;
-					arcTravelledStyle.color = '#'+target.data.color
+        arcTravelledStyle.color = "#" + target.data.color;
-					var travel = target.data.line
+        var travel = target.data.line;
-					var start = turf.point([Number(target.data.startLon),Number(target.data.startLat)])
+        var start = turf.point([
-					var current =  target.data.currentPosition
+          Number(target.data.startLon),
-					var end = turf.point([Number(target.data.destLon),Number(target.data.destLat)])
+          Number(target.data.startLat),
        ]);
        var current = target.data.currentPosition;
        var end = turf.point([
          Number(target.data.destLon),
          Number(target.data.destLat),
        ]);
        // for linestrings
-					if(travel.geometry.type == "LineString"){ 
+        if (travel.geometry.type == "LineString") {
          var sliced1 = turf.lineSlice(start, current, travel);
          var sliced2 = turf.lineSlice(current, end, travel);
          arcTravelled.addData(sliced1);
          arcTravel.addData(sliced2);
        }
        // we create a copy of lines crossing the datetime
-					function createCopy(c){
+        function createCopy(c) {
-						for (var i in c.geometry.coordinates){
+          for (var i in c.geometry.coordinates) {
-							if (c.geometry.coordinates[i][0] > 0){
+            if (c.geometry.coordinates[i][0] > 0) {
-								c.geometry.coordinates[i][0] = c.geometry.coordinates[i][0] - Number(360)
+              c.geometry.coordinates[i][0] =
-							}
+                c.geometry.coordinates[i][0] - Number(360);
-							else{
+            } else {
-								c.geometry.coordinates[i][0] = c.geometry.coordinates[i][0] + Number(360)
+              c.geometry.coordinates[i][0] =
                c.geometry.coordinates[i][0] + Number(360);
            }
          }
-						return c
+          return c;
        }
        //for multilinetrings
-					if(travel.geometry.type == "MultiLineString"){
+        if (travel.geometry.type == "MultiLineString") {
-						var l1 = turf.lineString(travel.geometry.coordinates[0]) // creating a line from first segment
+          var l1 = turf.lineString(travel.geometry.coordinates[0]); // creating a line from first segment
-						var l2 = turf.lineString(travel.geometry.coordinates[1]) // creating a line from second segment
+          var l2 = turf.lineString(travel.geometry.coordinates[1]); // creating a line from second segment
-						if(target.data.position == 1){
+          if (target.data.position == 1) {
            var sliced1 = turf.lineSlice(start, current, l1);
-							var sliced2 = turf.lineSlice(current, turf.point(l1.geometry.coordinates[l1.geometry.coordinates.length-1]), l1);
+            var sliced2 = turf.lineSlice(
              current,
              turf.point(
                l1.geometry.coordinates[l1.geometry.coordinates.length - 1]
              ),
              l1
            );
            arcTravelled.addData(sliced1);
            arcTravel.addData(sliced2);
            arcTravel.addData(l2);
-							
+          } else if (target.data.position == 2) {
-						}
+            var sliced1 = turf.lineSlice(
-						else if(target.data.position == 2){
+              turf.point(l2.geometry.coordinates[0]),
-							var sliced1 = turf.lineSlice(turf.point(l2.geometry.coordinates[0]), current, l2);
+              current,
              l2
            );
            var sliced2 = turf.lineSlice(current, end, l2);
            arcTravelled.addData(l1);
            arcTravelled.addData(sliced1);
            arcTravel.addData(sliced2);
          }
-						var travelledGeoJSON = arcTravelled.toGeoJSON()
+          var travelledGeoJSON = arcTravelled.toGeoJSON();
-						for (var i in travelledGeoJSON.features){
+          for (var i in travelledGeoJSON.features) {
-							arcTravelled.addData(createCopy(travelledGeoJSON.features[i]))
+            arcTravelled.addData(createCopy(travelledGeoJSON.features[i]));
          }
-						var travelGeoJSON = arcTravel.toGeoJSON()
+          var travelGeoJSON = arcTravel.toGeoJSON();
-						for (var i in travelGeoJSON.features){
+          for (var i in travelGeoJSON.features) {
-							arcTravel.addData(createCopy(travelGeoJSON.features[i]))
+            arcTravel.addData(createCopy(travelGeoJSON.features[i]));
          }
        }
        //add pulsating marker on destination;
-					pulsatingMarker.clearLayers()
+        pulsatingMarker.clearLayers();
        var pulseIcon = L.divIcon({
-					  className: 'pulse-icon', //empty class to overwrite leaflet defaults
+          className: "pulse-icon", //empty class to overwrite leaflet defaults
-					  html: '<div class="pulse-icon-anim" style="border-color:#'+target.data.color+'"></div>',
+          html:
-					  iconSize: [22,22]
+            '<div class="pulse-icon-anim" style="border-color:#' +
            target.data.color +
            '"></div>',
          iconSize: [22, 22],
        });
-					var endCoordo = [Number(target.data.destLat),Number(target.data.destLon)]
+        var endCoordo = [
-					pulsatingMarker.addLayer(new L.marker(endCoordo, {icon: pulseIcon}));
+          Number(target.data.destLat),
-					if(travel.geometry.type == "MultiLineString"){ //if arc cross dateline, we multiply the marker
+          Number(target.data.destLon),
-						pulsatingMarker.addLayer(new L.marker([endCoordo[0],endCoordo[1]-Number(360)], {icon: pulseIcon}));
+        ];
-						pulsatingMarker.addLayer(new L.marker([endCoordo[0],endCoordo[1]+Number(360)], {icon: pulseIcon}));
+        pulsatingMarker.addLayer(new L.marker(endCoordo, { icon: pulseIcon }));
        if (travel.geometry.type == "MultiLineString") {
          //if arc cross dateline, we multiply the marker
          pulsatingMarker.addLayer(
            new L.marker([endCoordo[0], endCoordo[1] - Number(360)], {
              icon: pulseIcon,
            })
          );
          pulsatingMarker.addLayer(
            new L.marker([endCoordo[0], endCoordo[1] + Number(360)], {
              icon: pulseIcon,
            })
          );
        }
        //adding static marker on origin
-					originMarker.clearLayers()
+        originMarker.clearLayers();
-					var startCoordo = [Number(target.data.startLat),Number(target.data.startLon)]
+        var startCoordo = [
-					originMarker.addLayer(new L.circleMarker(startCoordo, {radius: 6,opacity:0.7, weight:2,color:'#'+target.data.color}));
+          Number(target.data.startLat),
-					if(travel.geometry.type == "MultiLineString"){ //if arc cross dateline, we multiply the marker
+          Number(target.data.startLon),
-						originMarker.addLayer(new L.circleMarker([startCoordo[0],startCoordo[1]-Number(360)], {radius: 6,opacity:0.7,weight:2,color:'#'+target.data.color}));
+        ];
-						originMarker.addLayer(new L.circleMarker([startCoordo[0],startCoordo[1]+Number(360)], {radius: 6,opacity:0.7,color:'#'+target.data.color}));
+        originMarker.addLayer(
          new L.circleMarker(startCoordo, {
            radius: 6,
            opacity: 0.7,
            weight: 2,
            color: "#" + target.data.color,
          })
        );
        if (travel.geometry.type == "MultiLineString") {
          //if arc cross dateline, we multiply the marker
          originMarker.addLayer(
            new L.circleMarker([startCoordo[0], startCoordo[1] - Number(360)], {
              radius: 6,
              opacity: 0.7,
              weight: 2,
              color: "#" + target.data.color,
            })
          );
          originMarker.addLayer(
            new L.circleMarker([startCoordo[0], startCoordo[1] + Number(360)], {
              radius: 6,
              opacity: 0.7,
              color: "#" + target.data.color,
            })
          );
        }
        //popup
        var momentLocale = lang;
-					if (momentLocale == 'zh'){momentLocale = 'zh-cn'} //troubleshot for chinese
+        if (momentLocale == "zh") {
-					moment.locale(momentLocale)
+          momentLocale = "zh-cn";
        } //troubleshot for chinese
        moment.locale(momentLocale);
-					target.popup.setLatLng([target.data.currentPosition.geometry.coordinates[1],target.data.currentPosition.geometry.coordinates[0]])
+        target.popup.setLatLng([
          target.data.currentPosition.geometry.coordinates[1],
          target.data.currentPosition.geometry.coordinates[0],
        ]);
        //arabic popup
-					if(lang=="ar"){
+        if (lang == "ar") {
-						target.popup.setContent('<table><tbody><tr><th style="text-align:center">'+target.data.startName+'</th><th>&nbsp;<i class="fas fa-plane"></i>&nbsp;</th><th style="text-align:center">'+target.data.destName+'</th></tr><tr><th style="text-align:center"><small>'+moment(target.data.startTime).fromNow()+'</small></th><th></th><th style="text-align:center"><small>'+moment(target.data.deliveryTime).fromNow()+'</small></th></tr></tbody></table>')
+          target.popup.setContent(
            '<table><tbody><tr><th style="text-align:center">' +
              target.data.startName +
              '</th><th>&nbsp;<i class="fas fa-plane"></i>&nbsp;</th><th style="text-align:center">' +
              target.data.destName +
              '</th></tr><tr><th style="text-align:center"><small>' +
              moment(target.data.startTime).fromNow() +
              '</small></th><th></th><th style="text-align:center"><small>' +
              moment(target.data.deliveryTime).fromNow() +
              "</small></th></tr></tbody></table>"
          );
        }
        //other languages
-					else{
+        else {
-						target.popup.setContent('<table><tbody><tr><th style="text-align:center">'+target.data.startName+'</th><th>&nbsp;<i class="fas fa-plane"></i>&nbsp;</th><th style="text-align:center">'+target.data.destName+'</th></tr><tr><th style="text-align:center"><small>'+moment(target.data.startTime).fromNow()+'</small></th><th></th><th style="text-align:center"><small>'+moment(target.data.deliveryTime).fromNow()+'</small></th></tr></tbody></table>')
+          target.popup.setContent(
            '<table><tbody><tr><th style="text-align:center">' +
              target.data.startName +
              '</th><th>&nbsp;<i class="fas fa-plane"></i>&nbsp;</th><th style="text-align:center">' +
              target.data.destName +
              '</th></tr><tr><th style="text-align:center"><small>' +
              moment(target.data.startTime).fromNow() +
              '</small></th><th></th><th style="text-align:center"><small>' +
              moment(target.data.deliveryTime).fromNow() +
              "</small></th></tr></tbody></table>"
          );
        }
        target.popup.openOn(map);
-					target.popup.on('remove', function() {
+        target.popup.on("remove", function () {
-						arcTravel.clearLayers()
+          arcTravel.clearLayers();
-						arcTravelled.clearLayers()
+          arcTravelled.clearLayers();
-						pulsatingMarker.clearLayers()
+          pulsatingMarker.clearLayers();
-						originMarker.clearLayers()
+          originMarker.clearLayers();
        });
-					target.popup.on('popupclose', function() {
+        target.popup.on("popupclose", function () {
-						arcTravel.clearLayers()
+          arcTravel.clearLayers();
-						arcTravelled.clearLayers()
+          arcTravelled.clearLayers();
-						pulsatingMarker.clearLayers()
+          pulsatingMarker.clearLayers();
-						originMarker.clearLayers()
+          originMarker.clearLayers();
        });
      }
      //utils for popup
-			utils.getMap().on('click', function(e) {
+      utils.getMap().on("click", function (e) {
        var interaction = utils.getRenderer().plugins.interaction;
        var pointerEvent = e.originalEvent;
        var pixiPoint = new PIXI.Point();
-				interaction.mapPositionToPoint(pixiPoint, pointerEvent.clientX, pointerEvent.clientY);
+        interaction.mapPositionToPoint(
          pixiPoint,
          pointerEvent.clientX,
          pointerEvent.clientY
        );
        var target = interaction.hitTest(pixiPoint, container);
        if (target && target.popup) {
-					openPopup(target)
+          openPopup(target);
        }
      });
-			utils.getMap().on('touchend', function(e) {
+      utils.getMap().on("touchend", function (e) {
        var interaction = utils.getRenderer().plugins.interaction;
        var pointerEvent = e.originalEvent;
        var pixiPoint = new PIXI.Point();
-				interaction.mapPositionToPoint(pixiPoint, pointerEvent.clientX, pointerEvent.clientY);
+        interaction.mapPositionToPoint(
          pixiPoint,
          pointerEvent.clientX,
          pointerEvent.clientY
        );
        var target = interaction.hitTest(pixiPoint, container);
        if (target && target.popup) {
-					openPopup(target)
+          openPopup(target);
        }
      });
    }
    firstDraw = false;
@@ -463,22 +686,17 @@ loader.load(function(loader, resources) {
  pixiOverlay.addTo(map);
 });
 //hack to make white lines between lines disapear on non-retina screens (from: https://github.com/Leaflet/Leaflet/issues/3575 )
-(function(){
+(function () {
-    var originalInitTile = L.GridLayer.prototype._initTile
+  var originalInitTile = L.GridLayer.prototype._initTile;
  L.GridLayer.include({
    _initTile: function (tile) {
      originalInitTile.call(this, tile);
      var tileSize = this.getTileSize();
-            tile.style.width = tileSize.x + 1 + 'px';
+      tile.style.width = tileSize.x + 1 + "px";
-            tile.style.height = tileSize.y + 1 + 'px';
+      tile.style.height = tileSize.y + 1 + "px";
-        }
+    },
  });
-})()
+})();
@@ -109,7 +109,29 @@ $("#sendNewPlane").on('click',function(){
 			var randomColor = getRandomColor()
-			console.log(message)
+			var formData = new FormData()
 			var attachment = $("#attachmentPlane").prop('files')[0];
 			formData.append('file', attachment);
 			formData.append('message', encodeURIComponent(message));
 			formData.append('expeMail', $("#expeMail").val());
 			formData.append('expeKnown', expeKnown);
 			formData.append('expeLang', lang);
 			formData.append('destLang', $("#selectDestLang").val());
 			formData.append('startLat', expeLoc.center[1]);
 			formData.append('startLon', expeLoc.center[0]);
 			formData.append('startName', expeLoc.name);
 			formData.append('startTime', sentDate);
 			formData.append('startTZ', expeTimezone);
 			formData.append('destMail', $("#destMail").val());
 			formData.append('destLat', destLoc.center[1]);
 			formData.append('destLon', destLoc.center[0]);
 			formData.append('destName', destLoc.name);
 			formData.append('public', publicMessage, );
 			formData.append('color', randomColor);
 			formData.append('deliveryTime', deliveryDate);
 			formData.append('deliveryTZ', destTimezone);
 			formData.append('deliveryTimeServer', deliverySecondsServer);
 			formData.append('deliveryMethod', $("#selectTime").val());
 			var data = {
 				'message':encodeURIComponent(message),
@@ -131,39 +153,22 @@ $("#sendNewPlane").on('click',function(){
 				'deliveryTime':deliveryDate,
 				'deliveryTZ':destTimezone,
 				'deliveryTimeServer':deliverySecondsServer,
-				'deliveryMethod':$("#selectTime").val()
+				'deliveryMethod':$("#selectTime").val(),
 			}
-			
+			$.ajax({
-			var query = 'avionpoeme.php?'+
+				url: 'avionpoeme.php',
-						'message='+data.message+'&'+
+				data: formData,
-						'expeMail='+data.expeMail+'&'+
+				processData: false,
-						'expeKnown='+data.expeKnown+'&'+
+				contentType: false,
-						'expeLang='+data.expeLang+'&'+
+				cache : false,
-						'destLang='+data.destLang+'&'+
+				type: 'POST',
-						'startLat='+data.startLat+'&'+
+				success: function(result){
 						'startLon='+data.startLon+'&'+
 						'startName='+data.startName+'&'+
 						'startTime='+data.startTime+'&'+
 						'startTZ='+data.startTZ+'&'+
 						'destMail='+data.destMail+'&'+
 						'destLat='+data.destLat+'&'+
 						'destLon='+data.destLon+'&'+
 						'destName='+data.destName+'&'+
 						'public='+data.public+'&'+
 						'color='+data.color+'&'+
 						'deliveryTime='+data.deliveryTime+'&'+
 						'deliveryTZ='+data.deliveryTZ+'&'+
 						'deliveryTimeServer='+data.deliveryTimeServer+'&'+
 						'deliveryMethod='+data.deliveryMethod+'';
 			$.post(query, function(result) {
 					result = result.replace(/'/g, '"');
 				console.log(result)
 					result = $.parseJSON(result)
 					var planeId = Number(result.uid);
 					//selecting proper color for back
-				$("#back").attr("src","src/img/back-"+data.color+".jpg");
+					$("#back").attr("src","src/img/back-"+randomColor+".jpg");
 					// creating image for plane, need to link it to the inputs tog et entered values.
 					var message = quill.root.innerHTML
@@ -193,14 +198,11 @@ $("#sendNewPlane").on('click',function(){
 						},4400);
 						//reloading page (to change)
 						setInterval(function(){
-						window.location.href ='https://avion-poe.me?avion='+planeId+'';
+							window.location.href ='https://www.avion-poe.me/?avion='+planeId+'';
 						},5500);
 					})
-			})
+				}
-			
+			});
 		})
 	});
@@ -1,184 +1,182 @@
 // Default lang
-var lang = 'en'
+var lang = "en";
 // Lang by session
-var langSession = sessionStorage.getItem('lang');
+var langSession = sessionStorage.getItem("lang");
 // Lang by navigator config
 var userLang = navigator.userLanguage || navigator.language;
 if (langSession) {
-	lang = langSession.substring(0,2)
+  lang = langSession.substring(0, 2);
 } else if (userLang) {
-	lang = userLang.substring(0,2)
+  lang = userLang.substring(0, 2);
 }
 //loading the lang.json file
-$(document).ready(function(){
+$(document).ready(function () {
-	    translateUI(lang)
+  translateUI(lang);
-	 	$.getJSON("lang/lang.json", function(data){
+  $.getJSON("lang/lang.json", function (data) {
    //creating dropdown list of languages in navbar
-		for (var key in data){
+    for (var key in data) {
-			$("#langChoices").append( '<a class="dropdown-item langSelect" value="'+key+'" href="#">'+data[key]+'</a>' )
+      $("#langChoices").append(
-			$("#selectDestLang").append( '<option value="'+key+'" href="#">'+data[key]+'</option>' )
+        '<a class="dropdown-item langSelect" value="' +
          key +
          '" href="#">' +
          data[key] +
          "</a>"
      );
      $("#selectDestLang").append(
        '<option value="' + key + '" href="#">' + data[key] + "</option>"
      );
    }
    //setting the user lang
-		if(data[lang]){
+    if (data[lang]) {
      //$("#navbarDropdownLang").html(data[lang])
-			translateUI(lang)
+      translateUI(lang);
    }
    //or english if not in list
-		else{
+    else {
      //$("#navbarDropdownLang").html("English")
-			translateUI('en')
+      translateUI("en");
    }
-        $(".langSelect").on('click',function(e){
+    $(".langSelect").on("click", function (e) {
-			lang = e.currentTarget.attributes[1].value
+      lang = e.currentTarget.attributes[1].value;
-			sessionStorage.setItem('lang', lang);
+      sessionStorage.setItem("lang", lang);
-			translateUI(lang)
+      translateUI(lang);
      //$("#navbarDropdownLang").html($(this).html())
-		})
+    });
-	}).fail(function(error){
+  }).fail(function (error) {
    console.log(error);
  });
 });
-var dictionnary = []
+var dictionnary = [];
-function translateUI(l){
+function translateUI(l) {
-	$.getJSON("lang/"+l+"", function(s){
+  $.getJSON("lang/" + l + "", function (s) {
-		console.log(s)
+    dictionnary = s;
 		dictionnary = s
    //if arabic : display left to right (ltr) + troubleshooting a lot of individual elements
-		if (lang == "ar"){
+    if (lang == "ar") {
      //navbar
-			$("nav").css('direction','rtl')
+      $("nav").css("direction", "rtl");
-			$(".nav-menus").removeClass('mr-auto')
+      $(".nav-menus").removeClass("mr-auto");
-			$(".nav-button").addClass('mr-auto')
+      $(".nav-button").addClass("mr-auto");
      //form
      // $(".ql-container").css('direction','rtl')
      // $(".ql-container").css('float','right')
      // $(".ql-editor").css('float','right')
      // $(".ql-editor p").css('float','right')
-			$(".modal-content").css('direction','rtl')
+      $(".modal-content").css("direction", "rtl");
-			$(".bold").css('float','right')
+      $(".bold").css("float", "right");
-			$("#public").css('margin-left','5px')
+      $("#public").css("margin-left", "5px");
-			$("#prive").css('margin-left','5px')
+      $("#prive").css("margin-left", "5px");
-			$("#newPlaneModalAnonyme").css('margin-right','25px')
+      $("#newPlaneModalAnonyme").css("margin-right", "25px");
-			$("#newPlaneModalCancel").css('margin-left','8px')	
+      $("#newPlaneModalCancel").css("margin-left", "8px");
-			$("#closeModal").css('margin-left','0px')	
+      $("#closeModal").css("margin-left", "0px");
-			$("#closeModal").css('padding-left','0px')	
+      $("#closeModal").css("padding-left", "0px");
      //anthology
-			$("#anthology").css('direction','rtl')
+      $("#anthology").css("direction", "rtl");
-			$("#anthologyDisclaimer").css('float','right')
+      $("#anthologyDisclaimer").css("float", "right");
-			
+    } else {
 		}  
 		else{
      //navbar
-			$("nav").css('direction','ltr')
+      $("nav").css("direction", "ltr");
-			$(".nav-menus").addClass('mr-auto')
+      $(".nav-menus").addClass("mr-auto");
-			$(".nav-button").removeClass('mr-auto')
+      $(".nav-button").removeClass("mr-auto");
      //form
      // $(".ql-container").css('direction','ltr')
      // $(".ql-container").css('float','left')
      // $(".ql-editor").css('float','left')
      // $(".ql-editor p").css('float','none')
-			$(".modal-content").css('direction','ltr')
+      $(".modal-content").css("direction", "ltr");
-			$(".bold").css('float','left')
+      $(".bold").css("float", "left");
-			$("#public").css('margin-left','0px')
+      $("#public").css("margin-left", "0px");
-			$("#prive").css('margin-left','0px')
+      $("#prive").css("margin-left", "0px");
-			$("#newPlaneModalAnonyme").css('margin-right','0px')
+      $("#newPlaneModalAnonyme").css("margin-right", "0px");
-			$("#newPlaneModalCancel").css('margin-left','0px')
+      $("#newPlaneModalCancel").css("margin-left", "0px");
      //anthology
-			$("#anthology").css('direction','ltr')
+      $("#anthology").css("direction", "ltr");
-			$("#anthologyDisclaimer").css('float','left')
+      $("#anthologyDisclaimer").css("float", "left");
    }
    //changing all strings
    //main page
-			$('head title', window.parent.document).text(s.avionpoeme);
+    $("head title", window.parent.document).text(s.avionpoeme);
-			$("#navTitle").html(s.avionpoeme)
+    $("#navTitle").html(s.avionpoeme);
-			$("#buttonAnthology").html(s.anthologie)
+    $("#buttonAnthology").html(s.anthologie);
-			$("#buttonAbout").html(s.apropos)
+    $("#buttonAbout").html(s.apropos);
-			if (typeof nbPlane !== 'undefined') {
+    $("#buttonNewPlane").val(s.lancer_avion + " " + nbPlane + "/100");
 				$("#buttonNewPlane").val(s.lancer_avion+" "+nbPlane+"/100")
 			} else {
 				$("#buttonNewPlane").on('click', () => {
 					window.location.replace("/");
 				})
 			}
    //new plane form
-			$("#newPlaneModalTitle").html(s.lancer_avion)
+    $("#newPlaneModalTitle").html(s.lancer_avion);
-			$("#newPlaneModalMessage").html(s.message)
+    $("#newPlaneModalMessage").html(s.message);
-			$("#newPlaneModalPrive").html(s.prive)
+    $("#newPlaneModalPrive").html(s.prive);
-			$("#newPlaneModalPublic").html(s.public)
+    $("#newPlaneModalPublic").html(s.public);
-			$("#flightTime").html(s.temps_de_vol)
+    $("#labelAttachment").html(s.PJ_Ajouter);
-			$("#newPlaneModalRandom").html(s.aléatoire)
+    console.log(s);
-			$("#newPlaneModal3j").html(s.trois_jours)
+    $("#attachmentPlaneLabel").attr("data-after", s.PJ_Parcourir);
-			$("#newPlaneModal7j").html(s.sept_jours)
+    $("#flightTime").html(s.temps_de_vol);
-			$("#newPlaneModal30j").html(s.trente_jours)
+    $("#newPlaneModalRandom").html(s.aléatoire);
-			$("#newPlaneModal365j").html(s.unan_jours)
+    $("#newPlaneModal3j").html(s.trois_jours);
-			$("#newPlaneModalExpediteur").html(s.expediteur)
+    $("#newPlaneModal7j").html(s.sept_jours);
-			$("#newPlaneModalDestinataire").html(s.destinataire)
+    $("#newPlaneModal30j").html(s.trente_jours);
-			$("#newPlaneModalAnonyme").html(s.anonyme)
+    $("#newPlaneModal365j").html(s.unan_jours);
-			$("#newPlaneModalCancel").html(s.annuler)
+    $("#newPlaneModalExpediteur").html(s.expediteur);
-			$("#sendNewPlane").html(s.lancer)
+    $("#newPlaneModalDestinataire").html(s.destinataire);
-			$("#destLang").html(s.langue_destinataire)
+    $("#newPlaneModalAnonyme").html(s.anonyme);
-			$("#expeMail").attr("placeholder", s.expeMail_placeholder)
+    $("#newPlaneModalCancel").html(s.annuler);
-			$("#expeGeocoderPhoton").attr("placeholder", s.expeLoc_placeholder)
+    $("#sendNewPlane").html(s.lancer);
-			$("#destMail").attr("placeholder", s.destMail_placeholder)
+    $("#destLang").html(s.langue_destinataire);
-			$("#destGeocoderPhoton").attr("placeholder", s.destLoc_placeholder)
+    $("#expeMail").attr("placeholder", s.expeMail_placeholder);
-			$('#anonymeTooltip').attr("title", s.anonyme_tooltip).tooltip("_fixTitle");
+    $("#expeGeocoderPhoton").attr("placeholder", s.expeLoc_placeholder);
-			$('#publicTooltip').attr("title", s.public_tooltip).tooltip("_fixTitle");
+    $("#destMail").attr("placeholder", s.destMail_placeholder);
    $("#destGeocoderPhoton").attr("placeholder", s.destLoc_placeholder);
    $("#anonymeTooltip").attr("title", s.anonyme_tooltip).tooltip("_fixTitle");
    $("#publicTooltip").attr("title", s.public_tooltip).tooltip("_fixTitle");
-			$('#selectDestLang option[value="'+lang+'"]').prop('selected', true); //selecting by default recipient language same as interface
+    $('#selectDestLang option[value="' + lang + '"]').prop("selected", true); //selecting by default recipient language same as interface
 		//Anthology
 			displayAnthology()
 			$("#anthologyTitle").html(s.anthologie)
 			$("#anthologyDisclaimer").html(s.suppr_message_public)
 			$("#closeAnthologyAbout").html(s.retour_carte)
    //About
-		    $("#aboutTitle").html(s.apropos)
+    $("#aboutTitle").html(s.apropos);
-			$("#librairies").html(s.librairies)
+    $("#librairies").html(s.librairies);
-			$("#mapSources").html(s.source_carte)
+    $("#mapSources").html(s.source_carte);
-			$("#mapBackground").html(s.map_background)
+    $("#mapBackground").html(s.map_background);
-			$("#clouds").html(s.clouds)
+    $("#clouds").html(s.clouds);
-			$.getJSON("lang/about.json", function(e){
+    $.getJSON("lang/about.json", function (e) {
-				if(lang !== 'en' && lang !== 'fr' && lang !== 'de'){
+      if (lang !== "en" && lang !== "fr" && lang !== "de") {
-					$("#aboutText").html(e[0].en)
+        $("#aboutText").html(e[0].en);
      } else {
        $("#aboutText").html(e[0][lang]);
      }
-				else{
+      $("#donationText").html(s.AvionPoeme_free_independent);
-					$("#aboutText").html(e[0][lang])
+      $("#donationButtonText").html(s.Soutenez_avionpoeme);
-				}
+      $("#donationButtonText").addClass(lang);
-				$("#donationText").html(s.AvionPoeme_free_independent)
+    });
 				$("#donationButtonText").html(s.Soutenez_avionpoeme)
 				$("#donationButtonText").addClass(lang)
 			})
    //plane limit tooltip
-		if (typeof nbPlane !== 'undefined') {
+    if (typeof nbPlane !== "undefined") {
-			if (nbPlane > 99){
+      if (nbPlane > 99) {
-				$("#planeLimitTooltip").attr("title", s.AvionPoeme_epuise).tooltip("_fixTitle");
+        $("#planeLimitTooltip")
-			}
+          .attr("title", s.AvionPoeme_epuise)
-			else{
+          .tooltip("_fixTitle");
      } else {
        var remainingPlanes = 100 - nbPlane;
-				s.NB_AvionPoeme_restant = s.NB_AvionPoeme_restant.replace('$NB_avion_poeme',remainingPlanes)
+        s.NB_AvionPoeme_restant = s.NB_AvionPoeme_restant.replace(
-				$("#planeLimitTooltip").attr("title", s.NB_AvionPoeme_restant).tooltip("_fixTitle");
+          "$NB_avion_poeme",
          remainingPlanes
        );
        $("#planeLimitTooltip")
          .attr("title", s.NB_AvionPoeme_restant)
          .tooltip("_fixTitle");
      }
    }
-		
+  }).always(function (callback) {
 	})
 	 .always(function(callback) {
    //console.log( callback );
  });
 }
 //hovering lang icon
-$( "#navbarDropdownLang" ).mouseenter(function() {
+$("#navbarDropdownLang").mouseenter(function () {
-  $("#langIcon").attr("src","src/img/lang-hover.png");
+  $("#langIcon").attr("src", "src/img/lang-hover.png");
 });
-$( "#navbarDropdownLang" ).mouseleave(function() {
+$("#navbarDropdownLang").mouseleave(function () {
-  $("#langIcon").attr("src","src/img/lang.png");
+  $("#langIcon").attr("src", "src/img/lang.png");
 });
Author	SHA1	Message	Date
mberard	bff6df4a35	update repo	2021-12-14 22:33:54 +01:00
mathieu_berard	0a87a3a0cb	Merge branch 'add-htaccess' of DTux/avion-poeme into master	2021-11-24 21:58:21 +00:00
mberard	a5a934a108	feat: add htacces to redirect php file	2021-11-24 22:57:51 +01:00
mathieu_berard	876a925f79	Merge branch 'fix-bug-picto-lang-apropos' of DTux/avion-poeme into master	2021-11-24 21:51:56 +00:00
mberard	5b06af2026	fix: îcto bulgare donation elt apropos	2021-11-24 22:48:28 +01:00
mberard	d8070b6260	fix: attachment and gitignore	2021-11-11 15:18:01 +01:00
mberard	ca9d3b2d98	fix: update repo directy master branch	2021-11-11 14:37:27 +01:00
Daniel Tartavel	92c26dab45	replacing end of line	2021-11-03 10:33:04 +01:00
DTux	4da327413c	Merge branch 'anim-plane-reverse' of DTux/avion-poeme into master	2021-11-03 08:22:58 +00:00
DTux	8d8ea7adf3	Merge branch 'add-attachment' of DTux/avion-poeme into master	2021-11-03 08:22:07 +00:00
mberard	ea34094d41	Reverse anim plane	2021-11-01 20:12:31 +01:00
mberard	de54555d77	add-attachment-in-form	2021-11-01 13:48:35 +01:00
Daniel Tartavel	8f7e94e482	comparison of lat and long made on 3 decimals only	2021-10-30 12:43:54 +02:00
Daniel Tartavel	952121b1d2	correction of some regressions	2021-10-30 12:37:27 +02:00
Daniel Tartavel	5cb0055bee	corrected bug same coordinates	2021-10-30 12:15:02 +02:00
mathieu_berard	af9b97596f	Merge branch 'donation-button' of DTux/avion-poeme into master	2021-10-26 21:55:30 +00:00