Permalink
Browse files

Added HTML5 embedded audio for results playing on supporting browsers

Restricted to authenticated or localhost users only to prevent
redistribution license issues.
  • Loading branch information...
luccioman committed Feb 23, 2018
1 parent 1b90479 commit 07e86288534b7f19f8a0216138adc499ee15c6c6
Showing with 80 additions and 5 deletions.
  1. +10 −0 htroot/env/base.css
  2. +43 −1 htroot/js/yacysearch.js
  3. +3 −2 htroot/yacysearch.html
  4. +2 −1 htroot/yacysearch.java
  5. +6 −1 htroot/yacysearchitem.html
  6. +16 −0 htroot/yacysearchitem.java
@@ -1128,6 +1128,16 @@ div#tagcloud {
/******* yacysearchtrailer.html end ***********/
/******* yacysearchitem.html **********/
/* Mark audio element with media playing error */
.audioError {
border-style: solid;
border-color: orange;
}
/******* yacysearchitem.html end ***********/
/******* Vocabulary_p.html **********/
#Vocabulary_p label {
@@ -284,5 +284,47 @@ function toggleMoreTags(button, moreTagsId) {
moreTagsContainer.className = "";
}
}
}
/**
* Handle embedded audio result load error.
*
* @param event
* {ErrorEvent} the error event triggered
*/
function handleAudioLoadError(event) {
if (event != null && event.target != null) {
/* Fill the title attribute to provide some feedback about the error without need for looking at the console */
if (event.target.error != null && event.target.error.message) {
event.target.title = "Cannot play ("
+ event.target.error.message + ")";
} else {
event.target.title = "Cannot play";
}
/* Apply CSS class marking error for visual feedback*/
event.target.className = "audioError";
}
}
/**
* Handle embedded audio result 'playing' event : pauses any other currently
* playing audio.
*
* @param event
* {Event} a 'playing' event
*/
function handleAudioPlaying(event) {
if (event != null && event.target != null) {
var audioElems = document.getElementsByTagName("audio");
if(audioElems != null) {
for (var i = 0; i < audioElems.length; i++) {
var audioElem = audioElems[i];
if (audioElem != event.target && audioElem.pause
&& !audioElem.paused) {
audioElem.pause();
}
}
}
}
}
@@ -199,7 +199,8 @@ <h4 class="linktitle">
<div id="datehistogram"></div>
<!-- linklist begin -->
#(resultTable)#::<table width="100%"><tr class="TableHeader"><td width="30%">Media</td><td width="70%">URL</td></tr>#(/resultTable)#
#(resultTable)#::<table width="100%"><tr class="TableHeader"><td width="30%">Media</td><td width="70%">URL</td></tr>
::<table width="100%"><tr class="TableHeader"><td width="30%">Media</td><td width="70%">URL</td>#(embed)#::<td>Player</td>#(/embed)#</tr>#(/resultTable)#
#(jsResort)#
#{results}#
<!--#include virtual="yacysearchitem.html?item=#[item]#&eventID=#[eventID]#" -->
@@ -208,7 +209,7 @@ <h4 class="linktitle">
<div id="resultscontainer">
</div>
#(/jsResort)#
#(resultTable)#::</table>#(/resultTable)#
#(resultTable)#::</table>::</table>#(/resultTable)#
<!-- linklist end -->
#(num-results)#
@@ -902,7 +902,8 @@ public static serverObjects respond(
}
prop.put("results", theQuery.itemsPerPage());
prop.put("jsResort_results", theQuery.itemsPerPage());
prop.put("resultTable", (contentdom == ContentDomain.APP || contentdom == ContentDomain.AUDIO || contentdom == ContentDomain.VIDEO) ? 1 : 0);
prop.put("resultTable", (contentdom == ContentDomain.APP || contentdom == ContentDomain.VIDEO) ? 1 : (contentdom == ContentDomain.AUDIO ? 2 : 0) );
prop.put("resultTable_embed", (contentdom == ContentDomain.AUDIO && extendedSearchRights));
prop.put("eventID", theQuery.id(false)); // for bottomline
prop.put("jsResort_eventID", theQuery.id(false));
@@ -61,7 +61,12 @@ <h4 class="linktitle">
<div class="highslide-caption"><a href="#[href]#" target="#[target]#" #(noreferrer)#::rel="noreferrer"#(/noreferrer)#>#[name]#</a><br /><a href="#[source]#" target="#[target]#" #(noreferrer)#::rel="noreferrer"#(/noreferrer)#>#[sourcedom]#</a></div>
</div>#(/item)#
::
#(item)#::<tr class="#(col)#TableCellLight::TableCellDark#(/col)#"><td>#[name]#</td><td><a href="#[href]#" target="#[target]#" #(noreferrer)#::rel="noreferrer"#(/noreferrer)#>#[hrefshort]#</a></tr>#(/item)#
#(item)#::
<tr class="#(col)#TableCellLight::TableCellDark#(/col)#">
<td>#[name]#</td>
<td><a href="#[href]#" target="#[target]#" #(noreferrer)#::rel="noreferrer"#(/noreferrer)#>#[hrefshort]#</a>
<td class="text-center">#(embed)#::<audio src="#[href]#" preload="none" controls="controls" onplaying="handleAudioPlaying(event)" onerror="handleAudioLoadError(event)">Not supported</audio>#(/embed)#</td>
</tr>#(/item)#
::
#(item)#::<tr class="#(col)#TableCellLight::TableCellDark#(/col)#"><td>#[name]#</td><td><a href="#[href]#" target="#[target]#" #(noreferrer)#::rel="noreferrer"#(/noreferrer)#>#[hrefshort]#</a></tr>#(/item)#
::
@@ -104,6 +104,8 @@ public static serverObjects respond(final RequestHeader header, final serverObje
final UserDB.Entry user = sb.userDB != null ? sb.userDB.getUser(header) : null;
final boolean authenticated = adminAuthenticated || user != null;
final boolean extendedSearchRights = adminAuthenticated || (user != null && user.hasRight(UserDB.AccessRight.EXTENDED_SEARCH_RIGHT));
final int item = post.getInt("item", -1);
final RequestHeader.FileType fileType = header.fileType();
@@ -450,6 +452,20 @@ public static serverObjects respond(final RequestHeader header, final serverObje
final String resultUrlstring = ms.url().toNormalform(true);
final String target = sb.getConfig(resultUrlstring.matches(target_special_pattern) ? SwitchboardConstants.SEARCH_TARGET_SPECIAL : SwitchboardConstants.SEARCH_TARGET_DEFAULT, "_self");
prop.putHTML("content_item_href", resultUrlstring);
final String mediaType = ms.mime();
if (extendedSearchRights && mediaType != null && mediaType.startsWith("audio/")) {
/*
* Display HTML5 embedded audio only :
* - when content-type is known to be audio (each browser has its own set of supported audio subtypes,
* so the browser will then handle itself eventual report about unsupported media format)
* - to authenticated users with extended search rights to prevent any media redistribution issue
*/
prop.put("content_item_embed", true);
prop.putHTML("content_item_embed_href", resultUrlstring);
prop.putHTML("content_item_embed_mediaType", mediaType);
} else {
prop.put("content_item_embed", false);
}
prop.put("content_item_noreferrer", noreferrer ? 1 : 0);
prop.putHTML("content_item_hrefshort", nxTools.shortenURLString(resultUrlstring, MAX_URL_LENGTH));
prop.putHTML("content_item_target", target);

0 comments on commit 07e8628

Please sign in to comment.