HTML5 Coming to MapTool

You are currently viewing HTML5 Coming to MapTool

The MapTool elves have been busy this holiday season. They’ve introduced two new macro functions to produce HTML5 dialogs and frames. The new macro functions frame5() and dialog5() can be used in place of the HTML3 frame() and dialog() macro functions.

The new functionality allows the use of CSS3 and Javascript within the HTML frame/dialog so your formatting options now include those available to modern web applications. It has the limitation of not being able to access external assets.

You should now be able to do things like conditional displays like the code below.

[frame5("MyFrame"):{
<!DOCTYPE html>
<html lang="en">
<head>
    <script type="text/javascript">
    [r:"
        function toggle_visibility(id) {
            var e = document.getElementById(id);
            if (e.style.display == 'block')
                e.style.display = 'none';
            else
                e.style.display = 'block';
        }
        "]
    </script>
</head>
<body>
    <h1>Online Help</h1>
    <p class="boxtitle"><a href="#" onclick="toggle_visibility('help_topics');" class="boxtitle">Show/Hide Help Topics</a></p>
    <ul id="help_topics" style='display:none;'>
        <li>Products - blah blah blah.</li>
        <li>Blogs - blah blah blah.</li>
        <li>Documentation - blah blah blah.</li>
        <li>Partners - blah blah blah.</li>
    </ul>
</body>
</html>
}]

If you are a framework developer or web developer, please download the MapTool 1.6 alpha release and put the frame5 and dialog 5 through its paces. Please report problems back to our Discord server or the RPTools forums. You can download the alpha release of MapTool 1.6 here.

Excited about the new functionality? Let’s discuss in the comments below or on one of our many social outlets.

Discord
RPTools Forum
Like us on Facebook
Follow us on Twitter
Reddit
Log and issue or fork a branch of the code on GitHub

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.