Add column sorting support for directory component listings. Default to ascending sort on "name" column.

suite/common/directory/directory.js

@@ -155,3 +155,31 @@ function Boot()
 setTimeout("Boot()", 0);
 
 
+function doSort(sortColName)
+{
+	var node = document.getElementById(sortColName);
+	if (!node) return(false);
+
+	// determine column resource to sort on
+	var sortResource = node.getAttribute('resource');
+
+	// switch between ascending & descending sort (no natural order support)
+	var sortDirection="ascending";
+	var isSortActive = node.getAttribute('sortActive');
+	if (isSortActive == "true")
+	{
+		var currentDirection = node.getAttribute('sortDirection');
+		if (currentDirection == "ascending")
+		{
+			sortDirection = "descending";
+		}
+	}
+
+	var isupports = Components.classes["component://netscape/rdf/xul-sort-service"].getService();
+	if (!isupports)    return(false);
+	var xulSortService = isupports.QueryInterface(Components.interfaces.nsIXULSortService);
+	if (!xulSortService)    return(false);
+	xulSortService.Sort(node, sortResource, sortDirection);
+
+	return(false);
+}

suite/common/directory/directory.xul

@@ -26,6 +26,7 @@
 <window 
   title="&directoryWindowTitle.label;"
   xmlns:html="http://www.w3.org/TR/REC-html40"
+  xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
   align="vertical">
 
@@ -44,7 +45,6 @@
             <treerow>
               <treecell class="filename" indent="true"
                         value="rdf:urn:http-index-format:Filename"/>
-
               <treecell value="rdf:urn:http-index-format:Content-Length" />
               <treecell value="rdf:urn:http-index-format:Last-Modified" />
             </treerow>
@@ -52,11 +52,15 @@
         </treechildren>
       </template>
 
+      <treecol id="FilenameColumn" rdf:resource="urn:http-index-format:Filename" sortActive="true" sortDirection="ascending" />
+      <treecol id="ContentLengthColumn" rdf:resource="urn:http-index-format:Content-Length"/>
+      <treecol id="LastModColumn" rdf:resource="urn:http-index-format:Last-Modified"/>
+
       <treehead>
         <treerow>
-          <treecell>&directoryWindow.filename.label;</treecell>
-          <treecell>&directoryWindow.contentlength.label;</treecell>
-          <treecell>&directoryWindow.lastmodified.label;</treecell>
+          <treecell value="&directoryWindow.filename.label;" onclick="return doSort('FilenameColumn');" observes="FilenameColumn" sortActive="true" sortDirection="ascending" />
+          <treecell value="&directoryWindow.contentlength.label;" onclick="return doSort('ContentLengthColumn');" observes="ContentLengthColumn" />
+          <treecell value="&directoryWindow.lastmodified.label;" onclick="return doSort('LastModColumn');" observes="LastModColumn" />
         </treerow>
       </treehead>
 

xpfe/components/directory/directory.css

@@ -22,11 +22,10 @@
 
 */
 
-tree {
-  background-color: #ccccdd;
+treecol[sortActive="true"] {
+ background-color: lightgray;
 }
 
-
 /* Hide the twisty when type != DIRECTORY (XXX is there a != in CSS) */
 treeitem[type="FILE"] > treerow > treecell > .tree-icon > .twisty {
   list-style-image: none;

xpfe/components/directory/directory.js

@@ -155,3 +155,31 @@ function Boot()
 setTimeout("Boot()", 0);
 
 
+function doSort(sortColName)
+{
+	var node = document.getElementById(sortColName);
+	if (!node) return(false);
+
+	// determine column resource to sort on
+	var sortResource = node.getAttribute('resource');
+
+	// switch between ascending & descending sort (no natural order support)
+	var sortDirection="ascending";
+	var isSortActive = node.getAttribute('sortActive');
+	if (isSortActive == "true")
+	{
+		var currentDirection = node.getAttribute('sortDirection');
+		if (currentDirection == "ascending")
+		{
+			sortDirection = "descending";
+		}
+	}
+
+	var isupports = Components.classes["component://netscape/rdf/xul-sort-service"].getService();
+	if (!isupports)    return(false);
+	var xulSortService = isupports.QueryInterface(Components.interfaces.nsIXULSortService);
+	if (!xulSortService)    return(false);
+	xulSortService.Sort(node, sortResource, sortDirection);
+
+	return(false);
+}

xpfe/components/directory/directory.xul

@@ -26,6 +26,7 @@
 <window 
   title="&directoryWindowTitle.label;"
   xmlns:html="http://www.w3.org/TR/REC-html40"
+  xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
   align="vertical">
 
@@ -44,7 +45,6 @@
             <treerow>
               <treecell class="filename" indent="true"
                         value="rdf:urn:http-index-format:Filename"/>
-
               <treecell value="rdf:urn:http-index-format:Content-Length" />
               <treecell value="rdf:urn:http-index-format:Last-Modified" />
             </treerow>
@@ -52,11 +52,15 @@
         </treechildren>
       </template>
 
+      <treecol id="FilenameColumn" rdf:resource="urn:http-index-format:Filename" sortActive="true" sortDirection="ascending" />
+      <treecol id="ContentLengthColumn" rdf:resource="urn:http-index-format:Content-Length"/>
+      <treecol id="LastModColumn" rdf:resource="urn:http-index-format:Last-Modified"/>
+
       <treehead>
         <treerow>
-          <treecell>&directoryWindow.filename.label;</treecell>
-          <treecell>&directoryWindow.contentlength.label;</treecell>
-          <treecell>&directoryWindow.lastmodified.label;</treecell>
+          <treecell value="&directoryWindow.filename.label;" onclick="return doSort('FilenameColumn');" observes="FilenameColumn" sortActive="true" sortDirection="ascending" />
+          <treecell value="&directoryWindow.contentlength.label;" onclick="return doSort('ContentLengthColumn');" observes="ContentLengthColumn" />
+          <treecell value="&directoryWindow.lastmodified.label;" onclick="return doSort('LastModColumn');" observes="LastModColumn" />
         </treerow>
       </treehead>