[Picfinity-commit] SF.net SVN: picfinity: [22] .themes/ajax

[<esp...@us...>]

Revision: 22
          http://picfinity.svn.sourceforge.net/picfinity/?rev=22&view=rev
Author:   espadav8
Date:     2007-08-09 04:18:11 -0700 (Thu, 09 Aug 2007)

Log Message:
-----------
Implement the 'link to image' feature
Change the selectedImage div into a span
	- this means that the size doesn't need to be set/reset
Remove some unneeded JS due to switching to a span

Modified Paths:
--------------
    .themes/ajax/ajax.js
    .themes/ajax/ajax.xsl

Modified: .themes/ajax/ajax.js
===================================================================
--- .themes/ajax/ajax.js	2007-08-09 11:15:45 UTC (rev 21)
+++ .themes/ajax/ajax.js	2007-08-09 11:18:11 UTC (rev 22)
@@ -328,14 +328,9 @@
 {
 	var nodePath = getNodePath(getLayoutNode(imageNode.getAttribute("id")));
 	
-	var expandedImageDiv = document.createElement("div");
-	expandedImageDiv.setAttribute("id", "expandedimage");
+	var expandedImageSpan = document.createElement("span");
+	expandedImageSpan.setAttribute("id", "expandedimage");
 	
-	// this should allow it to work in IE but makes it harder to follow
-	// in things like FireBug since you can't see the onclick for the divs
-	expandedImageDiv.style.width = "200px";
-	expandedImageDiv.style.height = "43px";
-	
 	var linkToSpan = document.createElement("span");
 	linkToSpan.setAttribute("id", "linktospan");
 	linkToSpan.style.display = "none";
@@ -356,7 +351,6 @@
 	
 	var imageSpan = document.createElement("span");
 	imageSpan.setAttribute("id", "expandedimagespan");
-	// imageSpan.setAttribute("class", "image");
 	imageSpan.style.display = "none";
 	
 	var albumImage = document.createElement("img");
@@ -373,10 +367,6 @@
 	expandedImage.src = imageThumbPath;
 	expandedImage.onload = function()
 							{
-								var expandedImageDiv = document.getElementById("expandedimage");
-								expandedImageDiv.style.width = expandedImage.width + "px";
-								expandedImageDiv.style.height = (expandedImage.height + 49) + "px";
-								
 								var loadingSpan = document.getElementById("loadingspan");
 								loadingSpan.style.display = "none";
 								
@@ -387,12 +377,12 @@
 								linkToSpan.style.display = "block";
 							}
 	
-	expandedImageDiv.appendChild(linkToSpan);
-	expandedImageDiv.appendChild(loadingSpan);
-	expandedImageDiv.appendChild(imageSpan);
-	expandedImageDiv.appendChild(imageNameSpan);
+	expandedImageSpan.appendChild(linkToSpan);
+	expandedImageSpan.appendChild(loadingSpan);
+	expandedImageSpan.appendChild(imageSpan);
+	expandedImageSpan.appendChild(imageNameSpan);
 	
-	return expandedImageDiv;
+	return expandedImageSpan;
 }
 
 function createBreadcrumbTrail(element)

Modified: .themes/ajax/ajax.xsl
===================================================================
--- .themes/ajax/ajax.xsl	2007-08-09 11:15:45 UTC (rev 21)
+++ .themes/ajax/ajax.xsl	2007-08-09 11:18:11 UTC (rev 22)
@@ -32,28 +32,30 @@
 					</a>
 				</h1>
 				
-				<xsl:apply-templates select="layout" />
+				<xsl:choose>
+					<xsl:when test="$post_id = 0">
+						<xsl:apply-templates select="layout" />
+					</xsl:when>
+					<xsl:otherwise>
+						<xsl:apply-templates select="layout" mode="post"/>
+					</xsl:otherwise>
+				</xsl:choose>
 			</body>
 		</html>
 	</xsl:template>
 
 	<xsl:template match="layout">
-		<xsl:apply-templates select="themes">
-			<xsl:with-param name="location" select="@name" />
-		</xsl:apply-templates>
+		<xsl:apply-templates select="themes" />
 		
 		<div id="breadcrumbtrail"></div>
 		
 		<div id="albums">
-			<xsl:apply-templates select="folder">
-				<xsl:with-param name="location" select="@name" />
-			</xsl:apply-templates>
+			<xsl:apply-templates select="folder" />
+			<xsl:apply-templates select="image" />
 		</div>
 	</xsl:template>
 	
 	<xsl:template match="themes">
-		<xsl:param name="location" />
-		
 		<div id="themes">
 			<form id="themeform" action="index.php" method="post">
 				<select name="theme" onchange="submit();">
@@ -76,8 +78,6 @@
 	</xsl:template>
 
 	<xsl:template match="folder">
