Some fixes.

.gitignore

@@ -3,7 +3,9 @@
 bin
 build
 #target
-build.local.xml
+
+build.local.*
+
 
 # Eclipse
 .classpath

README.md

@@ -1,4 +1,4 @@
-# h5ai v0.5   ·   a beautified Apache index
+# h5ai v0.5.2   ·   a beautified Apache index
 
 
 ## Screenshots
@@ -47,6 +47,19 @@ please respect their rights.
 
 ## Changelog
 
+### v0.5.2
+*2011-07-02*
+
+* details view adjusts to window width
+* linked icon for *.gz and *.bz2
+
+
+### v0.5.1
+*2011-07-01*
+
+* disabled tree sidebar for now, since it had unwanted side effects
+
+
 ### v0.5
 *2011-07-01*
 

build.properties

@@ -3,7 +3,7 @@ custom                           = true
 
 # project
 project.name                     = h5ai
-project.version                  = 0.5
+project.version                  = 0.5.2
 
 
 # src

src/dot.htaccess

@@ -8,14 +8,16 @@
 # Options  +FollowSymLinks
 
 
-################################
-# cache images for 52 weeks
-################################
-
 <IfModule mod_headers.c>
+
+	################################
+	# cache images for 52 weeks
+	################################
+
 	<FilesMatch "\.png$">
 		Header set Cache-Control "max-age=31449600, public"
 	</FilesMatch>
+
 </IfModule>
 
 
@@ -54,6 +56,7 @@
 
 	IndexOrderDefault    Ascending Name
 
+	IndexOptions         Type=text/html;h5ai=%BUILD_VERSION%
 	IndexOptions         Charset=UTF-8
 	IndexOptions         FancyIndexing
 	IndexOptions         HTMLTable
@@ -87,9 +90,9 @@
 	AddIcon              /h5ai/icons/16x16/makefile.png    .pom  pom.xml  build.xml
 	AddIcon              /h5ai/icons/16x16/bin.png         .so  .o
 
-	AddIcon              /h5ai/icons/16x16/zip.png         .zip  .Z  .z  .jar  .war
-	AddIcon              /h5ai/icons/16x16/tar.png         .tar
 	AddIcon              /h5ai/icons/16x16/archive.png     .tar.gz  .tgz  .tar.bz2
+	AddIcon              /h5ai/icons/16x16/zip.png         .zip  .Z  .z  .jar  .war  .gz  .bz2
+	AddIcon              /h5ai/icons/16x16/tar.png         .tar
 	AddIcon              /h5ai/icons/16x16/pdf.png         .pdf
 	AddIcon              /h5ai/icons/16x16/deb.png         .deb
 	AddIcon              /h5ai/icons/16x16/rpm.png         .rpm

src/h5ai/css/inc/extended.less

@@ -8,7 +8,9 @@
 		list-style: none;
 
 		li {
+			position: relative;
 			white-space: nowrap;
+			clear: both;
 
 			&.header a {
 				padding-bottom: 18px;
@@ -44,16 +46,16 @@
 				}
 			}
 			.icon, .label, .date, .size {
-				display: inline-block;
-				padding: 3px 6px 6px 6px;
-				text-align: left;
+				padding: 6px;
 			}
 			.icon {
-				text-align: center;
+				display: inline-block;
+				position: absolute;
+				left: 0;
+				top: 2px;
 				width: 16px;
 
 				img {
-					padding-top: 4px;
 					width: 16px;
 					height: 16px;
 				}
@@ -62,17 +64,26 @@
 				display: none;
 			}
 			.label {
-				width: 682px;
+				display: block;
+				margin: 0 220px 0 24px;
+				overflow: hidden;
 				white-space: nowrap;
+				text-align: left;
 			}
 			.date {
+				position: absolute;
+				right: 70px;
+				top: 0;
 				text-align: right;
-				width: 160px;
+				width: 140px;
 				white-space: nowrap;
 			}
 			.size {
+				position: absolute;
+				right: 0;
+				top: 0;
 				text-align: right;
-				width: 70px;
+				width: 50px;
 				white-space: nowrap;
 			}
 		}

src/h5ai/css/inc/mixins.less

@@ -1,32 +1,32 @@
 
