npm.io
1.1.1 • Published 3 years ago

@idocs-kz/widgets

Licence
Version
1.1.1
Deps
3
Size
1.7 MB
Vulns
1
Weekly
0

IDocs Widgets

Language (Язык)

English

Library connector for iDocs widgets. Works as intermediary between website and various widgets of iDocs (right now only one way document signing)

Installation

Use the package manager npm to install iDocs-widget.

npm install --save @idocs-kz/widgets@latest

After installation add bundle.js (path to bundle "node_modules/@idocs-kz/widgets/dist/bundle.js") from package to your scripts.

Methods

signWidget

signWidget(ISignWidgetConfig) - creates sign widget instance with config, and returns it.

ISignWidgetConfig
Parameter Description
apiKey token received from iDocs
filename name of the resulting archive
widgetServerUrl url of the widget
onComplete callback on success, returns File
closeOnComplete to close widget on complete or not
onLicenceError callback on Licence Error.
onCancel callback on canceling / closing widget
open

open(files: File[]) - opens widget with files. Input value is Array of type File

Usage

Angular
Component ts file
import { Component } from '@angular/core';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.scss']
})
export class AppComponent {

    onChange(event: any) {
        const files: File[] = event.target.files;
        
        // getting widgets from window
        const widgets = (window as any).widgets;
        
        // creation of sign widget instance with config
        const widget = new widgets.signWidget({
            apiKey: 'Your Token', // token received from iDocs
            filename: 'result', // name of the resulting archive
            widgetServerUrl: 'https://widget.idocs.kz', // url of the widget
            onComplete: (zipFile: File) => { // callback on completion of signing document
                console.log('completed')
            },

            closeOnComplete: true, // to close widget on complete or not
            onLicenceError: (error: any) => { // callback on Licence Error 
                console.log(error);
            },

            onCancel: () => // callback on canceling / closing widget
                console.log('canceled')
        });
        
        // opening of sign widget iframe
        // File must have type
        // method open(files) takes Array<File[]>
        widget.open(files);
    }

}
Javascript
HTML file

<body>
    <input type="file" multiple id="files" />

    <script src="node_modules/@idocs-kz/widgets/dist/bundle.js"></script>

    <script>
      const files = document.getElementById("files");
      
      files.onchange = function (evt) {
        openSignWidget(evt);
      };

      function openSignWidget(event) {
        const files = event.target.files;
        
        // creation of sign widget instance with config
        const signWidget = new window.widgets.signWidget({
          apiKey: "Your Token", // token received from iDocs
          filename: 'result', // name of the resulting archive 
          closeOnComplete: true, // to close widget on complete or not 
          widgetServerUrl: "https://widget.idocs.kz", // url of the widget 

          onComplete: (zipFile) => { // callback on completion of signing document 
            console.log('completed');
          },
            
          onLicenceError: (error) => console.error(error), // callback on Licence Error 
            
          onCancel: () => console.info("canceled"), // callback on canceling / closing widget 
        });
        
        // opening of sign widget iframe 
        signWidget.open(Array.from(files));
      }
    </script>
  </body>
Component html file
<input type="file" multiple (change)="onChange($event)">

Русский

Соединитель библиотеки для виджетов iDocs. Работает в качестве посредника между веб-сайтом и различными виджетами IDocs (прямо сейчас только односторонняя подпись документов)

Установка

Используйте диспетчер пакетов npm для установки iDocs-widget.

npm install --save @idocs-kz/widgets@latest

После установки добавьте bundle.js (путь к пакету "node_modules/@idocs-kz/widgets/dist/bundle.js") из пакета в ваши скрипты.

Методы

signWidget

signWidget(ISignWidgetConfig) - создает экземпляр виджета подписания с конфигурацией, и возвращает его.

ISignWidgetConfig
Parameter Description
apiKey токен, полученный от IDocs
filename имя результирующего архива
widgetServerUrl url-адрес виджета
onComplete функция обратного вызова по завершении подписания документа, возвращает File
closeOnComplete чтобы закрыть виджет по завершении или нет
onLicenceError функция обратного вызова при ошибке лицензии
onCancel функция обратного вызова при отмене / закрытии виджета
open

open(files: File[]) - открытие виджета подписания c файлами. Входной параметр должен быть Массив типа File

Использование

Angular
Typescript файл компонента
import { Component } from '@angular/core';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.scss']
})
export class AppComponent {

    onChange(event: any) {
        const files: File[] = event.target.files;
        
        // получение виджетов из window
        const widgets = (window as any).widgets;
        
        // создание экземпляра виджета подписания с конфигурацией 
        const widget = new widgets.signWidget({
            apiKey: 'Your Token', // токен, полученный от IDocs 
            filename: 'result', // имя результирующего архива 
            widgetServerUrl: 'https://widget.idocs.kz', // url-адрес виджета 
            closeOnComplete: true, // чтобы закрыть виджет по завершении или нет 
            
            onComplete: (zipFile: File) => { // функция обратного вызова по завершении подписания документа 
                console.log('completed')
            },

            onLicenceError: (error: any) => { // функция обратного вызова при ошибке лицензии 
                console.log(error);
            },

            onCancel: () => // функция обратного вызова при отмене / закрытии виджета 
                console.log('canceled')
        });
        
        // открытие iframe виджета подписания 
        widget.open(files);
    }

}
HTML файл компонента

<input type="file" multiple (change)="onChange($event)">
Javascript
HTML файл

<body>
    <input type="file" multiple id="files" />

    <script src="node_modules/@idocs-kz/widgets/dist/bundle.js"></script>

    <script>
      const files = document.getElementById("files");
      
      files.onchange = function (evt) {
        openSignWidget(evt);
      };

      function openSignWidget(event) {
        const files = event.target.files;
        
        // создание экземпляра виджета подписания с конфигурацией 
        const signWidget = new window.widgets.signWidget({
            apiKey: 'Your Token', // токен, полученный от IDocs 
            filename: 'result', // имя результирующего архива 
            widgetServerUrl: 'https://widget.idocs.kz', // url-адрес виджета 
            closeOnComplete: true, // чтобы закрыть виджет по завершении или нет 

            onComplete: (zipFile) => { // функция обратного вызова по завершении подписания документа 
                console.log('completed')
            },

            onLicenceError: (error) => { // функция обратного вызова при ошибке лицензии 
                console.log(error);
            },

            onCancel: () => // функция обратного вызова при отмене / закрытии виджета 
                    console.log('canceled')
        });
        
        // открытие iframe виджета подписания
        signWidget.open(Array.from(files));
      }
    </script>
  </body>

Keywords