874070: Add the samples for the custom toolbar

Toolbar/Custom Toolbar/EBook Reader/CustomToolbar.sln

@@ -0,0 +1,25 @@
+
+Microsoft Visual Studio Solution File, Format Version 12.00
+# Visual Studio Version 17
+VisualStudioVersion = 17.10.34607.79
+MinimumVisualStudioVersion = 10.0.40219.1
+Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "CustomToolbar", "CustomToolbar\CustomToolbar.csproj", "{7159B758-ACD2-4275-B2C9-6F72ADE23ED5}"
+EndProject
+Global
+	GlobalSection(SolutionConfigurationPlatforms) = preSolution
+		Debug|Any CPU = Debug|Any CPU
+		Release|Any CPU = Release|Any CPU
+	EndGlobalSection
+	GlobalSection(ProjectConfigurationPlatforms) = postSolution
+		{7159B758-ACD2-4275-B2C9-6F72ADE23ED5}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{7159B758-ACD2-4275-B2C9-6F72ADE23ED5}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{7159B758-ACD2-4275-B2C9-6F72ADE23ED5}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{7159B758-ACD2-4275-B2C9-6F72ADE23ED5}.Release|Any CPU.Build.0 = Release|Any CPU
+	EndGlobalSection
+	GlobalSection(SolutionProperties) = preSolution
+		HideSolutionNode = FALSE
+	EndGlobalSection
+	GlobalSection(ExtensibilityGlobals) = postSolution
+		SolutionGuid = {DBDD3F7E-46A1-4658-8AF0-6F58C15ACC92}
+	EndGlobalSection
+EndGlobal

Toolbar/Custom Toolbar/EBook Reader/CustomToolbar/App.razor

@@ -0,0 +1,12 @@
+<Router AppAssembly="@typeof(App).Assembly">
+    <Found Context="routeData">
+        <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
+        <FocusOnNavigate RouteData="@routeData" Selector="h1" />
+    </Found>
+    <NotFound>
+        <PageTitle>Not found</PageTitle>
+        <LayoutView Layout="@typeof(MainLayout)">
+            <p role="alert">Sorry, there's nothing at this address.</p>
+        </LayoutView>
+    </NotFound>
+</Router>

Toolbar/Custom Toolbar/EBook Reader/CustomToolbar/CustomToolbar.csproj

@@ -0,0 +1,14 @@
+<Project Sdk="Microsoft.NET.Sdk.Web">
+
+  <PropertyGroup>
+    <TargetFramework>net7.0</TargetFramework>
+    <Nullable>enable</Nullable>
+    <ImplicitUsings>enable</ImplicitUsings>
+  </PropertyGroup>
+
+  <ItemGroup>
+    <PackageReference Include="Syncfusion.Blazor.SfPdfViewer" Version="25.1.35" />
+    <PackageReference Include="Syncfusion.Blazor.Themes" Version="25.1.35" />
+  </ItemGroup>
+
+</Project>

Toolbar/Custom Toolbar/EBook Reader/CustomToolbar/CustomToolbar.csproj.user

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Project ToolsVersion="Current" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
+  <PropertyGroup>
+    <ActiveDebugProfile>https</ActiveDebugProfile>
+  </PropertyGroup>
+</Project>

Toolbar/Custom Toolbar/EBook Reader/CustomToolbar/Data/WeatherForecast.cs

@@ -0,0 +1,13 @@
+namespace CustomToolbar.Data
+{
+    public class WeatherForecast
+    {
+        public DateOnly Date { get; set; }
+
+        public int TemperatureC { get; set; }
+
+        public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
+
+        public string? Summary { get; set; }
+    }
+}

Toolbar/Custom Toolbar/EBook Reader/CustomToolbar/Data/WeatherForecastService.cs

@@ -0,0 +1,20 @@
+namespace CustomToolbar.Data
+{
+    public class WeatherForecastService
+    {
+        private static readonly string[] Summaries = new[]
+        {
+            "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching"
+        };
+
+        public Task<WeatherForecast[]> GetForecastAsync(DateOnly startDate)
+        {
+            return Task.FromResult(Enumerable.Range(1, 5).Select(index => new WeatherForecast
+            {
+                Date = startDate.AddDays(index),
+                TemperatureC = Random.Shared.Next(-20, 55),
+                Summary = Summaries[Random.Shared.Next(Summaries.Length)]
+            }).ToArray());
+        }
+    }
+}

Toolbar/Custom Toolbar/EBook Reader/CustomToolbar/Pages/Counter.razor

