From 3c952cac20d158a8d6974c0e82cab1647be7bd79 Mon Sep 17 00:00:00 2001 From: Maurice Gottlieb Date: Thu, 12 Jul 2012 13:52:47 +0300 Subject: [PATCH 1/4] Docs: Refine the paragraph about split buttons to be more informative (docs-lists.html) --- docs/lists/docs-lists.html | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/docs/lists/docs-lists.html b/docs/lists/docs-lists.html index 6fb4c1d72e3..ca62967b11e 100644 --- a/docs/lists/docs-lists.html +++ b/docs/lists/docs-lists.html @@ -24,7 +24,7 @@

Lists

-

List views

+

Listviews

  • Basics
    • @@ -34,11 +34,11 @@

    List views

Basic linked lists

-

A list view is coded as a simple unordered list containing linked list items with a data-role="listview" attribute. jQuery Mobile will apply all the necessary styles to transform the list into a mobile-friendly list view with right arrow indicator that fills the full width of the browser window. When you tap on the list item, the framework will trigger a click on the first link inside the list item, issue an AJAX request for the URL in the link, create the new page in the DOM, then kick off a page transition. View the data- attribute reference to see all the possible attributes you can add to listviews.

+

A listview is coded as a simple unordered list containing linked list items with a data-role="listview" attribute. jQuery Mobile will apply all the necessary styles to transform the list into a mobile-friendly listview with right arrow indicator that fills the full width of the browser window. When you tap on the list item, the framework will trigger a click on the first link inside the list item, issue an Ajax request for the URL in the link, create the new page in the DOM, then kick off a page transition. View the data- attribute reference to see all the possible attributes you can add to listviews.

Here is the HTML markup for a basic linked list.


-<ul data-role="listview" data-theme="g">
+<ul data-role="listview" data-theme="b">
 	<li><a href="acura.html">Acura</a></li>
 	<li><a href="audi.html">Audi</a></li>
 	<li><a href="bmw.html">BMW</a></li>
@@ -51,22 +51,22 @@ 
Basic linked lists

 			
 			
Nested lists

 			
By nesting child ul or ol inside list items, you can create nested lists. When a list item with a child list is clicked, the framework will show a new page populated with the title of the parent in the header and the list of child elements. These dynamic nested lists are styled with the "b" theme swatch (blue in the default theme) to indicate that you are in a secondary level of navigation. Lists can be nested multiple levels deep and all pages and linking will be automatically handled by the framework. Note that the page of each nested listview is created when the parent page loads and for each nested page the page-events will trigger.

-			
To set the swatch color of the child list views, set the data-theme attribute on each list inside.

+			
To set the swatch color of the child listviews, set the data-theme attribute on each list inside.

 			Nested list example
 
 			
Numbered lists

-			
Lists can also be created from ordered lists (ol) which is useful when presenting items that are in a sequence such as search results or a movie queue. When the enhanced markup is applied to the list view, jQuery Mobile will try to first use CSS to add numbers to the list and, if not supported, will fall back to injecting numbers with JavaScript.

+			
Lists can also be created from ordered lists (ol) which is useful when presenting items that are in a sequence such as search results or a movie queue. When the enhanced markup is applied to the listview, jQuery Mobile will try to first use CSS to add numbers to the list and, if not supported, will fall back to injecting numbers with JavaScript.

 
 			Numbered list example
 
 			
Read-only lists

-			
List views can also be used to display a non-interactive list of items, usually as an inset list. This list is built from an unordered or ordered list that don't have linked list items. The framework styles the list items as buttons like the other list types (see theming lists), but without a gradient on the background.

+			
Listviews can also be used to display a non-interactive list of items, usually as an inset list. This list is built from an unordered or ordered list that don't have linked list items. The framework styles the list items as buttons like the other list types (see theming lists), but without a gradient on the background.

 
 			Read-only list example
 
 			
Split button lists

-			
In cases where there is more than one possible action per list item, a split button can be used to offer two independently clickable items -- the list item and a small arrow icon in the far right. To make a split list item, simply add a second link inside the li and the framework will add a vertical divider line, style the link as an icon-only arrow button, and set the title attribute of the link to the text the link for accessibility.

-			
You can set the icon for the right split icon by specifying a data-split-icon attribute with the icon name you want. The theme swatch color of the split button defaults to "b" (blue in the default theme) but can be set by specifying a swatch letter in the data-split-theme attribute.

