source: Dev/branches/rest-dojo-ui/client/dojox/gfx/tests/events-canvas.html @ 256

Last change on this file since 256 was 256, checked in by hendrikvanantwerpen, 13 years ago

Reworked project structure based on REST interaction and Dojo library. As
soon as this is stable, the old jQueryUI branch can be removed (it's
kept for reference).
File size: 1.7 KB
Line 
1<!DOCTYPE html>
2<html>
3        <head>
4                <title>dojox.gfx: Canvas events bug</title>
5                <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
6                <script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug:true, gfxRenderer:'canvas'">
7                </script>
8                <script type="text/javascript">
9                       
10                        require([
11                                "dojo/ready",
12                                "dojo/dom",
13                                "dojox/gfx",
14                                "dojox/gfx/matrix"
15                                ],function(ready, dom, gfx, matrix){
16                                        var container = null, surface = null;
17                                       
18                                        ready(function(){
19                                                container = dom.byId("gfx_holder");
20                                                surface = gfx.createSurface(container, 600, 100);
21                                               
22                                                var g1 = surface.createGroup(), g2 = surface.createGroup();
23                                               
24                                                g1.setTransform(matrix.translate({x: 0,y: 0}));
25                                                g1.createRect({x: 0,y: 0,width: 220,height: 56,r: 12}).setFill("#212833");
26                                                g1.createImage({x: 0,y: 0,width: 215,height: 53,src: 'http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif'});
27                                                g1.connect("onclick", null, function(){alert('Thank you for choosing jQuery')});
28                                               
29                                                g2.setTransform(matrix.translate({x: 300,y: 0}));
30                                                g2.createPath("M0 -10l16 0").setStroke({color: 'red',width: 4});
31                                                g2.createRect({x: 0,y: 0,width: 220,height: 56,r: 12}).setFill("#212833");
32                                                g2.createImage({x: 0,y: 0,width: 123,height: 56,src: 'http://dojotoolkit.org/images/logo.png'});
33                                                g2.connect("onclick", null, function(){alert('Thank you for choosing dojo')});
34                                               
35                                        });
36                                });
37                </script>
38        </head>
39        <body>
40                <h1>dojox.gfx: Canvas events bug (Canvas version)</h1>
41                <p>
42                        Click on one of the image below. An alert should pop up displaying the chosen framework name.
43                </p>
44                <div id="gfx_holder" style="width: 600px; height: 100px;">
45                </div>
46        </body>
47</html>
Note: See TracBrowser for help on using the repository browser.