ViewerCustomSidebar.cs
//
// This code is part of GrapeCity Documents for PDF samples.
// Copyright (c) GrapeCity, Inc. All rights reserved.
//
using System.IO;
using GrapeCity.Documents.Pdf;
using System.Drawing;
using GrapeCity.Documents.Pdf.Annotations;
using GrapeCity.Documents.Pdf.Actions;
using GrapeCity.Documents.Text;

namespace GcPdfWeb.Samples
{
    // This sample demonstrates how to create custom Sidebar panel.
    // In this example, we create a simple sidebar panel which displays the message "Hello <userName>".

    // This and other samples in this section demonstrate the features of GcPdfViewer
    // (a JavaScript PDF viewer control included with GcPdf), mainly the ability
    // to change PDF files (add or edit annotations and AcroForm fields, rotate pages etc.)
    // when the JS viewer on the client is supported by GcPdf running on the server.
    //
    // To enable the editing features of the viewer, its supportApi property must be set
    // to a URL on the server that implements all or some of the edit supporting APIs
    // that are known to/expected by the viewer. This GcPdf demo site provides those APIs,
    // which makes it possible to demonstrate the editing when you open the PDF viewer
    // in this sample. When you download this sample, in addition to the .NET Core
    // console app project that generates the sample PDF, an ASP.NET Core project is
    // also included in the download zip (located in the GcPdfViewerWeb sub-folder of the
    // downloaded zip), which also provides the necessary APIs. In particular, it includes
    // a project that implements the APIs and provides them via a special controller.
    // It is actually the same controller that is used by this GcPdf demo site, and which
    // can be used in any ASP.NET Core site to enable the viewer editing features.
    //
    // Look at the following files in the sample download zip for more info:
    // - GcPdfViewerWeb\SupportApiDemo: the sample ASP.NET Core web site.
    // - GcPdfViewerWeb\SupportApiDemo.sln: solution to build/run the sample web site.
    // - GcPdfViewerWeb\SupportApi: support API implementation (can be used in any site).
    // - GcPdfViewerWeb\SupportApi\Controllers\GcPdfViewerController.cs: support API controller.
    // 
    // Please note that this and other samples in this section are only available in C# at this time.
    //
    public class ViewerCustomSidebar
    {
        public void CreatePDF(Stream stream)
        {
            GcPdfDocument doc = new GcPdfDocument();
            GcPdfGraphics g = doc.NewPage().Graphics;
            g.DrawString("In this example, we create a simple sidebar panel which displays the message \"Hello <userName>\".",
                new TextFormat() { Font = StandardFonts.Times, FontSize = 12 },
                new PointF(72, 72));
            doc.Save(stream);
        }

        // Used by SupportApiDemo to initialize GcPdfViewer.
        public static GcPdfViewerSupportApiDemo.Models.PdfViewerOptions PdfViewerOptions
        {
            get => new GcPdfViewerSupportApiDemo.Models.PdfViewerOptions(
                GcPdfViewerSupportApiDemo.Models.PdfViewerOptions.Options.AnnotationEditorPanel,
                viewerTools: new string[] { "save", "$navigation", "$split", "text-selection", "pan", "$zoom", "$fullscreen", "download", "print", "rotate", "view-mode", "hide-annotations", "doc-properties", "about" },
                annotationEditorTools: new string[] { "edit-select", "$split", "edit-link", "edit-stamp", "$split", "edit-undo", "edit-redo", "save" });
        }

        public const string JS_CODE = @"
var viewer;
var React;
var customPanelHandle;
function createPanelContentElement(userName) {
	// Define function component:
	function PanelContentComponent(props) {
		return React.createElement('div', { style: { margin: '20px' } }, 'Hello ', props.sayHelloToWho);
	}
	// Create react element:
	return React.createElement(PanelContentComponent, { sayHelloToWho: userName });
}
function createSvgIconElement()
{
    return React.createElement('svg', { xmlns: 'http://www.w3.org/2000/svg', version: '1.1', width: '24', height: '24', viewBox: '0 0 24 24', fill: '#ffffff' }, React.createElement('path', { d: 'M12 0c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zM12 21c-4.971 0-9-4.029-9-9s4.029-9 9-9c4.971 0 9 4.029 9 9s-4.029 9-9 9z' }));
}

function createPdfViewer(selector, baseOptions) {
    viewer = new GcPdfViewer(selector, baseOptions || {});
	React = viewer.getType('React');
    customPanelHandle = viewer.createPanel(createPanelContentElement(viewer.currentUserName || 'World'), null, 'CustomPanel',  
        { icon: { type: 'svg', content: createSvgIconElement() },
          label: 'Custom panel', description: 'Custom panel title',
          visible: false, enabled: false } );
// Add 'CustomPanel' to panels layout:
viewer.layoutPanels(['*', 'CustomPanel']);

viewer.onAfterOpen.register(()=>{
    // Enable 'CustomPanel' when needed:
    viewer.updatePanel(customPanelHandle, { visible: true, enabled: true });
    // Open custom panel:
    viewer.leftSidebar.menu.panels.open(customPanelHandle.id);
});

return viewer;
}
";
    }
}