Final: Enhance app functionalities (#196)

hoangsonww · Sep 19, 2024 · 068a312 · 068a312
1 parent fd6746a
commit 068a312
Show file tree

Hide file tree

Showing 9 changed files with 151 additions and 21 deletions.
diff --git a/.gitignore b/.gitignore
@@ -6,3 +6,4 @@ node_modules
 
 # Ignore the Emscripten SDK
 emsdk/
+/MovieVerse-Mobile/platforms/
diff --git a/MovieVerse-Frontend/css/style.css b/MovieVerse-Frontend/css/style.css
@@ -798,6 +798,16 @@ header h1 {
   }
 }
 
+@media print {
+  #mobileGoogleSignInBtn {
+    display: none;
+  }
+
+  #mobileProfileBtn {
+    display: none;
+  }
+}
+
 .back-btn:hover {
   background-color: #ff8623;
   transition: 0.3s ease-in;
@@ -1282,6 +1292,15 @@ header h1 {
   }
 }
 
+@media print {
+  .movie-image {
+    height: auto;
+  }
+  #actor-image {
+    height: auto;
+  }
+}
+
 .movie-header {
   text-align: center;
   align-self: center;
@@ -1456,7 +1475,7 @@ header h1 {
   border-radius: 8px;
 }
 
-@media (max-width: 768px) {
+@media all and (max-width: 768px) {
   .company-item {
     max-width: 125px;
   }
@@ -2335,7 +2354,7 @@ strong {
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
 }
 
-@media (max-width: 700px) {
+@media all and (max-width: 700px) {
   #settings-container {
     max-width: calc(100% - 10px);
     margin: 10px 10px;
@@ -2359,7 +2378,7 @@ strong {
   display: none;
 }
 
-@media (min-width: 768px) {
+@media all and (min-width: 768px) {
   #chat-button,
   #settings-btn,
   #movie-of-the-day-btn,
@@ -2394,7 +2413,7 @@ strong {
   transition: transform 0.09s ease-in-out;
 }
 
-@media (max-width: 767px) {
+@media all and (max-width: 767px) {
   .mobile-bottom-bar {
     display: flex;
   }
@@ -2433,7 +2452,7 @@ strong {
   color: #ecf0f1;
 }
 
-@media (max-width: 767px) {
+@media all and (max-width: 767px) {
   .mobile-bottom-bar {
     display: flex;
   }
@@ -2600,7 +2619,7 @@ strong {
   text-align: center;
 }
 
-@media (max-width: 767px) {
+@media all and (max-width: 767px) {
   .genres + main + .pagination {
     text-align: center;
   }
@@ -2951,14 +2970,14 @@ ol li:hover {
   border-radius: 5px;
 }
 
-@media (max-width: 705px) {
+@media all and (max-width: 705px) {
   #search-title,
   #alt-title {
     display: none;
   }
 }
 
-@media (max-height: 930px) {
+@media all and (max-height: 930px) {
   #search-title,
   #alt-title {
     display: none;
@@ -2975,7 +2994,7 @@ ol li:hover {
   align-self: flex-start;
 }
 
-@media (max-width: 767px) {
+@media all and (max-width: 767px) {
   #chatbotContainer {
     top: 56.1%;
   }
@@ -3077,7 +3096,7 @@ ol li:hover {
   color: #ff8623;
 }
 
-@media (max-width: 982px) {
+@media all and (max-width: 982px) {
   #local-time {
     display: none;
   }
@@ -3148,7 +3167,7 @@ canvas {
   cursor: pointer;
 }
 
-@media screen and (max-width: 900px) {
+@media all and (max-width: 900px) {
   .chart-container {
     flex-direction: column;
   }
@@ -3199,7 +3218,7 @@ canvas {
   transition: 0.1s ease-in;
 }
 
-@media (max-width: 1000px) {
+@media all and (max-width: 1000px) {
   #comments-section {
     margin-bottom: 210px;
   }
@@ -3217,7 +3236,7 @@ canvas {
   transition: 0.1s ease-in;
 }
 
-@media (max-width: 800px) {
+@media all and (max-width: 800px) {
   #my-heading {
     margin-left: 0;
   }
@@ -3628,7 +3647,7 @@ canvas {
   background-color: #ff8623;
 }
 
-@media screen and (-webkit-min-device-pixel-ratio: 0) {
+@media all and (-webkit-min-device-pixel-ratio: 0) {
   body {
     background-size: auto;
     background-repeat: repeat;
@@ -3936,7 +3955,7 @@ body {
   color: purple;
 }
 
-@media (max-width: 800px) {
+@media all and (max-width: 800px) {
   .company-details-container {
     display: flex;
     flex-direction: column;
@@ -4207,7 +4226,7 @@ footer {
   color: white;
 }
 
-@media (max-width: 900px) {
+@media all and (max-width: 900px) {
   .notification-modal {
     right: 12.5px;
   }

diff --git a/MovieVerse-Mobile/.gitignore b/MovieVerse-Mobile/.gitignore
@@ -20,4 +20,5 @@
 
 # Generated by package manager
 node_modules/
+platforms/
 .env
diff --git a/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/index.html b/MovieVerse-Mobile/platforms/android/app/src/main/assets/www/index.html
@@ -56,6 +56,7 @@
     <link rel="preload" href="https://movie-verse.com/fonts/Poppins-Light.ttf" as="font" type="font/ttf" crossorigin="anonymous" />
     <link rel="preload" href="https://movie-verse.com/fonts/Poppins-Regular.ttf" as="font" type="font/ttf" crossorigin="anonymous" />
     <link rel="preload" href="https://movie-verse.com/fonts/Poppins-SemiBold.ttf" as="font" type="font/ttf" crossorigin="anonymous" />
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/confetti.browser.min.js"></script>
     <script type="application/ld+json">
       {
         "@context": "https://schema.org",
@@ -1695,5 +1696,32 @@ <h2 id="other" style="cursor: pointer">Timeless Classics: Trending Classic Movie
         searchInput.addEventListener('blur', clearSelection);
       });
     </script>
+    <script>
+      let confettiTriggered = false;
+
+      function launchConfetti() {
+        const confettiInstance = confetti.create(null, { resize: true });
+        confettiInstance({
+          particleCount: 150,
+          spread: 70,
+          origin: { y: 0.6 },
+        });
+
+        const canvas = document.querySelector('canvas');
+
+        if (canvas) {
+          canvas.style.zIndex = '9999999999';
+          canvas.style.position = 'fixed';
+        }
+      }
+
+      document.addEventListener('DOMContentLoaded', function () {
+        if (!confettiTriggered) {
+          launchConfetti();
+
+          confettiTriggered = true;
+        }
+      });
+    </script>
   </body>
 </html>
diff --git a/MovieVerse-Mobile/platforms/ios/MovieVerse.xcodeproj/project.pbxproj b/MovieVerse-Mobile/platforms/ios/MovieVerse.xcodeproj/project.pbxproj
@@ -114,11 +114,10 @@
 				34A1B8E64081AC554A7A24E1 /* Pods-MovieVerse.debug.xcconfig */,
 				DB4882ED1EE64C7487B364BE /* Pods-MovieVerse.release.xcconfig */,
 			);
-			name = Pods;
 			path = Pods;
 			sourceTree = "<group>";
 		};
-		29B97314FDCFA39411CA2CEA = {
+		29B97314FDCFA39411CA2CEA /* CustomTemplate */ = {
 			isa = PBXGroup;
 			children = (
 				EB87FDF41871DAF40020F90C /* config.xml */,
@@ -151,7 +150,6 @@
 				1D3623250D0F684500981E51 /* AppDelegate.m */,
 				29B97316FDCFA39411CA2CEA /* main.m */,
 			);
-			name = MovieVerse;
 			path = MovieVerse;
 			sourceTree = "<group>";
 		};
@@ -238,7 +236,6 @@
 		29B97313FDCFA39411CA2CEA /* Project object */ = {
 			isa = PBXProject;
 			attributes = {
-				BuildIndependentTargetsInParallel = YES;
 				LastUpgradeCheck = 1130;
 				TargetAttributes = {
 					1D6058900D05DD3D006BFB54 = {
@@ -254,7 +251,7 @@
 				en,
 				Base,
 			);
-			mainGroup = 29B97314FDCFA39411CA2CEA;
+			mainGroup = 29B97314FDCFA39411CA2CEA /* CustomTemplate */;
 			productRefGroup = 19C28FACFE9D520D11CA2CBB /* Products */;
 			projectDirPath = "";
 			projectReferences = (

diff --git a/.../MovieVerse.xcworkspace/xcuserdata/davidnguyen.xcuserdatad/UserInterfaceState.xcuserstate b/.../MovieVerse.xcworkspace/xcuserdata/davidnguyen.xcuserdatad/UserInterfaceState.xcuserstate
diff --git a/MovieVerse-Mobile/platforms/ios/www/index.html b/MovieVerse-Mobile/platforms/ios/www/index.html
@@ -56,6 +56,7 @@
     <link rel="preload" href="https://movie-verse.com/fonts/Poppins-Light.ttf" as="font" type="font/ttf" crossorigin="anonymous" />
     <link rel="preload" href="https://movie-verse.com/fonts/Poppins-Regular.ttf" as="font" type="font/ttf" crossorigin="anonymous" />
     <link rel="preload" href="https://movie-verse.com/fonts/Poppins-SemiBold.ttf" as="font" type="font/ttf" crossorigin="anonymous" />
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/confetti.browser.min.js"></script>
     <script type="application/ld+json">
       {
         "@context": "https://schema.org",
@@ -1695,5 +1696,32 @@ <h2 id="other" style="cursor: pointer">Timeless Classics: Trending Classic Movie
         searchInput.addEventListener('blur', clearSelection);
       });
     </script>
+    <script>
+      let confettiTriggered = false;
+
+      function launchConfetti() {
+        const confettiInstance = confetti.create(null, { resize: true });
+        confettiInstance({
+          particleCount: 150,
+          spread: 70,
+          origin: { y: 0.6 },
+        });
+
+        const canvas = document.querySelector('canvas');
+
+        if (canvas) {
+          canvas.style.zIndex = '9999999999';
+          canvas.style.position = 'fixed';
+        }
+      }
+
+      document.addEventListener('DOMContentLoaded', function () {
+        if (!confettiTriggered) {
+          launchConfetti();
+
+          confettiTriggered = true;
+        }
+      });
+    </script>
   </body>
 </html>
diff --git a/MovieVerse-Mobile/www/index.html b/MovieVerse-Mobile/www/index.html
@@ -56,6 +56,7 @@
     <link rel="preload" href="https://movie-verse.com/fonts/Poppins-Light.ttf" as="font" type="font/ttf" crossorigin="anonymous" />
     <link rel="preload" href="https://movie-verse.com/fonts/Poppins-Regular.ttf" as="font" type="font/ttf" crossorigin="anonymous" />
     <link rel="preload" href="https://movie-verse.com/fonts/Poppins-SemiBold.ttf" as="font" type="font/ttf" crossorigin="anonymous" />
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/confetti.browser.min.js"></script>
     <script type="application/ld+json">
       {
         "@context": "https://schema.org",
@@ -1695,5 +1696,32 @@ <h2 id="other" style="cursor: pointer">Timeless Classics: Trending Classic Movie
         searchInput.addEventListener('blur', clearSelection);
       });
     </script>
+    <script>
+      let confettiTriggered = false;
+
+      function launchConfetti() {
+        const confettiInstance = confetti.create(null, { resize: true });
+        confettiInstance({
+          particleCount: 150,
+          spread: 70,
+          origin: { y: 0.6 },
+        });
+
+        const canvas = document.querySelector('canvas');
+
+        if (canvas) {
+          canvas.style.zIndex = '9999999999';
+          canvas.style.position = 'fixed';
+        }
+      }
+
+      document.addEventListener('DOMContentLoaded', function () {
+        if (!confettiTriggered) {
+          launchConfetti();
+
+          confettiTriggered = true;
+        }
+      });
+    </script>
   </body>
 </html>
diff --git a/index.html b/index.html
@@ -56,6 +56,7 @@
     <link rel="preload" href="https://movie-verse.com/fonts/Poppins-Light.ttf" as="font" type="font/ttf" crossorigin="anonymous" />
     <link rel="preload" href="https://movie-verse.com/fonts/Poppins-Regular.ttf" as="font" type="font/ttf" crossorigin="anonymous" />
     <link rel="preload" href="https://movie-verse.com/fonts/Poppins-SemiBold.ttf" as="font" type="font/ttf" crossorigin="anonymous" />
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/confetti.browser.min.js"></script>
     <script type="application/ld+json">
       {
         "@context": "https://schema.org",
@@ -1695,5 +1696,32 @@ <h2 id="other" style="cursor: pointer">Timeless Classics: Trending Classic Movie
         searchInput.addEventListener('blur', clearSelection);
       });
     </script>
+    <script>
+      let confettiTriggered = false;
+
+      function launchConfetti() {
+        const confettiInstance = confetti.create(null, { resize: true });
+        confettiInstance({
+          particleCount: 150,
+          spread: 70,
+          origin: { y: 0.6 },
+        });
+
+        const canvas = document.querySelector('canvas');
+
+        if (canvas) {
+          canvas.style.zIndex = '9999999999';
+          canvas.style.position = 'fixed';
+        }
+      }
+
+      document.addEventListener('DOMContentLoaded', function () {
+        if (!confettiTriggered) {
+          launchConfetti();
+
+          confettiTriggered = true;
+        }
+      });
+    </script>
   </body>
 </html>
Original file line number	Diff line number	Diff line change
Expand Up		@@ -6,3 +6,4 @@ node_modules

		# Ignore the Emscripten SDK
		emsdk/
		/MovieVerse-Mobile/platforms/