From b6cbfc9087616f4522ee640f03cb588983e9f7d1 Mon Sep 17 00:00:00 2001 From: Son Nguyen Date: Fri, 17 Jan 2025 07:56:31 -0500 Subject: [PATCH] Final: Enhance app functionalities (#196) --- .../www/MovieVerse-Frontend/css/style.css | 38 ++++++++++++++ .../www/MovieVerse-Frontend/html/about.html | 38 +++++++------- .../html/catch-popcorn.html | 52 ++----------------- .../html/dinosaur-jump.html | 30 ----------- .../html/falling-stars.html | 30 ----------- .../MovieVerse-Frontend/html/flappy-bird.html | 31 ----------- .../www/MovieVerse-Frontend/html/games.html | 50 ++++++++---------- .../MovieVerse-Frontend/html/how-to-play.html | 36 ------------- .../html/space-invaders.html | 30 ----------- .../html/stack-blocks.html | 30 ----------- .../MovieVerse-Frontend/js/dinosaur-jump.js | 4 +- .../ios/www/MovieVerse-Frontend/css/style.css | 38 ++++++++++++++ .../www/MovieVerse-Frontend/html/about.html | 38 +++++++------- .../html/catch-popcorn.html | 52 ++----------------- .../html/dinosaur-jump.html | 30 ----------- .../html/falling-stars.html | 30 ----------- .../MovieVerse-Frontend/html/flappy-bird.html | 31 ----------- .../www/MovieVerse-Frontend/html/games.html | 50 ++++++++---------- .../MovieVerse-Frontend/html/how-to-play.html | 36 ------------- .../html/space-invaders.html | 30 ----------- .../html/stack-blocks.html | 30 ----------- .../MovieVerse-Frontend/js/dinosaur-jump.js | 4 +- .../www/MovieVerse-Frontend/css/style.css | 38 ++++++++++++++ .../www/MovieVerse-Frontend/html/about.html | 38 +++++++------- .../html/catch-popcorn.html | 52 ++----------------- .../html/dinosaur-jump.html | 30 ----------- .../html/falling-stars.html | 30 ----------- .../MovieVerse-Frontend/html/flappy-bird.html | 31 ----------- .../www/MovieVerse-Frontend/html/games.html | 50 ++++++++---------- .../MovieVerse-Frontend/html/how-to-play.html | 36 ------------- .../html/space-invaders.html | 30 ----------- .../html/stack-blocks.html | 30 ----------- .../MovieVerse-Frontend/js/dinosaur-jump.js | 4 +- 33 files changed, 252 insertions(+), 855 deletions(-) diff --git a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/css/style.css b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/css/style.css index 9fae8f35..87715f61 100644 --- a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/css/style.css +++ b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/css/style.css @@ -1058,6 +1058,44 @@ header h1 { animation: fadeInUp 1s ease forwards 0.5s; } +@keyframes fadeIn { + from { + opacity: 0; + transform: translateY(20px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes fadeInDown { + from { + opacity: 0; + transform: translateY(-30px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes bounce { + 0%, + 20%, + 50%, + 80%, + 100% { + transform: translateY(0); + } + 40% { + transform: translateY(-10px); + } + 60% { + transform: translateY(-5px); + } +} + #trivia-btn { position: fixed; bottom: 60px; diff --git a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/about.html b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/about.html index fe52897c..c3da938f 100644 --- a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/about.html +++ b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/about.html @@ -364,14 +364,14 @@

-

About The MovieVerse

-

+

About The MovieVerse

+

Welcome to The MovieVerse, your ultimate database for exploring the magic of movies. Created by Son Nguyen in 2023 with a vision to celebrate cinematic art, MovieVerse offers a unique but comprehensive platform for nearly one million movie lovers worldwide to discover, engage, and immerse themselves in the world of film.

-
+
About The Movie style="width: 200px; max-width: 800px; margin: 20px auto; border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2)" />
-

Thank you for visiting MovieVerse today! 🎬🍿

-

Core Features:

+

Thank you for visiting MovieVerse today! 🎬🍿

+

Core Features:

-
    +
    • Curated Movie Collections: Explore an array of movies categorized by genre, director, language, and era, including @@ -452,14 +452,14 @@

      Core Features:

      RT ratings for each movie directly within our app.
    -

    Explore Our Other Apps:

    -

    +

    Explore Our Other Apps:

    +

    Like MovieVerse, our other apps are designed to enhance your daily life and help you stay organized, focused, and informed. Check out our other apps below, or visit my GitHub profile for more!

    -
      +

      • Organize your thoughts effortlessly with StickyNotes, a simple yet effective note-taking app that can also help you focus on your tasks by @@ -486,23 +486,23 @@

        Explore Our Other Apps:

      -

      Our Vision:

      -

      +

      Our Vision:

      +

      Our aim is to create a haven for cinephiles, where the discovery of movies is an adventure. The MovieVerse is more than just a movie database; it's a vibrant community and a hub for sharing cinematic experiences and insights.

      -

      Join The Journey:

      -

      +

      Join The Journey:

      +

      We're constantly innovating to bring you new and exciting features. Stay tuned for upcoming enhancements, including AI-driven recommendations and social integration for shared movie experiences.


      -

      +

      Become a part of The MovieVerse community today. Your engagement and feedback are invaluable to us. Together, let's celebrate the wonder of movies!


      -

      +

      Thank you for being a part of The MovieVerse. For more insights and updates, connect with us on our GitHub pageJoin The Journey:

-

Useful Links:

-

+

Useful Links:

+

Here are some links that you might find useful: You can explore the analytics page of our database, read our @@ -523,7 +523,7 @@

Useful Links:

if you have any questions or concerns!


-

+

You're also encouraged to create an account and join our @@ -531,7 +531,7 @@

Useful Links:

to enjoy personalized movie recommendations, create/share watch lists, and more. We look forward to having you on board!


-

+

If you are also interested in the website's creator and developer, feel free to visit my LinkedIn profile! diff --git a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/catch-popcorn.html b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/catch-popcorn.html index d2de13a5..cf16a6c2 100644 --- a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/catch-popcorn.html +++ b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/catch-popcorn.html @@ -54,7 +54,6 @@ gtag('config', 'G-CQKJ67FXZ4'); @@ -459,6 +457,15 @@

Mini Games

+ +
+
+ +

How to Play

+ Learn More +
+
+
Mini Games } }); - document.getElementById('actor-image').addEventListener('click', function () { - const imageUrl = this.src.replace('w1280', 'original'); - const modalHtml = `
- - × -
`; - document.body.insertAdjacentHTML('beforeend', modalHtml); - - document.getElementById('image-modal').addEventListener('click', function (event) { - if (event.target === this) { - this.remove(); - } - }); - }); - window.addEventListener('resize', () => { if (window.innerWidth < 767) { const buttonIds = [ diff --git a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/how-to-play.html b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/how-to-play.html index 2ec36ea1..4e1813ba 100644 --- a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/how-to-play.html +++ b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/how-to-play.html @@ -66,14 +66,12 @@ background-repeat: repeat-y; background-size: 100% auto; } - h2 { margin: 20px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - .instructions-container { max-width: 1000px; margin: 0 auto; @@ -81,28 +79,23 @@ text-align: left; animation: fadeIn 1.5s ease-in-out; } - .instructions-container h3 { color: #ff8623; font-size: 1.6rem; margin-bottom: 10px; } - .instructions-container p { font-size: 1.1rem; line-height: 1.6; margin-bottom: 15px; } - .instructions-container ul { list-style: inside; margin-bottom: 15px; } - .instructions-container li { margin-bottom: 8px; } - a.instruction-link { color: #7378c5; font-weight: bold; @@ -112,7 +105,6 @@ color: #ff8623; transition: 0.2s ease-in; } - @keyframes fadeIn { from { opacity: 0; @@ -123,7 +115,6 @@ transform: translateY(0); } } - @keyframes fadeInDown { from { opacity: 0; @@ -134,13 +125,11 @@ transform: translateY(0); } } - @media (max-width: 600px) { .instructions-container { padding: 15px; } } - #translate_control { position: fixed; left: 10px; @@ -207,7 +196,6 @@ bottom: 70px; } } - @font-face { font-family: 'Poppins'; src: url('https://movie-verse.com/fonts/Poppins-Light.ttf') format('truetype'); @@ -229,7 +217,6 @@ font-style: normal; font-display: swap; } - @media (min-width: 900px) { #form1 { margin-right: 0; @@ -247,7 +234,6 @@ margin-top: 25px; } } - .modal-overlay { display: none; position: fixed; @@ -280,7 +266,6 @@ transform: rotate(360deg); } } - .mobile-bottom-bar { display: none; } @@ -354,7 +339,6 @@ border-radius: 8px; padding: 10px 20px; } - .back-btn2:hover { background-color: #ff8623; transition: 0.3s ease-in; @@ -779,24 +763,6 @@

Stack the Blocks

} }); - // Example function if you have an image to zoom (not used here but kept for consistency) - if (document.getElementById('actor-image')) { - document.getElementById('actor-image').addEventListener('click', function () { - const imageUrl = this.src.replace('w1280', 'original'); - const modalHtml = `
- - × -
`; - document.body.insertAdjacentHTML('beforeend', modalHtml); - - document.getElementById('image-modal').addEventListener('click', function (event) { - if (event.target === this) { - this.remove(); - } - }); - }); - } - // Responsive display toggles for floating buttons window.addEventListener('resize', () => { if (window.innerWidth < 767) { @@ -937,7 +903,6 @@

Stack the Blocks

} if (query) { - // Replace the following utility calls with your actual search logic: const searchURL = `https://${getMovieVerseData()}/3/search/multi?${generateMovieNames()}${getMovieCode()}&query=${encodeURIComponent( query )}`; @@ -1129,7 +1094,6 @@

Stack the Blocks

searchInput.addEventListener('blur', clearSelection); }); - // Spinner show/hide function showSpinner() { document.getElementById('myModal').classList.add('modal-visible'); } diff --git a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/space-invaders.html b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/space-invaders.html index 1c1acb9d..b4fe77b3 100644 --- a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/space-invaders.html +++ b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/space-invaders.html @@ -67,18 +67,15 @@ background-repeat: repeat-y; background-size: 100% auto; } - h2 { margin: 20px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - p { animation: fadeInDown 1s ease-in-out; } - .container { display: grid !important; grid-template-columns: repeat(3, 1fr); @@ -88,7 +85,6 @@ padding: 20px; animation: fadeIn 1.5s ease-in-out; } - .card { display: flex; flex-direction: column; @@ -107,24 +103,20 @@ position: relative; overflow: hidden; } - .card:hover { transform: translateY(-10px); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5); } - .card i { font-size: 3rem; margin-bottom: 10px; color: #ff8623; animation: bounce 2s infinite; } - .card p { font-size: 1.2rem; margin: 10px 0; } - .card a { display: inline-block; font-size: 1rem; @@ -138,19 +130,16 @@ background-color 0.3s ease, transform 0.2s; } - .card a:hover { background-color: #ff8623; transform: scale(1.1); } - h2 { margin: 50px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - @keyframes fadeIn { from { opacity: 0; @@ -161,7 +150,6 @@ transform: translateY(0); } } - @keyframes fadeInDown { from { opacity: 0; @@ -172,7 +160,6 @@ transform: translateY(0); } } - @keyframes bounce { 0%, 20%, @@ -188,7 +175,6 @@ transform: translateY(-5px); } } - @media (max-width: 600px) { .container { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); @@ -199,7 +185,6 @@ height: 240px; } } - #translate_control { position: fixed; left: 10px; @@ -700,21 +685,6 @@

