feat: add interactive button state and PocketBase integration

- Implemented button press tracking with visual feedback and event emission
- Integrated PocketBase for real-time session and movie data management
- Added session ID routing across pages for game state persistence

app/pages/info.vue

@@ -1,48 +1,19 @@
 
 <script setup lang="ts">
 const { pb } = usePocketbase()
-const movie_data2 = await pb.collection('movies').getFullList()
-console.log(movie_data2)
-    const movie_data = ref({
-        "Title": "A Maple Valley Christmas",
-        "Year": "2022",
-        "Rated": "TV-G",
-        "Released": "05 Nov 2022",
-        "Runtime": "85 min",
-        "Genre": "Comedy, Drama, Romance",
-        "Director": "Paul Ziller",
-        "Writer": "Joie Botkin, Jerry Todt",
-        "Actors": "Peyton List, Andrew W. Walker, Frances Flanagan",
-        "Plot": "Erica is a rancher who has spent her whole life working the family farm with her mother and sister. When Aaron arrives and disrupts her plans, she starts to question what it is she actually wants.",
-        "Language": "English, Italian",
-        "Country": "Canada, United States",
-        "Awards": "1 nomination total",
-        "Poster": "https://m.media-amazon.com/images/M/MV5BZjliMTRlMGItOGQzZC00NTI2LWJkODctZWZmMDIzOGRmYTQ3XkEyXkFqcGc@._V1_SX300.jpg",
-        "Ratings": [
-            {
-                "Source": "Internet Movie Database",
-                "Value": "6.3/10"
-            }
-        ],
-        "Metascore": "N/A",
-        "imdbRating": "6.3",
-        "imdbVotes": "1,577",
-        "imdbID": "tt21841642",
-        "Type": "movie",
-        "DVD": "N/A",
-        "BoxOffice": "N/A",
-        "Production": "N/A",
-        "Website": "N/A",
-        "Response": "True"
-})
+
+const sessionid = checkSession()
+const session_data = await pb.collection("game_sessions").getOne(sessionid as string, {expand: 'movie_title'})
+const movie_data = session_data.expand?.movie_title
+
 </script>
 <template>
     <div class="info-container">
-        <h1>{{ movie_data.Title }}</h1>
+        <h1>{{ movie_data?.title }}</h1>
         <div class="poster-content">
-            <img class="poster" :src="movie_data.Poster" alt="">
-            <p>{{ movie_data.Plot }}</p>
-            <NuxtLink class="btn btn-primary" to="/gameroom">Aloita</NuxtLink>
+            <img class="poster" :src="movie_data.poster_url" alt="">
+            <p>{{ movie_data.plot }}</p>
+            <NuxtLink class="btn btn-primary" :to="'/gameroom?sessionid=' + sessionid">Aloita</NuxtLink>
         </div>
     </div>
 </template>