From 8dddcc88be0723107f0066300990eedc01c9a902 Mon Sep 17 00:00:00 2001 From: Splines Date: Thu, 26 Oct 2023 00:13:13 +0200 Subject: [PATCH] Fix P5.js initialization --- app/assets/javascripts/monotile/hat.js | 18 +++++++++++++++++- app/views/layouts/devise.html.erb | 6 +++--- 2 files changed, 20 insertions(+), 4 deletions(-) diff --git a/app/assets/javascripts/monotile/hat.js b/app/assets/javascripts/monotile/hat.js index 01779dd22..978728195 100644 --- a/app/assets/javascripts/monotile/hat.js +++ b/app/assets/javascripts/monotile/hat.js @@ -6,7 +6,23 @@ // useful in combination with turbolinks. // see more here: // https://github.com/processing/p5.js/wiki/p5.js-overview#why-cant-i-assign-variables-using-p5-functions-and-variables-before-setup -new p5(); + +// A bit of a "hacky" fix. This is the only way I found that works +// so that the canvas is loaded even if the site is left +// e.g. user clicks on "Register" or changes language from "De" to "En" +// with the button on the landing page. +$(document).on('turbolinks:load', () => { + try { + setup(); + } catch (err) { + if (err instanceof ReferenceError) { + console.log('Setup P5.js'); + return; + } + console.error(err); + } +}); + const INITIAL_TO_SCREEN = [20, 0, 0, 0, -20, 0]; let to_screen = INITIAL_TO_SCREEN; diff --git a/app/views/layouts/devise.html.erb b/app/views/layouts/devise.html.erb index eddba5ba3..8c6c698aa 100644 --- a/app/views/layouts/devise.html.erb +++ b/app/views/layouts/devise.html.erb @@ -14,9 +14,9 @@ - - <%= javascript_include_tag 'monotile/geometry', defer: true %> - <%= javascript_include_tag 'monotile/hat', defer: true %> + + <%= javascript_include_tag 'monotile/geometry' %> + <%= javascript_include_tag 'monotile/hat' %>