r13469 - in Products.Archetypes/trunk/Products/Archetypes/skins/archetypes/widgets: js tests

"Matt Barkau" <[email protected]>
Newsgroups gmane.comp.web.zope.plone.archetypes.cvs
Message-ID <[email protected]>
Author: rmattb
Date: Fri Feb 11 04:13:59 2011
New Revision: 13469

Modified:
   Products.Archetypes/trunk/Products/Archetypes/skins/archetypes/widgets/js/keywordmultiselect.js
   Products.Archetypes/trunk/Products/Archetypes/skins/archetypes/widgets/tests/keywordmultiselecttests.js
Log:
Renamed options box in JavaScript test for keyword multiple select enhancement PLIP. Refs #11017.

Modified: Products.Archetypes/trunk/Products/Archetypes/skins/archetypes/widgets/js/keywordmultiselect.js
==============================================================================
--- Products.Archetypes/trunk/Products/Archetypes/skins/archetypes/widgets/js/keywordmultiselect.js	(original)
+++ Products.Archetypes/trunk/Products/Archetypes/skins/archetypes/widgets/js/keywordmultiselect.js	Fri Feb 11 04:13:59 2011
@@ -88,67 +88,149 @@
 		return html;
 	}
 	
-//	// Handle navigation of options
-//	function handleNavigation(device, element, option) {
-//		// Highlight navigated option
-//		
-//		// Scroll the optionsBox
-//		
-//	}
+	
+//	var allOptions = optionsBox.find('LABEL');
+//
+//	// Handle mouse move input
+//	// Handle mouse hover of option, both
+//	// entering an option, *and* 
+//	// mouse moving within an option.
+//	allOptions.mousemove( function(event) {
+//		// At this point, the browser is saying that the mouse moved.
+//		// Workaround Safari's errant reporting of mousemove 
+//		// when the mouse hasn't moved, but only background has.
+//		// Initialize position variables.
+//		if(optionsBox.oldPositionX === null || optionsBox.oldPositionY === null) {
+//			optionsBox.oldPositionX = event.pageX;
+//			optionsBox.oldPositionY = event.pageY;
+//		}
+//		if( optionsBox.oldPositionX != e.pageX || optionsBox.oldPositionY != e.pageY ) {
+//			// At this point, the mouse actually did move.  
+//			optionsBox.oldPositionX = event.pageX;
+//			optionsBox.oldPositionY = event.pageY;
+//			optionsBox.navigationDevice = 'mouse';
+//			optionsBox.navigationElement = $(this);
+//			optionsBox.navigationOption = $(this);
+//			handleNavigation();
+//		}
+//	});
 //	
-//	// Handle selection of options
-//	function handleSelection(device, element, option) {
-//		// Highlight selected option
-//		
-//		// Toggle a checkbox (if not already done directly)
-//		
-//		// Refocus the optionsBox or a checkbox (if one was tabbed to)
-//		
+//	// Handle mouse click input
+//	allOptions.mousedown( function(event) {
+//		optionsBox.selectionEvent = event;
+//		optionsBox.selectionDevice = 'mouse';
+//		optionsBox.selectionElement = $(this);
+//		optionsBox.selectionOption = $(this).parent('LABEL');
 //	}
 //	
+//	// Handle key press input
+//	optionsBox.keydown( function(event) {
+//		detectNavigation(event);
+//		detectKeyboardSelection(event);
+//	});
+//	
+//	// Detect navigation with mouse or non-tab keys
+//	function detectNavigation(event) {
+//		// if mouse, arrows, page up/down, or first letter/number,
+//		// not spacebar or enter
+//		if( event.keyCode != 13 && event.keyCode != 32 ) {
+//			// Save navigation input device to optionsBox
+//			optionsBox.navigationDevice = 'non-tab key';
+//			// Call handle navigation of options
+//			handleNavigation(optionsBox.navigationDevice, optionsBox.navigationElement, optionsBox.navigationOption);
+//			// Save navigated DOM element to optionsBox
+//			optionsBox.navigationElement = ;
+//			// Save navigated option to optionsBox
+//			optionsBox.navigationOption = ;
+//		}
+//	}
+//		
 //	// Detect navigation with tab key
+//	function detectNavigationTabKey(event) {
 //	// if tab key
 //		// Save navigation input device to optionsBox
-//		optionsBox.navigationDevice = "tab key";
-//		// Save navigated DOM element to optionsBox
-//		optionsBox.navigationElement = ;
-//		// Save navigated option to optionsBox
-//		optionsBox.navigationOption = ;
+//		optionsBox.navigationDevice = 'tab key';
 //		// Call handle navigation of options
 //		handleNavigation();