Space Invaders

} }); - document.getElementById('actor-image').addEventListener('click', function () { - const imageUrl = this.src.replace('w1280', 'original'); - const modalHtml = `
- - × -
`; - document.body.insertAdjacentHTML('beforeend', modalHtml); - - document.getElementById('image-modal').addEventListener('click', function (event) { - if (event.target === this) { - this.remove(); - } - }); - }); - window.addEventListener('resize', () => { if (window.innerWidth < 767) { const buttonIds = [ diff --git a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/stack-blocks.html b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/stack-blocks.html index 543a3437..ebb5fcf4 100644 --- a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/stack-blocks.html +++ b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/html/stack-blocks.html @@ -67,18 +67,15 @@ background-repeat: repeat-y; background-size: 100% auto; } - h2 { margin: 20px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - p { animation: fadeInDown 1s ease-in-out; } - .container { display: grid !important; grid-template-columns: repeat(3, 1fr); @@ -88,7 +85,6 @@ padding: 20px; animation: fadeIn 1.5s ease-in-out; } - .card { display: flex; flex-direction: column; @@ -107,24 +103,20 @@ position: relative; overflow: hidden; } - .card:hover { transform: translateY(-10px); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5); } - .card i { font-size: 3rem; margin-bottom: 10px; color: #ff8623; animation: bounce 2s infinite; } - .card p { font-size: 1.2rem; margin: 10px 0; } - .card a { display: inline-block; font-size: 1rem; @@ -138,19 +130,16 @@ background-color 0.3s ease, transform 0.2s; } - .card a:hover { background-color: #ff8623; transform: scale(1.1); } - h2 { margin: 50px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - @keyframes fadeIn { from { opacity: 0; @@ -161,7 +150,6 @@ transform: translateY(0); } } - @keyframes fadeInDown { from { opacity: 0; @@ -172,7 +160,6 @@ transform: translateY(0); } } - @keyframes bounce { 0%, 20%, @@ -188,7 +175,6 @@ transform: translateY(-5px); } } - @media (max-width: 600px) { .container { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); @@ -199,7 +185,6 @@ height: 240px; } } - #translate_control { position: fixed; left: 10px; @@ -689,21 +674,6 @@

Stack the Blocks

} }); - document.getElementById('actor-image').addEventListener('click', function () { - const imageUrl = this.src.replace('w1280', 'original'); - const modalHtml = `
- - × -
`; - document.body.insertAdjacentHTML('beforeend', modalHtml); - - document.getElementById('image-modal').addEventListener('click', function (event) { - if (event.target === this) { - this.remove(); - } - }); - }); - window.addEventListener('resize', () => { if (window.innerWidth < 767) { const buttonIds = [ diff --git a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/js/dinosaur-jump.js b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/js/dinosaur-jump.js index bc0fcf70..7ff98654 100644 --- a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/js/dinosaur-jump.js +++ b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/MovieVerse-Frontend/js/dinosaur-jump.js @@ -4,7 +4,7 @@ const ctx = canvas.getContext('2d'); // Dino properties let dino = { x: 50, - y: canvas.height - 50, // Start at the bottom + y: canvas.height - 50, width: 20, height: 20, vy: 0, @@ -17,7 +17,7 @@ let gameSpeed = 3; let score = 0; let isGameOver = false; let spawnTimer = 0; // Timer to control obstacle spawns -const spawnInterval = 120; // Minimum frames between spawns (e.g., 2 seconds at 60 FPS) +const spawnInterval = 100; // Minimum frames between spawns (e.g., 2 seconds at 60 FPS) // Key press or tap to jump function handleJump() { diff --git a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/css/style.css b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/css/style.css index 9fae8f35..87715f61 100644 --- a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/css/style.css +++ b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/css/style.css @@ -1058,6 +1058,44 @@ header h1 { animation: fadeInUp 1s ease forwards 0.5s; } +@keyframes fadeIn { + from { + opacity: 0; + transform: translateY(20px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes fadeInDown { + from { + opacity: 0; + transform: translateY(-30px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes bounce { + 0%, + 20%, + 50%, + 80%, + 100% { + transform: translateY(0); + } + 40% { + transform: translateY(-10px); + } + 60% { + transform: translateY(-5px); + } +} + #trivia-btn { position: fixed; bottom: 60px; diff --git a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/about.html b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/about.html index fe52897c..c3da938f 100644 --- a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/about.html +++ b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/about.html @@ -364,14 +364,14 @@

-

About The MovieVerse

-

+

About The MovieVerse

+

Welcome to The MovieVerse, your ultimate database for exploring the magic of movies. Created by Son Nguyen in 2023 with a vision to celebrate cinematic art, MovieVerse offers a unique but comprehensive platform for nearly one million movie lovers worldwide to discover, engage, and immerse themselves in the world of film.

-
+
About The Movie style="width: 200px; max-width: 800px; margin: 20px auto; border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2)" />
-

Thank you for visiting MovieVerse today! 🎬🍿

-

Core Features:

+

Thank you for visiting MovieVerse today! 🎬🍿

+

Core Features:

-
    +
    • Curated Movie Collections: Explore an array of movies categorized by genre, director, language, and era, including @@ -452,14 +452,14 @@

      Core Features:

      RT ratings for each movie directly within our app.
    -

    Explore Our Other Apps:

    -

    +

    Explore Our Other Apps:

    +

    Like MovieVerse, our other apps are designed to enhance your daily life and help you stay organized, focused, and informed. Check out our other apps below, or visit my GitHub profile for more!

    -
      +

      • Organize your thoughts effortlessly with StickyNotes, a simple yet effective note-taking app that can also help you focus on your tasks by @@ -486,23 +486,23 @@

        Explore Our Other Apps:

      -

      Our Vision:

      -

      +

      Our Vision:

      +

      Our aim is to create a haven for cinephiles, where the discovery of movies is an adventure. The MovieVerse is more than just a movie database; it's a vibrant community and a hub for sharing cinematic experiences and insights.

      -

      Join The Journey:

      -

      +

      Join The Journey:

      +

      We're constantly innovating to bring you new and exciting features. Stay tuned for upcoming enhancements, including AI-driven recommendations and social integration for shared movie experiences.


      -

      +

      Become a part of The MovieVerse community today. Your engagement and feedback are invaluable to us. Together, let's celebrate the wonder of movies!


      -

      +

      Thank you for being a part of The MovieVerse. For more insights and updates, connect with us on our GitHub pageJoin The Journey:

-

Useful Links:

-

+

Useful Links:

+

Here are some links that you might find useful: You can explore the analytics page of our database, read our @@ -523,7 +523,7 @@

Useful Links:

if you have any questions or concerns!


-

+

You're also encouraged to create an account and join our @@ -531,7 +531,7 @@

Useful Links:

to enjoy personalized movie recommendations, create/share watch lists, and more. We look forward to having you on board!


-

+

If you are also interested in the website's creator and developer, feel free to visit my LinkedIn profile! diff --git a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/catch-popcorn.html b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/catch-popcorn.html index d2de13a5..cf16a6c2 100644 --- a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/catch-popcorn.html +++ b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/catch-popcorn.html @@ -54,7 +54,6 @@ gtag('config', 'G-CQKJ67FXZ4'); @@ -459,6 +457,15 @@

Mini Games

+ +
+
+ +

How to Play

+ Learn More +
+
+
Mini Games } }); - document.getElementById('actor-image').addEventListener('click', function () { - const imageUrl = this.src.replace('w1280', 'original'); - const modalHtml = `
- - × -
`; - document.body.insertAdjacentHTML('beforeend', modalHtml); - - document.getElementById('image-modal').addEventListener('click', function (event) { - if (event.target === this) { - this.remove(); - } - }); - }); - window.addEventListener('resize', () => { if (window.innerWidth < 767) { const buttonIds = [ diff --git a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/how-to-play.html b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/how-to-play.html index 2ec36ea1..4e1813ba 100644 --- a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/how-to-play.html +++ b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/how-to-play.html @@ -66,14 +66,12 @@ background-repeat: repeat-y; background-size: 100% auto; } - h2 { margin: 20px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - .instructions-container { max-width: 1000px; margin: 0 auto; @@ -81,28 +79,23 @@ text-align: left; animation: fadeIn 1.5s ease-in-out; } - .instructions-container h3 { color: #ff8623; font-size: 1.6rem; margin-bottom: 10px; } - .instructions-container p { font-size: 1.1rem; line-height: 1.6; margin-bottom: 15px; } - .instructions-container ul { list-style: inside; margin-bottom: 15px; } - .instructions-container li { margin-bottom: 8px; } - a.instruction-link { color: #7378c5; font-weight: bold; @@ -112,7 +105,6 @@ color: #ff8623; transition: 0.2s ease-in; } - @keyframes fadeIn { from { opacity: 0; @@ -123,7 +115,6 @@ transform: translateY(0); } } - @keyframes fadeInDown { from { opacity: 0; @@ -134,13 +125,11 @@ transform: translateY(0); } } - @media (max-width: 600px) { .instructions-container { padding: 15px; } } - #translate_control { position: fixed; left: 10px; @@ -207,7 +196,6 @@ bottom: 70px; } } - @font-face { font-family: 'Poppins'; src: url('https://movie-verse.com/fonts/Poppins-Light.ttf') format('truetype'); @@ -229,7 +217,6 @@ font-style: normal; font-display: swap; } - @media (min-width: 900px) { #form1 { margin-right: 0; @@ -247,7 +234,6 @@ margin-top: 25px; } } - .modal-overlay { display: none; position: fixed; @@ -280,7 +266,6 @@ transform: rotate(360deg); } } - .mobile-bottom-bar { display: none; } @@ -354,7 +339,6 @@ border-radius: 8px; padding: 10px 20px; } - .back-btn2:hover { background-color: #ff8623; transition: 0.3s ease-in; @@ -779,24 +763,6 @@

Stack the Blocks

} }); - // Example function if you have an image to zoom (not used here but kept for consistency) - if (document.getElementById('actor-image')) { - document.getElementById('actor-image').addEventListener('click', function () { - const imageUrl = this.src.replace('w1280', 'original'); - const modalHtml = `
- - × -
`; - document.body.insertAdjacentHTML('beforeend', modalHtml); - - document.getElementById('image-modal').addEventListener('click', function (event) { - if (event.target === this) { - this.remove(); - } - }); - }); - } - // Responsive display toggles for floating buttons window.addEventListener('resize', () => { if (window.innerWidth < 767) { @@ -937,7 +903,6 @@

Stack the Blocks

} if (query) { - // Replace the following utility calls with your actual search logic: const searchURL = `https://${getMovieVerseData()}/3/search/multi?${generateMovieNames()}${getMovieCode()}&query=${encodeURIComponent( query )}`; @@ -1129,7 +1094,6 @@

Stack the Blocks

searchInput.addEventListener('blur', clearSelection); }); - // Spinner show/hide function showSpinner() { document.getElementById('myModal').classList.add('modal-visible'); } diff --git a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/space-invaders.html b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/space-invaders.html index 1c1acb9d..b4fe77b3 100644 --- a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/space-invaders.html +++ b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/space-invaders.html @@ -67,18 +67,15 @@ background-repeat: repeat-y; background-size: 100% auto; } - h2 { margin: 20px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - p { animation: fadeInDown 1s ease-in-out; } - .container { display: grid !important; grid-template-columns: repeat(3, 1fr); @@ -88,7 +85,6 @@ padding: 20px; animation: fadeIn 1.5s ease-in-out; } - .card { display: flex; flex-direction: column; @@ -107,24 +103,20 @@ position: relative; overflow: hidden; } - .card:hover { transform: translateY(-10px); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5); } - .card i { font-size: 3rem; margin-bottom: 10px; color: #ff8623; animation: bounce 2s infinite; } - .card p { font-size: 1.2rem; margin: 10px 0; } - .card a { display: inline-block; font-size: 1rem; @@ -138,19 +130,16 @@ background-color 0.3s ease, transform 0.2s; } - .card a:hover { background-color: #ff8623; transform: scale(1.1); } - h2 { margin: 50px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - @keyframes fadeIn { from { opacity: 0; @@ -161,7 +150,6 @@ transform: translateY(0); } } - @keyframes fadeInDown { from { opacity: 0; @@ -172,7 +160,6 @@ transform: translateY(0); } } - @keyframes bounce { 0%, 20%, @@ -188,7 +175,6 @@ transform: translateY(-5px); } } - @media (max-width: 600px) { .container { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); @@ -199,7 +185,6 @@ height: 240px; } } - #translate_control { position: fixed; left: 10px; @@ -700,21 +685,6 @@

Space Invaders

} }); - document.getElementById('actor-image').addEventListener('click', function () { - const imageUrl = this.src.replace('w1280', 'original'); - const modalHtml = `
- - × -
`; - document.body.insertAdjacentHTML('beforeend', modalHtml); - - document.getElementById('image-modal').addEventListener('click', function (event) { - if (event.target === this) { - this.remove(); - } - }); - }); - window.addEventListener('resize', () => { if (window.innerWidth < 767) { const buttonIds = [ diff --git a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/stack-blocks.html b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/stack-blocks.html index 543a3437..ebb5fcf4 100644 --- a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/stack-blocks.html +++ b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/html/stack-blocks.html @@ -67,18 +67,15 @@ background-repeat: repeat-y; background-size: 100% auto; } - h2 { margin: 20px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - p { animation: fadeInDown 1s ease-in-out; } - .container { display: grid !important; grid-template-columns: repeat(3, 1fr); @@ -88,7 +85,6 @@ padding: 20px; animation: fadeIn 1.5s ease-in-out; } - .card { display: flex; flex-direction: column; @@ -107,24 +103,20 @@ position: relative; overflow: hidden; } - .card:hover { transform: translateY(-10px); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5); } - .card i { font-size: 3rem; margin-bottom: 10px; color: #ff8623; animation: bounce 2s infinite; } - .card p { font-size: 1.2rem; margin: 10px 0; } - .card a { display: inline-block; font-size: 1rem; @@ -138,19 +130,16 @@ background-color 0.3s ease, transform 0.2s; } - .card a:hover { background-color: #ff8623; transform: scale(1.1); } - h2 { margin: 50px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - @keyframes fadeIn { from { opacity: 0; @@ -161,7 +150,6 @@ transform: translateY(0); } } - @keyframes fadeInDown { from { opacity: 0; @@ -172,7 +160,6 @@ transform: translateY(0); } } - @keyframes bounce { 0%, 20%, @@ -188,7 +175,6 @@ transform: translateY(-5px); } } - @media (max-width: 600px) { .container { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); @@ -199,7 +185,6 @@ height: 240px; } } - #translate_control { position: fixed; left: 10px; @@ -689,21 +674,6 @@

Stack the Blocks

} }); - document.getElementById('actor-image').addEventListener('click', function () { - const imageUrl = this.src.replace('w1280', 'original'); - const modalHtml = `
- - × -
`; - document.body.insertAdjacentHTML('beforeend', modalHtml); - - document.getElementById('image-modal').addEventListener('click', function (event) { - if (event.target === this) { - this.remove(); - } - }); - }); - window.addEventListener('resize', () => { if (window.innerWidth < 767) { const buttonIds = [ diff --git a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/js/dinosaur-jump.js b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/js/dinosaur-jump.js index bc0fcf70..7ff98654 100644 --- a/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/js/dinosaur-jump.js +++ b/MovieVerse-Mobile/platforms/ios/www/MovieVerse-Frontend/js/dinosaur-jump.js @@ -4,7 +4,7 @@ const ctx = canvas.getContext('2d'); // Dino properties let dino = { x: 50, - y: canvas.height - 50, // Start at the bottom + y: canvas.height - 50, width: 20, height: 20, vy: 0, @@ -17,7 +17,7 @@ let gameSpeed = 3; let score = 0; let isGameOver = false; let spawnTimer = 0; // Timer to control obstacle spawns -const spawnInterval = 120; // Minimum frames between spawns (e.g., 2 seconds at 60 FPS) +const spawnInterval = 100; // Minimum frames between spawns (e.g., 2 seconds at 60 FPS) // Key press or tap to jump function handleJump() { diff --git a/MovieVerse-Mobile/www/MovieVerse-Frontend/css/style.css b/MovieVerse-Mobile/www/MovieVerse-Frontend/css/style.css index 9fae8f35..87715f61 100644 --- a/MovieVerse-Mobile/www/MovieVerse-Frontend/css/style.css +++ b/MovieVerse-Mobile/www/MovieVerse-Frontend/css/style.css @@ -1058,6 +1058,44 @@ header h1 { animation: fadeInUp 1s ease forwards 0.5s; } +@keyframes fadeIn { + from { + opacity: 0; + transform: translateY(20px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes fadeInDown { + from { + opacity: 0; + transform: translateY(-30px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes bounce { + 0%, + 20%, + 50%, + 80%, + 100% { + transform: translateY(0); + } + 40% { + transform: translateY(-10px); + } + 60% { + transform: translateY(-5px); + } +} + #trivia-btn { position: fixed; bottom: 60px; diff --git a/MovieVerse-Mobile/www/MovieVerse-Frontend/html/about.html b/MovieVerse-Mobile/www/MovieVerse-Frontend/html/about.html index fe52897c..c3da938f 100644 --- a/MovieVerse-Mobile/www/MovieVerse-Frontend/html/about.html +++ b/MovieVerse-Mobile/www/MovieVerse-Frontend/html/about.html @@ -364,14 +364,14 @@

-

About The MovieVerse

-

+

About The MovieVerse

+

Welcome to The MovieVerse, your ultimate database for exploring the magic of movies. Created by Son Nguyen in 2023 with a vision to celebrate cinematic art, MovieVerse offers a unique but comprehensive platform for nearly one million movie lovers worldwide to discover, engage, and immerse themselves in the world of film.

-
+
About The Movie style="width: 200px; max-width: 800px; margin: 20px auto; border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2)" />
-

Thank you for visiting MovieVerse today! 🎬🍿

-

Core Features:

+

Thank you for visiting MovieVerse today! 🎬🍿

+

Core Features:

-
    +
    • Curated Movie Collections: Explore an array of movies categorized by genre, director, language, and era, including @@ -452,14 +452,14 @@

      Core Features:

      RT ratings for each movie directly within our app.
    -

    Explore Our Other Apps:

    -

    +

    Explore Our Other Apps:

    +

    Like MovieVerse, our other apps are designed to enhance your daily life and help you stay organized, focused, and informed. Check out our other apps below, or visit my GitHub profile for more!

    -
      +

      • Organize your thoughts effortlessly with StickyNotes, a simple yet effective note-taking app that can also help you focus on your tasks by @@ -486,23 +486,23 @@

        Explore Our Other Apps:

      -

      Our Vision:

      -

      +

      Our Vision:

      +

      Our aim is to create a haven for cinephiles, where the discovery of movies is an adventure. The MovieVerse is more than just a movie database; it's a vibrant community and a hub for sharing cinematic experiences and insights.

      -

      Join The Journey:

      -

      +

      Join The Journey:

      +

      We're constantly innovating to bring you new and exciting features. Stay tuned for upcoming enhancements, including AI-driven recommendations and social integration for shared movie experiences.


      -

      +

      Become a part of The MovieVerse community today. Your engagement and feedback are invaluable to us. Together, let's celebrate the wonder of movies!


      -

      +

      Thank you for being a part of The MovieVerse. For more insights and updates, connect with us on our GitHub pageJoin The Journey:

-

Useful Links:

-

+

Useful Links:

+

Here are some links that you might find useful: You can explore the analytics page of our database, read our @@ -523,7 +523,7 @@

Useful Links:

if you have any questions or concerns!


-

+

You're also encouraged to create an account and join our @@ -531,7 +531,7 @@

Useful Links:

to enjoy personalized movie recommendations, create/share watch lists, and more. We look forward to having you on board!


-

+

If you are also interested in the website's creator and developer, feel free to visit my LinkedIn profile! diff --git a/MovieVerse-Mobile/www/MovieVerse-Frontend/html/catch-popcorn.html b/MovieVerse-Mobile/www/MovieVerse-Frontend/html/catch-popcorn.html index d2de13a5..cf16a6c2 100644 --- a/MovieVerse-Mobile/www/MovieVerse-Frontend/html/catch-popcorn.html +++ b/MovieVerse-Mobile/www/MovieVerse-Frontend/html/catch-popcorn.html @@ -54,7 +54,6 @@ gtag('config', 'G-CQKJ67FXZ4'); @@ -459,6 +457,15 @@

Mini Games

+ +
+
+ +

How to Play

+ Learn More +
+
+
Mini Games } }); - document.getElementById('actor-image').addEventListener('click', function () { - const imageUrl = this.src.replace('w1280', 'original'); - const modalHtml = `
- - × -
`; - document.body.insertAdjacentHTML('beforeend', modalHtml); - - document.getElementById('image-modal').addEventListener('click', function (event) { - if (event.target === this) { - this.remove(); - } - }); - }); - window.addEventListener('resize', () => { if (window.innerWidth < 767) { const buttonIds = [ diff --git a/MovieVerse-Mobile/www/MovieVerse-Frontend/html/how-to-play.html b/MovieVerse-Mobile/www/MovieVerse-Frontend/html/how-to-play.html index 2ec36ea1..4e1813ba 100644 --- a/MovieVerse-Mobile/www/MovieVerse-Frontend/html/how-to-play.html +++ b/MovieVerse-Mobile/www/MovieVerse-Frontend/html/how-to-play.html @@ -66,14 +66,12 @@ background-repeat: repeat-y; background-size: 100% auto; } - h2 { margin: 20px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - .instructions-container { max-width: 1000px; margin: 0 auto; @@ -81,28 +79,23 @@ text-align: left; animation: fadeIn 1.5s ease-in-out; } - .instructions-container h3 { color: #ff8623; font-size: 1.6rem; margin-bottom: 10px; } - .instructions-container p { font-size: 1.1rem; line-height: 1.6; margin-bottom: 15px; } - .instructions-container ul { list-style: inside; margin-bottom: 15px; } - .instructions-container li { margin-bottom: 8px; } - a.instruction-link { color: #7378c5; font-weight: bold; @@ -112,7 +105,6 @@ color: #ff8623; transition: 0.2s ease-in; } - @keyframes fadeIn { from { opacity: 0; @@ -123,7 +115,6 @@ transform: translateY(0); } } - @keyframes fadeInDown { from { opacity: 0; @@ -134,13 +125,11 @@ transform: translateY(0); } } - @media (max-width: 600px) { .instructions-container { padding: 15px; } } - #translate_control { position: fixed; left: 10px; @@ -207,7 +196,6 @@ bottom: 70px; } } - @font-face { font-family: 'Poppins'; src: url('https://movie-verse.com/fonts/Poppins-Light.ttf') format('truetype'); @@ -229,7 +217,6 @@ font-style: normal; font-display: swap; } - @media (min-width: 900px) { #form1 { margin-right: 0; @@ -247,7 +234,6 @@ margin-top: 25px; } } - .modal-overlay { display: none; position: fixed; @@ -280,7 +266,6 @@ transform: rotate(360deg); } } - .mobile-bottom-bar { display: none; } @@ -354,7 +339,6 @@ border-radius: 8px; padding: 10px 20px; } - .back-btn2:hover { background-color: #ff8623; transition: 0.3s ease-in; @@ -779,24 +763,6 @@

Stack the Blocks

} }); - // Example function if you have an image to zoom (not used here but kept for consistency) - if (document.getElementById('actor-image')) { - document.getElementById('actor-image').addEventListener('click', function () { - const imageUrl = this.src.replace('w1280', 'original'); - const modalHtml = `
- - × -
`; - document.body.insertAdjacentHTML('beforeend', modalHtml); - - document.getElementById('image-modal').addEventListener('click', function (event) { - if (event.target === this) { - this.remove(); - } - }); - }); - } - // Responsive display toggles for floating buttons window.addEventListener('resize', () => { if (window.innerWidth < 767) { @@ -937,7 +903,6 @@

Stack the Blocks

} if (query) { - // Replace the following utility calls with your actual search logic: const searchURL = `https://${getMovieVerseData()}/3/search/multi?${generateMovieNames()}${getMovieCode()}&query=${encodeURIComponent( query )}`; @@ -1129,7 +1094,6 @@

Stack the Blocks

searchInput.addEventListener('blur', clearSelection); }); - // Spinner show/hide function showSpinner() { document.getElementById('myModal').classList.add('modal-visible'); } diff --git a/MovieVerse-Mobile/www/MovieVerse-Frontend/html/space-invaders.html b/MovieVerse-Mobile/www/MovieVerse-Frontend/html/space-invaders.html index 1c1acb9d..b4fe77b3 100644 --- a/MovieVerse-Mobile/www/MovieVerse-Frontend/html/space-invaders.html +++ b/MovieVerse-Mobile/www/MovieVerse-Frontend/html/space-invaders.html @@ -67,18 +67,15 @@ background-repeat: repeat-y; background-size: 100% auto; } - h2 { margin: 20px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - p { animation: fadeInDown 1s ease-in-out; } - .container { display: grid !important; grid-template-columns: repeat(3, 1fr); @@ -88,7 +85,6 @@ padding: 20px; animation: fadeIn 1.5s ease-in-out; } - .card { display: flex; flex-direction: column; @@ -107,24 +103,20 @@ position: relative; overflow: hidden; } - .card:hover { transform: translateY(-10px); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5); } - .card i { font-size: 3rem; margin-bottom: 10px; color: #ff8623; animation: bounce 2s infinite; } - .card p { font-size: 1.2rem; margin: 10px 0; } - .card a { display: inline-block; font-size: 1rem; @@ -138,19 +130,16 @@ background-color 0.3s ease, transform 0.2s; } - .card a:hover { background-color: #ff8623; transform: scale(1.1); } - h2 { margin: 50px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - @keyframes fadeIn { from { opacity: 0; @@ -161,7 +150,6 @@ transform: translateY(0); } } - @keyframes fadeInDown { from { opacity: 0; @@ -172,7 +160,6 @@ transform: translateY(0); } } - @keyframes bounce { 0%, 20%, @@ -188,7 +175,6 @@ transform: translateY(-5px); } } - @media (max-width: 600px) { .container { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); @@ -199,7 +185,6 @@ height: 240px; } } - #translate_control { position: fixed; left: 10px; @@ -700,21 +685,6 @@

Space Invaders

} }); - document.getElementById('actor-image').addEventListener('click', function () { - const imageUrl = this.src.replace('w1280', 'original'); - const modalHtml = `
- - × -
`; - document.body.insertAdjacentHTML('beforeend', modalHtml); - - document.getElementById('image-modal').addEventListener('click', function (event) { - if (event.target === this) { - this.remove(); - } - }); - }); - window.addEventListener('resize', () => { if (window.innerWidth < 767) { const buttonIds = [ diff --git a/MovieVerse-Mobile/www/MovieVerse-Frontend/html/stack-blocks.html b/MovieVerse-Mobile/www/MovieVerse-Frontend/html/stack-blocks.html index 543a3437..ebb5fcf4 100644 --- a/MovieVerse-Mobile/www/MovieVerse-Frontend/html/stack-blocks.html +++ b/MovieVerse-Mobile/www/MovieVerse-Frontend/html/stack-blocks.html @@ -67,18 +67,15 @@ background-repeat: repeat-y; background-size: 100% auto; } - h2 { margin: 20px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - p { animation: fadeInDown 1s ease-in-out; } - .container { display: grid !important; grid-template-columns: repeat(3, 1fr); @@ -88,7 +85,6 @@ padding: 20px; animation: fadeIn 1.5s ease-in-out; } - .card { display: flex; flex-direction: column; @@ -107,24 +103,20 @@ position: relative; overflow: hidden; } - .card:hover { transform: translateY(-10px); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5); } - .card i { font-size: 3rem; margin-bottom: 10px; color: #ff8623; animation: bounce 2s infinite; } - .card p { font-size: 1.2rem; margin: 10px 0; } - .card a { display: inline-block; font-size: 1rem; @@ -138,19 +130,16 @@ background-color 0.3s ease, transform 0.2s; } - .card a:hover { background-color: #ff8623; transform: scale(1.1); } - h2 { margin: 50px 0; font-size: 2.2rem; color: #ff8623; animation: fadeInDown 1s ease-in-out; } - @keyframes fadeIn { from { opacity: 0; @@ -161,7 +150,6 @@ transform: translateY(0); } } - @keyframes fadeInDown { from { opacity: 0; @@ -172,7 +160,6 @@ transform: translateY(0); } } - @keyframes bounce { 0%, 20%, @@ -188,7 +175,6 @@ transform: translateY(-5px); } } - @media (max-width: 600px) { .container { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); @@ -199,7 +185,6 @@ height: 240px; } } - #translate_control { position: fixed; left: 10px; @@ -689,21 +674,6 @@

Stack the Blocks

} }); - document.getElementById('actor-image').addEventListener('click', function () { - const imageUrl = this.src.replace('w1280', 'original'); - const modalHtml = `
- - × -
`; - document.body.insertAdjacentHTML('beforeend', modalHtml); - - document.getElementById('image-modal').addEventListener('click', function (event) { - if (event.target === this) { - this.remove(); - } - }); - }); - window.addEventListener('resize', () => { if (window.innerWidth < 767) { const buttonIds = [ diff --git a/MovieVerse-Mobile/www/MovieVerse-Frontend/js/dinosaur-jump.js b/MovieVerse-Mobile/www/MovieVerse-Frontend/js/dinosaur-jump.js index bc0fcf70..7ff98654 100644 --- a/MovieVerse-Mobile/www/MovieVerse-Frontend/js/dinosaur-jump.js +++ b/MovieVerse-Mobile/www/MovieVerse-Frontend/js/dinosaur-jump.js @@ -4,7 +4,7 @@ const ctx = canvas.getContext('2d'); // Dino properties let dino = { x: 50, - y: canvas.height - 50, // Start at the bottom + y: canvas.height - 50, width: 20, height: 20, vy: 0, @@ -17,7 +17,7 @@ let gameSpeed = 3; let score = 0; let isGameOver = false; let spawnTimer = 0; // Timer to control obstacle spawns -const spawnInterval = 120; // Minimum frames between spawns (e.g., 2 seconds at 60 FPS) +const spawnInterval = 100; // Minimum frames between spawns (e.g., 2 seconds at 60 FPS) // Key press or tap to jump function handleJump() {