@@ -0,0 +1,27 @@
+@page "/counter"
+@using Syncfusion.Blazor.SfPdfViewer
+
+<SfPdfViewer2 Height="100%" Width="100%" DocumentPath="@DocumentPath">
+    <PdfViewerToolbarSettings ToolbarItems="ToolbarItems" MobileToolbarItems="MobileToolbarItems"></PdfViewerToolbarSettings>
+</SfPdfViewer2>
+
+@code {
+
+    public string DocumentPath { get; set; } = "https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf";
+
+    List<ToolbarItem> ToolbarItems = new List<ToolbarItem>()
+    {
+        ToolbarItem.OpenOption,
+        ToolbarItem.PageNavigationTool,
+        ToolbarItem.AnnotationEditTool,
+        ToolbarItem.SearchOption,
+        ToolbarItem.DownloadOption,
+    };
+
+    List<MobileToolbarItem> MobileToolbarItems = new List<MobileToolbarItem>()
+    {
+        MobileToolbarItem.Open,
+        MobileToolbarItem.UndoRedo,
+        MobileToolbarItem.EditAnnotation,
+    };
+}

Toolbar/Custom Toolbar/EBook Reader/CustomToolbar/Pages/CustomTools.razor

@@ -0,0 +1,51 @@
+@page "/customtool"
+@using Syncfusion.Blazor.SfPdfViewer;
+@using Syncfusion.Blazor.Navigations;
+
+<SfPdfViewer2 @ref="@Viewer" DocumentPath="@DocumentPath" Height="100%" Width="100%">
+    <PdfViewerToolbarSettings CustomToolbarItems="@CustomToolbarItems" ToolbarItems=null />
+    <PdfViewerEvents ToolbarClicked="ClickAction"></PdfViewerEvents>
+</SfPdfViewer2>
+
+@code {
+
+    SfPdfViewer2 Viewer;
+    MemoryStream stream;
+
+    private string DocumentPath { get; set; } = "https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf";
+
+    // List provide the position and element for the custom toolbar items
+    public List<PdfToolbarItem> CustomToolbarItems = new List<PdfToolbarItem>()
+    {
+        new PdfToolbarItem (){  Template = @GetTemplate("Save")}
+    };
+
+    // Get the renderfragment element for the custom toolbaritems in the primary toolbar
+    private static RenderFragment GetTemplate(string name)
+    {
+        return __builder =>
+            {
+                if (name == "Save")
+                {
+                    <ToolbarItem PrefixIcon="e-icons e-save"
+                                 Text="Save"
+                                 TooltipText="Save Document"
+                                 Id="save"
+                                 Align="ItemAlign.Right">
+                    </ToolbarItem>
+                }
+            };
+    }
+
+    // Click for the custom toolbar items in the primary toolbar
+    public async void ClickAction(ClickEventArgs Item)
+    {
+        if (Item.Item.Id == "save")
+        {
+            //Gets the loaded PDF document with the changes.
+            byte[] data = await Viewer.GetDocumentAsync();
+            //Save the PDF document to a MemoryStream.
+            stream = new MemoryStream(data);
+        }
+    }
+}

Toolbar/Custom Toolbar/EBook Reader/CustomToolbar/Pages/Error.cshtml

@@ -0,0 +1,42 @@
+@page
+@model CustomToolbar.Pages.ErrorModel
+
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+    <title>Error</title>
+    <link href="~/css/bootstrap/bootstrap.min.css" rel="stylesheet" />
+    <link href="~/css/site.css" rel="stylesheet" asp-append-version="true" />
+</head>
+
+<body>
+    <div class="main">
+        <div class="content px-4">
+            <h1 class="text-danger">Error.</h1>
+            <h2 class="text-danger">An error occurred while processing your request.</h2>
+
+            @if (Model.ShowRequestId)
+            {
+                <p>
+                    <strong>Request ID:</strong> <code>@Model.RequestId</code>
+                </p>
+            }
+
+            <h3>Development Mode</h3>
+            <p>
+                Swapping to the <strong>Development</strong> environment displays detailed information about the error that occurred.
+            </p>
+            <p>
+                <strong>The Development environment shouldn't be enabled for deployed applications.</strong>
+                It can result in displaying sensitive information from exceptions to end users.
+                For local debugging, enable the <strong>Development</strong> environment by setting the <strong>ASPNETCORE_ENVIRONMENT</strong> environment variable to <strong>Development</strong>
+                and restarting the app.
+            </p>
+        </div>
+    </div>
+</body>
+
+</html>

Toolbar/Custom Toolbar/EBook Reader/CustomToolbar/Pages/Error.cshtml.cs

