Visual enhancement: Make progress bar invisible if duration is 0.

Visual enhancement: fixed and changed several access path to the
img/transparent.png invisible image.

8 files changed, 36 insertions, 26 deletions

diff --git a/css/styles.css b/css/styles.css
index 16ae529..7c36def 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -786,6 +786,13 @@ div.__progress {
 	border: 1px solid #C0C1DA;
 }
 
+div.__progress_invisible {
+	overflow: hidden;
+	width: 100px;
+	height: 10px;
+	border: 0px none transparent;
+}
+
 div.__progress div.__elapsed {
 	float: left;
 	height: 8px;
diff --git a/pages/pageelems.ecpp b/pages/pageelems.ecpp
index 8327d47..90cbaa7 100644
--- a/pages/pageelems.ecpp
+++ b/pages/pageelems.ecpp
@@ -71,10 +71,16 @@ int update_status(1);
 
 <%def progressbar>
 <%args>
-	string progress = "0";
+	int progress = 0;
 	string id;
+	int duration = -1; // invalid duration as default
 </%args>
-<div class="__progress"><div class="__elapsed" <%cpp> if (!id.empty()) { </%cpp>id="<$ id $>"<%cpp> } </%cpp> style="width: <$ progress $>px"></div></div>
+<%cpp>
+	string cls("__progress");
+	if ((duration >= 0) && ((progress < 0) || (duration == 0)))
+		cls +="_invisible";
+</%cpp>
+<div class="<$ cls $>"><div class="__elapsed" <%cpp> if (!id.empty()) { </%cpp>id="<$ id $>"<%cpp> } </%cpp> style="width: <$ progress $>px"></div></div>
 </%def>
 
 <# ---------------------------------------------------------------------- #>
@@ -256,6 +262,7 @@ int update_status(1);
 	int lastCurrentChanel = int();
 </%args>
 <%cpp>
+	int duration = EpgEvents::Duration(startTime, endTime);
 	int elapsed = EpgEvents::ElapsedTime(startTime, endTime);
     tEventID eventId = tEventID();
 	tChannelID channelId = tChannelID();
@@ -271,7 +278,7 @@ int update_status(1);
 	<a href="searchresults.html?searchplain=<$ StringEscapeAndBreak(title) $>"><img src="<$ LiveSetup().GetThemedLink("img", "search.png") $>" alt="" <& tooltip.hint text=(tr("Search for repeats.")) &>></img></a>
 <%cpp>
 		}
