Embeds on other web-services (#32)

* Add meta data tags

* Path is not a thing there

ReplayBrowser/Pages/Changelog.razor

@@ -1,4 +1,11 @@
 @page "/changelog"
+@using ReplayBrowser.Pages.Shared
+
+<MetaDataSpecifer 
+    Title="Changelog" 
+    Description="A list of changes made to the Replay Browser." 
+    />
+
 <h3>Changelog</h3>
 
 <p>12.08.2024</p>

ReplayBrowser/Pages/Contact.razor

@@ -1,8 +1,15 @@
 @page "/contact"
 @using Microsoft.AspNetCore.Components.Web
+@using ReplayBrowser.Pages.Shared
 
 @inject IConfiguration Configuration
 
+<MetaDataSpecifer
+    Title="Contact"
+    Path="contact"
+    Description="@OpenGraphDescription"
+/>
+
 <PageTitle>Contact</PageTitle>
 
 <h3>Contact</h3>
@@ -11,6 +18,12 @@
 <ul>
     <li>Email: <a href="mailto:@Configuration["Contact:Email"]">@Configuration["Contact:Email"]</a></li>
     <li>Discord: @Configuration["Contact:Discord"]</li>
+    <li>Discord Server: @Configuration["Contact:Server"]</li>
 </ul>
 
 You can also raise an issue on the <a href="https://github.com/Simyon264/ReplayBrowser/issues/new">GitHub repository</a> if you have any questions or suggestions.
+
+@code
+{
+    private string OpenGraphDescription => $"Contact information\nEmail: {Configuration["Contact:Email"]}\nDiscord: {Configuration["Contact:Discord"]}\nDiscord Server: {Configuration["Contact:Server"]}";
+}

ReplayBrowser/Pages/Contributors.razor

@@ -6,6 +6,12 @@
 @using ReplayBrowser.Pages.Shared
 @using ReplayBrowser.Helpers
 
+<MetaDataSpecifer
+    Title="Contributors"
+    Path="contributors"
+    Description="List of the awesome people who helped make this project not suck."
+/>
+
 <PageTitle>Contributors</PageTitle>
 
 <h3>Contributors</h3>

ReplayBrowser/Pages/Downloads.razor

@@ -1,5 +1,12 @@
 @page "/downloads"
 @using Microsoft.AspNetCore.Components.Web
+@using ReplayBrowser.Pages.Shared
+
+<MetaDataSpecifer
+    Title="Downloads"
+    Path="downloads"
+    Description="Progress tracker for the internal downloads of the website."
+/>
 
 <PageTitle>Downloads</PageTitle>
 

ReplayBrowser/Pages/Home.razor

@@ -1,14 +1,15 @@
 @page "/"
 @using Microsoft.AspNetCore.Components.Authorization
 @using Microsoft.AspNetCore.Components.Web
-@using ReplayBrowser.Data.Models
 @using ReplayBrowser.Helpers
 @using ReplayBrowser.Models
 @using ReplayBrowser.Pages.Shared
 
 @inject ReplayHelper ReplayHelper
 @inject AuthenticationStateProvider AuthenticationStateProvider
 
+<MetaDataSpecifer/>
+
 <PageTitle>Replay browser</PageTitle>
 
 <h1>Replay browser for Space Station 14</h1>

ReplayBrowser/Pages/Leaderboard.razor

@@ -5,12 +5,18 @@
 @using ReplayBrowser.Services
 @using Microsoft.AspNetCore.Components.Web
 @using ReplayBrowser.Helpers
+@using ReplayBrowser.Pages.Shared
 @inject NavigationManager NavigationManager
 @inject AuthenticationStateProvider AuthenticationStateProvider
 @inject IConfiguration Configuration
 @inject LeaderboardService LeaderboardService
 @inject Ss14ApiHelper Ss14ApiHelper
 
+<MetaDataSpecifer
+    Title="Leaderboards"
+    Description="View leaderboards for various tracked statistics. See how you compare to other players!"
+/>
+
 <PageTitle>Leaderboard</PageTitle>
 <h4>Leaderboards</h4>
 @if(RequestedPrivate)

ReplayBrowser/Pages/Privacy.razor

@@ -1,5 +1,8 @@
 @page "/privacy"
 @using Microsoft.AspNetCore.Components.Web
+@using ReplayBrowser.Pages.Shared
+
+<MetaDataSpecifer Title="Privacy Policy" Description="Document explaining what data is collected and how it is used. Boring stuff, really." />
 
 <PageTitle>Privacy Policy</PageTitle>
 

ReplayBrowser/Pages/Profile.razor

@@ -6,6 +6,7 @@
 @using ReplayBrowser.Data.Models
 @using ReplayBrowser.Helpers
 @using Serilog
+@using ReplayBrowser.Pages.Shared
 
 @inject AuthenticationStateProvider AuthenticationStateProvider
 @inject ReplayHelper ReplayHelper
@@ -30,6 +31,10 @@ else if (FailedToLoad)
 }
 else
 {
+    <MetaDataSpecifer
+        Title="@OpenGraphTitle"
+        Description="@OpenGraphDescription"
+    />
     <button class="btn btn-outline-danger" id="watchButton" onclick="Watch()">
         @if (_playerData.IsWatched)
         {
@@ -148,6 +153,9 @@ else
     private bool IsPrivate { get; set; } = false;
     private bool IsLoggedIn { get; set; } = false;
     private string Username { get; set; } = string.Empty;
+
+    private string OpenGraphTitle => $"Player info :: {Username}";
+    private string OpenGraphDescription => $"Player info for {Username}\nTotal estimated playtime: {_playerData.TotalEstimatedPlaytime.Humanize()}\nTotal rounds played: {_playerData.TotalRoundsPlayed}\nTotal antag rounds played: {_playerData.TotalAntagRoundsPlayed}\nLast seen: {_playerData.LastSeen.Humanize()}";
 
     protected override async Task OnInitializedAsync()
     {

ReplayBrowser/Pages/Search.razor

@@ -1,4 +1,5 @@
 @page "/search"
+
 @using System.Diagnostics
 @using Humanizer
 @using Microsoft.AspNetCore.Components.Authorization
@@ -8,6 +9,7 @@
 @using Microsoft.AspNetCore.Components.Web
 @using ReplayBrowser.Data
 @using ReplayBrowser.Helpers
+
 @inject NavigationManager NavigationManager
 @inject AuthenticationStateProvider AuthenticationStateProvider
 @inject ReplayHelper ReplayHelper
@@ -20,6 +22,11 @@
 <hr/>
 @if (ErrorMessage != null)
 {
+    <MetaDataSpecifer
+        Title="Search error"
+        Description="@OpenGraphDescriptionError"
+    />
+
     <p class="alert alert-danger">
         @ErrorMessage
         <br/>
@@ -40,6 +47,10 @@
         </div>
         break;
     case 0:
+            <MetaDataSpecifer
+                Title="Search results"
+                Description="@OpenGraphDescriptionNoResults"
+            />
             <p>Found 0 replays in @stopWatch.ElapsedMilliseconds ms</p>
             <div class="replay-list">
                 <p>No results... :(</p>
@@ -48,6 +59,10 @@
     default:
     {
         var pageDisplay = SearchResult.CurrentPage + 1;
+        <MetaDataSpecifer
+            Title="Search results"
+            Description="@OpenGraphDescriptionResults"
+        />
 
         if (SearchResult.IsCache)
         {
@@ -131,7 +146,23 @@
     public PlayerData? ProfileFound { get; set; }
 
     public SearchResult SearchResult { get; set; } = new SearchResult();
-
+    public List<SearchQueryItem> SearchItems { get; set; } = new List<SearchQueryItem>();
+
+    private string OpenGraphDescriptionError => ErrorMessage + "\n" + ErrorDetails;
+    private string OpenGraphDescriptionResults => SearchResult.TotalReplays + " found. Page: " + (SearchResult.CurrentPage + 1) + "\n" + FormatOpenGraphSpeciferDescription();
+    private string OpenGraphDescriptionNoResults => "No results found.\n" + FormatOpenGraphSpeciferDescription();
+
+    private string FormatOpenGraphSpeciferDescription()
+    {
+        var searchQuery = string.Join(", ", SearchItems.Select(x => x.SearchMode + ": " + x.SearchValue));
+
+        // Limit the length of the description to 200 characters
+        if (searchQuery.Length > 200)
+        {
+            searchQuery = searchQuery.Substring(0, 200) + "...";
+        }
+        return $"Search results for {searchQuery}";
+    }
     /// <summary>
     /// Search modes that you can only once in a query to save on processing time
     /// </summary>
@@ -165,13 +196,12 @@
             NavigationManager.NavigateTo("/");
             return;
         }
-
-        var searchItems = new List<SearchQueryItem>();
+
         // Searches is a base64 encoded json string
         try
         {
             var decoded = System.Text.Encoding.UTF8.GetString(Convert.FromBase64String(searches));
-            searchItems = System.Text.Json.JsonSerializer.Deserialize<List<SearchQueryItem>>(decoded);
+            SearchItems = System.Text.Json.JsonSerializer.Deserialize<List<SearchQueryItem>>(decoded);
         }
         catch (Exception e)
         {
@@ -185,7 +215,7 @@
         // If any SearchMode is invalid, we throw an error
         try
         {
-            searchItems.ForEach(x => _ = x.SearchModeEnum); // we dont care about the result, just need to call the getter
+            SearchItems.ForEach(x => _ = x.SearchModeEnum); // we dont care about the result, just need to call the getter
         }
         catch (ArgumentOutOfRangeException e)
         {
@@ -196,7 +226,7 @@
         }
 
         // If any SearchMode in the query is a LimitedSearchMode, we check if it is duplicated, if it is, we throw an error
-        var searchModes = searchItems.Select(x => x.SearchModeEnum).ToList();
+        var searchModes = SearchItems.Select(x => x.SearchModeEnum).ToList();
         foreach (var limitedSearchMode in LimitedSearchModes)
         {
             if (searchModes.Count(x => x == limitedSearchMode) > 1)
@@ -208,22 +238,22 @@
             }
         }
 
-        if (searchItems.Count == 0)
+        if (SearchItems.Count == 0)
         {
             ErrorMessage = "Invalid search query";
             ErrorDetails = "No search items found";
             stopWatch.Stop();
             NavigationManager.NavigateTo("/");
             return;
         }
-        if (searchItems.Exists(x => x.SearchModeEnum == SearchMode.PlayerOocName))
+        if (SearchItems.Exists(x => x.SearchModeEnum == SearchMode.PlayerOocName))
         {
-            ProfileFound = await ReplayHelper.HasProfile(searchItems.Find(x => x.SearchModeEnum == SearchMode.PlayerOocName).SearchValue, authState);
+            ProfileFound = await ReplayHelper.HasProfile(SearchItems.Find(x => x.SearchModeEnum == SearchMode.PlayerOocName).SearchValue, authState);
         }
 
         try
         {
-            SearchResult = await ReplayHelper.SearchReplays(searchItems, pageInt, authState);
+            SearchResult = await ReplayHelper.SearchReplays(SearchItems, pageInt, authState);
         }
         catch (UnauthorizedAccessException e)
         {

ReplayBrowser/Pages/Shared/MetaDataSpecifer.razor

@@ -0,0 +1,32 @@
+@inject NavigationManager NavigationManager
+
+<HeadContent>
+    <meta name="title" content="Replay Browser @Title" />
+    <meta name="description" content="@Description" />
+    <meta name="theme-color" content="#9d32a8">
+
+    <meta property="og:type" content="website" />
+    <meta property="og:url" content="@NavigationManager.Uri" />
+    <meta property="og:title" content="Replay Browser @Title" />
+    <meta property="og:description" content="@Description" />
+
+    <meta property="twitter:card" content="summary" />
+    <meta property="twitter:url" content="@NavigationManager.Uri" />
+    <meta property="twitter:title" content="Replay Browser @Title" />
+    <meta property="twitter:description" content="@Description" />
+</HeadContent>
+
+@code {
+    [Parameter]
+    public string? Title { get; set; }
+
+    [Parameter]
+    public string? Description { get; set; }
+
+    protected override void OnInitialized()
+    {
+        Description ??= "Search and browse replays for Space Station 14.";
+        Title = Title != null ? $":: {Title}" : "";
+    }
+
+}

ReplayBrowser/Pages/ViewReplay.razor

@@ -4,9 +4,11 @@
 @using ReplayBrowser.Data.Models
 @using ReplayBrowser.Helpers
 @using ReplayBrowser.Pages.Shared
+@using ReplayBrowser.Services.ReplayParser
 
 @inject AuthenticationStateProvider AuthenticationStateProvider
 @inject ReplayHelper ReplayHelper
+@inject ReplayParserService ReplayParserService
 
 <PageTitle>Replay viewer</PageTitle>
 @if (Replay == null && !IsLoading)
@@ -20,13 +22,54 @@ else if (IsLoading)
 else
 {
     <ReplayDetails FullReplay="Replay" />
+
+    <MetaDataSpecifer
+        Title="@GetTitle()"
+        Description="@GetDescription()"
+    />
 }
 
 @code {
     [Parameter] public string Id { get; set; }
     public Replay? Replay { get; set; }
     public bool IsLoading { get; set; } = true;
 
+    private string GetTitle()
+    {
+        var fileName = Path.GetFileName(Replay.Link);
+        var storageUrl = ReplayParserService.GetStorageUrlFromReplayLink(Replay.Link);
+        var matchName = storageUrl.ServerNameRegexCompiled.Match(fileName);
+        var matchDate = storageUrl.ReplayRegexCompiled.Match(fileName);
+
+        var nameFormatted = "";
+        var dateFormatted = "";
+
+        if (matchName.Success && matchDate.Success)
+        {
+            nameFormatted = $"{matchName.Groups[1].Value} - {matchDate.Groups[1].Value.Replace("_","-")}";
+            dateFormatted = matchDate.Groups[1].Value.Replace("_", "-");
+            if (string.IsNullOrWhiteSpace(matchName.Groups[1].Value))
+            {
+                nameFormatted = $"{Replay.ServerId} - {matchDate.Groups[1].Value}";
+            }
+            else
+            {
+                nameFormatted = $"{matchName.Groups[1].Value} - {matchDate.Groups[1].Value}";
+            }
+        }
+        else
+        {
+            nameFormatted = Replay.ServerName ?? Replay.ServerId;
+        }
+
+        return $"Round {Replay.RoundId} - {nameFormatted}";
+    }
+
+    private string GetDescription()
+    {
+        return "Round " + Replay.RoundId + " played on " + Replay.Map + " on " + Replay.Date?.ToString("yyyy-MM-dd HH:mm:ss");
+    }
+
     protected override async Task OnInitializedAsync()
     {
         var authstate = await AuthenticationStateProvider.GetAuthenticationStateAsync();

ReplayBrowser/Pages/WatchedItems.razor

@@ -1,13 +1,20 @@
 @page "/favorites/profiles"
+
 @using Microsoft.AspNetCore.Authorization
 @using Microsoft.AspNetCore.Components.Authorization
 @using Microsoft.AspNetCore.Components.Web
 @using ReplayBrowser.Services
 @using ReplayBrowser.Pages.Shared
+
 @attribute [Authorize]
+
 @inject AccountService AccountService
 @inject AuthenticationStateProvider AuthenticationStateProvider
 
+<MetaDataSpecifer
+    Title="Favorite profiles"
+/>
+
 <PageTitle>Watched profiles</PageTitle>
 
 <h3>Watched profiles</h3>