+			
In cases where there is more than one possible action per list item, a split button can be used to offer two independently clickable items -- the list item and a small arrow icon in the far right. To make a split list item, simply add a second link inside the li and the framework will add a vertical divider line, style the link as an icon-only arrow button, and set the title attribute of the link to the text of the link for accessibility.

+			
You can set the icon for the right split icon by specifying a data-split-icon attribute on the listview with a icon name you want. The default icon is "arrow-r" but can be configured with the splitIcon listview option. By adding a data-icon attribute to the list item, you can set individual icons for each split. The theme swatch color of the split button defaults to "b" (blue in the default theme) but can be set by specifying a swatch letter with the data-split-theme attribute on listview level or for individual splits with the data-theme attribute on link level.

 
 			Split list example
 
@@ -160,7 +160,7 @@ 
More in this section

 
 						
    
 
-							
  • List views
    • 
+							
  • Listviews
    • 
 							
  • List basics & API
    • 
 							
  • Basic linked list
    • 
 							
  • Nested list
    • 

From 3dcf458d153c3218798ddafce19a0b94292aa9d0 Mon Sep 17 00:00:00 2001
From: Maurice Gottlieb 
Date: Fri, 13 Jul 2012 01:18:01 +0300
Subject: [PATCH 2/4] Docs: Change "list view" to "listview"
 (lists-options.html)

---
 docs/lists/lists-options.html | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/docs/lists/lists-options.html b/docs/lists/lists-options.html
index b6d26b11591..8797d3ffb17 100644
--- a/docs/lists/lists-options.html
+++ b/docs/lists/lists-options.html
@@ -24,7 +24,7 @@ 
    Lists
    
 
 	
    
 	
    
-		
    List views
    
+		
    Listviews
    
 
 		
      
 			
    • Basics
      • 
@@ -39,7 +39,7 @@ 
      List views
      
 			
      countTheme string
      
 			
      
 				
      default: "c"
      
-				
      Sets the color scheme (swatch) for list item count bubbles. It accepts a single letter from a-z that maps to the swatches included in your theme. To set the value for all instances of this widget, bind this option to the mobileinit event:
      
+				
      Sets the color theme (swatch) for list item count bubbles. It accepts a single letter from a-z that maps to the swatches included in your theme. To set the value for all instances of this widget, bind this option to the mobileinit event:
      
 
      $( document ).bind( "mobileinit", function(){
     $.mobile.listview.prototype.options.countTheme = "a";
 });
@@ -50,7 +50,7 @@ 
      List views
      
 			
      dividerTheme string
      
 			
      
 				
      default: "b"
      
-				
      Sets the color scheme (swatch) for list dividers. It accepts a single letter from a-z that maps to the swatches included in your theme. To set the value for all instances of this widget, bind this option to the mobileinit event:
      
+				
      Sets the color theme (swatch) for list dividers. It accepts a single letter from a-z that maps to the swatches included in your theme. To set the value for all instances of this widget, bind this option to the mobileinit event:
      
 
      $( document ).bind( "mobileinit", function(){
     $.mobile.listview.prototype.options.dividerTheme = "a";
 });
@@ -95,7 +95,7 @@ 
      List views
      
 			
      filterTheme string
      
 			
      
 				
      default: "c"
      
-				
      Sets the color scheme (swatch) for the search filter bar. It accepts a single letter from a-z that maps to the swatches included in your theme. To set the value for all instances of this widget, bind this option to the mobileinit event:
      
+				
      Sets the color theme (swatch) for the search filter bar. It accepts a single letter from a-z that maps to the swatches included in your theme. To set the value for all instances of this widget, bind this option to the mobileinit event:
      
 
      $( document ).bind( "mobileinit", function(){
     $.mobile.listview.prototype.options.filterTheme = "a";
 });
@@ -106,7 +106,7 @@ 
      List views
      
 			
      headerTheme string
      
 			
      
 				
      default: "b"
      
-				
      Sets the color scheme (swatch) for headers of nested list sub pages. It accepts a single letter from a-z that maps to the swatches included in your theme. To set the value for all instances of this widget, bind this option to the mobileinit event:
      
