hello,
first time p5js user here
i am trying to make a sketch display text in a 3D environment
it works just fine on a computer browser, but on mobile devices it crashes the browser.
you can try it out here: https://www.jacobremin.com/websynth/crash.html
i am pretty sure it is the text causing the crash, the sketch works fine on mobile if i take away the text part.
any tips?
thanks!
code follows:
var boxSize, rotationSpeed;
var textBoxSize, fontSize;
var quote;
function preload() {
cineType = loadFont('assets/fonts/GT-Cinetype-Regular.otf');
}
function setup() {
createCanvas(windowWidth, windowHeight, WEBGL);
fullscreen(true);
boxSize = random(windowWidth/2,windowWidth);
rotationSpeed = random(0.01,0.02);
textFont(cineType);
}
function draw() {
background(150);
drawBox();
displayText();
}
function displayText() {
fill(0);
rectMode(CENTER);
textAlign(CENTER, CENTER);
textSize(300);
text("some text",0,0,width*0.9,height*0.9);
}
function drawBox() {
var rotX = map (mouseX, 0, windowWidth, -1, 1);
var rotY = map (mouseY, 0, windowHeight, -1, 1);
push();
rotateY(frameCount * 0.01 + rotX);
rotateX(frameCount * 0.01 + rotY);
strokeWeight(10);
noFill();
stroke(255);
box(boxSize);
pop();
}