-		if (elapsed >= 0) {
+		if ((duration == 0) || (elapsed >= 0)) {
 </%cpp>
 	<& pageelems.vlc_stream_channel channelId=(channelId) &>
 <%cpp>
@@ -286,8 +293,8 @@ int update_status(1);
 </%cpp>
 		<td class="action leftcol <? lastCurrentChanel ? "bottomrow"?>"><& pageelems.event_timer epgid=(epgid) &></td>
 		<td class="action <? lastCurrentChanel ? "bottomrow"?>"><& pageelems.ajax_action_href action="switch_channel" tip=(tr("Switch to this channel.")) param=(channelId) image="zap.png" alt="" &></td>
-		<td class="action <? lastCurrentChanel ? "bottomrow"?>"><%cpp>if (LiveFeatures<features::epgsearch>().Recent() && eventId != 0) { </%cpp><a href="searchresults.html?searchplain=<$ StringUrlEncode(title) $>"><img src="<$ LiveSetup().GetThemedLink("img", "search.png") $>" alt="" <& tooltip.hint text=(tr("Search for repeats.")) &>></img></a><%cpp> } else { </%cpp><img src="transparent.png" width="16" height="16"><%cpp> } </%cpp></td>
-		<td class="action <? lastCurrentChanel ? "bottomrow"?>"><%cpp>if (LiveSetup().GetUseStreamdev() && elapsed > 0 && LiveFeatures<features::streamdev_server>().Loaded()) { </%cpp><a href="vlc.html?channel=<$ channelId $>"><img src="<$ LiveSetup().GetThemedLink("img", "stream_button.png") $>" alt="" <& tooltip.hint text=(tr("Stream this channel into browser.")) &>></img></a><%cpp> } else { </%cpp><img src="transparent.png" width="16" height="16"><%cpp> } </%cpp></td>
+		<td class="action <? lastCurrentChanel ? "bottomrow"?>"><%cpp>if (LiveFeatures<features::epgsearch>().Recent() && eventId != 0) { </%cpp><a href="searchresults.html?searchplain=<$ StringUrlEncode(title) $>"><img src="<$ LiveSetup().GetThemedLink("img", "search.png") $>" alt="" <& tooltip.hint text=(tr("Search for repeats.")) &>></img></a><%cpp> } else { </%cpp><img src="img/transparent.png" width="16" height="16"><%cpp> } </%cpp></td>
+        <td class="action <? lastCurrentChanel ? "bottomrow"?>"><%cpp>if ((duration == 0)  || (elapsed > 0)) { </%cpp><& pageelems.vlc_stream_channel channelId=(channelId) &><%cpp> } else { </%cpp><img src="img/transparent.png" width="16" height="16"><%cpp> } </%cpp></td>
 		<td class="action <? lastCurrentChanel ? "bottomrow"?>">
 <%cpp>
 			if (eventId != 0) {
diff --git a/pages/recordings.ecpp b/pages/recordings.ecpp
index fbd29ab..ea18800 100644
--- a/pages/recordings.ecpp
+++ b/pages/recordings.ecpp
@@ -197,7 +197,7 @@ for (iter = recordingsTree->begin(path); iter != end; ++iter) {
 	string folderimg = "folder_closed.png";
 </%args>
 	<div class="recording_item" onclick="Toggle(this)">
-		<div class="recording_imgs"><%cpp> reply.out() << StringRepeat(level, "<img src=\"/img/transparent.png\" alt=\"\" width=\"16px\" height=\"16px\" />"); </%cpp><img class="recording_expander" src="<$ LiveSetup().GetThemedLink("img", collapseimg) $>" alt="" /><img class="recording_folder" src="<$ LiveSetup().GetThemedLink("img", folderimg) $>" alt="" /></div>
+		<div class="recording_imgs"><%cpp> reply.out() << StringRepeat(level, "<img src=\"img/transparent.png\" alt=\"\" width=\"16px\" height=\"16px\" />"); </%cpp><img class="recording_expander" src="<$ LiveSetup().GetThemedLink("img", collapseimg) $>" alt="" /><img class="recording_folder" src="<$ LiveSetup().GetThemedLink("img", folderimg) $>" alt="" /></div>
 		<div class="recording_spec">
 			<div class="recording_name"><$ name $></div>
 	    </div>
@@ -221,7 +221,7 @@ for (iter = recordingsTree->begin(path); iter != end; ++iter) {
 	string archived;
 </%args>
 	<div class="recording_item">
-	<div class="recording_imgs"><%cpp> reply.out() << StringRepeat(level + 1, "<img src=\"/img/transparent.png\" alt=\"\" width=\"16px\" height=\"16px\" />"); </%cpp><%cpp> if (!archived.empty()) { </%cpp><img src="<$ LiveSetup().GetThemedLink("img", "on_dvd.png") $>" alt="on_dvd" <& tooltip.hint text=(archived) &> /><%cpp> } else { </%cpp><img src="<$ LiveSetup().GetThemedLink("img", "movie.png") $>" alt="movie" /><%cpp> } </%cpp></div>
+	<div class="recording_imgs"><%cpp> reply.out() << StringRepeat(level + 1, "<img src=\"img/transparent.png\" alt=\"\" width=\"16px\" height=\"16px\" />"); </%cpp><%cpp> if (!archived.empty()) { </%cpp><img src="<$ LiveSetup().GetThemedLink("img", "on_dvd.png") $>" alt="on_dvd" <& tooltip.hint text=(archived) &> /><%cpp> } else { </%cpp><img src="<$ LiveSetup().GetThemedLink("img", "movie.png") $>" alt="movie" /><%cpp> } </%cpp></div>
 	<div class="recording_spec">
 		<div class="recording_day" style="width: <$ dayLen $>"><$ day $></div>
 		<div class="recording_date"><$ FormatDateTime(tr("%b %d %y"), startTime) $></div>
@@ -238,7 +238,7 @@ for (iter = recordingsTree->begin(path); iter != end; ++iter) {
 	    }
 		else {
 </%cpp>
-		<img src="/img/transparent.png" alt="" width="16px" height="16px" />
+		<img src="img/transparent.png" alt="" width="16px" height="16px" />
 		<& pageelems.imdb_info_href title=(name) &>
 <%cpp>
 		}
diff --git a/pages/schedule.ecpp b/pages/schedule.ecpp
index 1417eee..f8623da 100644
--- a/pages/schedule.ecpp
+++ b/pages/schedule.ecpp
@@ -127,7 +127,7 @@ if (!logged_in && LiveSetup().UseAuth()) return reply.redirect("login.html");
 </%cpp>
 				<tr>
 	   				<td class="action leftcol <? lastEventCurrentDay ? "bottomrow" ?>"><& pageelems.event_timer epgid=(epgid) &></td>
-					<td class="action <? lastEventCurrentDay ? "bottomrow" ?>"><%cpp>if (LiveFeatures<features::epgsearch>().Recent() ) { </%cpp><a href="searchresults.html?searchplain=<$ StringUrlEncode(title) $>"><img src="<$ LiveSetup().GetThemedLink("img", "search.png") $>" alt="" <& tooltip.hint text=(tr("Search for repeats.")) &>></img></a><%cpp> } else { </%cpp><img src="transparent.png" width="16" height="16"><%cpp> } </%cpp></td>
+					<td class="action <? lastEventCurrentDay ? "bottomrow" ?>"><%cpp>if (LiveFeatures<features::epgsearch>().Recent() ) { </%cpp><a href="searchresults.html?searchplain=<$ StringUrlEncode(title) $>"><img src="<$ LiveSetup().GetThemedLink("img", "search.png") $>" alt="" <& tooltip.hint text=(tr("Search for repeats.")) &>></img></a><%cpp> } else { </%cpp><img src="img/transparent.png" width="16" height="16"><%cpp> } </%cpp></td>
 					<td class="action <? lastEventCurrentDay ? "bottomrow" ?>"><& pageelems.imdb_info_href title=(title) &></td>
 					<td class="topaligned <? lastEventCurrentDay ? "bottomrow" ?>"><div class="withmargin"><$ start $> - <$ end $></div></td>
 					<td class="<? (Event == PresentEvent) ? "current" ?> topaligned rightcol <? lastEventCurrentDay ? "bottomrow" ?>"><div class="more withmargin"><a <& tooltip.hint text=(StringEscapeAndBreak(StringWordTruncate(description, 300, truncated)) + "<br />" + tr("Click to view details.")) &><& tooltip.display domId=(epgEvent->Id()) &>><span class="title"><$ title $></span><br /><span class="short"><%cpp>if (short_description.empty()) { </%cpp>&nbsp;<%cpp> } </%cpp><$ short_description $></span></a></div></td>
diff --git a/pages/searchtimers.ecpp b/pages/searchtimers.ecpp
index 73255e4..fc2eaf8 100644
--- a/pages/searchtimers.ecpp
+++ b/pages/searchtimers.ecpp
@@ -51,7 +51,7 @@ if (!logged_in && LiveSetup().UseAuth()) return reply.redirect("login.html");
 					</td>
 				</tr>
 				<tr class="description">
-					<td class="action leftcol"><img src="/img/transparent.png" alt="" width="16px" height="16px"/></td>
+					<td class="action leftcol"><img src="img/transparent.png" alt="" width="16px" height="16px"/></td>
 					<td><div class="withmargin"><$ tr("Expression") $></div></td>
 					<td><div class="withmargin"><$ tr("Channel") $></div></td>
 					<td><div class="withmargin"><$ tr("Starts between") $></div></td>
diff --git a/pages/timerconflicts.ecpp b/pages/timerconflicts.ecpp
index 4e2c15c..b9e3669 100644
--- a/pages/timerconflicts.ecpp
+++ b/pages/timerconflicts.ecpp
@@ -56,16 +56,16 @@ if (!logged_in && LiveSetup().UseAuth()) return reply.redirect("login.html");
 							</td>
 						</tr>
 						<tr class="description">
-							<td class="leftcol"><img src="/img/transparent.png" alt="" width="16px" height="16px" /></td>
+							<td class="leftcol"><img src="img/transparent.png" alt="" width="16px" height="16px" /></td>
 							<td><div class="withmargin"><$ trVDR("Channel") $></div></td>
 							<td><div class="withmargin"><$ trVDR("Start") $></div></td>
 							<td><div class="withmargin"><$ trVDR("Stop") $></div></td>
 							<td><div class="withmargin"><$ trVDR("Priority") $></div></td>
 							<td><div class="withmargin"><$ trVDR("File") $></div></td>
-							<td class="action"><img src="/img/transparent.png" alt="" width="16px" height="16px" /></td>
-							<td class="action"><img src="/img/transparent.png" alt="" width="16px" height="16px" /></td>
-							<td class="action"><img src="/img/transparent.png" alt="" width="16px" height="16px" /></td>
-							<td class="action rightcol"><img src="/img/transparent.png" alt="" width="16px" height="16px" /></td>
+							<td class="action"><img src="img/transparent.png" alt="" width="16px" height="16px" /></td>
+							<td class="action"><img src="img/transparent.png" alt="" width="16px" height="16px" /></td>
+							<td class="action"><img src="img/transparent.png" alt="" width="16px" height="16px" /></td>
+							<td class="action rightcol"><img src="img/transparent.png" alt="" width="16px" height="16px" /></td>
 						</tr>
 <%cpp>
 						for (std::list<int>::const_iterator timerIndex = confltimer->concurrentTimerIndices.begin(); timerIndex != confltimer->concurrentTimerIndices.end(); ++timerIndex) {
diff --git a/pages/timers.ecpp b/pages/timers.ecpp
index 8ed41c0..15839a1 100644
--- a/pages/timers.ecpp
+++ b/pages/timers.ecpp
@@ -110,14 +110,14 @@ static const size_t maximumDescriptionLength = 300;
 					</td>
 				</tr>
 				<tr class="description">
-					<td class="leftcol"><img src="/img/transparent.png" alt="" width="16px" height="16px" /></td>
+					<td class="leftcol"><img src="img/transparent.png" alt="" width="16px" height="16px" /></td>
 					<td><div class="withmargin"><$ trVDR("Channel") $></div></td>
 					<td><div class="withmargin"><$ trVDR("Start") $></div></td>
 					<td><div class="withmargin"><$ trVDR("Stop") $></div></td>
 					<td><div class="withmargin"><$ trVDR("File") $></div></td>
-					<td class="action"><img src="/img/transparent.png" alt="" width="16px" height="16px" /></td>
-					<td class="action"><img src="/img/transparent.png" alt="" width="16px" height="16px" /></td>
-					<td class="action rightcol"><img src="/img/transparent.png" alt="" width="16px" height="16px" /></td>
+					<td class="action"><img src="img/transparent.png" alt="" width="16px" height="16px" /></td>
+					<td class="action"><img src="img/transparent.png" alt="" width="16px" height="16px" /></td>
+					<td class="action rightcol"><img src="img/transparent.png" alt="" width="16px" height="16px" /></td>
 				</tr>
 <%cpp>
 					}
diff --git a/pages/whats_on.ecpp b/pages/whats_on.ecpp
index ea5d222..dc348be 100644
--- a/pages/whats_on.ecpp
+++ b/pages/whats_on.ecpp
@@ -190,9 +190,7 @@ if (type == "now") {
 					</div>
 					<div>
 						<div class="info"><$ (timeSpan) $></div>
-%						if (epgEvent->Elapsed() >= 0) {
-							<div class="progress"><div><& pageelems.progressbar progress=(epgEvent->Elapsed()) &></div></div>
-%						}
+						<div class="progress"><div><& pageelems.progressbar progress=(epgEvent->Elapsed()) duration=(epgEvent->Duration()) &></div></div>
 						<div class="title withmargin"><$ (epgEvent->Title()) $></div>
 						<div class="short withmargin"><$ (epgEvent->ShortDescr()) $></div>
 						<div class="description withmargin"><$ truncDescription $></div>
@@ -215,15 +213,13 @@ if (type == "now") {
 				<td class="topaligned <? lastCurrentChanel ? "bottomrow"?>">
 					<div class="withmargin">
 						<div class="nomargin"><$ (timeSpan) $></div>
-%						if (epgEvent->Elapsed() >= 0) {
-							<div class="progress"><div><& pageelems.progressbar progress=(epgEvent->Elapsed()) &></div></div>
-%						}
+						<div class="progress"><div><& pageelems.progressbar progress=(epgEvent->Elapsed()) duration=(epgEvent->Duration()) &></div></div>
 					</div>
 				</td>
 				<td class="topaligned <? lastCurrentChanel ? "bottomrow"?>">
 					<div class="more withmargin">
 %					if (eventId != 0) {
-					     <a
+					    <a
 % 						if (!longDescription.empty()) {
 						<& tooltip.hint text=(longDescription) &><& tooltip.display domId=(epgEvent->Id()) &>
 %						}