-		<xsl:param name="location" />
-		
 		<div>
 			<xsl:choose>
 				<xsl:when test="count(folder) = 0 and count(image) = 0">
@@ -142,8 +142,114 @@
 	</xsl:template>
 
 	<xsl:template match="image">
-		<xsl:param name="location" />
-		<xsl:variable name="id"><xsl:value-of select="@id" /></xsl:variable>
+		<xsl:param name="selectedID">0</xsl:param>
+		<xsl:variable name="path">
+			<xsl:apply-templates select="ancestor::folder" mode="getpath" />
+		</xsl:variable>
+		
+		<div class="thumbnail">
+			<xsl:attribute name="id"><xsl:value-of select="@id" /></xsl:attribute>
+			<xsl:if test="@id = $selectedID">
+				<xsl:attribute name="class">thumbnail selected</xsl:attribute>
+			</xsl:if>
+			<span class="image">
+				<a>
+					<xsl:attribute name="onclick">showImage('<xsl:value-of select="@id" />'); return false;</xsl:attribute>
+					<xsl:attribute name="href">index.php?id=<xsl:value-of select="@id" /></xsl:attribute>
+					<img>
+						<xsl:attribute name="alt"><xsl:value-of select="@file" /></xsl:attribute>
+						<xsl:attribute name="src"><xsl:value-of select="concat('./.thumbs/', $path, @file)" /></xsl:attribute>
+					</img>
+				</a>
+			</span>
+			<span class="name"><xsl:value-of select="@file" /></span>
+		</div>
 	</xsl:template>
+	
+	
+	<xsl:template match="layout" mode="post">
+		<xsl:variable name="folder">
+			<xsl:choose>
+				<xsl:when test="count(//folder[@id = $post_id]) = 1">1</xsl:when>
+				<xsl:when test="@id = $post_id">2</xsl:when>
+				<xsl:otherwise>0</xsl:otherwise>
+			</xsl:choose>
+		</xsl:variable>
+		
+		
+		<xsl:apply-templates select="themes" />
+		
+		
+		<!-- the passed in ID is an image -->
+		<xsl:if test="$folder = 0">
+			<xsl:apply-templates select="//image[@id = $post_id]" mode="post" />
+		</xsl:if>
+	</xsl:template>
+	
+	<xsl:template match="folder" mode="breadcrumbtrail">
+		<xsl:if test="parent::folder">
+			<xsl:apply-templates select="parent::folder" mode="breadcrumbtrail" />
+		</xsl:if>
+		
+		<ul class="trailentry">
+			<li class="currentfolder">
+				<span class="icon">
+					<img src=".themes/ajax/foldericon.png" />
+				</span>
+				<span class="name"><xsl:value-of select="@name" /></span>
+				<ul>
+					<xsl:for-each select="parent::*/folder">
+						<li class="menuentry">
+							<xsl:attribute name="onclick">openFolder('<xsl:value-of select="@id" />'); return false;</xsl:attribute>
+							<span class="icon">
+								<img src=".themes/ajax/foldericon.png" />
+							</span>
+							<span class="name"><xsl:value-of select="@name" /></span>
+						</li>
+					</xsl:for-each>
+				</ul>
+			</li>
+		</ul>
+	</xsl:template>
+	
+	<xsl:template match="image" mode="post">
+		<xsl:variable name="path">
+			<xsl:apply-templates select="ancestor::folder" mode="getpath" />
+		</xsl:variable>
+		
+		<div id="breadcrumbtrail">
+			<xsl:apply-templates select="parent::folder" mode="breadcrumbtrail" />
+		</div>
+		
+		<div id="albums">
+			<span id="expandedimage">
+				<span style="display: block;" id="linktospan">
+					<a>
+						<xsl:attribute name="href">index.php?id=<xsl:value-of select="@id" /></xsl:attribute>
+						Link to this image</a>
+				</span>
+				<span style="display: block;" id="expandedimagespan">
+					<a href="#" onclick="closeImage(); return false;">
+						<img>
+							<xsl:attribute name="src"><xsl:value-of select="concat('./', $path, @file)" /></xsl:attribute>
+						</img>
+					</a>
+				</span>
+				<span class="name"><xsl:value-of select="@file" /></span>
+			</span>
+			
+			<div id="selectedalbum">
+				<xsl:apply-templates select="parent::*/folder" />
+				<xsl:apply-templates select="parent::*/image">
+					<xsl:with-param name="selectedID" select="@id" />
+				</xsl:apply-templates>
+			</div>
+		
+		</div>
+	</xsl:template>
+	
+	<xsl:template match="folder" mode="getpath">
+		<xsl:value-of select="concat(@name, '/')" />
+	</xsl:template>
 
 </xsl:stylesheet>


This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site.