+				
      Sets the color theme (swatch) for headers of nested list sub pages. It accepts a single letter from a-z that maps to the swatches included in your theme. To set the value for all instances of this widget, bind this option to the mobileinit event:
      
 
      $( document ).bind( "mobileinit", function(){
     $.mobile.listview.prototype.options.headerTheme = "a";
 });
@@ -117,7 +117,7 @@ 
      List views
      
 			
      initSelector CSS selector string
      
 			
      
 				
      default: ":jqmData(role='listview')"
      
-				
      This is used to define the selectors (element types, data roles, etc.) that will automatically be initialized as list views. To change which elements are initialized, bind this option to the mobileinit event:
      
+				
      This is used to define the selectors (element types, data roles, etc.) that will automatically be initialized as listviews. To change which elements are initialized, bind this option to the mobileinit event:
      
 
      $( document ).bind( "mobileinit", function(){
     $.mobile.listview.prototype.options.initSelector = ".mylistview";
 });
@@ -149,7 +149,7 @@ 
      List views
      
 			
      splitTheme string
      
 			
      
 				
      default: "b"
      
-				
      Sets the color scheme (swatch) for split list buttons. It accepts a single letter from a-z that maps to the swatches included in your theme. To set the value for all instances of this widget, bind this option to the mobileinit event:
      
+				
      Sets the color theme (swatch) for split list buttons. It accepts a single letter from a-z that maps to the swatches included in your theme. To set the value for all instances of this widget, bind this option to the mobileinit event:
      
 
      $( document ).bind( "mobileinit", function(){
     $.mobile.listview.prototype.options.splitTheme = "a";
 });
@@ -160,7 +160,7 @@ 
      List views
      
 			
      theme string
      
 			
      
 				
      default: null, inherited from parent
      
-				
      Sets the color scheme (swatch) for this widget. It accepts a single letter from a-z that maps to the swatches included in your theme. By default, it will inherit the same swatch color as its parent container if not explicitly set. To set the value for all instances of this widget, bind this option to the mobileinit event:
      
+				
      Sets the color theme (swatch) for this widget. It accepts a single letter from a-z that maps to the swatches included in your theme. By default, it will inherit the same swatch color as its parent container if not explicitly set. To set the value for all instances of this widget, bind this option to the mobileinit event:
      
 
      $( document ).bind( "mobileinit", function(){
     $.mobile.listview.prototype.options.theme = "a";
 });
@@ -180,7 +180,7 @@ 
      More in this section
      
 
 				
        
 
-					
      • List views
        • 
+					
      • Listviews
        • 
 					
      • List basics & API
        • 
 					
      • Basic linked list
        • 
 					
      • Nested list
        • 

From 495191b1df015d80c02d6837f64f1d962ae2a565 Mon Sep 17 00:00:00 2001
From: Maurice Gottlieb 
Date: Fri, 13 Jul 2012 01:21:49 +0300
Subject: [PATCH 3/4] Docs: Change "list view" to "listview"
 (lists-methods.html)

---
 docs/lists/lists-methods.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/lists/lists-methods.html b/docs/lists/lists-methods.html
index 56f87b3a64d..044396c47b8 100644
--- a/docs/lists/lists-methods.html
+++ b/docs/lists/lists-methods.html
@@ -24,7 +24,7 @@ 
        Lists
        
 
 	
        
 	
        
-		
        List views
        
+		
        Listviews
        
 
 		
          
 			
        • Basics
          • 
@@ -66,7 +66,7 @@ 
          More in this section
          
 
 				
            
 
-					
          • List views
            • 
+					
          • Listviews
            • 
 					
          • List basics & API
            • 
 					
          • Basic linked list
            • 
 					
          • Nested list
            • 

From 13f09095fefb122422c303b75c79a02e7ec33eda Mon Sep 17 00:00:00 2001
From: Maurice Gottlieb 
Date: Fri, 13 Jul 2012 01:25:01 +0300
Subject: [PATCH 4/4] Docs: Change "list view" to "listview"
 (lists-events.html)

---
 docs/lists/lists-events.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/lists/lists-events.html b/docs/lists/lists-events.html
index ac8aee29cc6..ee1209e61fc 100644
--- a/docs/lists/lists-events.html
+++ b/docs/lists/lists-events.html
@@ -24,7 +24,7 @@ 
            Lists
            
 
 	
            
 	
            
-		
            List views
            
+		
            Listviews