(Geogebra) interactives not scaling correctly on mobile

[Gabriel Indurskis]

Hi all,

I've run into the strange problem that on mobile devices (tested on iPhone, but also verified with the "Responsive Design Mode" in Firefox on desktop for various mobile devices) Geogebra interactives (and maybe others?) will not respect the 100% width, whereas on a desktop browser it works perfectly - see the screenshots:

Mobile:

Desktop:

The relevant source code is:

<figure xml:id="fig-shadow-of-a-vector"> <caption>The <q>shadow</q> or <q>projection</q> of a vector onto a given line</caption> <interactive geogebra="yr7bkqh6" width="100%" aspect="3:2" reset-icon="yes" shift-drag-zoom="yes" /> </figure>

​

but the same also happens when using the alternative method using a slate:

<figure xml:id="fig-shadow-of-a-vector"> <caption>The <q>shadow</q> or <q>projection</q> of a vector onto a given line</caption> <interactive platform="geogebra" width="100%" aspect="3:2"> <slate surface="geogebra" material="yr7bkqh6" /> </interactive> </figure>

​

I've tested this both with the denver and default-modern themes, the problem occurs in both.

Another data point:   When reducing the font-size in the browser on an iPhone to 50%, the width of the interactive is suddenly correct.

I've searched the message archive and only found an older thread about iframes not scaling correctly on mobile, but maybe this is related?

Thanks in advance for any insights!

Gabriel

P.S.: This is still heavily work-in-progress, but the page is live at https://math.mychamplain.ca/cla/sec-projections.html

[Sean Fitzpatrick]

I haven't used GeoGebra in PreTeXt much, but my experience with GeoGebra on their own site is that the applets are pretty rigid in terms of size.
When I create an applet I always see a warning that it's too big. Sometimes I can resize within the app and that helps.

--
You received this message because you are subscribed to the Google Groups "PreTeXt support" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pretext-suppo...@googlegroups.com.
To view this discussion visit https://groups.google.com/d/msgid/pretext-support/29d0acd0-3d1b-46e2-ad0f-658d639373fcn%40googlegroups.com.

[D. Brian Walton]

As far as I understand, the 100% width is referring to 100% of the reading width of 600 px for when the content is generated. The CSS for the page adjusts boundaries and page structure for window widths larger than 600 px, but once it is smaller, the text will flow properly but in the narrower width, but I'm not sure that iframes scale at all. On a desktop browser with a narrow window and zooming in, you'll find the same behavior.

We did find a lot of subtlety on mapping the width of the original GeoGebra content to the slate used in the document, but this seems to be unrelated to that.

Brian

To view this discussion visit https://groups.google.com/d/msgid/pretext-support/CAH%2BNcPbStGxXRrAsVXXSyo0ynJ9%2BatRsscrGkmideZyNE0dhaQ%40mail.gmail.com.

[Gabriel Indurskis]

Thanks for the insights, everyone.

So I guess this means there is no fix for this at the moment?

I've tried to use the `material-width` and `material-height` attributes (as described in thread https://groups.google.com/g/pretext-support/c/ETIbKs5h9I8/m/t6SmyEE-AAAJ), which does help forcing the internal sizing of the geogebra material - but, as Brian pointed out, this has no effect on the scaling below the 600px width.

Thanks again,

Gabriel

[Andrew Scholer]

Gabriel - 

There is a draft update that may fix this issue: https://github.com/PreTeXtBook/pretext/pull/2590

You can test out the new behavior here: https://computerscience.chemeketa.edu/ascholer/pretext-test/interactives/section-interactive-server.html

Since the update was in part motivated by your post, please check it out and let me know if you think it addresses your concerns.

Regards,

Andrew Scholer (he/him/his)

Computer Science Instructor

Chemeketa Community College

503.589.7649 

computerscience.chemeketa.edu/people/andrew-scholer/

To view this discussion visit https://groups.google.com/d/msgid/pretext-support/baf44543-936d-49c4-a667-c9b9694fbf5fn%40googlegroups.com.

[Gabriel Indurskis]

Hi Andrew,

this is fantastic, and (as far as I could test with your sample site) seems to completely fix the problem. Thanks so much for this quick fix!

Cheers,

Gabriel