-.border-radius ( @radius: 5px ) {
+.border-radius ( @radius ) {
 	-moz-border-radius: @radius;
 	-webkit-border-radius: @radius;
 	border-radius: @radius;
 }
 
 
-.box-shadow ( @x: 10px, @y: 10px, @blur: 5px, @color: #ccc ) {
-	-moz-box-shadow: @x @y @blur @color;
-	-webkit-box-shadow: @x @y @blur @color;
-	box-shadow: @x @y @blur @color;
+.box-shadow ( @shadow ) {
+	-moz-box-shadow: @shadow;
+	-webkit-box-shadow: @shadow;
+	box-shadow: @shadow;
 }
 
 
-.transition ( @transitions ) {
-	-moz-transition: @transitions;
-	-ms-transition: @transitions;
-	-o-transition: @transitions;
-	-webkit-transition: @transitions;
-	transition: @transitions;
+.transition ( @transition ) {
+	-moz-transition: @transition;
+	-ms-transition: @transition;
+	-o-transition: @transition;
+	-webkit-transition: @transition;
+	transition: @transition;
 }
 
 
-.transform ( @transforms ) {
-	-moz-transform: @transforms;
-	-o-transform: @transforms;
-	-webkit-transform: @transforms;
-	transform: @transforms;
+.transform ( @transform ) {
+	-moz-transform: @transform;
+	-o-transform: @transform;
+	-webkit-transform: @transform;
+	transform: @transform;
 }
 
 

src/h5ai/css/inc/tree.less

@@ -10,7 +10,7 @@
 	border: 1px solid rgb(225,225,225);
 	border-left: none;
 	.border-radius ( 0 15px 15px 0 );
-	.box-shadow( 0, 0, 30px, #999 );
+	.box-shadow( 0 0 30px #999 );
 
 	.entry {
 		> a, > a.visited {
@@ -51,6 +51,9 @@
 				color: #c55;
 			}
 		}
+		&.file {
+			display: none;
+		}
 		&.current {
 			> a, > a:visited {
 				border: 1px solid rgba(0,0,0,0.1);

src/h5ai/css/main.less

@@ -41,7 +41,7 @@ body > nav {
 	font-size: 0.85em;
 	background-color: rgb(240,240,240);
 	border-bottom: 1px solid rgb(225,225,225);
-	.box-shadow( 0, 0, 30px, #555 );
+	.box-shadow( 0 0 30px #555 );
 
 	span.jsDisabledFallback {
 		display: block;
@@ -135,7 +135,7 @@ body > footer {
 	color: #999;
 	font-size: 0.85em;
 	text-align: center;
-	.box-shadow( 0, 0, 30px, #555 );
+	.box-shadow( 0 0 30px #555 );
 
 	a, a:visited {
 		color: #555;

src/h5ai/footer.html

@@ -11,7 +11,7 @@
 			<img class="techclass" src="/h5ai/images/html5-storage.png" alt="html5-storage" />
 			<img class="techclass" src="/h5ai/images/html5-css3.png" alt="html5-css3" />
 		</a>
-		<a href="http://larsjung.de/h5ai" target="_blank" title="%BUILD_NAME% %BUILD_VERSION%">h5ai</a>
+		<a href="http://larsjung.de/h5ai" target="_blank" title="h5ai %BUILD_VERSION%">h5ai</a>
 		using
 		<a href="http://tiheum.deviantart.com/art/Faenza-Icons-173323228" target="_blank" title="icon theme for Gnome">Faenza icons</a>
 	</footer>

src/h5ai/header.html

@@ -3,7 +3,7 @@
 <head>
 	<meta charset="utf-8">
 	<title>Directory index · styled with h5ai</title>
-	<meta name="h5ai-version" content="%BUILD_NAME% %BUILD_VERSION%">
+	<meta name="h5ai-version" content="h5ai %BUILD_VERSION%">
 	<meta name="description" content="Directory index styled with h5ai (http://larsjung.de/h5ai)">
 	<meta name="keywords" content="directory, index, autoindex, h5ai">
 	<link rel="shortcut icon" type="image/png" href="/h5ai/images/h5ai-16x16.png">

src/h5ai/js/inc/h5ai.js

@@ -256,7 +256,6 @@
 			// in case of floats
 			$( "#extended" ).append( $( "<div class='clearfix' />" ) );
 
-		
 			// click callbacks
 			$( "#extended .entry.folder" )
 				.click( function() {
@@ -269,7 +268,6 @@
 		};
 
 
-
 		/*******************************
 		 * init views
 		 *******************************/

src/h5ai/js/inc/h5aitree.js

@@ -18,9 +18,9 @@
 	H5aiTree = function ( options ) {
 
 		
-		var h5aiMetaRegEx = /<meta name="h5ai-version"/;
 		var folderRegEx = /\/$/;
 		var pathnameRegEx = /^(\/(.*\/)*)([^\/]+\/?)$/;
+		var contentTypeRegEx = /^text\/html;h5ai=/;
 
 
 		function init() {
@@ -39,8 +39,8 @@
 			var match = pathnameRegEx.exec( pathname );
 			return [ match[1], match[3] ];
 		};
-		
-		
+
+
 		function checkCrumb() {
 
 			$( "li.crumb a" ).each( function() {
@@ -108,7 +108,7 @@
 			
 			walkBack( pathname, function( walkbackedPathname ) {
 				var entry = new Entry( walkbackedPathname );
-				fetchFoldersRecursive( walkbackedPathname, function ( content ) {
+				fetchEntriesRecursive( walkbackedPathname, function ( content ) {
 					entry.content = content;
 					callback( entry );
 				} );
@@ -134,96 +134,72 @@
 		};
 
 
-		function fetchFoldersRecursive( pathname, callback ) {
+		function fetchEntriesRecursive( pathname, callback ) {
 
-			fetchFolders( pathname, false, function ( folders ) {
-				if ( folders instanceof Array ) {
-					for ( idx in folders ) {
+			fetchEntries( pathname, false, function ( entries ) {
+				if ( entries instanceof Array ) {
+					for ( idx in entries ) {
 						( function ( entry ) {
 							if ( entry.isFolder ) {
-								fetchFoldersRecursive( entry.absHref, function( content ) {
+								fetchEntriesRecursive( entry.absHref, function( content ) {
 									entry.content = content;
-									callback( folders );
+									callback( entries );
 								} );
 							};
-						} ) ( folders[idx] );
+						} ) ( entries[idx] );
 					};
 				};
-				callback( folders );
-			} );
-		};
-
-
-		function fetchFolders( pathname, includeParent, callback ) {
-
-			fetchEntries( pathname, includeParent, function ( entries ) {
-				
-				if ( entries instanceof Array ) {
-					var folders = [];
-					for ( idx in entries ) {
-						var entry = entries[idx];
-						if ( entry.isFolder ) {
-							folders.push( entry );
-						};
-					};
-					callback( folders );
-				} else {
-					callback( entries );					
-				};
+				callback( entries );
 			} );
 		};
 
 
 		function fetchEntries( pathname, includeParent, callback ) {
 
-			$.ajax( {
-				url: pathname,
-				type: "GET",
-				dataType: "html",
-				error: function ( xhr ) {
-
-					callback( xhr.status );
-				},
-				success: function ( html ) {
-
-					if ( ! h5aiMetaRegEx.test( html ) ) {
-						callback( 200 );
-					} else {
-						var entries = [];
-						$( html ).find( "#table table td" ).closest( "tr" ).each( function () { 
-							var entry = new Entry( pathname, this );
-							if ( !entry.isParentFolder || includeParent ) {
-								entries.push( entry );
+			checkPathname( pathname, function ( status ) {
+				console.log( "checkPathname", pathname, status );
+				if ( status !== 0 ) {
+					callback( status );
+				} else {
+					$.ajax( {
+						url: pathname,
+						type: "GET",
+						dataType: "html",
+						error: function ( xhr ) {
+							// since it was checked before this should never happen
+							callback( xhr.status );
+						},
+						success: function ( html, status, xhr ) {
+							if ( !contentTypeRegEx.test( xhr.getResponseHeader( "Content-Type" ) ) ) {
+								// since it was checked before this should never happen
+								callback( xhr.status );
+							} else {
+								var entries = [];
+								$( html ).find( "#table table td" ).closest( "tr" ).each( function () { 
+									var entry = new Entry( pathname, this );
+									if ( !entry.isParentFolder || includeParent ) {
+										entries.push( entry );
+									};
+								} );
+								callback( entries );
 							};
-						} );
-						callback( entries );
-					};
-				}
+						}
+					} );
+				};
 			} );
 		};
 
 
-		/*
-		 * Checks pathname for accessibility.
-		 * Calls callback with argument 0 if pathname is a h5ai styled directory.
-		 * Otherwise it returns the http response status. 
-		 */
 		function checkPathname( pathname, callback ) {
 
 			$.ajax( {
 				url: pathname,
-				type: "GET",
-				dataType: "html",
-				error: function ( xhr ) {
-
-					callback( xhr.status );
-				},
-				success: function ( html ) {
-
-					if ( h5aiMetaRegEx.test( html ) ) {
+				type: "HEAD",
+				complete: function ( xhr ) {
+					if ( xhr.status === 200 && contentTypeRegEx.test( xhr.getResponseHeader( "Content-Type" ) ) ) {
 						callback( 0 );
 					} else {
-						callback( 200 );
+						callback( xhr.status );
 					};
 				}
 			} );
@@ -240,7 +216,7 @@
 				var $tds = $( tableRow ).find( "td" );
 				var $img = $( $tds.get( 0 ) ).find( "img" );
 				var $a= $( $tds.get( 1 ) ).find( "a" );
-				
+
 				this.parentFolder = folder;
 				this.icon16 = $img.attr( "src" );
 				this.alt = $img.attr( "alt" );
@@ -271,14 +247,15 @@
 
 
 			this.isComplete = function () {
-				
-				if ( this.content === undefined ) {
-					return false;
-				};
-				if ( this.content instanceof Array  ) {
-					for ( idx in this.content ) {
-						if ( !this.content[idx].isComplete() ) {
-							return false;
+
+				if ( this.isFolder ) {
+					if ( this.content === undefined ) {
+						return false;
+					} else if ( this.content instanceof Array  ) {
+						for ( idx in this.content ) {
+							if ( !this.content[idx].isComplete() ) {
+								return false;
+							};
 						};
 					};
 				};
@@ -287,7 +264,7 @@
 
 
 			this.toHtml = function () {
-				
+
 				var $entry = $( "<div class='entry' />" );
 
 				try {
@@ -297,6 +274,7 @@
 						.append( $( "<span class='label'>" + this.label + "</span>" ) );
 
 					if ( this.isFolder ) {
+						$entry.addClass( "folder" );
 						if ( this.absHref === document.location.pathname ) {
 							$a.find( ".icon img" ).attr( "src", "/h5ai/images/folder-open.png" );
 							$entry.addClass( "current" );
@@ -315,6 +293,8 @@
 							$a.append( $( "<span class='hint error'>" + this.content + "</span>" ) );
 							$entry.addClass( "notListable" );
 						};
+					} else {
+						$entry.addClass( "file" );
 					};
 
 				} catch( err ) {

src/h5ai/js/main.js

@@ -1,3 +1,3 @@
 // @include "inc/jquery.json.min.js"
 // @include "inc/h5ai.js"
-// @include "inc/h5aitree.js"
+// #not#include "inc/h5aitree.js"

target/dot.htaccess

@@ -1,5 +1,5 @@
 ################################
-# h5ai 0.5
+# h5ai 0.5.2
 # customized .htaccess
 ################################
 
@@ -8,14 +8,16 @@
 # Options  +FollowSymLinks
 
 
-################################
-# cache images for 52 weeks
-################################
-
 <IfModule mod_headers.c>
+
+	################################
+	# cache images for 52 weeks
+	################################
+
 	<FilesMatch "\.png$">
 		Header set Cache-Control "max-age=31449600, public"
 	</FilesMatch>
+
 </IfModule>
 
 
@@ -54,6 +56,7 @@
 
 	IndexOrderDefault    Ascending Name
 
+	IndexOptions         Type=text/html;h5ai=0.5.2
 	IndexOptions         Charset=UTF-8
 	IndexOptions         FancyIndexing
 	IndexOptions         HTMLTable
@@ -87,9 +90,9 @@
 	AddIcon              /h5ai/icons/16x16/makefile.png    .pom  pom.xml  build.xml
 	AddIcon              /h5ai/icons/16x16/bin.png         .so  .o
 
-	AddIcon              /h5ai/icons/16x16/zip.png         .zip  .Z  .z  .jar  .war
-	AddIcon              /h5ai/icons/16x16/tar.png         .tar
 	AddIcon              /h5ai/icons/16x16/archive.png     .tar.gz  .tgz  .tar.bz2
+	AddIcon              /h5ai/icons/16x16/zip.png         .zip  .Z  .z  .jar  .war  .gz  .bz2
+	AddIcon              /h5ai/icons/16x16/tar.png         .tar
 	AddIcon              /h5ai/icons/16x16/pdf.png         .pdf
 	AddIcon              /h5ai/icons/16x16/deb.png         .deb
 	AddIcon              /h5ai/icons/16x16/rpm.png         .rpm

target/h5ai/footer.html

@@ -11,7 +11,7 @@
 			<img class="techclass" src="/h5ai/images/html5-storage.png" alt="html5-storage" />
 			<img class="techclass" src="/h5ai/images/html5-css3.png" alt="html5-css3" />
 		</a>
-		<a href="http://larsjung.de/h5ai" target="_blank" title="h5ai 0.5">h5ai</a>
+		<a href="http://larsjung.de/h5ai" target="_blank" title="h5ai 0.5.2">h5ai</a>
 		using
 		<a href="http://tiheum.deviantart.com/art/Faenza-Icons-173323228" target="_blank" title="icon theme for Gnome">Faenza icons</a>
 	</footer>

target/h5ai/header.html

@@ -3,7 +3,7 @@
 <head>
 	<meta charset="utf-8">
 	<title>Directory index · styled with h5ai</title>
-	<meta name="h5ai-version" content="h5ai 0.5">
+	<meta name="h5ai-version" content="h5ai 0.5.2">
 	<meta name="description" content="Directory index styled with h5ai (http://larsjung.de/h5ai)">
 	<meta name="keywords" content="directory, index, autoindex, h5ai">
 	<link rel="shortcut icon" type="image/png" href="/h5ai/images/h5ai-16x16.png">