ajout
This commit is contained in:
parent
e3c07b83d4
commit
8e1ed459d1
38
WIM4.1/tp/tp3/ex2/index.html
Normal file
38
WIM4.1/tp/tp3/ex2/index.html
Normal file
@ -0,0 +1,38 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="stylesheet" href="http://www.iut-fbleau.fr/css/tacit.css">
|
||||
<title>Ajax</title>
|
||||
<script src="js/serviceAjax.js"></script>
|
||||
<script src="js/helpers.js"></script>
|
||||
|
||||
</head>
|
||||
<body container>
|
||||
<form action="">
|
||||
<fieldset>
|
||||
<label for="">Commune</label>
|
||||
<input autocomplete=off list="communes" type="text">
|
||||
<datalist id="communes"></datalist>
|
||||
<button type="submit">Envoyer</button>
|
||||
</fieldset>
|
||||
</form>
|
||||
</body>
|
||||
<script>
|
||||
let doRequest = debounce (search,500)
|
||||
let input = document.querySelector("input")
|
||||
let listes = document.querySelector("datalist")
|
||||
input.addEventListener("input",doRequest)
|
||||
|
||||
let cache = []
|
||||
async function search(ev){
|
||||
|
||||
let communes_promise = http.getVilles(input.value);
|
||||
|
||||
communes_promise.then(function(table) {
|
||||
autocomplete(listes, table);
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
</html>
|
19
WIM4.1/tp/tp3/ex2/js/helpers.js
Normal file
19
WIM4.1/tp/tp3/ex2/js/helpers.js
Normal file
@ -0,0 +1,19 @@
|
||||
function debounce(fn, wait)
|
||||
{
|
||||
let timeout;
|
||||
return (...args) => {
|
||||
clearTimeout(timeout);
|
||||
timeout = setTimeout(() => fn(...args), wait);
|
||||
}
|
||||
}
|
||||
function autocomplete(datalist,communes)
|
||||
{
|
||||
// À compléter
|
||||
datalist.innerHTML = '';
|
||||
|
||||
for(let c of communes) {
|
||||
let option = document.createElement("option");
|
||||
option.value = c;
|
||||
datalist.appendChild(option);
|
||||
}
|
||||
}
|
30
WIM4.1/tp/tp3/ex2/js/serviceAjax.js
Normal file
30
WIM4.1/tp/tp3/ex2/js/serviceAjax.js
Normal file
@ -0,0 +1,30 @@
|
||||
let http={
|
||||
getVilles(nom){
|
||||
// À compléter
|
||||
let final_json;
|
||||
return fetch('https://geo.api.gouv.fr/communes?nom=' + nom + '&fields=departement&boost=population&limit=7')
|
||||
.then(readResponseAsJson)
|
||||
.then(function(body) {
|
||||
final_json = new Array();
|
||||
body.forEach(el => final_json.push(el.nom));
|
||||
return final_json
|
||||
})
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
function readResponseAsJson(response){
|
||||
|
||||
if (!response.ok) {
|
||||
|
||||
console.log(response.statusText);
|
||||
}
|
||||
|
||||
else {
|
||||
return response.json()
|
||||
}
|
||||
}
|
||||
|
||||
|
27
WIM4.1/tp/tp3/ex3/chat.html
Normal file
27
WIM4.1/tp/tp3/ex3/chat.html
Normal file
@ -0,0 +1,27 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title></title>
|
||||
<link rel="stylesheet" href="http://www.iut-fbleau.fr/css/tacit.css" type="text/css">
|
||||
<link rel="stylesheet" href="./css/style.css">
|
||||
<script src="js/chat.js"></script>
|
||||
</head>
|
||||
<body container>
|
||||
<h3>Chat</h3>
|
||||
<form id="form_auth">
|
||||
<input id="nom" name="nom" type="text">
|
||||
<button type="submit">Se connecter</button>
|
||||
</form>
|
||||
<div id="espace_chat">
|
||||
<h3>Messages</h3>
|
||||
<div id="messages" style="height:600px;overflow-y:auto;" >
|
||||
<ul id="liste_message"></ul>
|
||||
</div>
|
||||
<br>
|
||||
<form id="form" action="" method="post">
|
||||
<input name="message" id="message" type="text">
|
||||
</form>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
5
WIM4.1/tp/tp3/ex3/css/style.css
Normal file
5
WIM4.1/tp/tp3/ex3/css/style.css
Normal file
@ -0,0 +1,5 @@
|
||||
#message{
|
||||
display:inline-block;
|
||||
width:100%;
|
||||
}
|
||||
|
20
WIM4.1/tp/tp3/ex3/php/chat.php
Normal file
20
WIM4.1/tp/tp3/ex3/php/chat.php
Normal file
@ -0,0 +1,20 @@
|
||||
<?php
|
||||
header("Access-Control-Allow-Origin: *");
|
||||
header('Content-Type: application/json');
|
||||
$conn = mysqli_connect("localhost","","","");
|
||||
|
||||
$id = filter_input(INPUT_GET,"id",FILTER_VALIDATE_INT);
|
||||
$message = filter_input(INPUT_POST,"message");
|
||||
$pseudo = filter_input(INPUT_POST,"pseudo");
|
||||
|
||||
if ($message !== NULL && $pseudo !== NULL){
|
||||
$res=mysqli_query($conn,"INSERT INTO message values(NULL,'$pseudo','$message')");
|
||||
}
|
||||
|
||||
$result = mysqli_query($conn,"SELECT * FROM message where id > $id;");
|
||||
$retour = [];
|
||||
foreach($result as $message){
|
||||
$retour[]=$message;
|
||||
}
|
||||
echo json_encode($retour);
|
||||
?>
|
60
WIM4.1/tp/tp3/ex3/sql/message.sql
Normal file
60
WIM4.1/tp/tp3/ex3/sql/message.sql
Normal file
@ -0,0 +1,60 @@
|
||||
-- phpMyAdmin SQL Dump
|
||||
-- version 4.9.2
|
||||
-- https://www.phpmyadmin.net/
|
||||
--
|
||||
-- Hôte : localhost
|
||||
-- Généré le : lun. 11 mai 2020 à 15:56
|
||||
-- Version du serveur : 10.4.11-MariaDB
|
||||
-- Version de PHP : 7.4.1
|
||||
|
||||
SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
|
||||
SET AUTOCOMMIT = 0;
|
||||
START TRANSACTION;
|
||||
SET time_zone = "+00:00";
|
||||
|
||||
|
||||
/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
|
||||
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
|
||||
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
|
||||
/*!40101 SET NAMES utf8mb4 */;
|
||||
|
||||
--
|
||||
-- Base de données : `chat`
|
||||
--
|
||||
|
||||
-- --------------------------------------------------------
|
||||
|
||||
--
|
||||
-- Structure de la table `message`
|
||||
--
|
||||
|
||||
CREATE TABLE `message` (
|
||||
`id` int(11) NOT NULL,
|
||||
`pseudo` varchar(10) COLLATE utf8mb4_unicode_ci NOT NULL,
|
||||
`message` text COLLATE utf8mb4_unicode_ci NOT NULL
|
||||
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
|
||||
|
||||
--
|
||||
-- Index pour les tables déchargées
|
||||
--
|
||||
|
||||
--
|
||||
-- Index pour la table `message`
|
||||
--
|
||||
ALTER TABLE `message`
|
||||
ADD PRIMARY KEY (`id`);
|
||||
|
||||
--
|
||||
-- AUTO_INCREMENT pour les tables déchargées
|
||||
--
|
||||
|
||||
--
|
||||
-- AUTO_INCREMENT pour la table `message`
|
||||
--
|
||||
ALTER TABLE `message`
|
||||
MODIFY `id` int(11) NOT NULL AUTO_INCREMENT;
|
||||
COMMIT;
|
||||
|
||||
/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
|
||||
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
|
||||
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
|
Loading…
Reference in New Issue
Block a user