<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">

<!--

   Licensed to the Apache Software Foundation (ASF) under one or more
   contributor license agreements.  See the NOTICE file distributed with
   this work for additional information regarding copyright ownership.
   The ASF licenses this file to You under the Apache License, Version 2.0
   (the "License"); you may not use this file except in compliance with
   the License.  You may obtain a copy of the License at

       http://www.apache.org/licenses/LICENSE-2.0

   Unless required by applicable law or agreed to in writing, software
   distributed under the License is distributed on an "AS IS" BASIS,
   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
   See the License for the specific language governing permissions and
   limitations under the License.

-->
<!-- ========================================================================= -->
<!-- This interactive test validates that the pointer-events property          -->
<!--                                                                           -->
<!-- @author tkormann@ilog.fr                                                  -->
<!-- @version $Id$ -->
<!-- ========================================================================= -->
<?xml-stylesheet type="text/css" href="../../resources/style/test.css" ?>  

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="body" width="450" height="500" viewBox="0 0 450 500">
<title>Pointer Events Test</title>

    <g id="content">

        <text class="title" x="50%" y="40">'pointer-events' Test
        <desc>Click in any of the links in the 
              table. You should see a smilley.</desc></text>

        <defs>
            <g id="smilley">
                <g  transform="scale(.8, .8) translate(-15,-15)">
                    <circle cx="15" cy="15" r="10"/>
                    <circle cx="12" cy="12" r="1.5" fill="black"/>
                    <circle cx="17" cy="12" r="1.5" fill="black"/>
                    <path d="M 10 19 A 8 8 0 0 0 20 19" stroke="black" stroke-width="1"/>
                </g>
            </g>

            <g id="success" fill="rgb(0,255,0)">
                <use xlink:href="#smilley" />
            </g>
            <g id="cell">
                <rect x="20" y="60" width="120" height="20" style="fill:#eee; stroke:black"/>
                <rect x="20" y="80" width="120" height="100" style="fill:none; stroke:black"/>

                <g>
                    <g>
                        <rect x="90" y="90" width="40" height="20" style="fill:#aaa"/>
                    </g>

                    <g transform="translate(0 30)">
                        <rect x="90" y="90" width="40" height="20" style="fill:none; stroke:black; stroke-width:4"/>
                    </g>

                    <g transform="translate(0 60)">
                        <rect x="90" y="90" width="40" height="20" style="fill:#aaa; stroke:black; stroke-width:4"/>
                    </g>
                </g>
            </g>

        </defs>

        <g transform="translate(5, 5) scale(.2)">
            <use xlink:href="#success"/>
            <a xlink:href="#svgView(viewBox(0,0,450,500))">
                <text y="-11" font-size="2" fill="blue" text-decoration="underline" text-anchor="middle">Return to test</text>
            </a>
        </g>

<!-- ######################################### -->


<g style="text-anchor:middle;">

<g transform="translate(0 0)">
    <use xlink:href="#cell" />
    <text x="80" y="74">visiblePainted</text>
</g>

<g transform="translate(140 0)">
    <use xlink:href="#cell" />
    <text x="80" y="74">visibleFill</text>
</g>

<g transform="translate(280 0)">
    <use xlink:href="#cell" />
    <text x="80" y="74">visibleStroke</text>
</g>

<g transform="translate(0 130)">
    <use xlink:href="#cell" />
    <text x="80" y="74">visible</text>
</g>

<g transform="translate(140 130)">
    <use xlink:href="#cell" />
    <text x="80" y="74">painted</text>
</g>

<g transform="translate(280 130)">
    <use xlink:href="#cell" />
    <text x="80" y="74">fill</text>
</g>

<g transform="translate(0 260)">
    <use xlink:href="#cell" />
    <text x="80" y="74">stroke</text>
</g>

<g transform="translate(140 260)">
    <use xlink:href="#cell" />
    <text x="80" y="74">all</text>
</g>

<g transform="translate(280 260)">
    <use xlink:href="#cell" />
    <text x="80" y="74">none</text>
</g>

<!-- ######################################### -->

<g transform="translate(0 0)" style="pointer-events:visiblePainted">
    <a xlink:href="#svgView(viewBox(3,2.5,4,4))">
        <g style="fill:crimson">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 30)" style="fill:none; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 60)" style="fill:crimson; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

    </a>
</g>

<g transform="translate(140 0)" style="pointer-events:visibleFill">
    <a xlink:href="#svgView(viewBox(3,2.5,4,4))">
        <g style="fill:crimson">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 30)" style="fill:none; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 60)" style="fill:crimson; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

    </a>
</g>

<g transform="translate(280 0)" style="pointer-events:visibleStroke">
    <a xlink:href="#svgView(viewBox(3,2.5,4,4))">
        <g style="fill:crimson">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 30)" style="fill:none; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 60)" style="fill:crimson; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

    </a>
</g>

<g transform="translate(0 130)" style="pointer-events:visible">
    <a xlink:href="#svgView(viewBox(3,2.5,4,4))">
        <g style="fill:crimson">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 30)" style="fill:none; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 60)" style="fill:crimson; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

    </a>
</g>

<g transform="translate(140 130)" style="pointer-events:painted">
    <a xlink:href="#svgView(viewBox(3,2.5,4,4))">
        <g style="fill:crimson">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 30)" style="fill:none; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 60)" style="fill:crimson; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

    </a>
</g>

<g transform="translate(280 130)" style="pointer-events:fill">
    <a xlink:href="#svgView(viewBox(3,2.5,4,4))">
        <g style="fill:crimson">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 30)" style="fill:none; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 60)" style="fill:crimson; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

    </a>
</g>

<g transform="translate(0 260)" style="pointer-events:stroke">
    <a xlink:href="#svgView(viewBox(3,2.5,4,4))">
        <g style="fill:crimson">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 30)" style="fill:none; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 60)" style="fill:crimson; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

    </a>
</g>

<g transform="translate(140 260)" style="pointer-events:all">
    <a xlink:href="#svgView(viewBox(3,2.5,4,4))">
        <g style="fill:crimson">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 30)" style="fill:none; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 60)" style="fill:crimson; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

    </a>
</g>

<g transform="translate(280 260)" style="pointer-events:none">
    <a xlink:href="#svgView(viewBox(3,2.5,4,4))">
        <g style="fill:crimson">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 30)" style="fill:none; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

        <g transform="translate(0 60)" style="fill:crimson; stroke:gold; stroke-width:4">
            <rect x="30" y="90" width="40" height="20" />
            <rect x="90" y="90" width="40" height="20" style="visibility:hidden"/>
        </g>

    </a>
</g>

</g>




    </g><!-- "content" -->

    <!-- ============================================================= -->
    <!-- Batik sample mark                                             -->
    <!-- ============================================================= -->
    <use xlink:href="../../../batikLogo.svg#Batik_Tag_Box" />

</svg>
