Added bluepixle.js demo

This commit is contained in:
bluesaxman 2022-12-20 12:43:21 -07:00
parent 7ecaf615e5
commit cf7aeb35f5

View File

@ -40,10 +40,12 @@ blueui.js - Adds classes for several highly reusable ui objects such as buttons
window.bdescription.content.innerText = "This project is to develop and test my own small private javascript libraries.";
window.bcore.content.innerText = "This is as its named very basic functions like grabbing things asynchronously and such. This library also containes a lot of legacy functions for backwards compatibility.";
window.bpixle.content.innerText = "bluepixle.js - Adds helper classes to make using canveas with objects simple (requires bluemath.js)";
window.bui.content.innerText = "blueui.js - Adds classes for several reusable ui objects such as buttons and draggable windows.";
// window.bpixle.content.innerText = "bluepixle.js - Adds helper classes to make using canveas with objects simple (requires bluemath.js)";
window.bui.content.innerText = "blueui.js - Adds classes for several reusable ui objects such as buttons and draggable windows. (You are viewing the demo for this right now)";
window.bmath.content.innerText = "bluemath.js - Adds some helpful math objects such as vectors and matricies.";
// blueaudio.js demo code
var baudioDescription = document.createElement("div");
baudioDescription.innerText = "blueaudio.js - This is for adding/loading audio assets to a project.";
var bluePlayer = new AudioContext();
@ -61,6 +63,29 @@ blueui.js - Adds classes for several highly reusable ui objects such as buttons
window.baudio.content.appendChild(mySound.root);
window.baudio.content.appendChild(mySequence);
// bluepixle.js demo code
var cancan = document.createElement("canvas");
cancan.height = 400;
cancan.width = 600;
window.bpixle.content.appendChild(cancan);
var buffy = new frameBuffer(cancan.getContext("2d"), 400, 600);
var desc = new container(new vector([20,20]));
desc.addShape(new shape("text", null, new vector([500,200]), null, "#000000", null, null, {text:"bluepixle.js - Adds helper classes to make using canveas with objects simple (requires bluemath.js)"}));
buffy.addContainer(desc);
buffy.tick = setInterval(() => { buffy.pushFrame(); }, 33);
var speedFactor = 0.05;
desc.tick = setInterval(() => {
if (desc.coordinates.d[1] <= 0) { desc.movementVector.d[1] = speedFactor }
if (desc.coordinates.d[1] >= 400) { desc.movementVector.d[1] = -speedFactor }
if (desc.coordinates.d[0] <= 0) { desc.movementVector.d[0] = speedFactor }
if (desc.coordinates.d[0] >= 100) { desc.movementVector.d[0] = -speedFactor }
desc.move(66);
}, 66);
desc.movementVector.d[1] = speedFactor;
desc.movementVector.d[0] = speedFactor;
document.body.appendChild(window.bdescription.root);
window.bdescription.content.appendChild(window.bcore.root);
window.bcore.root.style.top = "80px";