Foxit viewer

Currently avialable in Pims 365 only

Appframe has built in support to view your PDF files using foxit viewer. You can use it as standalone viewer or use markup data-foxit to embed viewer inside another page.

You need to modify web.config and add following extension
mimeMap fileExtension=".brotli" mimeType="application/brotli"

Dependencies:

  1. Assembly: Appframe365.FoxitClientSide - javascript library.
  2. Assembly: Appframe365.FoxitEmbedded - HTTP module which is serving client side library.
  3. Code module: api/foxit - gets pdf document, handles annotation create/edit/delete
  4. Article: foxit - have all neccessery files/code to run foxit viewer.

Emebedded viewer

  • data-foxit="afFoxit" - bind viewer. Important: data object should be pointing to file table and have all file table fields, such as: PrimKey, FileName, FileSize
    • [UserPermission] - optional field. Can be calculated. Available values:
      • author - default value. Only personal annotations can be edited/deleted. Can create new ones.
      • admin - can edit/delete all comments. Can create new ones.
      • none - comments toolbar will be disabled, can view only.
  • data-foxit-comments="dsAnnots" - optional parameter to add annotations data source.

For displaying it will use dsTest.currentRow() data. By default it will not load onCurrentIndexChanged event. To display document you can use afFoxit.loadDocument() method. afFoxit.setLoadOnIndexChanged()true - to load documents onCurrentIndexChanged event

Standalone viewer

Viewer can be loaded with following url: /foxit?articleID={ArticleID}&datasourceID={datasourceID}&id={FileID}&comments={commentsDatasourceID}. Instead of File ID, PrimKey={PrimKey} can be used. comments is optional parameter. If not defined it will show document in read only mode, without any toolbar.

Fields for Foxit comments table/view:

  • [Page] int - index of the page.
  • [Annot] nvarchar - JSON typed annotation data.
  • [AnnotID] navrachar(100) - reference to annotation.

For files relationship with comments datasource use master child binding.

Customizing toolbar

When using embedded viewer you can customize toolbar in your app. You can just copy default toolbarConfig file toolbar-config.bundle.js and add it to your app scripts. When Foxit viewer loads, it will look for your toolbar parent.ToolbarConfig and load it first. Note: use FoxitWebViewer.WebPdf to access viewer instance, cause it is under iframe.

More details about toolbar customization and implementation please refer to foxit documentation here or here.

Converting non pdf files

By default, when foxit requests for a file info and file is not pdf, it will search for converted pdf file ref. If such does not exists it will try to convert it. For bigger files it might take some time.
There are 2 options how files could be pre converted. One is by calling api, for example after file upload /api/foxit/convertArticleFile/articleID/dsObject/{PrimKey or ID}. It will convert 1 file. Other mas converter /api/foxit/convertArticleFiles/articleID/dsObject/ - it will take top 50 files with each size less then 100 mb and do convert.

Public methods

  • loadDocument() - will load or reload document
  • download() - will download pdf document with all annotations, will work only after document loaded event
  • getBlob() - will get pdf document Blob object.
  • reloadAnnots() - will reload annotations from server
  • removeCommentsTab() - will remove comments tab, will work only after document loaded event

Events

  • DOCUMENT_LOADED - will fire after successful document load.
  • ANNOT_ADDED - after annotation is added
  • ANNOT_UPDATED - after annotation is updated
  • ANNOT_DELETED - after annotation is deleted

Annotation events will return Foxit annotation object.

Other notes

Important. Foxit files and comments (if used) table datasources must be added to the article.

System files table stbl_System_Files has field PdfFileRef, if file type is not pdf, viewer will try to load file referenced by this field.