Thread: [Picfinity-commit] SF.net SVN: picfinity: [36] trunk/.themes/ajax
Status: Beta
Brought to you by:
espadav8
From: <esp...@us...> - 2007-08-14 00:52:25
|
Revision: 36 http://picfinity.svn.sourceforge.net/picfinity/?rev=36&view=rev Author: espadav8 Date: 2007-08-13 17:52:28 -0700 (Mon, 13 Aug 2007) Log Message: ----------- Add an onclick for the root breadtrail item Slight CSS positioning changes and hide overflowing names Update the XML loading for IE. Now getting somewhere, the XML wasn't loading before (due to the DTD but unsure why it was causing the problem). Can now click on the folders, however, the elements aren't being created correctly so they're rendered wrong. Modified Paths: -------------- trunk/.themes/ajax/ajax.css trunk/.themes/ajax/ajax.js trunk/.themes/ajax/ajax.xsl Modified: trunk/.themes/ajax/ajax.css =================================================================== --- trunk/.themes/ajax/ajax.css 2007-08-14 00:06:33 UTC (rev 35) +++ trunk/.themes/ajax/ajax.css 2007-08-14 00:52:28 UTC (rev 36) @@ -101,6 +101,7 @@ text-align: center; display: block; height: 16px; + overflow: hidden; } #expandedimage span.name @@ -137,7 +138,7 @@ { display: block; margin: 0 0 10px 0; - height: 20px; + height: 24px; } #breadcrumbtrail ul @@ -162,7 +163,7 @@ #breadcrumbtrail ul li ul { display: none; - margin: 21px 0 -1px -6px; + margin: 22px 0 -1px -6px; position: fixed; z-index: 10; } Modified: trunk/.themes/ajax/ajax.js =================================================================== --- trunk/.themes/ajax/ajax.js 2007-08-14 00:06:33 UTC (rev 35) +++ trunk/.themes/ajax/ajax.js 2007-08-14 00:52:28 UTC (rev 36) @@ -7,18 +7,20 @@ if (document.implementation && document.implementation.createDocument) { xmlDoc = document.implementation.createDocument("", "layout", null); + xmlDoc.load("gallery.xml"); } else if (window.ActiveXObject) { xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); + xmlDoc.validateOnParse = false; + xmlDoc.resolveExternals = false; + xmlDoc.load("gallery.xml"); } else { alert('Your browser can\'t handle this script'); return; } - - xmlDoc.load("gallery.xml"); } function reloadPage() Modified: trunk/.themes/ajax/ajax.xsl =================================================================== --- trunk/.themes/ajax/ajax.xsl 2007-08-14 00:06:33 UTC (rev 35) +++ trunk/.themes/ajax/ajax.xsl 2007-08-14 00:52:28 UTC (rev 36) @@ -214,6 +214,7 @@ <ul class="trailentry"> <li class="currentfolder"> + <xsl:attribute name="onclick">openFolder('<xsl:value-of select="@id" />'); return false;</xsl:attribute> <span class="icon"> <img src=".themes/ajax/foldericon.png" /> </span> This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site. |
From: <esp...@us...> - 2007-08-14 23:06:31
|
Revision: 39 http://picfinity.svn.sourceforge.net/picfinity/?rev=39&view=rev Author: espadav8 Date: 2007-08-14 16:06:33 -0700 (Tue, 14 Aug 2007) Log Message: ----------- Add a fieldset around the theme selector and button For all images replace ' ' with '%20' and include the alt attributes Convert the <spans> with divs for the expanded image (needs to be updated in the JS as well Set font sizes in the CSS (using ems) Clean up a lot of the CSS Add the onload before setting the src for the Image() loader Don'y need to get the element in the onload function These 2 changes allow IE and Opera to open an image if it's been stored in the cache Modified Paths: -------------- trunk/.themes/ajax/ajax.css trunk/.themes/ajax/ajax.js trunk/.themes/ajax/ajax.xsl Modified: trunk/.themes/ajax/ajax.css =================================================================== --- trunk/.themes/ajax/ajax.css 2007-08-14 21:12:12 UTC (rev 38) +++ trunk/.themes/ajax/ajax.css 2007-08-14 23:06:33 UTC (rev 39) @@ -18,6 +18,7 @@ h1, h1 a { + font-size: 1.2em; text-align: center; color: #d0d0d0; } @@ -39,24 +40,6 @@ float: left; } -#expandedimage -{ - padding: 5px 5px 0 5px; - border: 1px solid #ccc; - clear: both; - float: left; -} - -#loadingspan -{ - text-align: center; - color: #fff; - font-weight: bold; - margin: -5px; - padding: 5px; -} - - /* --- folders --- */ .image a @@ -65,6 +48,7 @@ width: 100px; display: block; padding: 14px 25px; + border-bottom: 1px solid #ccc; } .folder, @@ -92,37 +76,46 @@ /* --- image names --- */ -.name +.name, +#loadingspan, +#linktospan a { color: #f0f0f0; font-weight: bold; - border-top: 1px solid #ccc; padding: 3px 0; text-align: center; display: block; - height: 16px; overflow: hidden; + font-size: 0.7em; } -#expandedimage span.name +/* --- expanded image --- */ + +#linktospan a { - margin: 5px -5px 0 -5px; + text-decoration: none; } -/* --- image link --- */ -#linktospan a +#expandedimage { - color: #f0f0f0; - font-weight: bold; + border: 1px solid #ccc; + float: left; +} + +#expandedimagespan +{ + border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; - padding: 3px 0 3px 0; - text-align: center; - display: block; - text-decoration: none; - margin: -5px -5px 5px -5px; + padding: 5px; } +#loadingspan +{ + padding: 3px 5px; + border-bottom: 1px solid #ccc; +} + /* --- hover actions --- */ a:hover, @@ -163,7 +156,7 @@ #breadcrumbtrail ul li ul { display: none; - margin: 22px 0 -1px -6px; + margin: 21px 0 -1px -6px; position: fixed; z-index: 10; } @@ -201,7 +194,7 @@ #breadcrumbtrail ul li:hover, #breadcrumbtrail ul li ul li.selected { - background: #303030; + background-color: #303030; } .folder, @@ -209,19 +202,19 @@ #expandedimage, #breadcrumbtrail ul { - background: #505050; + background-color: #505050; } .image a:hover, #linktospan a:hover, #breadcrumbtrail ul li ul li:hover { - background: #707070; + background-color: #707070; } #loadingspan { - background: #cc0022; + background-color: #cc0022; } Modified: trunk/.themes/ajax/ajax.js =================================================================== --- trunk/.themes/ajax/ajax.js 2007-08-14 21:12:12 UTC (rev 38) +++ trunk/.themes/ajax/ajax.js 2007-08-14 23:06:33 UTC (rev 39) @@ -375,25 +375,20 @@ imageNameSpan.className = "name"; imageNameSpan.appendChild(document.createTextNode(imageNode.getAttribute("file"))); + expandedImageSpan.appendChild(linkToSpan); + expandedImageSpan.appendChild(loadingSpan); + expandedImageSpan.appendChild(imageSpan); + expandedImageSpan.appendChild(imageNameSpan); + var expandedImage = new Image(); - expandedImage.src = imageThumbPath; expandedImage.onload = function() { - var loadingSpan = document.getElementById("loadingspan"); loadingSpan.style.display = "none"; - - var imageSpan = document.getElementById("expandedimagespan"); imageSpan.style.display = "block"; - - var linkToSpan = document.getElementById("linktospan"); linkToSpan.style.display = "block"; - } + }; + expandedImage.src = imageThumbPath; - expandedImageSpan.appendChild(linkToSpan); - expandedImageSpan.appendChild(loadingSpan); - expandedImageSpan.appendChild(imageSpan); - expandedImageSpan.appendChild(imageNameSpan); - return expandedImageSpan; } Modified: trunk/.themes/ajax/ajax.xsl =================================================================== --- trunk/.themes/ajax/ajax.xsl 2007-08-14 21:12:12 UTC (rev 38) +++ trunk/.themes/ajax/ajax.xsl 2007-08-14 23:06:33 UTC (rev 39) @@ -58,11 +58,13 @@ <xsl:template match="themes"> <div id="themes"> <form id="themeform" action="index.php" method="post"> - <select name="theme" onchange="submit();"> - <option value="">Please choose a theme</option> - <xsl:apply-templates select="theme" /> - </select> - <button type="submit">Go</button> + <fieldset> + <select name="theme" onchange="submit();"> + <option value="">Please choose a theme</option> + <xsl:apply-templates select="theme" /> + </select> + <button type="submit">Go</button> + </fieldset> </form> </div> </xsl:template> @@ -97,23 +99,27 @@ <xsl:choose> <xsl:when test="count(image) > 0"> <xsl:variable name="path"> - <xsl:apply-templates select="ancestor::folder" mode="getpath" /> + <xsl:call-template name="replaceCharsInString"> + <xsl:with-param name="stringIn"> + <xsl:text>.thumbs/</xsl:text><xsl:apply-templates select="ancestor::folder" mode="getpath" /><xsl:value-of select="concat(@name, '/', image[1]/@file)" /> + </xsl:with-param> + <xsl:with-param name="charsIn" select="' '"/> + <xsl:with-param name="charsOut" select="'%20'"/> + </xsl:call-template> </xsl:variable> - <img> - <xsl:attribute name="src"><xsl:value-of select="concat('.thumbs/' , $path, @name, '/', image[1]/@file)" /></xsl:attribute> + <img alt="Sample Image"> + <xsl:attribute name="src"><xsl:value-of select="$path" /></xsl:attribute> <xsl:attribute name="alt"><xsl:value-of select="image[1]/@file" /></xsl:attribute> </img> </xsl:when> <xsl:when test="count(folder) > 0"> - <img> + <img alt="Image Folder"> <xsl:attribute name="src"><xsl:value-of select="concat('.themes/', $themename, '/folder.png')" /></xsl:attribute> - <xsl:attribute name="alt">Image Folder</xsl:attribute> </img> </xsl:when> <xsl:otherwise> - <img> + <img alt="Empty Folder"> <xsl:attribute name="src"><xsl:value-of select="concat('.themes/', $themename, '/empty.png')" /></xsl:attribute> - <xsl:attribute name="alt">Empty Folder</xsl:attribute> </img> </xsl:otherwise> </xsl:choose> @@ -121,9 +127,8 @@ </span> <xsl:if test="count(folder) > 0 or count(image) > 0"> <span class="icon"> - <img> + <img alt="Folder Icon"> <xsl:attribute name="src"><xsl:value-of select="concat('.themes/', $themename, '/foldericon.png')" /></xsl:attribute> - <xsl:attribute name="alt">Folder Icon</xsl:attribute> </img> </span> </xsl:if> @@ -147,7 +152,13 @@ <xsl:template match="image"> <xsl:param name="selectedID">0</xsl:param> <xsl:variable name="path"> - <xsl:apply-templates select="ancestor::folder" mode="getpath" /> + <xsl:call-template name="replaceCharsInString"> + <xsl:with-param name="stringIn"> + <xsl:text>.thumbs/</xsl:text><xsl:apply-templates select="ancestor::folder" mode="getpath" /><xsl:value-of select="@file" /> + </xsl:with-param> + <xsl:with-param name="charsIn" select="' '"/> + <xsl:with-param name="charsOut" select="'%20'"/> + </xsl:call-template> </xsl:variable> <div class="thumbnail"> @@ -161,7 +172,7 @@ <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> + <xsl:attribute name="src"><xsl:value-of select="$path" /></xsl:attribute> </img> </a> </span> @@ -216,7 +227,7 @@ <li class="currentfolder"> <xsl:attribute name="onclick">openFolder('<xsl:value-of select="@id" />'); return false;</xsl:attribute> <span class="icon"> - <img src=".themes/ajax/foldericon.png" /> + <img src=".themes/ajax/foldericon.png" alt="Folder Icon" /> </span> <span class="name"><xsl:value-of select="@name" /></span> <ul> @@ -224,7 +235,7 @@ <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" /> + <img src=".themes/ajax/foldericon.png" alt="Folder Icon" /> </span> <span class="name"><xsl:value-of select="@name" /></span> </li> @@ -236,7 +247,13 @@ <xsl:template match="image" mode="post"> <xsl:variable name="path"> - <xsl:apply-templates select="ancestor::folder" mode="getpath" /> + <xsl:call-template name="replaceCharsInString"> + <xsl:with-param name="stringIn"> + <xsl:text>./</xsl:text><xsl:apply-templates select="ancestor::folder" mode="getpath" /><xsl:value-of select="@file" /> + </xsl:with-param> + <xsl:with-param name="charsIn" select="' '"/> + <xsl:with-param name="charsOut" select="'%20'"/> + </xsl:call-template> </xsl:variable> <div id="breadcrumbtrail"> @@ -244,21 +261,23 @@ </div> <div id="albums"> - <span id="expandedimage"> - <span style="display: block;" id="linktospan"> + <div id="expandedimage"> + <div 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"> + <xsl:text>Link to this image</xsl:text> + </a> + </div> + <div id="expandedimagespan"> <a href="#" onclick="closeImage(); return false;"> <img> - <xsl:attribute name="src"><xsl:value-of select="concat('./', $path, @file)" /></xsl:attribute> + <xsl:attribute name="src"><xsl:value-of select="$path" /></xsl:attribute> + <xsl:attribute name="alt"><xsl:value-of select="@file" /></xsl:attribute> </img> </a> - </span> - <span class="name"><xsl:value-of select="@file" /></span> - </span> + </div> + <div class="name"><xsl:value-of select="@file" /></div> + </div> <div id="selectedalbum"> <xsl:apply-templates select="parent::*/folder" /> @@ -273,5 +292,24 @@ <xsl:template match="folder" mode="getpath"> <xsl:value-of select="concat(@name, '/')" /> </xsl:template> + + <xsl:template name="replaceCharsInString"> + <xsl:param name="stringIn"/> + <xsl:param name="charsIn"/> + <xsl:param name="charsOut"/> + <xsl:choose> + <xsl:when test="contains($stringIn,$charsIn)"> + <xsl:value-of select="concat(substring-before($stringIn,$charsIn),$charsOut)"/> + <xsl:call-template name="replaceCharsInString"> + <xsl:with-param name="stringIn" select="substring-after($stringIn,$charsIn)"/> + <xsl:with-param name="charsIn" select="$charsIn"/> + <xsl:with-param name="charsOut" select="$charsOut"/> + </xsl:call-template> + </xsl:when> + <xsl:otherwise> + <xsl:value-of select="$stringIn"/> + </xsl:otherwise> + </xsl:choose> + </xsl:template> </xsl:stylesheet> This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site. |
From: <esp...@us...> - 2007-08-15 21:26:38
|
Revision: 41 http://picfinity.svn.sourceforge.net/picfinity/?rev=41&view=rev Author: espadav8 Date: 2007-08-15 14:26:41 -0700 (Wed, 15 Aug 2007) Log Message: ----------- Add a link image (20x20) Add the CSS to position the link image and the XSL to add it to the XHTML Also change the 'Link to this image' background and :hover to make it stand out a bit better Modified Paths: -------------- trunk/.themes/ajax/ajax.css trunk/.themes/ajax/ajax.xsl Added Paths: ----------- trunk/.themes/ajax/link.png Modified: trunk/.themes/ajax/ajax.css =================================================================== --- trunk/.themes/ajax/ajax.css 2007-08-14 23:23:49 UTC (rev 40) +++ trunk/.themes/ajax/ajax.css 2007-08-15 21:26:41 UTC (rev 41) @@ -91,12 +91,24 @@ /* --- expanded image --- */ +#linktospan +{ + position: relative; +} #linktospan a { text-decoration: none; + padding: 4px 0; } +#linktospan a img +{ + position: absolute; + top: 2px; + left: 3px; +} + #expandedimage { border: 1px solid #ccc; @@ -191,6 +203,7 @@ html, .selected a, +#linktospan a:hover, #breadcrumbtrail ul li:hover, #breadcrumbtrail ul li ul li.selected { @@ -205,8 +218,8 @@ background-color: #505050; } +#linktospan a, .image a:hover, -#linktospan a:hover, #breadcrumbtrail ul li ul li:hover { background-color: #707070; Modified: trunk/.themes/ajax/ajax.xsl =================================================================== --- trunk/.themes/ajax/ajax.xsl 2007-08-14 23:23:49 UTC (rev 40) +++ trunk/.themes/ajax/ajax.xsl 2007-08-15 21:26:41 UTC (rev 41) @@ -227,7 +227,9 @@ <li class="currentfolder"> <xsl:attribute name="onclick">openFolder('<xsl:value-of select="@id" />'); return false;</xsl:attribute> <span class="icon"> - <img src=".themes/ajax/foldericon.png" alt="Folder Icon" /> + <img alt="Folder Icon"> + <xsl:attribute name="src"><xsl:value-of select="concat('.themes/', $themename, '/foldericon.png')" /></xsl:attribute> + </img> </span> <span class="name"><xsl:value-of select="@name" /></span> <ul> @@ -266,6 +268,11 @@ <a> <xsl:attribute name="href">index.php?id=<xsl:value-of select="@id" /></xsl:attribute> <xsl:text>Link to this image</xsl:text> +<!-- + <img alt="Link to this image"> + <xsl:attribute name="src"><xsl:value-of select="concat('.themes/', $themename, '/link.png')" /></xsl:attribute> + </img> +--> </a> </div> <div id="expandedimagespan"> Added: trunk/.themes/ajax/link.png =================================================================== (Binary files differ) Property changes on: trunk/.themes/ajax/link.png ___________________________________________________________________ Name: svn:mime-type + application/octet-stream This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site. |
From: <esp...@us...> - 2007-08-16 12:57:27
|
Revision: 42 http://picfinity.svn.sourceforge.net/picfinity/?rev=42&view=rev Author: espadav8 Date: 2007-08-16 05:57:30 -0700 (Thu, 16 Aug 2007) Log Message: ----------- Update the XSL to produce a suckerfish dropdown Clean parts of the CSS and ann the new styles for the suckerfish Add some JS for IE6 dropdown Create the dropdown correctly in the JS Create the expanded image correctly in the JS Modified Paths: -------------- trunk/.themes/ajax/ajax.css trunk/.themes/ajax/ajax.js trunk/.themes/ajax/ajax.xsl Modified: trunk/.themes/ajax/ajax.css =================================================================== --- trunk/.themes/ajax/ajax.css 2007-08-15 21:26:41 UTC (rev 41) +++ trunk/.themes/ajax/ajax.css 2007-08-16 12:57:30 UTC (rev 42) @@ -5,6 +5,11 @@ border: 0; } +a +{ + text-decoration: none; +} + img { display: block; @@ -30,12 +35,13 @@ #themes { position: absolute; - top: 20px; - right: 20px; + top: 10px; + right: 10px; } #selectedalbum { + margin-top: 5px; clear: both; float: left; } @@ -58,7 +64,7 @@ width: 150px; display: block; float: left; - margin: 5px 5px 0 0; + margin: 0 5px 5px 0; border: 1px solid #ccc; position: relative; } @@ -91,13 +97,8 @@ /* --- expanded image --- */ -#linktospan -{ - position: relative; -} #linktospan a { - text-decoration: none; padding: 4px 0; } @@ -113,6 +114,8 @@ { border: 1px solid #ccc; float: left; + clear: both; + margin-top: 5px; } #expandedimagespan @@ -131,103 +134,88 @@ /* --- hover actions --- */ a:hover, -#breadcrumbtrail ul li:hover +#breadcrumbtrail ul li a:hover { cursor: pointer; } -/* --- breadcrumb --- */ +/*** BACKGROUND ***/ -#breadcrumbtrail +html, +.selected a, +#linktospan a:hover, +#breadcrumbtrail ul li a:hover, +#breadcrumbtrail ul li ul li.selected { - display: block; - margin: 0 0 10px 0; - height: 24px; + background-color: #303030; } -#breadcrumbtrail ul -{ - color: #fff; - font-weight: bold; - list-style: none; - display: block; - float: left; - width: 150px; - margin: 0 5px 0 0; - border: 1px solid #ccc; -} - +.folder, +.thumbnail, +#expandedimage, #breadcrumbtrail ul li { - height: 18px; - padding: 3px 0 3px 5px; - width: 145px; + background-color: #505050; } -#breadcrumbtrail ul li ul +#linktospan a, +.image a:hover, +#breadcrumbtrail ul li ul li a:hover { - display: none; - margin: 21px 0 -1px -6px; - position: fixed; - z-index: 10; + background-color: #707070; } -#breadcrumbtrail ul li ul li -{ - clear: left; -} -#breadcrumbtrail ul li .name +#loadingspan { - float: left; - border: none; - text-align: left; - padding: 3px 0 3px 5px; + background-color: #cc0022; } -#breadcrumbtrail ul li .icon + +/*** BREADCRUMB TRAIL ***/ + +#breadcrumbtrail ul { - position: static; - float: left; - margin: -3px 0 0 0; + list-style: none; } -#breadcrumbtrail ul li:hover ul +#breadcrumbtrail a { display: block; + width: 150px; } - -/*** BACKGROUND ***/ - -html, -.selected a, -#linktospan a:hover, -#breadcrumbtrail ul li:hover, -#breadcrumbtrail ul li ul li.selected +#breadcrumbtrail img { - background-color: #303030; + display: none; } -.folder, -.thumbnail, -#expandedimage, -#breadcrumbtrail ul +#breadcrumbtrail ul li { - background-color: #505050; + margin-right: 5px; + float: left; + width: 150px; + border: 1px solid #ccc; } - -#linktospan a, -.image a:hover, -#breadcrumbtrail ul li ul li:hover +#breadcrumbtrail ul li ul { - background-color: #707070; + border: 1px solid #ccc; + left: -999em; + position: absolute; + width: 150px; + z-index: 10; } -#loadingspan +#breadcrumbtrail ul li ul li { - background-color: #cc0022; + border: none; } +#breadcrumbtrail ul li.over ul, +#breadcrumbtrail ul li:hover ul +{ + left: auto; + margin-left: -1px; +} \ No newline at end of file Modified: trunk/.themes/ajax/ajax.js =================================================================== --- trunk/.themes/ajax/ajax.js 2007-08-15 21:26:41 UTC (rev 41) +++ trunk/.themes/ajax/ajax.js 2007-08-16 12:57:30 UTC (rev 42) @@ -1,7 +1,27 @@ addEvent(window, 'load', importLayout, false); +addEvent(window, 'load', IE6navhover, false); var xmlDoc; +function IE6navhover() +{ + if ((window.attachEvent) && (document.getElementById("breadcrumbtrail") != null)) + { + var sfEls = document.getElementById("breadcrumbtrail").getElementsByTagName("LI"); + for (var i=0; i<sfEls.length; i++) + { + sfEls[i].onmouseover = function() + { + this.className += " over"; + } + sfEls[i].onmouseout = function() + { + this.className = this.className.replace(new RegExp(" over\\b"), ""); + } + } + } +} + function importLayout() { if (window.XMLHttpRequest) @@ -177,7 +197,7 @@ var layoutNode = getLayoutNode(elementID); var nodePath = getNodePath(layoutNode); - var breadcrumbDiv = createBreadcrumbTrail(layoutNode);; + var breadcrumbDiv = createBreadcrumbTrail(layoutNode); var newAlbumsDiv = document.createElement("div"); newAlbumsDiv.setAttribute("id", "albums"); @@ -207,6 +227,7 @@ document.getElementById("albums").parentNode.replaceChild(newAlbumsDiv, document.getElementById("albums")); + IE6navhover() return false; } @@ -340,56 +361,56 @@ { var nodePath = getNodePath(getLayoutNode(imageNode.getAttribute("id"))); - var expandedImageSpan = document.createElement("span"); - expandedImageSpan.setAttribute("id", "expandedimage"); + var expandedImageDiv = document.createElement("div"); + expandedImageDiv.setAttribute("id", "expandedimage"); - var linkToSpan = document.createElement("span"); - linkToSpan.setAttribute("id", "linktospan"); - linkToSpan.style.display = "none"; + var linkToDiv = document.createElement("div"); + linkToDiv.setAttribute("id", "linktospan"); + linkToDiv.style.display = "none"; var linkToAnchor = document.createElement("a"); linkToAnchor.setAttribute("href", "index.php?id=" + imageNode.getAttribute("id")) linkToAnchor.appendChild(document.createTextNode("Link to this image")); - linkToSpan.appendChild(linkToAnchor); + linkToDiv.appendChild(linkToAnchor); - var loadingSpan = document.createElement("span"); - loadingSpan.setAttribute("id", "loadingspan"); - loadingSpan.style.display = "block"; - loadingSpan.appendChild(document.createTextNode("Loading image")); + var loadingDiv = document.createElement("div"); + loadingDiv.setAttribute("id", "loadingspan"); + loadingDiv.style.display = "block"; + loadingDiv.appendChild(document.createTextNode("Loading image")); var imageAnchor = document.createElement("a"); imageAnchor.onclick = function() { closeImage(); return false }; imageAnchor.href = "#"; - var imageSpan = document.createElement("span"); - imageSpan.setAttribute("id", "expandedimagespan"); - imageSpan.style.display = "none"; + var imageDiv = document.createElement("div"); + imageDiv.setAttribute("id", "expandedimagespan"); + imageDiv.style.display = "none"; var albumImage = document.createElement("img"); var imageThumbPath = nodePath + '/' + imageNode.getAttribute("file"); albumImage.setAttribute("src", imageThumbPath); imageAnchor.appendChild(albumImage); - imageSpan.appendChild(imageAnchor); + imageDiv.appendChild(imageAnchor); - var imageNameSpan = document.createElement("span"); - imageNameSpan.className = "name"; - imageNameSpan.appendChild(document.createTextNode(imageNode.getAttribute("file"))); + var imageNameDiv = document.createElement("div"); + imageNameDiv.className = "name"; + imageNameDiv.appendChild(document.createTextNode(imageNode.getAttribute("file"))); - expandedImageSpan.appendChild(linkToSpan); - expandedImageSpan.appendChild(loadingSpan); - expandedImageSpan.appendChild(imageSpan); - expandedImageSpan.appendChild(imageNameSpan); + expandedImageDiv.appendChild(linkToDiv); + expandedImageDiv.appendChild(loadingDiv); + expandedImageDiv.appendChild(imageDiv); + expandedImageDiv.appendChild(imageNameDiv); var expandedImage = new Image(); expandedImage.onload = function() { - loadingSpan.style.display = "none"; - imageSpan.style.display = "block"; - linkToSpan.style.display = "block"; + loadingDiv.style.display = "none"; + imageDiv.style.display = ""; + linkToDiv.style.display = ""; }; expandedImage.src = imageThumbPath; - return expandedImageSpan; + return expandedImageDiv; } function createBreadcrumbTrail(element) @@ -447,6 +468,9 @@ // this is for the current folder if ((node.nodeName == "folder") && (node.getAttribute("name") == currentFolder)) { + var dropMenuAnchor = document.createElement("a"); + dropMenuAnchor.href = "index.php?id=" + dropMenuItem.getAttribute("id"); + var nameSpan = document.createElement("span"); nameSpan.className = "name"; nameSpan.appendChild(document.createTextNode(node.getAttribute("name"))); @@ -459,9 +483,11 @@ var iconImage = document.createElement("img"); iconImage.setAttribute("src", ".themes/ajax/foldericon.png"); iconSpan.appendChild(iconImage); + + dropMenuAnchor.appendChild(nameSpan); + dropMenuAnchor.appendChild(nameSpan); - menuLi.insertBefore(nameSpan, menuLi.firstChild); - menuLi.insertBefore(iconSpan, menuLi.firstChild); + menuLi.insertBefore(dropMenuAnchor, menuLi.firstChild); breadcrumbEntry.appendChild(menuLi); } @@ -475,10 +501,12 @@ var dropMenuItem = document.createElement("li"); dropMenuItem.setAttribute("id", node.getAttribute("id")); + var dropMenuAnchor = document.createElement("a"); + dropMenuAnchor.href = "index.php?id=" + dropMenuItem.getAttribute("id"); + dropMenuAnchor.onclick = function() { openFolder(dropMenuItem.getAttribute("id")); return false; }; + if (node.hasChildNodes()) { - dropMenuItem.onclick = function() { openFolder(dropMenuItem.getAttribute("id")); return false; }; - // create a span for the folder icon var iconSpan = document.createElement("span"); iconSpan.className = "icon"; @@ -487,11 +515,12 @@ var iconImage = document.createElement("img"); iconImage.setAttribute("src", ".themes/ajax/foldericon.png"); iconSpan.appendChild(iconImage); - dropMenuItem.appendChild(iconSpan); + + dropMenuAnchor.appendChild(iconSpan); } else { - dropMenuItem.setAttribute("class", "folder empty"); + dropMenuItem.setAttribute("class", "empty"); // create a span for the folder icon var iconSpan = document.createElement("span"); @@ -517,8 +546,9 @@ var nameSpan = document.createElement("span"); nameSpan.className = "name"; nameSpan.appendChild(document.createTextNode(node.getAttribute("name"))); - dropMenuItem.appendChild(nameSpan); + dropMenuAnchor.appendChild(nameSpan); + dropMenuItem.appendChild(dropMenuAnchor); return dropMenuItem; } Modified: trunk/.themes/ajax/ajax.xsl =================================================================== --- trunk/.themes/ajax/ajax.xsl 2007-08-15 21:26:41 UTC (rev 41) +++ trunk/.themes/ajax/ajax.xsl 2007-08-16 12:57:30 UTC (rev 42) @@ -223,23 +223,39 @@ <xsl:apply-templates select="parent::folder" mode="breadcrumbtrail" /> </xsl:if> + <xsl:variable name="currentName"><xsl:value-of select="@name" /></xsl:variable> + <ul class="trailentry"> <li class="currentfolder"> - <xsl:attribute name="onclick">openFolder('<xsl:value-of select="@id" />'); return false;</xsl:attribute> - <span class="icon"> - <img alt="Folder Icon"> - <xsl:attribute name="src"><xsl:value-of select="concat('.themes/', $themename, '/foldericon.png')" /></xsl:attribute> - </img> - </span> - <span class="name"><xsl:value-of select="@name" /></span> + <a> + <xsl:attribute name="onclick">openFolder('<xsl:value-of select="@id" />'); return false;</xsl:attribute> + <xsl:attribute name="href">index.php?id=<xsl:value-of select="@id" /></xsl:attribute> + <span class="icon"> + <img alt="Folder Icon"> + <xsl:attribute name="src"><xsl:value-of select="concat('.themes/', $themename, '/foldericon.png')" /></xsl:attribute> + </img> + </span> + <span class="name"><xsl:value-of select="@name" /></span> + </a> <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" alt="Folder Icon" /> - </span> - <span class="name"><xsl:value-of select="@name" /></span> + <li> + <xsl:choose> + <xsl:when test="$currentName = @name"> + <xsl:attribute name="class">menuentry selected</xsl:attribute> + </xsl:when> + <xsl:otherwise> + <xsl:attribute name="class">menuentry</xsl:attribute> + </xsl:otherwise> + </xsl:choose> + <a> + <xsl:attribute name="onclick">openFolder('<xsl:value-of select="@id" />'); return false;</xsl:attribute> + <xsl:attribute name="href">index.php?id=<xsl:value-of select="@id" /></xsl:attribute> + <span class="icon"> + <img src=".themes/ajax/foldericon.png" alt="Folder Icon" /> + </span> + <span class="name"><xsl:value-of select="@name" /></span> + </a> </li> </xsl:for-each> </ul> This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site. |