@@ -0,0 +1,27 @@
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.RazorPages;
+using System.Diagnostics;
+
+namespace CustomToolbar.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;
+        }
+    }
+}

Toolbar/Custom Toolbar/EBook Reader/CustomToolbar/Pages/Example.razor

@@ -0,0 +1,89 @@
+@page "/example"
+@using Syncfusion.Blazor.SfPdfViewer;
+@using Syncfusion.Blazor.Navigations;
+@using Syncfusion.Blazor.Inputs
+
+
+<SfPdfViewer2 @ref="@Viewer" DocumentPath="@DocumentPath" Height="100%" Width="100%">
+    <PdfViewerToolbarSettings CustomToolbarItems="@CustomToolbarItems" ToolbarItems="null" MobileToolbarItems="null" />
+    <PdfViewerEvents ToolbarClicked="@ClickAction"></PdfViewerEvents>
+</SfPdfViewer2>
+
+@code {
+    private string DocumentPath { get; set; } = "https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf";
+    SfPdfViewer2 Viewer;
+
+    private List<PdfToolbarItem> CustomToolbarItems = new List<PdfToolbarItem>();
+    protected override void OnInitialized()
+    {
+        AddCustomToolbarItems();
+    }
+
+    private void AddCustomToolbarItems()
+    {
+        CustomToolbarItems.Add(new PdfToolbarItem() { Index = 1, Template = GetTemplate("PreviousPage") });
+        CustomToolbarItems.Add(new PdfToolbarItem() { Index = 2, Template = GetTemplate("NextPage") });
+        CustomToolbarItems.Add(new PdfToolbarItem() { Index = 3, Template = GetTemplate("ZoomIn") });
+        CustomToolbarItems.Add(new PdfToolbarItem() { Index = 4, Template = GetTemplate("ZoomOut") });
+        CustomToolbarItems.Add(new PdfToolbarItem() { Index = 5, Template = GetTemplate("TextSearch") });
+    }
+
+    // Get the renderfragment element for the custom toolbaritems in the primary toolbar
+    private RenderFragment GetTemplate(string templatename)
+    {
+        return __builder =>
+        {
+            if (templatename == "PreviousPage")
+            {
+                <ToolbarItem Text="Previous Page" PrefixIcon="e-icons e-chevron-up" TooltipText="Previous Page" Id="previousPage" Align="ItemAlign.Left" CssClass="e-pv-previous-page-navigation-container">
+                </ToolbarItem>
+            }
+            else if (templatename == "NextPage")
+            {
+                <ToolbarItem Text="Next Page" PrefixIcon="e-icons e-chevron-down" TooltipText="Next Page" id="nextPage" Align="ItemAlign.Left" CssClass="e-pv-next-page-navigation-container">
+                </ToolbarItem>
+            }
+            else if (templatename == "ZoomIn")
+            {
+                <ToolbarItem Text="Zoom In" PrefixIcon="e-icons e-circle-add" Id="zoomin" TooltipText="Zoom In" Align="ItemAlign.Left" CssClass="e-pv-zoom-in-container" TabIndex="0">
+                </ToolbarItem>
+            }
+            else if (templatename == "ZoomOut")
+            {
+                <ToolbarItem Text="Zoom Out" PrefixIcon="e-icons e-circle-remove" Id="zoomout" TooltipText="Zoom Out" Align="ItemAlign.Left" CssClass="e-pv-zoom-out-container" TabIndex="0">
+                </ToolbarItem>
+            }
+            else if (templatename == "TextSearch")
+            {
+                <ToolbarItem Text="Text Search" PrefixIcon="e-pv-text-search-icon e-pv-icon" TooltipText="Text Search" Id="textsearch" Align="ItemAlign.Right" CssClass="e-pv-text-search-container" TabIndex="0">
+                </ToolbarItem>
+            }
+        };
+    }
+    // Click for the custom toolbaritems in the primary toolbar
+    private async void ClickAction(ClickEventArgs Item)
+    {
+        if (Item.Item.Id == "previousPage")
+        {
+            await Viewer.GoToPreviousPageAsync();
+        }
+        else if (Item.Item.Id == "nextPage")
+        {
+            await Viewer.GoToNextPageAsync();
+        }
+
+        else if (Item.Item.Id == "zoomin")
+        {
+            await Viewer.ZoomInAsync();
+        }
+        else if (Item.Item.Id == "zoomout")
+        {
+            await Viewer.ZoomOutAsync();
+        }
+    }
+
+}
+
+<style>
+
+</style>