PreTeXtBook / pretext

PreTeXt: an authoring and publishing system for scholarly documents
https://pretextbook.org
Other
254 stars 202 forks source link

Height to large: Interactive tag using pure JavaScript #2157

Open Aljumaily opened 2 weeks ago

Aljumaily commented 2 weeks ago

I have been trying to use pure JavaScript within the .ptx file and the only way was to use the interactive tag (as mentioned here). The simple code snippet is the following:

<p>The start of the text.</p>
<interactive xml:id="my-sample-code" platform="javascript">
  <script>
    console.log("Hello!");
  </script>
</interactive>
<p>The end.</p>

The issue is that the entire script would be wrapped in an iframe tag, which has a width and height of 600 and produces the following:

large-height

Looking into the source code generated, from the following line: <iframe id="my-sample-code" width="600" height="600" src="my-sample-code-if.html"></iframe><div class="para" id="sec-section-name-4">The end.</div></section></div> change height="600" to max-height="600". Also, change the definition of the div inside of my-sample-codex-if.html that is linked in the above line from: <body class="ptx-content ignore-math"><div style="width:600px; height:600px; display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;">

to having the height to be max-height:600px.

One might think we could pass height and weight through the interactive tag, but this wouldn't work for whatever reason. In other words, the following has no effect:

<interactive xml:id="my-sample-code" platform="javascript" width="90%" height="10%">
  <script>
    console.log("Hello!");
  </script>
</interactive>
rbeezer commented 2 weeks ago

I think this should begin as a support question, and only when we know that there is something to be done, should it become a GitHub issue.

Please see the following, especially A.1 and A.3. Thanks.

Appendix A: Welcome to the PreTeXt Community https://pretextbook.org/doc/guide/html/welcome.html