WeBWorK Main Forum

Overlapping Text with entry cells when using GeoGebra

Overlapping Text with entry cells when using GeoGebra

by tim Payer -
Number of replies: 1
Greetings,

I would like to know if there is a solution for the overlapping text that occurs for WeBWorK problems that use GeoGebra applets with Javascript.

I am also writing on behalf of the folks at ECE dept at North Carolina who are experiencing the same problem with their WeBWorK problems that use GeoGebra applets with Javascript.

Below is the Source Code from Michael Gage's workshop (at webwork/2017/_ur_ww_workshop/geogebra/4) that has the same problem:

Is this something in the code or our browsers that would cause this overlapping?

## DBsubject(Algebra) ## DBchapter(Conic sections) ## DBsection(Circles) DOCUMENT(); loadMacros( "PGstandard.pl", "MathObjects.pl", "PGinfo.pl", "AppletObjects.pl", #"source.pl", "PGcourse.pl", ); TEXT(beginproblem()); $showPartialCorrectAnswers = 1; Context("Numeric"); ################################# # Set up problem # Set parameters for a circle ################################# ($a0, $b0) = (2,2); #( random(-5,5,1), random(-5,5,1) ); $r0 = random(2,5,1); $top0 = $b0 + $r0; ($a1, $b1) = (4,4); #( random(-5,5,1), random(-5,5,1) ); $r1 = random(2,5,1); $top1 = $b1 + $r1; $r2 = $r1**2; $answer = Compute("($a1, $b1, $r2)"); ###################################### # Create link to applet: ################################### # You can name your applet (anything reasonable :-) ) # Adjust the height and width as desired # Paste the geogebra parameters in at the bottom of the page just above the # command end command # so that they don't get in the way ################################### $appletName = "ggbfoo"; $applet = GeogebraWebApplet( code => "geogebra.GeoGebraApplet", archive => "geogebra.jar", codebase => findAppletCodebase("geogebra.jar"), appletName => $appletName, appletId => $appletName, submitActionAlias => 'getAppletValues', # default actionAlias initializeActionAlias => '', # default actionAlias setStateAlias => 'setXML', getStateAlias => 'getXML', setConfigAlias => '', getConfigAlias => '', returnFieldName => '', width => 526, # may want to modify width height => 552, # may want to modify height # mayscript => "true", debugMode => 0, # set debugMode to 0 for no debug # to 1 to make xml representation visible # to 2 to add alerts detailing progression # through the applet onInit => 'ggbOnInit', type => 'geogebraweb', submitActionScript => qq{ getQE('answerBox').value = getAppletValues() }, selfLoading => 1, params => GEOGEBRA_PARAMS(),# paste parameters in ); ################################## # Setup GeogebraWebApplet -- ################################### HEADER_TEXT( MODES(TeX=>'', HTML=><<END_SCRIPT ) ); <script language="javascript"> function ggbOnInit(param) { var applet = document.$appletName; if (param == "$appletName") { applet_loaded(param,1); // report that applet is ready. ww_applet_list[param].safe_applet_initialize(2); ww_applet_list[param].object = param; console.log("ggbOnInit: ww_applet_list["+param+"].object = ", ww_applet_list[param].object ); } } </script> END_SCRIPT HEADER_TEXT( MODES(TeX=>'', HTML=><<END_SCRIPT ) ); <script language="javascript"> function setConfig() { var appletState = getQE('${appletName}_state').value; //console.log("appletState =" + appletState); //console.log( "foobar " +ww_applet_list['$appletName'].object); if (ww_applet_list['$appletName'].object == undefined ) { setTimeout("setConfig()", 5000); console.log("waiting"); } else { //console.log("run setConfig"); //console.log("object is " +ww_applet_list['ggbfoo'].object); var applet=$appletName; applet.evalCommand("A = ($a0,$b0)"); applet.setCoords('B',$a1,$b1) ; } } </script> END_SCRIPT HEADER_TEXT( MODES(TeX=>'', HTML=><<END_SCRIPT ) ); <script language="javascript"> function getAppletValues() { console.log("getAppletValues() entered"); // get a handle for the applet object var applet = $appletName; var Ax = applet.getXcoord("A"); var Ay = applet.getYcoord("A"); var Bx = applet.getXcoord("B"); var By = applet.getYcoord("B"); var r2 = Math.pow( (Ax-Bx),2) + Math.pow( (Ay -By),2); return( Ax + ',' + Ay + ',' + r2); } </script> END_SCRIPT ################################### #insert applet into body -- this does not need to be changed # except to adjust the insertion of the reinitialize_button or # a hidden AnswerBox ################################### TEXT($PAR, MODES(TeX=>'geogebraweb code', HTML=>$applet->insertAll( debug =>0, reinitialize_button => 1, includeAnswerBox=>1, ))); ####################################### # TEXT ####################################### Context()->texStrings; BEGIN_TEXT Graph the circle with equation \[(x - $a1)^2 + (y - $b1)^2 = $r2 \] by clicking and dragging points \( A \) and \( B \) in the interactive figure below. Click the submit answers button when you are done. $PAR $PAR END_TEXT #TEXT($PAR, "foostate |", $inputs_ref->{ "${appletName}_state"}, "|"); TEXT( "run SetConfig", q!<script language="javascript">setConfig()</script> !) if $inputs_ref->{ "${appletName}_state"} =~ "restart_applet"; ######################################### # ANSWER section ######################################### NAMED_ANS( 'answerBox' => $answer->cmp ); sub GEOGEBRA_PARAMS { my $result = { showResetIcon=>"false" , enableRightClick=>"false" , enableLabelDrags=>"false", showMenuBar=>"false" , showToolBar=>"false", showAlgebraInput=>"false", useBrowserForJS=>"true", ggbbase64=>"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" }; $result; } ENDDOCUMENT();

Thanks, tim


In reply to tim Payer

Re: Overlapping Text with entry cells when using GeoGebra

by Michael Gage -
I think the geogebra display problem is fixed now on https://demo.webwork.rochester.edu/webwork2/2017_UR_WW_workshop/geogebra/

The problem appears to be a change in the geogebra code imported to run the geogebra applet. In order to accommodate the change by the geogebra site we've modified code in Applet.pm. This was done in pull requests:
https://github.com/openwebwork/pg/pull/354
and 355.
They have been incorporated into the master branch and the develop branch respectively so updating your code base using github will restore the proper display of geogebra applets.

You can also view the changes (only a few lines) by following the link above.