Skip to content

Commit

Permalink
Update: Enhanced loading times (#192)
Browse files Browse the repository at this point in the history
  • Loading branch information
@hoangsonww
hoangsonww committed May 23, 2024
1 parent a48e475 commit e756edc
Show file tree
Hide file tree
Showing 12 changed files with 18 additions and 18 deletions.
6 changes: 3 additions & 3 deletions ...ile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/movie-details.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -955,9 +955,9 @@ <h3>Add a Comment for This Movie</h3>
document.getElementById('trailerButton').scrollIntoView({ behavior: 'smooth' });
}

const imageUrl = this.src;
const modalHtml = `<div id="image-modal" style="z-index: 10002; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px;">
let imageUrl = this.src.replace('w780', 'w1280');
const modalHtml = `<div id="image-modal" style="z-index: 100020000; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px;" alt="Movie Image" />
<span style="position: absolute; top: 10px; right: 25px; font-size: 40px; cursor: pointer" id="removeBtn" onclick="document.getElementById('image-modal').remove();">&times;</span>
</div>`;
document.body.insertAdjacentHTML('beforeend', modalHtml);
Expand Down
2 changes: 1 addition & 1 deletion ...Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/tv-details.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -785,7 +785,7 @@ <h3>Add a Comment for This TV Series</h3>
});

document.getElementById('movie-image').addEventListener('click', function() {
const imageUrl = this.src;
let imageUrl = this.src.replace('w780', 'w1280');
const modalHtml = `<div id="image-modal" style="z-index: 10002; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px;">
<span style="position: absolute; top: 10px; right: 25px; font-size: 40px; cursor: pointer" id="removeBtn" onclick="document.getElementById('image-modal').remove();">&times;</span>
Expand Down
2 changes: 1 addition & 1 deletion ...-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/js/movie-details.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1193,7 +1193,7 @@ async function populateMovieDetails(movie, imdbRating, rtRating, metascore, awar
mediaContainer.appendChild(imageWrapper);

imageElement.addEventListener('click', function() {
const imageUrl = this.src;
let imageUrl = this.src.replace('w780', 'w1280');
const modalHtml = `
<div id="image-modal" style="z-index: 100022222; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 16px; cursor: default;" onclick="event.stopPropagation();" loading="lazy" alt="Movie Image">
Expand Down
2 changes: 1 addition & 1 deletion ...rse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/js/tv-details.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -809,7 +809,7 @@ async function populateTvSeriesDetails(tvSeries, imdbRating) {
}

imageElement.addEventListener('click', function() {
const imageUrl = this.src;
let imageUrl = this.src.replace('w780', 'w1280');
const modalHtml = `
<div id="image-modal" style="z-index: 100022222; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px; cursor: default;" onclick="event.stopPropagation();">
Expand Down
6 changes: 3 additions & 3 deletions MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/movie-details.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -955,9 +955,9 @@ <h3>Add a Comment for This Movie</h3>
document.getElementById('trailerButton').scrollIntoView({ behavior: 'smooth' });
}

const imageUrl = this.src;
const modalHtml = `<div id="image-modal" style="z-index: 10002; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px;">
let imageUrl = this.src.replace('w780', 'w1280');
const modalHtml = `<div id="image-modal" style="z-index: 100020000; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px;" alt="Movie Image" />
<span style="position: absolute; top: 10px; right: 25px; font-size: 40px; cursor: pointer" id="removeBtn" onclick="document.getElementById('image-modal').remove();">&times;</span>
</div>`;
document.body.insertAdjacentHTML('beforeend', modalHtml);
Expand Down
2 changes: 1 addition & 1 deletion MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/tv-details.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -785,7 +785,7 @@ <h3>Add a Comment for This TV Series</h3>
});

document.getElementById('movie-image').addEventListener('click', function() {
const imageUrl = this.src;
let imageUrl = this.src.replace('w780', 'w1280');
const modalHtml = `<div id="image-modal" style="z-index: 10002; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px;">
<span style="position: absolute; top: 10px; right: 25px; font-size: 40px; cursor: pointer" id="removeBtn" onclick="document.getElementById('image-modal').remove();">&times;</span>
Expand Down
2 changes: 1 addition & 1 deletion MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/js/movie-details.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1193,7 +1193,7 @@ async function populateMovieDetails(movie, imdbRating, rtRating, metascore, awar
mediaContainer.appendChild(imageWrapper);

imageElement.addEventListener('click', function() {
const imageUrl = this.src;
let imageUrl = this.src.replace('w780', 'w1280');
const modalHtml = `
<div id="image-modal" style="z-index: 100022222; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 16px; cursor: default;" onclick="event.stopPropagation();" loading="lazy" alt="Movie Image">
Expand Down
2 changes: 1 addition & 1 deletion MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/js/tv-details.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -809,7 +809,7 @@ async function populateTvSeriesDetails(tvSeries, imdbRating) {
}

imageElement.addEventListener('click', function() {
const imageUrl = this.src;
let imageUrl = this.src.replace('w780', 'w1280');
const modalHtml = `
<div id="image-modal" style="z-index: 100022222; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px; cursor: default;" onclick="event.stopPropagation();">
Expand Down
6 changes: 3 additions & 3 deletions MovieVerse-Mobile/www/MovieVerse-Frontend/html/movie-details.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -955,9 +955,9 @@ <h3>Add a Comment for This Movie</h3>
document.getElementById('trailerButton').scrollIntoView({ behavior: 'smooth' });
}

const imageUrl = this.src;
const modalHtml = `<div id="image-modal" style="z-index: 10002; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px;">
let imageUrl = this.src.replace('w780', 'w1280');
const modalHtml = `<div id="image-modal" style="z-index: 100020000; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px;" alt="Movie Image" />
<span style="position: absolute; top: 10px; right: 25px; font-size: 40px; cursor: pointer" id="removeBtn" onclick="document.getElementById('image-modal').remove();">&times;</span>
</div>`;
document.body.insertAdjacentHTML('beforeend', modalHtml);
Expand Down
2 changes: 1 addition & 1 deletion MovieVerse-Mobile/www/MovieVerse-Frontend/html/tv-details.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -785,7 +785,7 @@ <h3>Add a Comment for This TV Series</h3>
});

document.getElementById('movie-image').addEventListener('click', function() {
const imageUrl = this.src;
let imageUrl = this.src.replace('w780', 'w1280');
const modalHtml = `<div id="image-modal" style="z-index: 10002; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px;">
<span style="position: absolute; top: 10px; right: 25px; font-size: 40px; cursor: pointer" id="removeBtn" onclick="document.getElementById('image-modal').remove();">&times;</span>
Expand Down
2 changes: 1 addition & 1 deletion MovieVerse-Mobile/www/MovieVerse-Frontend/js/movie-details.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1193,7 +1193,7 @@ async function populateMovieDetails(movie, imdbRating, rtRating, metascore, awar
mediaContainer.appendChild(imageWrapper);

imageElement.addEventListener('click', function() {
const imageUrl = this.src;
let imageUrl = this.src.replace('w780', 'w1280');
const modalHtml = `
<div id="image-modal" style="z-index: 100022222; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 16px; cursor: default;" onclick="event.stopPropagation();" loading="lazy" alt="Movie Image">
Expand Down
2 changes: 1 addition & 1 deletion MovieVerse-Mobile/www/MovieVerse-Frontend/js/tv-details.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -809,7 +809,7 @@ async function populateTvSeriesDetails(tvSeries, imdbRating) {
}

imageElement.addEventListener('click', function() {
const imageUrl = this.src;
let imageUrl = this.src.replace('w780', 'w1280');
const modalHtml = `
<div id="image-modal" style="z-index: 100022222; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
<img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px; cursor: default;" onclick="event.stopPropagation();">
Expand Down

0 comments on commit e756edc

Please sign in to comment.