Mercurial > hg > digilib-old

view webapp/src/main/webapp/jquery/jquery-test-svg.html @ 1118:f0474c1faaff

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
trying new annotator authentication.
author robcast
date Tue, 06 Nov 2012 18:24:39 +0100
parents 6407c33355a2
children bd90fdfd55f7
line wrap: on
line source

<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:xlink="http://www.w3.org/1999/xlink" >
    <head>
        <title>jquery.digilib.svg.js test</title>

        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript" src="jquery.cookie.js"></script>
        <script type="text/javascript" src="jquery.digilib.js"></script>
        <script type="text/javascript" src="jquery.digilib.geometry.js"></script>
        <script type="text/javascript" src="jquery.digilib.arrows.js"></script>
        <script type="text/javascript" src="jquery.range.js"></script>
        <link rel="stylesheet" type="text/css" href="jquery.range.css" />
        <script type="text/javascript" src="jquery.digilib.buttons.js"></script>
        <script type="text/javascript" src="jquery.digilib.dialogs.js"></script>
        <script type="text/javascript" src="jquery.digilib.sliders.js"></script>
        <script type="text/javascript" src="jquery.digilib.birdseye.js"></script>
        <script type="text/javascript" src="jquery.digilib.marks.js"></script>
        <script type="text/javascript" src="jquery.digilib.regions.js"></script>
        <link rel="stylesheet" type="text/css" href="jquery.digilib.css" />
        <script type="text/javascript" src="svg/jquery.svg.js"></script>
        <script type="text/javascript" src="jquery.digilib.svg.js"></script>
        <link rel="stylesheet" type="text/css" href="jquery.digilib.svg.css" />

        <script type="text/javascript">
            $(document).ready(function(){
                var opts = {
                    interactionMode : 'fullscreen',
                    showRegionNumbers : true
                    };
                var $div = $('div#digilib');
                $div.digilib(opts);
                DIGILIB = function (action) {
                    return $div.digilib(action);
                    };
            });
        </script>
    </head>

    <body>

        <div id="digilib">
            <p>digilib doesn't work! Please switch on Javascript or notify the server administrator!</p>
            <img src="http://digilib.berlios.de/images/digilib-logo-big.png" />
        </div>

        <a href="javascript: DIGILIB('test')">test</a>

        <div id="dl_svgdiv">
            <svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1 1">
                <g style="stroke-width: 0.005; fill: none">
                    <rect x="0.0" y="0.0" width="1.0" height="1.0" style="stroke: red" />
                    <rect x="0.1" y="0.1" width="0.8" height="0.8" style="stroke: orange" />
                    <rect x="0.2" y="0.2" width="0.6" height="0.6" style="stroke: yellow" />
                    <rect x="0.3" y="0.3" width="0.4" height="0.4" style="stroke: green" />
                    <rect x="0.4" y="0.4" width="0.2" height="0.2" style="stroke: cyan" />
                    <g style="fill:magenta; stroke:silver; fill-opacity:0.1; stroke-opacity:0.9">
                        <rect x="0.025" y="0.025" width="0.05" height="0.05"/>
                        <rect x="0.125" y="0.025" width="0.05" height="0.05"/>
                        <rect x="0.225" y="0.025" width="0.05" height="0.05"/>
                        <rect x="0.325" y="0.025" width="0.05" height="0.05"/>
                        <rect x="0.425" y="0.025" width="0.05" height="0.05"/>
                        <rect x="0.525" y="0.025" width="0.05" height="0.05"/>
                        <rect x="0.625" y="0.025" width="0.05" height="0.05"/>
                        <rect x="0.725" y="0.025" width="0.05" height="0.05"/>
                        <rect x="0.825" y="0.025" width="0.05" height="0.05"/>
                        <rect x="0.925" y="0.025" width="0.05" height="0.05"/>
                    </g>
                    <g style="fill:blue; stroke:silver; fill-opacity:0.1; stroke-opacity:0.9">
                        <rect x="0.025" y="0.125" width="0.05" height="0.05"/>
                        <rect x="0.125" y="0.125" width="0.05" height="0.05"/>
                        <rect x="0.225" y="0.125" width="0.05" height="0.05"/>
                        <rect x="0.325" y="0.125" width="0.05" height="0.05"/>
                        <rect x="0.425" y="0.125" width="0.05" height="0.05"/>
                        <rect x="0.525" y="0.125" width="0.05" height="0.05"/>
                        <rect x="0.625" y="0.125" width="0.05" height="0.05"/>
                        <rect x="0.725" y="0.125" width="0.05" height="0.05"/>
                        <rect x="0.825" y="0.125" width="0.05" height="0.05"/>
                        <rect x="0.925" y="0.125" width="0.05" height="0.05"/>
                    </g>
                    <g style="fill:cyan; stroke:silver; fill-opacity:0.1; stroke-opacity:0.9">
                        <rect x="0.025" y="0.225" width="0.05" height="0.05"/>
                        <rect x="0.125" y="0.225" width="0.05" height="0.05"/>
                        <rect x="0.225" y="0.225" width="0.05" height="0.05"/>
                        <rect x="0.325" y="0.225" width="0.05" height="0.05"/>
                        <rect x="0.425" y="0.225" width="0.05" height="0.05"/>
                        <rect x="0.525" y="0.225" width="0.05" height="0.05"/>
                        <rect x="0.625" y="0.225" width="0.05" height="0.05"/>
                        <rect x="0.725" y="0.225" width="0.05" height="0.05"/>
                        <rect x="0.825" y="0.225" width="0.05" height="0.05"/>
                        <rect x="0.925" y="0.225" width="0.05" height="0.05"/>
                    </g>
                    <g style="fill:green; stroke:silver; fill-opacity:0.1; stroke-opacity:0.9">
                        <rect x="0.025" y="0.325" width="0.05" height="0.05"/>
                        <rect x="0.125" y="0.325" width="0.05" height="0.05"/>
                        <rect x="0.225" y="0.325" width="0.05" height="0.05"/>
                        <rect x="0.325" y="0.325" width="0.05" height="0.05"/>
                        <rect x="0.425" y="0.325" width="0.05" height="0.05"/>
                        <rect x="0.525" y="0.325" width="0.05" height="0.05"/>
                        <rect x="0.625" y="0.325" width="0.05" height="0.05"/>
                        <rect x="0.725" y="0.325" width="0.05" height="0.05"/>
                        <rect x="0.825" y="0.325" width="0.05" height="0.05"/>
                        <rect x="0.925" y="0.325" width="0.05" height="0.05"/>
                    </g>
                    <g style="fill:yellow; stroke:silver; fill-opacity:0.1; stroke-opacity:0.9">
                        <rect x="0.025" y="0.425" width="0.05" height="0.05"/>
                        <rect x="0.125" y="0.425" width="0.05" height="0.05"/>
                        <rect x="0.225" y="0.425" width="0.05" height="0.05"/>
                        <rect x="0.325" y="0.425" width="0.05" height="0.05"/>
                        <rect x="0.425" y="0.425" width="0.05" height="0.05"/>
                        <rect x="0.525" y="0.425" width="0.05" height="0.05"/>
                        <rect x="0.625" y="0.425" width="0.05" height="0.05"/>
                        <rect x="0.725" y="0.425" width="0.05" height="0.05"/>
                        <rect x="0.825" y="0.425" width="0.05" height="0.05"/>
                        <rect x="0.925" y="0.425" width="0.05" height="0.05"/>
                    </g>
                    <g style="fill:orange; stroke:silver; fill-opacity:0.1; stroke-opacity:0.9">
                        <rect x="0.025" y="0.525" width="0.05" height="0.05"/>
                        <rect x="0.125" y="0.525" width="0.05" height="0.05"/>
                        <rect x="0.225" y="0.525" width="0.05" height="0.05"/>
                        <rect x="0.325" y="0.525" width="0.05" height="0.05"/>
                        <rect x="0.425" y="0.525" width="0.05" height="0.05"/>
                        <rect x="0.525" y="0.525" width="0.05" height="0.05"/>
                        <rect x="0.625" y="0.525" width="0.05" height="0.05"/>
                        <rect x="0.725" y="0.525" width="0.05" height="0.05"/>
                        <rect x="0.825" y="0.525" width="0.05" height="0.05"/>
                        <rect x="0.925" y="0.525" width="0.05" height="0.05"/>
                    </g>
                    <g style="fill:red; stroke:silver; fill-opacity:0.1; stroke-opacity:0.9">
                        <rect x="0.025" y="0.625" width="0.05" height="0.05"/>
                        <rect x="0.125" y="0.625" width="0.05" height="0.05"/>
                        <rect x="0.225" y="0.625" width="0.05" height="0.05"/>
                        <rect x="0.325" y="0.625" width="0.05" height="0.05"/>
                        <rect x="0.425" y="0.625" width="0.05" height="0.05"/>
                        <rect x="0.525" y="0.625" width="0.05" height="0.05"/>
                        <rect x="0.625" y="0.625" width="0.05" height="0.05"/>
                        <rect x="0.725" y="0.625" width="0.05" height="0.05"/>
                        <rect x="0.825" y="0.625" width="0.05" height="0.05"/>
                        <rect x="0.925" y="0.625" width="0.05" height="0.05"/>
                    </g>
                    <g style="fill:magenta; stroke:silver; fill-opacity:0.1; stroke-opacity:0.9">
                        <rect x="0.025" y="0.725" width="0.05" height="0.05"/>
                        <rect x="0.125" y="0.725" width="0.05" height="0.05"/>
                        <rect x="0.225" y="0.725" width="0.05" height="0.05"/>
                        <rect x="0.325" y="0.725" width="0.05" height="0.05"/>
                        <rect x="0.425" y="0.725" width="0.05" height="0.05"/>
                        <rect x="0.525" y="0.725" width="0.05" height="0.05"/>
                        <rect x="0.625" y="0.725" width="0.05" height="0.05"/>
                        <rect x="0.725" y="0.725" width="0.05" height="0.05"/>
                        <rect x="0.825" y="0.725" width="0.05" height="0.05"/>
                        <rect x="0.925" y="0.725" width="0.05" height="0.05"/>
                    </g>
                    <g style="fill:blue; stroke:silver; fill-opacity:0.1; stroke-opacity:0.9">
                        <rect x="0.025" y="0.825" width="0.05" height="0.05"/>
                        <rect x="0.125" y="0.825" width="0.05" height="0.05"/>
                        <rect x="0.225" y="0.825" width="0.05" height="0.05"/>
                        <rect x="0.325" y="0.825" width="0.05" height="0.05"/>
                        <rect x="0.425" y="0.825" width="0.05" height="0.05"/>
                        <rect x="0.525" y="0.825" width="0.05" height="0.05"/>
                        <rect x="0.625" y="0.825" width="0.05" height="0.05"/>
                        <rect x="0.725" y="0.825" width="0.05" height="0.05"/>
                        <rect x="0.825" y="0.825" width="0.05" height="0.05"/>
                        <rect x="0.925" y="0.825" width="0.05" height="0.05"/>
                    </g>
                    <g style="fill:darkgrey; stroke:silver; fill-opacity:0.1; stroke-opacity:0.9">
                        <rect x="0.025" y="0.925" width="0.05" height="0.05"/>
                        <rect x="0.125" y="0.925" width="0.05" height="0.05"/>
                        <rect x="0.225" y="0.925" width="0.05" height="0.05"/>
                        <rect x="0.325" y="0.925" width="0.05" height="0.05"/>
                        <rect x="0.425" y="0.925" width="0.05" height="0.05"/>
                        <rect x="0.525" y="0.925" width="0.05" height="0.05"/>
                        <rect x="0.625" y="0.925" width="0.05" height="0.05"/>
                        <rect x="0.725" y="0.925" width="0.05" height="0.05"/>
                        <rect x="0.825" y="0.925" width="0.05" height="0.05"/>
                        <rect x="0.925" y="0.925" width="0.05" height="0.05"/>
                    </g>
                </g>
            </svg>
        </div>

    </body>
</html>