Skip to content

Commit 58aa35d

Browse files
Phil-NHSPhil-NHS
committed
pull merge virgo
2 parents fb19f24 + b6367ac commit 58aa35d

File tree

4 files changed

+1924
-129
lines changed

4 files changed

+1924
-129
lines changed

‎LearningHub.Nhs.WebUI/Controllers/ResourceController.cs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -180,7 +180,7 @@ public async Task<IActionResult> Index(int resourceReferenceId, bool? acceptSens
180180
}
181181

182182
// For article/image resources, immediately record the resource activity for this user.
183-
if ((resource.ResourceTypeEnum == ResourceTypeEnum.Article || resource.ResourceTypeEnum == ResourceTypeEnum.Image) && (!resource.SensitiveContent))
183+
if ((resource.ResourceTypeEnum == ResourceTypeEnum.Article || resource.ResourceTypeEnum == ResourceTypeEnum.Image) && (!resource.SensitiveContent) && this.User.Identity.IsAuthenticated)
184184
{
185185
var activity = new CreateResourceActivityViewModel()
186186
{

‎LearningHub.Nhs.WebUI/Views/Home/_CmsVideo.cshtml‎

Lines changed: 49 additions & 128 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,13 @@
11
@using LearningHub.Nhs.Models.Content
22
@model PageSectionDetailViewModel
33
@{
4-
string mkPlayerLicence = (string) ViewData["mkPlayerLicenceKey"];
4+
string mkPlayerLicence = (string)ViewData["mkPlayerLicenceKey"];
5+
var scheme = Context?.Request?.Scheme ?? "undefined";
6+
var host = Context?.Request?.Host;
7+
var path = Context?.Request?.Path ?? "undefined";
8+
var requestURL = $"{scheme}://{host}{path}";
59
}
610

7-
@* <link href="~/css/mkplayer-ui.css" rel="stylesheet" asp-append-version="true" /> *@
811
<script type="text/javascript" src="~/js/mkplayer.js" asp-append-version="true"></script>
912

1013
@* @if (Model != null)
@@ -50,7 +53,7 @@
5053
} *@
5154
<div class="video-container" id="@($"{"videoContainer"}{Model.Id}")"></div>
5255

53-
<script>
56+
<script type="text/javascript">
5457
5558
var model = @Json.Serialize(Model);
5659
// 1. Grab the video container
@@ -59,142 +62,65 @@
5962
// 2. Prepare the player configuration
6063
var playerConfig = {
6164
key: "@mkPlayerLicence",
62-
ui: false,
65+
ui: true,
6366
theme: "dark",
6467
playback: {
6568
muted: false,
6669
autoplay: false,
6770
preferredTech: [{ player: 'html5', streaming: 'hls' }]
68-
},
69-
70-
// Subscribe to player events
71-
events: {
72-
[mkplayer.MKPlayerEvent.Error]: (event) => {
73-
console.log("Encountered player error: ", JSON.stringify(event));
74-
},
75-
[mkplayer.MKPlayerEvent.TimeChanged]: (event) => {
76-
console.log("Current player position: ", event.time);
77-
},
78-
[mkplayer.MKPlayerEvent.Muted]: (data) => {
79-
console.log("Audio muted!")
80-
},
81-
[mkplayer.MKPlayerEvent.Unmuted]: onUnmute,
82-
83-
[mkplayer.MKPlayerEvent.Ready]: () => {
84-
85-
// debugger;
86-
//var caption = model.videoAsset.closedCaptionsFile.fileName;
87-
88-
// var subtitleTrack = {
89-
// id: "@($"{"subid"}{Model.Id}")",
90-
// lang: "en",
91-
// label: "Custom Subtitle",
92-
// url: "https://bitdash-a.akamaihd.net/content/sintel/subtitles/subtitles_en.vtt",
93-
// kind: "subtitle"
94-
// };
95-
// player.addSubtitle(subtitleTrack);
96-
},
97-
[mkplayer.MKPlayerEvent.SubtitleAdded]: () => {
98-
// player.enableSubtitle("@($"{"subid"}{Model.Id}")");
99-
},
100-
[mkplayer.MKPlayerEvent.playbackSpeed]: (data) => {
101-
alert("Video playback quality changed to: ");
102-
},
103-
}
71+
}
10472
};
10573
10674
// 3. Initialize the player with video container and player configuration
10775
var player = new mkplayer.MKPlayer(videoContainer, playerConfig);
10876
109-
player.on("loaded", () => {
110-
playerElement.addEventListener("mousemove", () => {
111-
});
112-
});
113-
114-
player.on(mkplayer.MKPlayerEvent.SourceLoaded, (event) => {
115-
console.log("Source loaded successfully!");
116-
});
117-
118-
player.on(mkplayer.MKPlayerEvent.Ready, (event) => {
119-
120-
const videoElement = document.getElementById("@($"{"bitmovinplayer-video-videoContainer"}{Model.Id}")");
121-
if (videoElement) {
122-
videoElement.controls = true;
123-
// debugger;
124-
// Check if captions available
125-
if (model.videoAsset.closedCaptionsFile) {
126-
const captionsInfo = model.videoAsset.closedCaptionsFile;
127-
if (captionsInfo.filePath) {
128-
const trackElement = document.createElement('track');
129-
// const srcPath = "/file/download?filePath=" + captionsInfo.filePath + "&fileName=" + captionsInfo.fileName;
130-
const srcPath = "/file/download/" + captionsInfo.filePath + "/" + captionsInfo.fileName;
131-
trackElement.kind = 'captions'; // Or 'subtitles' or 'descriptions' depending on your track type
132-
trackElement.label = captionsInfo.language || 'english';
133-
trackElement.srclang = captionsInfo.language || 'en';
134-
// trackElement.src = "/api/resource/DownloadResource?filePath=396eb836-5cf5-4255-b33f-66a31fdbef39&amp;fileName=samplecaption.vtt";
135-
// trackElement.src = "https://bitdash-a.akamaihd.net/content/sintel/subtitles/subtitles_en.vtt";
136-
trackElement.src = srcPath;
137-
138-
139-
// Append the track to the video element
140-
videoElement.appendChild(trackElement);
141-
142-
// Add event listener to TextTrackList for when a new text track is added
143-
// videoElement.textTracks.addEventListener('addtrack', function (event) {
144-
// let track = event.track;
145-
// console.log('Track added:', track);
146-
147-
// if (track.kind === 'subtitles' || track.kind === 'captions') {
148-
// track.mode = 'showing'; // Automatically show captions
149-
// console.log('Track showing:', track);
150-
// }
151-
// });
152-
153-
// trackElement.addEventListener('load', function () {
154-
// debugger;
155-
// this.track.mode = 'showing'; // Automatically show captions
156-
// alert('Track loaded and showing:', this.track);
157-
// });
158-
159-
// Manually check and set track mode after a slight delay
160-
// setTimeout(() => {
161-
// var textTracks = videoElement.textTracks;
162-
// for (let i = 0; i < textTracks.length; i++) {
163-
// if ((textTracks[i].kind === 'subtitles' || textTracks[i].kind === 'captions') && textTracks[i].src === srcPath) {
164-
// textTracks[i].mode = 'showing';
165-
// debugger;
166-
// console.log('Track set to showing:', textTracks[i]);
167-
// }
168-
// }
169-
// }, 1000);
170-
171-
// Ensure the track is loaded and ready
172-
// trackElement.addEventListener('load', function () {
173-
// debugger;
174-
// this.mode = 'showing'; // Automatically show captions
175-
// });
176-
177-
}
178-
}
179-
}
180-
181-
// document.getElementById("@($"{"bitmovinplayer-video-videoContainer"}{Model.Id}")").controls = true;
182-
// console.log("Player is ready for playback!");
183-
});
77+
// [BY] Commenting and leaving this code here for future reference : When we set UI:false, we need to manually add controls
78+
// -----------------------------------------------------------------------------------------------------------------------
79+
// player.on(mkplayer.MKPlayerEvent.Ready, (event) => {
80+
// const videoElement = document.getElementById("@($"{"bitmovinplayer-video-videoContainer"}{Model.Id}")");
81+
// if (videoElement) {
82+
// videoElement.controls = true;
83+
84+
// // Check if captions available
85+
// if (model.videoAsset.closedCaptionsFile) {
86+
// const captionsInfo = model.videoAsset.closedCaptionsFile;
87+
// if (captionsInfo.filePath) {
88+
// const trackElement = document.createElement('track');
89+
// const srcPath = "/file/download/" + captionsInfo.filePath + "/" + captionsInfo.fileName;
90+
// trackElement.kind = 'captions'; // Or 'subtitles' or 'descriptions' depending on your track type
91+
// trackElement.label = captionsInfo.language || 'english';
92+
// trackElement.srclang = captionsInfo.language || 'en';
93+
// trackElement.src = srcPath;
94+
95+
// // Append the track to the video element
96+
// videoElement.appendChild(trackElement);
97+
// }
98+
// }
99+
// }
100+
// });
101+
// -----------------------------------------------------------------------------------------------------------------------
184102
185103
var url = model.videoAsset.azureMediaAsset.locatorUri;
186104
url = url.substring(0, url.lastIndexOf("manifest")) + "manifest(format=m3u8-cmaf,encryption=cbc)";
187105
106+
var subtitleTrack = null;
107+
if (model.videoAsset.closedCaptionsFile) {
108+
const captionsInfo = model.videoAsset.closedCaptionsFile;
109+
var srcPath = "file/download/" + captionsInfo.filePath + "/" + captionsInfo.fileName;
110+
srcPath = '@requestURL' + srcPath;
111+
112+
subtitleTrack = {
113+
id: "subtitle",
114+
lang: "en",
115+
label: "english",
116+
url: srcPath,
117+
kind: "subtitle"
118+
};
119+
}
120+
188121
var sourceConfig = {
189122
hls: url,
190-
// Custom subtitle track
191-
// subtitleTracks: [{
192-
// id: "sub1",
193-
// lang: "en",
194-
// label: "Custom Subtitle",
195-
// url: "https://bitdash-a.akamaihd.net/content/sintel/subtitles/subtitles_en.vtt",
196-
// kind: "subtitle"
197-
// }],
123+
subtitleTracks: [subtitleTrack],
198124
drm: {
199125
clearkey: {
200126
LA_URL: "HLS_AES",
@@ -207,16 +133,11 @@
207133
208134
player.load(sourceConfig)
209135
.then(() => {
210-
// you can also get notified when subscribed to `SourceLoaded` event.
211136
console.log("Source loaded successfull!");
212137
})
213138
.catch((error) => {
214139
console.error("An error occurred while loading the source!");
215140
});
216-
217-
function onUnmute(data) {
218-
console.log("Audio unmuted!");
219-
}
220141
</script>
221142

222143
<style>

‎LearningHub.Nhs.WebUI/Views/Shared/Tenant/LearningHub/_Layout.cshtml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
<link rel="manifest" href="~/site.webmanifest.json">
2222
<link href="~/css/nhsuk/common.css" rel="stylesheet" asp-append-version="true" />
2323
<link href="~/css/nhsuk/layout.css" rel="stylesheet" asp-append-version="true" />
24+
<link href="~/css/mkplayer-ui.css" rel="stylesheet" asp-append-version="true" />
2425
<noscript>
2526
<link href="~/css/no-js/no-js.css" rel="stylesheet" asp-append-version="true" />
2627
</noscript>

0 commit comments

Comments
 (0)