Merge pull request #469 from SyncfusionExamples/986459-Update-Blazor-Samples

986459 - Updated Blazor Server and WASM Samples to Run State

Author: MathanKumarVaradhaRajaPerumal

Getting-Started/Blazor/Blazor-Server-app/Create-Word-document/Pages/DocIO.razor

@@ -0,0 +1,23 @@
+@page "/DocIO"
+@using System.IO;
+@using Create_Word_document;
+@inject Create_Word_document.Data.WordService service
+@inject Microsoft.JSInterop.IJSRuntime JS
+
+<h2>Syncfusion DocIO library (Essential DocIO)</h2>
+<p>Syncfusion DocIO library (Essential DocIO) is a Blazor DocIO library used to create, read, edit, and convert Word files in your applications without Microsoft Office dependencies.</p>
+<button class="btn btn-primary" @onclick="@CreateWord">Create Word</button>
+
+
+@code {
+    MemoryStream documentStream;
+
+    /// <summary>
+    /// Create and download the Word document
+    /// </summary>
+    protected async void CreateWord()
+    {
+        documentStream = service.CreateWord();
+        await JS.SaveAs("Sample.docx", documentStream.ToArray());
+    }
+}

Word-to-Image-conversion/Convert-Word-to-image/Blazor/Server-app/Convert-Word-Document-to-Image/Pages/DocIO.razor

@@ -0,0 +1,21 @@
+@page "/docio"
+@using Convert_Word_Document_to_Image;
+@inject Convert_Word_Document_to_Image.Data.WordService service;
+@inject Microsoft.JSInterop.IJSRuntime JS;
+
+<h2>Syncfusion DocIO library </h2>
+<p>Syncfusion DocIO library is a Blazor DocIO library used to create, read, edit, and convert Word files in your applications without Microsoft Office dependencies.</p>
+<button class="btn btn-primary" @onclick="@ConvertWordtoImage">Convert Word to Image</button>
+
+
+@code {
+    MemoryStream documentStream;
+    /// <summary>
+    /// Convert Word to image and download the image file
+    /// </summary>
+    protected async void ConvertWordtoImage()
+    {
+        documentStream = service.ConvertWordtoImage();
+        await JS.SaveAs("WordToImage.Jpeg", documentStream.ToArray());
+    }
+}

Word-to-Image-conversion/Convert-Word-to-image/Blazor/Server-app/Convert-Word-Document-to-Image/Pages/Error.cshtml.cs

@@ -0,0 +1,27 @@
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.RazorPages;
+using System.Diagnostics;
+
+namespace Convert_Word_Document_to_Image.Pages
+{
+    [ResponseCache(Duration = 0, Location = ResponseCacheLocation.None, NoStore = true)]
+    [IgnoreAntiforgeryToken]
+    public class ErrorModel : PageModel
+    {
+        public string? RequestId { get; set; }
+
+        public bool ShowRequestId => !string.IsNullOrEmpty(RequestId);
+
+        private readonly ILogger<ErrorModel> _logger;
+
+        public ErrorModel(ILogger<ErrorModel> logger)
+        {
+            _logger = logger;
+        }
+
+        public void OnGet()
+        {
+            RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier;
+        }
+    }
+}

Word-to-Image-conversion/Convert-Word-to-image/Blazor/Server-app/Convert-Word-Document-to-Image/Shared/MainLayout.razor.css

