2018-10-12 23:28:32 +00:00
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
|
<html lang="fr">
|
|
|
|
|
|
|
|
|
|
|
|
<head>
|
|
|
|
|
|
<title>Button - Lucien Cartier-Tilet</title>
|
|
|
|
|
|
<meta name="author" content="Lucien Cartier-Tilet" />
|
|
|
|
|
|
<meta name="description" content="Page universitaire de Lucien Cartier-Tilet" />
|
|
|
|
|
|
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
|
|
|
|
|
|
<meta name="viewport" content="initial-scale=1, user-scalable=yes, maximum-scale=5, width=device-width, height=device-height">
|
|
|
|
|
|
<link rel="stylesheet" type="text/css" href="../css/style.css">
|
|
|
|
|
|
<link rel="stylesheet" type="text/css" href="../css/canvas.css">
|
|
|
|
|
|
<link rel="stylesheet" type="text/css" href="../css/edit-image.css">
|
|
|
|
|
|
<script type="text/javascript" src="../js/edit-image.js"></script>
|
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
|
|
<ul class="navbar">
|
|
|
|
|
|
<li><a href="../">Home</a></li>
|
|
|
|
|
|
<li><a href="../square/">Square</a></li>
|
|
|
|
|
|
<li><a href="../faker/">Faker</a></li>
|
|
|
|
|
|
<li><a href="../canvas/">Canvas</a></li>
|
|
|
|
|
|
<li><a href="../button/">Button</a></li>
|
|
|
|
|
|
<li><a href="../animation/">Animation</a></li>
|
|
|
|
|
|
<li><a class="active" href="../edit-image/">Édition d’Image</a></li>
|
2018-11-22 11:02:02 +00:00
|
|
|
|
<li><a href="../random-rectangles/" >Rectangles aléatoires</a></li>
|
2018-10-12 23:28:32 +00:00
|
|
|
|
</ul>
|
|
|
|
|
|
<div id="container">
|
|
|
|
|
|
<div class="content">
|
|
|
|
|
|
<p>Édition de paramètres basiques en temps réel d’une image utilisateur.</p>
|
|
|
|
|
|
<input type="file" id="files" name="files[]" type="file" accept="image/*" />
|
|
|
|
|
|
<table>
|
|
|
|
|
|
<tr>
|
|
|
|
|
|
<th>
|
|
|
|
|
|
<p>Luminosité</p>
|
|
|
|
|
|
</th>
|
|
|
|
|
|
<th>
|
|
|
|
|
|
<p>Contraste</p>
|
|
|
|
|
|
</th>
|
|
|
|
|
|
<th>
|
|
|
|
|
|
<p>Saturation</p>
|
|
|
|
|
|
</th>
|
|
|
|
|
|
</tr>
|
|
|
|
|
|
<tr>
|
|
|
|
|
|
<td>
|
|
|
|
|
|
<input type="range" min="0" max="200" value="100" class="slider" id="rgnlum">
|
|
|
|
|
|
</td>
|
|
|
|
|
|
<td>
|
|
|
|
|
|
<input type="range" min="0" max="200" value="100" class="slider" id="rgncon">
|
|
|
|
|
|
</td>
|
|
|
|
|
|
<td>
|
|
|
|
|
|
<input type="range" min="0" max="200" value="100" class="slider" id="rgnsat">
|
|
|
|
|
|
</td>
|
|
|
|
|
|
</tr>
|
|
|
|
|
|
</table>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="slidecontainer">
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<canvas id="canvastp1" width="800" height="600"></canvas>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
|
|
</html>
|
