Skip to content

Commit

Permalink
Support rendering images but default to video
Browse files Browse the repository at this point in the history
  • Loading branch information
@dormant-user
dormant-user committed Feb 25, 2024
1 parent 6427a5c commit 2f71235
Show file tree
Hide file tree
Showing 2 changed files with 85 additions and 34 deletions.
28 changes: 28 additions & 0 deletions src/routes/video.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -136,6 +136,34 @@ pub async fn stream(config: web::Data<Arc<squire::settings::Config>>,
let landing = template.get_template("landing").unwrap();
let rust_iter = squire::content::get_iter(&__target, &config.file_formats);
let render_path = format!("/video?file={}", url_encode(&filepath));
let image_extensions: Vec<&str> = vec![
"jpeg", "jpg", "png", "gif", "tiff", "tif", "bmp", "svg", "ico", "raw", "psd", "ai", "eps", "pdf",
];
if image_extensions.contains(&render_path.split('.').last()
.unwrap_or_default()
.to_lowercase().as_str()) {
match landing.render(context!(
video_title => &__filename, path => render_path,
render_image => true,
previous => &rust_iter.previous,
next => &rust_iter.next,
previous_title => &rust_iter.previous,
next_title => &rust_iter.next,
)) {
Ok(response_body) => {
log::debug!("Rendering {} as image", &__filename);
return HttpResponse::build(StatusCode::OK)
.content_type("text/html; charset=utf-8").body(response_body);
}
Err(error) => {
log::error!("Failed to render {} as image", &__filename);
log::error!("{}", error);
// todo: raise an appropriate message and display in the UI
}
};
}
// todo: move all jinja rendering to a function and use match instead of blind unwrap
// raise an appropriate HTTPResponse and display in the UI
// Rust doesn't allow re-assignment, so might as well create a mutable variable
// Load the default response body and re-construct with subtitles if present
let mut response_body = landing.render(context!(
Expand Down
91 changes: 57 additions & 34 deletions src/templates/landing.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -101,6 +101,15 @@ pub fn get_content() -> String {
height: 75vh; /* Set height to 75% of the viewport height */
margin: 0 auto; /* Center the container horizontally */
}
#image-source {
height: 75vh;
width: auto;
max-width: 100%;
margin: 0 auto; /* Center the container horizontally */
display: flex;
justify-content: center;
align-items: center; /* Center the container vertically */
}
#video-player {
position: relative;
width: 100%;
Expand Down Expand Up @@ -135,28 +144,33 @@ pub fn get_content() -> String {
<br><br>
<h1>{{ video_title }}</h1>
<div id="video-container">
<video id="video-player"
class="video-js"
preload="auto"
controls muted="muted"
style="position: relative; margin-left: auto; margin-right: auto; display: block"
data-setup='{
"playbackRates": [1, 1.5, 2, 5],
"controlBar": {
"skipButtons": {
"backward": 10,
"forward": 10
}
}
}'>
<source id="video-source" type="video/mp4" src=""/>
<track id="subtitles" kind="subtitles" src="" srclang="en"/>
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a
web browser that
<a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
</p>
</video>
{% if render_image %}
<img id="image-source" src="">
{% else %}
<video id="video-player"
class="video-js"
preload="auto"
controls muted="muted"
style="position: relative; margin-left: auto; margin-right: auto; display: block"
data-setup='{
"playbackRates": [1, 1.5, 2, 5],
"controlBar": {
"skipButtons": {
"backward": 10,
"forward": 10
}
}
}'>
<source id="video-source" type="video/mp4" src=""/>
<track id="subtitles" kind="subtitles" src="" srclang="en"/>
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a
web browser that
<a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
</p>
</video>
{% endif %}
<br>
{% if previous %}
<button class="iter" style="float: left" onclick="window.location='{{ previous }}'" title="{{ previous_title }}">
<i class="fa fa-backward"></i> Previous
Expand All @@ -172,22 +186,31 @@ pub fn get_content() -> String {
<script>
let origin = window.location.origin; // Get the current origin using JavaScript
let path = "{{ path }}";
let track = "{{ track }}";
{% if render_image %}
// Construct the source URL for video by combining origin and path
let imageSource = origin + path;
// Construct the source URL for video by combining origin and path
let videoSource = origin + path;
// Set the video source URL for the video-source element
let videoElement = document.getElementById("image-source");
videoElement.setAttribute("src", imageSource);
{% else %}
let track = "{{ track }}";
// Set the video source URL for the video-source element
let videoElement = document.getElementById("video-source");
videoElement.setAttribute("src", videoSource);
// Construct the source URL for video by combining origin and path
let videoSource = origin + path;
// Set the subtitles URL for the video
let trackElement = document.getElementById("subtitles");
trackElement.setAttribute("src", track);
// Set the video source URL for the video-source element
let videoElement = document.getElementById("video-source");
videoElement.setAttribute("src", videoSource);
let videoPlayer = document.getElementById("video-player");
videoPlayer.load(); // Load the video
// videoPlayer.play(); // Play the video
// Set the subtitles URL for the video
let trackElement = document.getElementById("subtitles");
trackElement.setAttribute("src", track);
let videoPlayer = document.getElementById("video-player");
videoPlayer.load(); // Load the video
// videoPlayer.play(); // Play the video
{% endif %}
</script>
<script>
function logOut() {
Expand Down

0 comments on commit 2f71235

Please sign in to comment.