@@ -0,0 +1,70 @@
+.page {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+}
+
+main {
+    flex: 1;
+}
+
+.sidebar {
+    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
+}
+
+.top-row {
+    background-color: #f7f7f7;
+    border-bottom: 1px solid #d6d5d5;
+    justify-content: flex-end;
+    height: 3.5rem;
+    display: flex;
+    align-items: center;
+}
+
+    .top-row ::deep a, .top-row .btn-link {
+        white-space: nowrap;
+        margin-left: 1.5rem;
+    }
+
+    .top-row a:first-child {
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+
+@media (max-width: 640.98px) {
+    .top-row:not(.auth) {
+        display: none;
+    }
+
+    .top-row.auth {
+        justify-content: space-between;
+    }
+
+    .top-row a, .top-row .btn-link {
+        margin-left: 0;
+    }
+}
+
+@media (min-width: 641px) {
+    .page {
+        flex-direction: row;
+    }
+
+    .sidebar {
+        width: 250px;
+        height: 100vh;
+        position: sticky;
+        top: 0;
+    }
+
+    .top-row {
+        position: sticky;
+        top: 0;
+        z-index: 1;
+    }
+
+    .top-row, article {
+        padding-left: 2rem !important;
+        padding-right: 1.5rem !important;
+    }
+}

Word-to-PDF-Conversion/Convert-Word-document-to-PDF/Blazor/Server-app/Convert-Word-Document-to-PDF/Pages/Convert-Word-Document-to-PDF.sln

@@ -0,0 +1,21 @@
+@page "/docio"
+@using Convert_Word_Document_to_PDF;
+@inject Convert_Word_Document_to_PDF.Data.WordService service
+@inject Microsoft.JSInterop.IJSRuntime JS
+
+<h2>Syncfusion DocIO library </h2>
+<p>Syncfusion DocIO library is a Blazor DocIO library used to create, read, edit, and convert Word files in your applications without Microsoft Office dependencies.</p>
+<button class="btn btn-primary" @onclick="@ConvertWordtoPDF">Convert Word to PDF</button>
+
+
+@code {
+    MemoryStream documentStream;
+    /// <summary>
+    /// Convert Word to PDF and download the PDF document
+    /// </summary>
+    protected async void ConvertWordtoPDF()
+    {
+        documentStream = service.ConvertWordtoPDF();
+        await JS.SaveAs("Sample.pdf", documentStream.ToArray());
+    }
+}

Word-to-PDF-Conversion/Convert-Word-document-to-PDF/Blazor/Server-app/Convert-Word-Document-to-PDF/Pages/DocIO.razor

@@ -0,0 +1,27 @@
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.RazorPages;
+using System.Diagnostics;
+
+namespace Convert_Word_Document_to_PDF.Pages
+{
+    [ResponseCache(Duration = 0, Location = ResponseCacheLocation.None, NoStore = true)]
+    [IgnoreAntiforgeryToken]
+    public class ErrorModel : PageModel
+    {
+        public string? RequestId { get; set; }
+
+        public bool ShowRequestId => !string.IsNullOrEmpty(RequestId);
+
+        private readonly ILogger<ErrorModel> _logger;
+
+        public ErrorModel(ILogger<ErrorModel> logger)
+        {
+            _logger = logger;
+        }
+
+        public void OnGet()
+        {
+            RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier;
+        }
+    }
+}

Word-to-PDF-Conversion/Convert-Word-document-to-PDF/Blazor/Server-app/Convert-Word-Document-to-PDF/Pages/Error.cshtml.cs

@@ -0,0 +1,70 @@
+.page {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+}
+
+main {
+    flex: 1;
+}
+
+.sidebar {
+    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
+}
+
+.top-row {
+    background-color: #f7f7f7;
+    border-bottom: 1px solid #d6d5d5;
+    justify-content: flex-end;
+    height: 3.5rem;
+    display: flex;
+    align-items: center;
+}
+
+    .top-row ::deep a, .top-row .btn-link {
+        white-space: nowrap;
+        margin-left: 1.5rem;
+    }
+
+    .top-row a:first-child {
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+
+@media (max-width: 640.98px) {
+    .top-row:not(.auth) {
+        display: none;
+    }
+
+    .top-row.auth {
+        justify-content: space-between;
+    }
+
+    .top-row a, .top-row .btn-link {
+        margin-left: 0;
+    }
+}
+
+@media (min-width: 641px) {
+    .page {
+        flex-direction: row;
+    }
+
+    .sidebar {
+        width: 250px;
+        height: 100vh;
+        position: sticky;
+        top: 0;
+    }
+
+    .top-row {
+        position: sticky;
+        top: 0;
+        z-index: 1;
+    }
+
+    .top-row, article {
+        padding-left: 2rem !important;
+        padding-right: 1.5rem !important;
+    }
+}