tests/manual/contextmenu.html

	contextmenu.html revision 12df09d952fd1b176ed5930f9b30c7fb1a80dc0b
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots<!DOCTYPE html>
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots<html lang="en">
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots    <head>
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots        <meta charset="utf-8">
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots        <meta http-equiv="X-UA-Compatible" content="IE=edge">
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots        <title>contextmenu synthetic event</title>
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots        <meta name="author" content="Todd Kloots">
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots        <style type="text/css">
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots          body {
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots/*
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots            padding-top: 500px;
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots            padding-bottom: 200px;
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots*/
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots          }
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots          #menu {
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots            position: absolute;
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots            display: none;
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots            background: #ccc;
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots            padding: 0;
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots            margin: 0;
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots            list-style-type: none;
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots          }
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots        </style>
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots        <script type="text/javascript" src="/build/yui/yui.js"></script>
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots        <script type="text/javascript">
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots          YUI({
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots            filter: (window.location.search.match(/[?&]filter=([^&]+)/) || [])[1] || 'min',
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots            allowRollup: false,
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots            lazyEventFacade: true
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots          }).use("event-contextmenu", "node-event-delegate", "node-style", "node-screen", function (Y) {
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots            Y.one("doc").delegate("contextmenu", function (e) {
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots              e.preventDefault();
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots              var menu = Y.one("#menu");
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots              menu.setStyle("display", "block");
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots              menu.setXY([e.pageX, e.pageY]);
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots            }, "button");
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots/*
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots            Y.one("#btn-1").on("contextmenu", function (e) {
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots              Y.log(e.pageX);
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots              Y.log(e.pageY);
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots            });
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots*/
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots          });
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots        </script>
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots    </head>
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots    <body>
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots       <button id="btn-1">Button 1</button>
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots       <button id="detach-btn">Detach Listeners</button>
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots     <ul id="menu">
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots        <li>Option 1</li>
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots        <li>Option 2</li>
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots        <li>Option 3</li>
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots     </ul>
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
12df09d952fd1b176ed5930f9b30c7fb1a80dc0bTodd Kloots
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots    </body>
7af920b5469a3ebc416dace31e18e2d1abfea057Todd Kloots</html>