PreTeXtBook
Height to large: Interactive tag using pure JavaScript
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:
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>
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
