<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <style>
        th,
        td {
            border: 1px solid black;
        }
    </style>

    <script type="text/javascript">
        web2d = {
            peer: {}
        };

        web2d.peer =
        {
            svg: {}
        };

        web2d.peer.utils = {};
    </script>
    <script type="text/javascript">
        function initialize() {
            web2d.Toolkit.init();

            var overflowWorkspace = new web2d.Workspace({ fillColor: 'green' });
            overflowWorkspace.setSize("200px", "200px");
            var arrow = new web2d.Arrow();
            arrow.setFrom(50, 50);
            arrow.setControlPoint(new core.Point(-50, 0));

            overflowWorkspace.append(arrow);

            var arrow2 = new web2d.Arrow();
            arrow2.setFrom(100, 50);
            arrow2.setControlPoint(new core.Point(50, 50));

            overflowWorkspace.append(arrow2);

            overflowWorkspace.addItAsChildTo($('#overflowExample').first());
        }
    </script>
</head>

<body onload="initialize();">

    <h1>PolyLines Render Tests </h1>

    <table>
        <colgroup style="width:80%;">
            <col style="width:30%" />
            <col style="width:60%" />
        </colgroup>
        <tr>
            <td>
                Different types of PolyLines that can be used.
            </td>
            <td>
                <div id="overflowExample" />
            </td>

        </tr>
        <tr>
            <td>
                This is how multiple childs will look in each style line
            </td>
            <td>
                <div id="multipleLineExample" />
            </td>

        </tr>
    </table>
</body>

</html>