Author: jmorliaguet
Date: Sun Dec 25 19:03:59 2005
New Revision: 2077
Added:
cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/
cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/contextualmenus.css
(contents, props changed)
cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/cpsskins_contextualmenu_test.html
(contents, props changed)
Log:
- added functional test for the contextual menus
Added:
cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/contextualmenus.css
==============================================================================
--- (empty file)
+++
cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/contextualmenus.css
Sun Dec 25 19:03:59 2005
@@ -0,0 +1,136 @@
+
+.pad {
+ margin: 1em;
+ padding: 1em;
+ border: 1px solid #999;
+}
+
+#testArea1 {
+ width: 160px;
+ background-color: #dec;
+ border: 1px dotted #999;
+}
+
+#testArea2 {
+ width: 160px;
+ background-color: #ff9;
+ border: 1px dotted #999;
+}
+
+#area1 {
+ background-color: #fed;
+}
+
+#area2 {
+ background-color: #fdf;
+}
+
+#area3 {
+ background-color: #def;
+}
+
+#area4 {
+ background-color: #ffe;
+}
+
+#area5 {
+ background-color: #ddd;
+}
+
+#area6 {
+ background-color: #dce;
+}
+
+/* Contextual menu */
+
+.contextMenu {
+ position: absolute;
+ display: none;
+ cursor: default;
+ z-index: 2000;
+ display: table;
+ white-space: nowrap;
+}
+
+.contextMenu a {
+ text-decoration: none;
+ vertical-align: top;
+ cursor: default;
+ display: block;
+ background-repeat: no-repeat;
+ background-position: 6px center;
+}
+
+.contextMenu .submenu {
+ position: absolute;
+ top: auto;
+ left: auto;
+ border-width: 1px 2px 2px 1px;
+ border-style: solid;
+ border-color: #333;
+ margin-top: -2px;
+}
+
+.contextMenu .submenu a {
+ background: #f6f3f3;
+ background-repeat: no-repeat;
+ background-position: 6px center;
+}
+
+.contextMenu .submenu a:hover {
+ background-color: #326ab7;
+ color: #fff;
+}
+
+.contextMenu .submenu > .items { /* ignored by IE */
+ margin-top: -20px;
+}
+
+
+.contextMenu .separator {
+ border-top: 1px solid #ccc;
+ margin: 0.3em 0.8em 0.3em 0.8em;
+}
+
+.large {
+ font: 11px Verdana, Arial, Helvetica, sans-serif;
+ border-width: 1px 2px 2px 1px;
+ border-style: solid;
+ border-color: #666;
+ background: #eeeeec;
+ color: #000;
+ width: 120px;
+}
+
+.large a {
+ color: #000;
+ padding: 4px 5px 4px 29px;
+ width: 86px;
+}
+
+.large a:hover {
+ background-color: #3465a4;
+ color: #fff;
+}
+
+.small {
+ font: italic 9px Arial, Helvetica, sans-serif;
+ border-width: 1px;
+ border-style: solid;
+ border-color: #999;
+ background: #ffe;
+ color: #000;
+ width: 100px;
+}
+
+.small a {
+ color: #000;
+ padding: 2px 5px 2px 29px;
+ width: 66px;
+}
+
+.small a:hover {
+ background-color: #909;
+ color: #fff;
+}
+
Added:
cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/cpsskins_contextualmenu_test.html
==============================================================================
--- (empty file)
+++
cpsskins/branches/jmo-perspectives/ui/framework/tests/functional/cpsskins_contextualmenu_test.html
Sun Dec 25 19:03:59 2005
@@ -0,0 +1,96 @@
+<!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"; xml:lang="en" lang="en">
+<head>
+ <title>CPSSkins Unit test file</title>
+ <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+ <script src="../../prototype.js" type="text/javascript"></script>
+ <script src="../../cpsskins.js" type="text/javascript"></script>
+ <link rel="stylesheet" href="../test.css" type="text/css" />
+ <link rel="stylesheet" href="contextualmenus.css" type="text/css" />
+</head>
+
+<body>
+
+ <h1>CPSSkins Contextual menus</h1>
+
+ <div style="float: left; margin: 1em">
+ <h2>Menu 1</h2>
+ <div id="testArea1">
+ <div id="area1" class="pad"></div>
+ <div id="area2" class="pad" formattable="1"></div>
+ <div id="area3" class="pad" editable="1"></div>
+ <div id="area4" class="pad" formattable="1">
+ <div id="area5" class="pad" editable="1"></div>
+ </div>
+ </div>
+ </div>
+
+ <div style="float: left; margin: 1em">
+ <h2>Menu 2</h2>
+ <div id="testArea2">
+ <div id="area6" class="pad" editable="1" formattable="1"></div>
+ </div>
+ </div>
+
+ <div id="contextmenu1" class="contextMenu large">
+ <a action="edit" href="#">Edit</a>
+ <div class="separator"></div>
+ <a action="copy" href="#">Copy</a>
+ <a action="paste" href="#">Paste</a>
+ <div class="separator"></div>
+ <a action="format" href="#">Format</a>
+ <div class="separator"></div>
+ <a action="delete" href="#" confirm="Deleting, are you sure?">Delete</a>
+ </div>
+
+ <div id="contextmenu2" class="contextMenu small">
+ <a action="copy" href="#">Copy</a>
+ <a action="paste" href="#">Paste</a>
+ <a action="format" href="#">Format</a>
+ <a action="edit" href="#">Edit</a>
+ <a action="delete" href="#" confirm="Deleting, are you sure?">Delete</a>
+ </div>
+
+ <script type="text/javascript">
+ function displayChoice(selected, choice) {
+ alert('You have selected the ' + choice + ' item');
+ }
+
+ var contextmenu1 = new CPSSkins.ContextualMenu(
+ menu='contextmenu1',
+ area='testArea1',
+ actions = {
+ 'menu1.edit': {
+ handler: displayChoice,
+ visibility: 'editable'
+ },
+ 'menu1.copy': {
+ handler: displayChoice,
+ visibility: 'copyable'
+ },
+ 'menu1.paste': {
+ handler: displayChoice,
+ visibility: 'editable'
+ },
+ 'menu1.formats': {
+ handler: displayChoice,
+ visibility: 'formattable'
+ },
+ 'menu1.delete': {
+ handler: displayChoice,
+ visibility: 'editable'
+ }
+ });
+
+ var contextmenu2 = new CPSSkins.ContextualMenu(
+ menu='contextmenu2',
+ area='testArea2',
+ actions = contextmenu1.actions
+ );
+
+ </script>
+
+</body>
+
+</html>
--
http://lists.nuxeo.com/mailman/listinfo/z3lab-checkins
