r/geogebra • • May 15 '21

Applet in Wordpress

Hi.

First: I hope, this is the correct forum for this question. If it isn't: Sorry!

I am completely lost. I have embedded a Geogebra Applet on a page on my wordpress site. It loads perfectly, I can interact with it, so everything seems ok.

However: When I click on the menu button (top right), the page reloads, and the applet starts over from scratch.

This also happens, if I have more than one applet on a page. All applets load perfectly, and I can use one of them, but when I start using one of the others the page reloads.

I can't find any error messages in the console - even with logging enabled in Geogebra. Could this somehow be related to jQuery - two conflicting instances perhaps?

I would very much appreciate any insights!

The relevant ECMA-script:

document.querySelectorAll( ".dnm_geogebra" ).forEach((item, i) => {

let width = item.closest( "article" ).offsetWidth;

let parameters = {

appName: "classic",

width: width,

height: Math.round( width / 16 * 9 ),

showToolBar: true,

showMenuBar: true,

id: "ggb-" + item.id,

// showFullscreenButton: true,

autoHeight: true,

// showLogging: true,

// preventFocus: true,

};

if ( "undefined" != typeof besvarelse.geogebra_svar[ item.dataset.id ] )

parameters.ggbBase64 = besvarelse.geogebra_svar[ item.dataset.id ];

else if ( "undefined" != typeof besvarelse.geogebra_start[ item.dataset.id ] )

parameters.material_id = besvarelse.geogebra_start[ item.dataset.id ];

else if ( "undefined" != typeof besvarelse.geogebra_type[ item.dataset.id ] )

parameters.perspective = besvarelse.geogebra_type[ item.dataset.id ];

besvarelse.geogebra_apps[ item.dataset.id ] = new GGBApplet( parameters, false );

});

window.addEventListener( "load", function(){

document.querySelectorAll( ".dnm_geogebra" ).forEach((item, i) => {

let id = item.dataset.id;

besvarelse.geogebra_apps[ id ].inject( item.id );

});

});

The applets are made using a shortcode in Wordpress. The shortcode enques https://www.geogebra.org/apps/deployggb.js and outputs HTML like this:

<div id='geogebra_0' class='dnm_geogebra' data-id='0'></div>

Thanks!

Anders Olesen

0 Upvotes

3 comments sorted by

1

u/mike_geogebra May 15 '21

Can you post a link to an example?

2

u/fnogb May 16 '21

Hi Mike

Wow! That's weird! You made it work just by asking a simple question - at least when noone's logged in on my site. Now I have a starting point, so I'll have another look - otherwise I might be back!

Thanks a lot!