<!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>
    <!--[if gte IE 9]>
    <meta http-equiv="X-UA-Compatible" content="IE=9">
    <![endif]-->

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

        web2d.peer =
        {
            svg: {}
        };

        web2d.peer.utils = {};
    </script> 

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

            var overflowWorkspace = new web2d.Workspace({fillColor:'green'});
            overflowWorkspace.setSize("400px", "400px");
            var line1 = new web2d.CurvedLine();
            line1.setStyle(web2d.CurvedLine.SIMPLE_LINE);
            line1.setFrom(200, 200);
            line1.setTo(100, 100);
            line1.setSrcControlPoint(new core.Point(-100, 0));
            line1.setDestControlPoint(new core.Point(100, 0));
            overflowWorkspace.append(line1);

            var line2 = new web2d.CurvedLine();
            line2.setStyle(web2d.CurvedLine.NICE_LINE);
            line2.setFrom(0, 0);
            line2.setTo(150, 90);
            line2.setSrcControlPoint(new core.Point(100, 0));
            line2.setDestControlPoint(new core.Point(-100, 0));
            overflowWorkspace.append(line2);

            overflowWorkspace.addItAsChildTo($('#overflowExample').first());

        }
    </script>
</head>

<body onload="initialize();">

<h1>PolyLines Render Tests </h1>

<table border="1">
    <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>