-//			
-//	// Detect navigation with mouse or non-tab keys
-//	// if mouse or arrows or page up/down or first letter
-//		// Save navigation input device to optionsBox
-//		optionsBox.navigationDevice = "mouse or non-tab key";
 //		// Save navigated DOM element to optionsBox
 //		optionsBox.navigationElement = ;
 //		// Save navigated option to optionsBox
 //		optionsBox.navigationOption = ;
-//		// Call handle navigation of options
-//		handleNavigation();
-//			
+//	}
+//
 //	// Detect selection with mouse
-//	// if mouse click
-//		// Save selection input device to optionsBox
-//		optionsBox.selectionDevice = "mouse";
+//	function detectSelectionMouse(event) {
+//		// if mouse click
+//		// Handle mouse click of checkbox
+//		optionsBox.find('INPUT:checkbox').click( function() {
+//			// set the label checked class
+//			$(this).parent('LABEL').toggleClass('checked', $(this).attr('checked'));
+//			updateSelected.call(multiSelectA);
+//			// Highlight selected option
+//			// 
+//			// Refocus
+//			multiSelectA.focus();
+//			// If this checkbox was navigated to with the tab key before being checked, 
+//			// then put focus back on it.
+//			if(typeof(lastNavTabKeyCheckbox) !== 'undefined' && lastNavTabKeyCheckbox !== null) {
+//				lastNavTabKeyCheckbox.focus();
+//				lastNavTabKeyCheckbox = null;
+//			}
+//		});
+//		// Handle mouse click of option label
 //		// Save selected DOM element to optionsBox
-//		optionsBox.selectionElement = ;
+//		optionsBox.selectionElement = $(this);
+//		// Save selection input device to optionsBox
+//		optionsBox.selectionDevice = 'mouse';
 //		// Save selected option to optionsBox
 //		optionsBox.selectionOption = ;
 //		// Call handle selection of options
 //		handleSelection();
 //			
 //	// Detect selection with keyboard
-//	// if space or enter keys
-//		// Save selection input device to optionsBox
-//		optionsBox.selectionDevice = "keyboard";
-//		// Save selected DOM element to optionsBox
-//		optionsBox.selectionElement = ;
-//		// Save selected option to optionsBox
-//		optionsBox.selectionOption = ;
-//		// Call handle selection of options
-//		handleSelection();
+//	function detectSelectionKeyboard(event) {
+//		// if space or enter keys
+//		if( event.keyCode == 13 || event.keyCode == 32 ) {
+//			// Save selection input device to optionsBox
+//			optionsBox.selectionDevice = 'keyboard';
+//			// Save selected DOM element to optionsBox
+//			optionsBox.selectionElement = ;
+//			// Save selected option to optionsBox
+//			optionsBox.selectionOption = ;
+//			// Call handle selection of options
+//			handleSelection(optionsBox);
+//		}
+//		
+//	// Handle navigation of options
+//	function handleNavigation(optionsBox) {
+//		// Remove all highlights
+//		allOptions.removeClass('hover'); 
+//		// Highlight navigated option
+//		optionsBox.navigationOption.addClass('hover'); 
+//		// Scroll the optionsBox
+//		adjustViewPort(optionsBox);
+//	}
+//	
+//	// Handle selection of options
+//	function handleSelection(optionsBox) {
+//		// Highlight selected option
+//		optionsBox.selectionOption.toggleClass('checked');
+//		// Toggle a checkbox (if not already toggled after tab key)
+//		optionsBox.selectionOption.attr('checked');
+//		// Refocus the optionsBox or a checkbox if one was tabbed to
+//		// If navigation was done with mouse or a non-tab key?
+//		if(optionsBox.selectionDevice == 'mouse' || \
+//		optionsBox.selectionDevice == 'non-tab key') {
+//			// Return focus to div
+//			optionsBox.focus();
+//		// If navigation was done with tab key?
+//		} else if(optionsBox.selectionDevice == 'tab key') {
+//			// Return focus to checkbox
+//			optionsBox.selectionElement.focus();
+//		}
+//	}
+
+
 
 	// Building the actual options
 	function buildOptions(options)
@@ -172,7 +254,6 @@
 		
 		// Initialize selected options list
 		updateSelected.call(multiSelectA);
-		var allOptions = optionsBox.find('LABEL');
 		
 		// --- Navigation with Mouse ---
 		// Handle mouse hover of option, both

