JavaScript library for object-based canvas drawing.
oCanvas - Object-based canvas drawing ocanvas is a javascript library intended to make development with html5 canvas easier, by working with objects instead of pixels.
I'm still a little fuzzy on ocanvas, I'm new to it. I know it's not the best choice or most documented, but I have a potential job that depends on me learning it.
I was wondering where ocanvas.create(); should be placed. right now I have a function called Main(); in the html head and the html body runs it every time the body loops. it seems that ocanvas.create(); only works if i place it in the Main(); function, but is that creating a canvas every time the body loops?
Source: (StackOverflow)
I'm having an issue with a variable not being passed through an ocanvas function. it appears that the variable is changing inside the function but isn't making it outside the function. here is my code:
sonicSpeed2 = 0;
sonicState2 = 0;
canvas.bind("keypress", function () {
var keys = canvas.keyboard.getKeysDown();
var x;
sonicSpeed2 = 4;
for (x = keys.length; x > 0; x--) {
if (keys[x-1] == 16 && keys.length > 1) {
sonicSpeed2 = 15;
sonicState2 = 2;
}
if (keys[x-1] == 65) {
sonicState2 = 1;
sonicDirection2a = false;
}
if (keys[x-1] == 68) {
sonicState2 = 1;
sonicDirection2a = true;
}
if (keys[x-1] == 87) {
sonicState2 = 1;
sonicDirection2b = false;
}
if (keys[x-1] == 83) {
sonicState2 = 1;
sonicDirection2b = true;
}
}
});
if (sonicDirection2a == false) {
nullObject2.x -= sonicSpeed2;
}
else if (sonicDirection2a == true) {
nullObject2.x += sonicSpeed2;
}
if (sonicDirection2b == false) {
nullObject2.y -= sonicSpeed2;
}
else if (sonicDirection2b == true) {
nullObject2.y += sonicSpeed2;
}
Source: (StackOverflow)
I'm new to ocanvas and I'm finding it is not well-documented for beginners. I would like to know how to limit animations, such as when clicked, a box will move -350 to it's own position but stop at the edge of the canvas if it is closer than it's position - 350. Any help or tutorials would be greatly appreciated.
Source: (StackOverflow)