sadorowo/draw
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add: labels

Browse Source
This commit is contained in:
sadorowo 2023-10-27 07:28:15 +00:00
parent ad4682fada
commit e0469d7a54
2 changed files with 6 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
index.html
View File

@ -11,7 +11,7 @@
<body> <body>
<div id="menu"> <div id="menu">
<select id="color"> <select id="colorSelect">
<option value="green">Zielony</option> <option value="green">Zielony</option>
<option value="red">Czerwony</option> <option value="red">Czerwony</option>
<option value="yellow">Żółty</option> <option value="yellow">Żółty</option>
@ -20,8 +20,10 @@
<option value="black">Czarny</option> <option value="black">Czarny</option>
<option value="lime">Limonkowy</option> <option value="lime">Limonkowy</option>
</select> </select>
<input type="range" min="5" max="40" value="5" id="weight"/> <label for="colorSelect">Wybierz kolor: </label>
<button id="clear">Wyczyść rysunek!</button> <input type="range" min="5" max="40" value="5" id="weightSlider"/>
<label for="weightSlider">Wybierz grubość linii: </label>
<button id="clearButton">Wyczyść rysunek!</button>
</div> </div>
<canvas id="canvas"></canvas> <canvas id="canvas"></canvas>
</body> </body>

6
script.js
View File

@ -4,12 +4,7 @@ document.addEventListener('mouseup', stopPainting);
document.addEventListener('mousemove', draw); document.addEventListener('mousemove', draw);
window.addEventListener('resize', resize); window.addEventListener('resize', resize);
const colorSelector = document.getElementById('color');
const weightSlider = document.getElementById('weight');
const clearButton = document.getElementById('clear');
const canvas = document.getElementById('canvas');
const ctx = canvas.getContext('2d'); const ctx = canvas.getContext('2d');
let color = 'green'; let color = 'green';
let weight = 5; let weight = 5;
@ -28,6 +23,7 @@ document.addEventListener('wheel', e => {
clearButton.addEventListener('click', () => ctx.clearRect(0, 0, canvas.width, canvas.height)) clearButton.addEventListener('click', () => ctx.clearRect(0, 0, canvas.width, canvas.height))
weightSlider.addEventListener('change', e => weight = e.target.value) weightSlider.addEventListener('change', e => weight = e.target.value)
colorSelector.addEventListener('change', e => color = e.target.value) colorSelector.addEventListener('change', e => color = e.target.value)
resize(); resize();
function resize() { function resize() {