This commit is contained in:
Devine Lu Linvega 2016-11-11 15:42:13 -08:00
parent cb4713a1b1
commit ca48de36d8
4 changed files with 77 additions and 0 deletions

10
index.html Normal file
View File

@ -0,0 +1,10 @@
<html>
<head>
<script type="text/javascript" src="scripts/position.js"></script>
<script type="text/javascript" src="scripts/pointer.js"></script>
</head>
<body>
<canvas id="myCanvas" width="400" height="400" style="background:#efefef"></canvas>
<script type="text/javascript" src="scripts/main.js"></script>
</body>
</html>

44
scripts/main.js Normal file
View File

@ -0,0 +1,44 @@
var pointer = new Pointer();
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
function writeMessage(canvas, message) {
var context = canvas.getContext('2d');
// context.clearRect(0, 0, canvas.width, canvas.height);
context.font = '12pt Calibri';
context.fillStyle = 'black';
context.fillText(message, 10, 25);
}
function getMousePos(canvas, evt)
{
var rect = canvas.getBoundingClientRect();
return new Position(evt.clientX - rect.left,evt.clientY - rect.top);
}
canvas.addEventListener('mousemove', function(evt) {
pointer.position = getMousePos(canvas, evt);
pointer.draw();
// var message = 'Mouse position: ' + mousePos.x + ',' + mousePos.y;
// writeMessage(canvas, message);
// draw_pixel(context,mousePos.x,mousePos.y);
}, false);
canvas.addEventListener('mousedown', function(evt) {
pointer.can_draw = true;
}, false);
canvas.addEventListener('mouseup', function(evt) {
pointer.can_draw = false;
}, false);
function draw_pixel(context,x,y)
{
var id = context.createImageData(1,1);
var d = id.data;
d[0] = 0;
d[1] = 0;
d[2] = 0;
d[3] = 255;
context.putImageData(id,x,y);
}

18
scripts/pointer.js Normal file
View File

@ -0,0 +1,18 @@
function Pointer()
{
this.position = new Position();
this.can_draw = false;
this.draw = function()
{
if(this.can_draw === false){return;}
var id = context.createImageData(1,1);
var d = id.data;
d[0] = 0;
d[1] = 0;
d[2] = 0;
d[3] = 255;
context.putImageData(id,this.position.x,this.position.y);
}
}

5
scripts/position.js Normal file
View File

@ -0,0 +1,5 @@
function Position(x = 0,y = 0)
{
this.x = x;
this.y = y;
}