MightyPork
/
airsonic-custom
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge remote-tracking branch 'origin/pr/982'

Browse Source
master
Andrew DeMaria 6 years ago
parent a2b423aa82 15c6a8861b
commit 326583839e
No known key found for this signature in database
GPG Key ID: 0A3F5E91F8364EDF
1 changed files with 64 additions and 39 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 103
      airsonic-main/src/main/webapp/WEB-INF/jsp/externalPlayer.jsp

103
airsonic-main/src/main/webapp/WEB-INF/jsp/externalPlayer.jsp
Unescape View File

@ -10,56 +10,81 @@
<script type="text/javascript" src="<c:url value="/script/mediaelement/playlist.min.js"/>"></script>
<link type="text/css" rel="stylesheet" href="<c:url value="/script/mediaelement/playlist.min.css"/>">
<c:if test="${not empty model.songs}">
<meta name="og:title" content="${fn:escapeXml(model.songs[0].artist)} &mdash; ${fn:escapeXml(model.songs[0].albumName)}"/>
<meta name="og:title"
content="${fn:escapeXml(model.songs[0].artist)} &mdash; ${fn:escapeXml(model.songs[0].albumName)}"/>
<meta name="og:image" content="${model.songs[0].coverArtUrl}"/>
</c:if>
</head>
<body class="mainframe bgcolor1" style="padding-top:2em">
<div style="margin:auto;width:500px">
<h1>
<c:choose>
<c:when test="${empty model.share or empty model.songs}">
Sorry, the content is not available.
</c:when>
<c:otherwise>
${empty model.share.description ? model.songs[0].artist : fn:escapeXml(model.share.description)}
</c:otherwise>
</c:choose>
</h1>
<div>
<h2 style="margin:0;">${empty model.share.description ? model.songs[0].albumName : fn:escapeXml(model.share.username)}</h2>
<body class="mainframe bgcolor1" style="height:100%;margin:0;">
<div class="external box">
<div class="header">
<h1>
<c:choose>
<c:when test="${empty model.share or empty model.songs}">
Sorry, the content is not available.
</c:when>
<c:otherwise>
${empty model.share.description ? model.songs[0].artist : fn:escapeXml(model.share.description)}
</c:otherwise>
</c:choose>
</h1>
<div>
<h2 style="margin:0;">${empty model.share.description ? model.songs[0].albumName : fn:escapeXml(model.share.username)}</h2>
</div>
</div>
</div>
<audio id='player'>
<c:forEach items="${model.songs}" var="song" varStatus="loopStatus">
<source
src="${song.streamUrl}"
title="${fn:escapeXml(song.title)}"
type="${song.getMediaType()=='MUSIC'?'audio':'video'}/${fn:escapeXml(song.getFormat())}"
data-playlist-thumbnail="${song.coverArtUrl}"
data-playlist-description="${fn:escapeXml(song.artist)}"
>
</c:forEach>
</audio>
<audio id='player'>
<c:forEach items="${model.songs}" var="song" varStatus="loopStatus">
<source
src="${song.streamUrl}"
title="${fn:escapeXml(song.title)}"
type="${song.getMediaType()=='MUSIC'?'audio':'video'}/${fn:escapeXml(song.getFormat())}"
data-playlist-thumbnail="${song.coverArtUrl}"
data-playlist-description="${fn:escapeXml(song.artist)}"
>
</c:forEach>
</audio>
<div class="detail" style="text-align:center;">Streaming by <a href="https://airsonic.github.io/" target="_blank"><b>Airsonic</b></a></div>
<div class="detail" style="text-align:center;">Streaming by <a href="https://airsonic.github.io/"
target="_blank"><b>Airsonic</b></a></div>
</div>
<script type="text/javascript">
new MediaElementPlayer('player', {
features: ['playpause','playlist','current','progress','duration','volume'],
currentMessage: "",
});
new MediaElementPlayer('player', {
features: ['playpause', 'playlist', 'current', 'progress', 'duration', 'volume'],
currentMessage: "",
audioWidth: 600,
});
</script>
<style>
.mejs-container.mejs-audio, .mejs__container.mejs__audio {
min-height: 75%;
margin: auto;
margin-top: 2%;
margin-bottom: 2%;
}
.external .mejs-container.mejs-audio, .mejs__container.mejs__audio {
margin: auto;
margin-top: 2%;
margin-bottom: 2%;
flex-grow: 1;
flex-shrink: 1;
flex-basis: auto;
}
.external.box {
display: flex;
flex-flow: column;
height: 100%;
}
.external > .header {
padding-top: 2em;
margin: auto;
width: 500px;
flex-grow: 0;
flex-shrink: 1;
flex-basis: auto;
}
.external > .detail {
flex-grow: 0;
flex-shrink: 1;
flex-basis: 40px;
}
</style>
</body>
</html>

Write Preview
Loading…
Cancel
Save