Modified: Products.Archetypes/trunk/Products/Archetypes/skins/archetypes/widgets/tests/keywordmultiselecttests.js
==============================================================================
--- Products.Archetypes/trunk/Products/Archetypes/skins/archetypes/widgets/tests/keywordmultiselecttests.js	(original)
+++ Products.Archetypes/trunk/Products/Archetypes/skins/archetypes/widgets/tests/keywordmultiselecttests.js	Fri Feb 11 04:13:59 2011
@@ -8,42 +8,42 @@
     // These assignments are not used in the tests, 
     // but were handy for hovering variable names in Firebug when writing the tests, 
     // and could be handy for debugging failed tests if any failures happen in the future.
-    multiple_select = $(".multiSelectOptions");
+    multiple_select = $(".optionsBox");
     existing_tags = multiple_select.children();
     first_tag = existing_tags.first();
-    first_label = $(".multiSelectOptions label:first").text();
+    first_label = $(".optionsBox label:first").text();
     first_selected = $("#selectedTags span:first").text();
     num_tags = existing_tags.length;
-    checked_input_val = $(".multiSelectOptions input:checked").val();
-    checked_label = $(".multiSelectOptions label.checked").css("backgroundColor");
+    checked_input_val = $(".optionsBox input:checked").val();
+    checked_label = $(".optionsBox label.checked").css("backgroundColor");
 
     module("Keyword multiple select enhancement test - refs PLIP ticket #11017");  
     test("Div existence test", function(){  
         expect(1);  
-        equals( $(".multiSelectOptions").length,  
+        equals( $(".optionsBox").length,  
             1,  
-            'Expected 1 as the result, result was: ' + $(".multiSelectOptions").length );  
+            'Expected 1 as the result, result was: ' + $(".optionsBox").length );  
     });
     test("Tag dd count test", function(){  
         expect(1);  
-        equals( $(".multiSelectOptions").children().length,  
+        equals( $(".optionsBox").children().length,  
             16,  
-            'Expected 16 as the result, result was: ' + $(".multiSelectOptions").children().length );  
+            'Expected 16 as the result, result was: ' + $(".optionsBox").children().length );  
     });
     test("First label text test", function(){  
         expect(1);  
-        equals( $(".multiSelectOptions label:first").text(),  
+        equals( $(".optionsBox label:first").text(),  
             'An existing tag',  
-            'Expected An existing tag as the result, result was: ' + $(".multiSelectOptions label:first").text() );  
+            'Expected An existing tag as the result, result was: ' + $(".optionsBox label:first").text() );  
     });
     test("Pre-checked/selected text, checked, formatted, & listed test", function(){  
         expect(3);  
-        equals( $(".multiSelectOptions input:checked").val(),  
+        equals( $(".optionsBox input:checked").val(),  
             "Major Initiatives: Nurture Community",  
-            'Expected Major Initiatives: Nurture Community as the result, result was: ' + $(".multiSelectOptions input:checked").val() );  
-        equals( $(".multiSelectOptions label.checked").css("backgroundColor"),  
+            'Expected Major Initiatives: Nurture Community as the result, result was: ' + $(".optionsBox input:checked").val() );  
+        equals( $(".optionsBox label.checked").css("backgroundColor"),  
             "rgb(238, 238, 238)",  
-            'Expected rgb(238, 238, 238) as the result, result was: ' + $(".multiSelectOptions label.checked").css("backgroundColor") );  
+            'Expected rgb(238, 238, 238) as the result, result was: ' + $(".optionsBox label.checked").css("backgroundColor") );  
         equals( $("#selectedTags span:first").text(),  
             "Major Initiatives: Nurture Community",  
             'Expected Major Initiatives: Nurture Community as the result, result was: ' + $("#selectedTags span:first").text() );  
@@ -52,8 +52,8 @@
         //expect(1);  
         //// This doesn't trigger the click methods in the js, not sure why.  
         //// That seems to wreck the possibility of testing this with QUnit; it currently fails.
-        //$(".multiSelectOptions input:first").click();  
-        //ok( $(".multiSelectOptions label:first").hasClass("hover"),  
+        //$(".optionsBox input:first").click();  
+        //ok( $(".optionsBox label:first").hasClass("hover"),  
             //'Expected hover class on first label.' );  
     //});
     

------------------------------------------------------------------------------
The ultimate all-in-one performance toolkit: Intel(R) Parallel Studio XE:
Pinpoint memory and threading errors before they happen.
Find and fix more than 250 security defects in the development cycle.
Locate bottlenecks in serial and parallel code that limit performance.
http://p.sf.net/sfu/intel-dev2devfeb
lmpx.com only provides a reader for public news (NNTP) servers. It is not affiliated with the servers or forums shown here and is not responsible for the content of articles, which is written by their respective authors.