Starting to clean up the project.

This commit is contained in:
Devine Lu Linvega 2016-11-11 16:00:41 -08:00
parent ca48de36d8
commit 33592730dd
3 changed files with 15 additions and 36 deletions

View File

@ -1,10 +1,12 @@
<html> <html>
<head> <head>
<link rel="stylesheet" type="text/css" href="links/main.css"/>
<script type="text/javascript" src="scripts/position.js"></script> <script type="text/javascript" src="scripts/position.js"></script>
<script type="text/javascript" src="scripts/pointer.js"></script> <script type="text/javascript" src="scripts/pointer.js"></script>
</head> </head>
<body> <body>
<canvas id="myCanvas" width="400" height="400" style="background:#efefef"></canvas> <canvas id="myCanvas" width="400" height="400" style="background:#efefef"></canvas>
<input id ='commander'/>
<script type="text/javascript" src="scripts/main.js"></script> <script type="text/javascript" src="scripts/main.js"></script>
</body> </body>
</html> </html>

View File

@ -2,43 +2,14 @@ var pointer = new Pointer();
var canvas = document.getElementById('myCanvas'); var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d'); var context = canvas.getContext('2d');
function writeMessage(canvas, message) { canvas.addEventListener('mousemove', function(e) {
var context = canvas.getContext('2d'); pointer.draw(e);
// 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); }, false);
canvas.addEventListener('mousedown', function(evt) { canvas.addEventListener('mousedown', function(e) {
pointer.can_draw = true; pointer.can_draw = true;
}, false); }, false);
canvas.addEventListener('mouseup', function(evt) { canvas.addEventListener('mouseup', function(e) {
pointer.can_draw = false; pointer.can_draw = false;
}, 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);
}

View File

@ -3,7 +3,7 @@ function Pointer()
this.position = new Position(); this.position = new Position();
this.can_draw = false; this.can_draw = false;
this.draw = function() this.draw = function(e)
{ {
if(this.can_draw === false){return;} if(this.can_draw === false){return;}
@ -13,6 +13,12 @@ function Pointer()
d[1] = 0; d[1] = 0;
d[2] = 0; d[2] = 0;
d[3] = 255; d[3] = 255;
context.putImageData(id,this.position.x,this.position.y); context.putImageData(id,e.clientX,e.clientY);
}
this.position = function()
{
var rect = canvas.getBoundingClientRect();
return new Position(evt.clientX - rect.left,evt.clientY - rect.top);
} }
} }