<?xml version="1.0"?>

<xsl:stylesheet version="1.0"
	xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
	xmlns:fd="http://www.bradsoft.com/feeddemon/xmlns/1.0/">

<xsl:output method="html"
	doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN"
	doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"/>

<!-- report type:
	  0 = rptAllSubscriptions
     1 = rptAllWatches
     2 = rptAllNewsBins
     3 = rptSingleFolder
-->
<xsl:variable name="rpt-type" select="opml/@fd:reportType"/>

<xsl:template match="opml">

<xsl:variable name="rpt-title" select="head/title"/>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title><xsl:value-of select="$rpt-title"/></title>
	<style type="text/css">
		body {
			width: 100%;
			height: 100%; 
			font-size: 80%;
			font-family: "Tahoma", "Segoe UI", "Trebuchet MS", Verdana, sans-serif;
			line-height: 1.6em;
			margin: 0;
			color: #1F1F1F;
			background-color: white;
		}
		
		h1, h2, h3, h4, h5, h6 { font-weight: bold; }
		h1 { font-size: 135%; }
		h2 { font-size: 125%; }
		h3 { font-size: 115% }
		h4, h5, h6 { font-size: 105% }
		
		a { color: #006ABA; text-decoration: none; }
		a.more { font-weight: bold; }
		a:hover { color: #6F94C3; text-decoration: underline; }
			
		#pagehead { 
			background-color: #285AB0; 
			padding: 8px 12px;
			height: 26px;
			color: #FFFFFF;
			filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#5987D6,endColorStr=#033893);
		}
		#newspapertitle {
			font-weight: bold; 
			font-size: large;
		}
		#newspapertitle img { margin-right: 10px; }
		#newspapertitle a { color: white; text-decoration: underline; }
		
		#searchbar {
			float: right;
			color: white;
			font-weight: bold;
		}
		div#searchbar form {	margin: 0; }
		input.keyword { width: 120px; margin: 0 10px; }
		input.keyword, option { 
			border: 1px solid #B5C6E6;
			background-color: white;
			height: 18px;
		}
		
		img { border: none; }
		img.button { margin-left: 5px; margin-right: 8px; margin-top: 4px; }
		img.icon { margin-right: 1px; }
		img.uplevel { margin-left: 6px; }
		div#newspapertitle img.icon { margin-left: 8px; margin-right: 0; }
		
		a.icon { padding: 1px; }
		a.icon:hover { border: 1px solid #6F94C3; padding: 0; }
		a.more { font-weight: bold; }
		
		div.spacer { margin-bottom: 10px; }
				
		.collapsed { display: none; }
		.expanded {  }
		.collapsible, img.button { cursor: pointer; }
		
		kbd, code { font-size: 100%; }
		
		.none { color: silver; }
		.sep { color: silver; margin: 0 1px; }
		.fdhighlight { background-color: #FFFFAC; border: 1px dotted #CDCE00; }
		
		div.groupheader, #options {
			border-bottom: 1px solid #B5C6E6;
			color: #000000;
			background-color: #DFEDFE;
			filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#DFEDFE,endColorStr=#BEDAFB);
			text-align: left;
			/* keep group headers on one line */
			overflow: hidden;
			text-overflow: ellipsis;
		}
		div.groupheader { 
			padding: 3px 4px 3px 14px;
			font-variant: small-caps;
			font-size: 12px;
			height: 18px;
		}
		.groupcaption { margin-right: 6px; }
		.groupcaption .icon { margin-left: 4px; }
		
		#options {
			float: right;
			width: 130px;	
			padding: 6px 18px 10px 22px;
			margin-left: 2px;
			border-left: 1px solid #B5C6E6;
			border-bottom: 1px solid #B5C6E6;
		}
		#options form { 
			margin: 0;
			margin-bottom: 5px;
		}
		#options select { width: 100%; margin-top: 4px; font-size: 88%; }
		div.groupheader a, #options a { color: #000000  }
		div.options-label {
			font-variant: small-caps;
			border-bottom: 1px solid #B5C6E6;
			margin-top: 12px;
			margin-bottom: 2px;
			padding-bottom: 2px;
		}
		
		ul.actionlink { 
			float: right;
			margin: 0;
		}
		li.actionlink { display: inline; margin-right: 6px; }
		li.actionlink a { color: blue; text-decoration: underline; }
		#pagehead li.actionlink a { color: white; }
		
		a#filter { font-weight: normal; color: #006ABA; }
		
		.unread { font-size: 105%; font-weight: bold; color: #000000; }
		.flagged { color: #DC143C; }
		.normal { color: black; }
		
		/******************/
		/* end surfer.css */
		/******************/

		ul.feedlist { list-style-type: none;  }
		.feedlist { }
		.feedlist li {
			margin-bottom: 6px;
		}
		.feedlist img.icon { margin-left: 6px; }

		.task { 
			margin: 10px; 
			color: black;
			font-weight: bold;
		}
		.task img.icon { margin-right: 6px; }
		.task a { text-decoration: underline; }
		
		#attention {
			float: right;
			width: 35%;
			padding-bottom: 12px;
			border-left: 1px solid #B5C6E6;
			border-bottom: 1px solid #B5C6E6;
			background-color: #E5EBFF;
			color: #000000;
			filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#FCFDFE,endColorStr=#E2EDFD);
		}
	</style>
	<script type="text/javascript">
		<![CDATA[
		  var mb_IsIE = (document.all);
			
			function collapseGrp(groupid) {
				document.getElementById(groupid + '_items').className = 'feedlist collapsed';
				document.getElementById(groupid + '_imgexpand').style.display = 'inline';
				document.getElementById(groupid + '_imgcollapse').style.display = 'none';
			}				
			function expandGroup(groupid) {
				document.getElementById(groupid + '_items').className = 'feedlist expanded';
				document.getElementById(groupid + '_imgexpand').style.display = 'none';
				document.getElementById(groupid + '_imgcollapse').style.display = 'inline';
			}				
			function toggleGroup(groupid) {
				if ((mb_IsIE) && (event.srcElement.id == ''))
 					return;
				var divItems = document.getElementById(groupid + '_items');
				if (divItems == undefined) 
					return;				
				if (divItems.className == 'feedlist collapsed')
					expandGroup(groupid)
				else
					collapseGrp(groupid);
			}						
		]]>
	</script>	
</head>
<body>
	<xsl:variable name="folderId" select="@fd:folderId"/>
	
	<xsl:variable name="nds_feeds" select="body/outline"/>
	<xsl:variable name="nds_unread_feeds" select="$nds_feeds[@fd:numUnread &gt; 0]"/>
	<xsl:variable name="nds_flagged_feeds" select="$nds_feeds[@fd:numFlagged &gt; 0]"/>
	<xsl:variable name="num_unread_feeds" select="count($nds_unread_feeds)"/>
	<xsl:variable name="num_flagged_feeds" select="count($nds_flagged_feeds)"/>
	
	<div id="pagehead">
		<!-- search form -->
		<div id="searchbar">
			<form method="get" action="fdaction:">
				<label>
					<xsl:choose>
						<xsl:when test="$rpt-type=0">Search Subscriptions</xsl:when>
						<xsl:when test="$rpt-type=1">Search Watches</xsl:when>
						<xsl:when test="$rpt-type=2">Search News Bins</xsl:when>
						<xsl:when test="$rpt-type=3">Search Folder</xsl:when>
					</xsl:choose>	
				</label>
				<input size="20" type="text" maxlength="255" name="keyword" value="" class="keyword" />
				<input type="image" src="images/find.gif" class="submit" />
				<xsl:choose>
					<xsl:when test="$rpt-type=1">
						<input type="hidden" name="action" value="searchwatches"/>
					</xsl:when>
					<xsl:when test="$rpt-type=2">
						<input type="hidden" name="action" value="searchnewsbins"/>
					</xsl:when>
					<xsl:otherwise>
						<input type="hidden" name="action" value="searchsubscriptions"/>
						<xsl:if test="$rpt-type=3">
							<input type="hidden" name="folderId" value="{$folderId}"/>
						</xsl:if>
					</xsl:otherwise>
				</xsl:choose>
			</form>
		</div>
		
		<div id="newspapertitle">
			<xsl:choose>
				<!-- no unread items exist -->
				<xsl:when test="$num_unread_feeds=0">
					<xsl:choose>
						<xsl:when test="$rpt-type=1"><img src="images/Watch-lg.gif" align="absmiddle" /></xsl:when>
						<xsl:when test="$rpt-type=2"><img src="images/NewsBin-lg.gif" align="absmiddle" /></xsl:when>
						<xsl:when test="$rpt-type=3"><img src="images/Folder-lg.gif" align="absmiddle" /></xsl:when>
						<xsl:otherwise><img src="images/Subscriptions-lg.gif" align="absmiddle" /></xsl:otherwise>
					</xsl:choose>
				</xsl:when>
				<!-- unread items exist -->
				<xsl:otherwise>
					<xsl:choose>
						<xsl:when test="$rpt-type=0">
							<a href="fdaction:?action=markallfeedsread" title="Mark feeds read">
								<img src="images/Subscriptions-unread-lg.gif" align="absmiddle" />
							</a>
						</xsl:when>
						<xsl:when test="$rpt-type=1">
							<a href="fdaction:?action=markallwatchesread" title="Mark watches read">
								<img src="images/Watch-unread-lg.gif" align="absmiddle" />
							</a>
						</xsl:when>
						<xsl:when test="$rpt-type=2">
							<a href="fdaction:?action=markallnewsbinsread" title="Mark news bins read">
								<img src="images/NewsBin-unread-lg.gif" align="absmiddle" />
							</a>
						</xsl:when>
						<xsl:when test="$rpt-type=3">
							<a href="fdaction:?action=markfolderread&amp;folderId={$folderId}" title="Mark folder read">
								<img src="images/Folder-unread-lg.gif" align="absmiddle" />
							</a>						
						</xsl:when>
					</xsl:choose>
				</xsl:otherwise>
			</xsl:choose>
			
			<xsl:value-of select="$rpt-title"/>
			<!-- up one level -->
			<xsl:if test="$rpt-type!=0">
				<a title="Up one level" href="fdaction:?action=uplevel">
					<img class="uplevel" src="images/up.gif" align="absmiddle" />
				</a>
			</xsl:if>
		</div>
	</div>
	
	<div id="container">
		<!-- options sidebar only for folder -->
		<xsl:if test="$rpt-type=3">
			<div id="options">
				<!-- show newspaper instead of overview -->
				<form method="get" action="fdaction:">
					<div class="options-label">Folder View</div>
					<input type="hidden" name="action" value="showoverview"/>
					<input type="hidden" name="folderId" value="{$folderId}"/>
					<input type="radio" name="value" value="1" onclick="this.form.submit();" checked="checked" />
					<a href="fdaction:?action=showoverview&amp;folderId={$folderId}&amp;value=1">Subscriptions</a>
					<br />
					<input type="radio" name="value" value="0" onclick="this.form.submit();" />
					<a href="fdaction:?action=showoverview&amp;folderId={$folderId}&amp;value=0">News items</a>
				</form>
			</div>
		</xsl:if>
		<!-- attention sidebar only shown for All Subscriptions -->
		<xsl:if test="$rpt-type=0">
			<div id="attention">
				<!-- Top 10 most attention -->
				<xsl:call-template name="group">
					<xsl:with-param name="group-id" select="'favorite'"/>
					<xsl:with-param name="group-caption" select="'Feeds I Pay the Most Attention To'"/>
				</xsl:call-template>
				<ol class="feedlist" id="favorite_items">
					<xsl:for-each select="$nds_feeds[@fd:collectAttention='true']">
						<xsl:sort select="@fd:attentionRank" data-type="number" order="descending"/>
						<xsl:if test="position() &lt;= 10">						
							<xsl:call-template name="feed">
								<xsl:with-param name="show-reset-attention" select="1"/>
							</xsl:call-template>
						</xsl:if>
					</xsl:for-each>
				</ol>
				<!-- Top 5 least attention -->
				<!--
				<xsl:call-template name="group">
					<xsl:with-param name="group-id" select="'leastfavorite'"/>
					<xsl:with-param name="group-caption" select="'Feeds I Pay the Least Attention To'"/>
				</xsl:call-template>
				<ol class="feedlist" id="leastfavorite_items">
					<xsl:for-each select="$nds_feeds[@collectAttention='true']">
						<xsl:sort select="@attentionRank" data-type="number" order="ascending"/>
						<xsl:if test="position() &lt;= 5">						
							<xsl:call-template name="feed">
								<xsl:with-param name="show-unsubscribe" select="1"/>
							</xsl:call-template>
						</xsl:if>
					</xsl:for-each>
				</ol>
				-->
			</div>
		</xsl:if>
		
		<div>
			<!-- feeds with unread items -->
			<xsl:call-template name="group">
				<xsl:with-param name="group-id" select="'unread'"/>
				<xsl:with-param name="group-caption" select="'Feeds with Unread Items'"/>
			</xsl:call-template>
						
			<ul class="feedlist" id="unread_items">
				<xsl:choose>
					<xsl:when test="$num_unread_feeds=0">
						<li class="none">(none)</li>
					</xsl:when>
					<xsl:otherwise>
						<xsl:for-each select="$nds_unread_feeds">
							<xsl:sort select="@title"/>
							<xsl:call-template name="feed"/>
						</xsl:for-each>						
					</xsl:otherwise>
				</xsl:choose>
			</ul>

			<!-- feeds with flagged items -->
			<xsl:call-template name="group">
				<xsl:with-param name="group-id" select="'flagged'"/>
				<xsl:with-param name="group-caption" select="'Feeds with Flagged Items'"/>
			</xsl:call-template>
			<ul class="feedlist" id="flagged_items">
				<xsl:choose>
					<xsl:when test="$num_flagged_feeds=0">
						<li class="none">(none)</li>
					</xsl:when>
					<xsl:otherwise>
						<xsl:for-each select="$nds_flagged_feeds">
							<xsl:sort select="@title"/>
							<xsl:call-template name="feed"/>
						</xsl:for-each>
					</xsl:otherwise>
				</xsl:choose>
			</ul>
		</div>
		
		<!-- tasks (currently only cleanup wizard) -->
		<xsl:for-each select="body/tasks/fd:task">
			<div class="task">
				<img src="images/task.gif" align="absmiddle" class="icon" />
				<xsl:value-of select="." disable-output-escaping="yes"/>
			</div>
		</xsl:for-each>
	
	</div> <!-- container -->	
</body>
</html>
</xsl:template>
<!-- end OPML template -->

<!-- group header template -->
<xsl:template name="group">
	<xsl:param name="group-id"/>
	<xsl:param name="group-caption"/>
	<xsl:param name="collapsible" select="1"/>
	
	<xsl:choose>
		<xsl:when test="$collapsible=1">
			<div class="groupheader collapsible" id="{$group-id}_header" onclick="toggleGroup('{$group-id}')">
				<img src="images/arrowright.gif" id="{$group-id}_imgexpand" border="0" align="right" class="collapsed button" />
				<img src="images/arrowdown.gif" id="{$group-id}_imgcollapse" border="0" align="right" class="expanded button" />			
				<xsl:value-of select="$group-caption"/>
			</div>
		</xsl:when>
		<xsl:otherwise>
			<div class="groupheader" id="{$group-id}_header">
				<xsl:value-of select="$group-caption"/>
			</div>
		</xsl:otherwise>
	</xsl:choose>
</xsl:template>

<!-- feed template -->
<xsl:template name="feed">
	<xsl:param name="show-reset-attention"/>
	<xsl:param name="show-unsubscribe"/>
	<li>
		<xsl:variable name="feedId" select="@fd:feedId"/>
		<xsl:variable name="numunread" select="@fd:numUnread"/>
		<xsl:variable name="numflagged" select="@fd:numFlagged"/>
		<xsl:variable name="lastPostDt" select="@fd:lastPostDateDisplay"/>
		<xsl:variable name="feed-type" select="@fd:feedType"/>
		
		<xsl:variable name="feedclass">
			<xsl:choose>
				<xsl:when test="$numunread &gt; 0 and $numflagged &gt; 0">unread flagged</xsl:when>
				<xsl:when test="$numunread &gt; 0">unread</xsl:when>
				<xsl:when test="$numflagged &gt; 0">flagged</xsl:when>
				<xsl:otherwise>normal</xsl:otherwise>
			</xsl:choose>
		</xsl:variable>

		<!-- feed title -->		
		<a class="{$feedclass}" href="fdaction:?action=gotofeed&amp;feedid={$feedId}" title="Show this feed">
			<xsl:value-of select="@title" disable-output-escaping="yes"/>
		</a>
		<!-- unsubscribe -->
		<xsl:if test="$show-unsubscribe=1">
			<a href="fdaction:?action=unsubscribe&amp;feedid={$feedId}" title="Unsubscribe">
				<img src="images/unsubscribe.gif" class="icon" align="absmiddle" />
			</a>
			<!-- link to feed home so user can check it out before unsubscribing - note that this does NOT use fdaction: for the link
				  since we don't want to affect the feed's attention rank here -->
			<a class="icon" href="{@htmlUrl}" target="_blank" title="Open link in new tab">
				<img src="images/linknew.gif" class="icon" align="absmiddle" />
			</a>			
		</xsl:if>
		<!-- unread count -->
		<xsl:if test="$numunread &gt; 0">
			<span class="unreadcount"> (<xsl:value-of select="$numunread"/>)</span>
			<a class="icon" href="fdaction:?action=markfeedread&amp;feedid={$feedId}" title="Mark feed read">
				<img src="images/unread.gif" class="icon" align="absmiddle" />
			</a>		
		</xsl:if>
		<!-- reset attention -->
		<xsl:if test="$show-reset-attention=1">
			<a href="fdaction:?action=resetattention&amp;feedid={$feedId}" title="Reset attention rank">
				<img src="images/resetattn.gif" class="icon" align="absmiddle" />
			</a>
		</xsl:if>
	</li>
</xsl:template>

</xsl:stylesheet>