Getting Started

The viewer can be used as an Angular component. It allows basic internationalization and styling as well as some basic configuration regarding the toolbar.

tip

The jadice web viewer is intended to be used "as-is". If you look for a highly customizable solution to create a viewer specific for your use-case that highly integrates in your existing application take a look at the jadice web toolkit that is the basis for the jadice web viewer which was built exactly for that.

Angular integration

Setup npm

We need to configure npm so that all packages that are scoped with @levigo are retrieved from our Nexus. If you do not already have a user (e.g. from using jadice maven dependencies) please contact us.

npm config set registry https://artifacts.jadice.com/repository/npm-hosted/ --scope=@levigo
npm login --scope=@levigo

Installation

First of all, install the required dependencies:

npm i ngx-scrollbar @ngx-translate/core @levigo/jadice-web-viewer-dist

Usage

app.component.html

<jadice-web-viewer [source]="source"></jadice-web-viewer>

app.component.ts

@Component({
  selector: "app-root",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.scss"],
  imports: [
    WebviewerModule.forRoot()
  ],
  standalone: true
})
export class AppComponent {
  
  source = {uri: "https://whatever.any/pdf.PDF", password: null}
}

Backend

Spring Boot

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.context.annotation.ComponentScan;
import org.springframework.context.annotation.Import;

import com.levigo.jadice.web.server.spring.JWTSpringConfiguration;
import com.levigo.jadice.web.server.spring.SpringPropertiesServerConfiguration;
import com.levigo.jadice.web.server.spring.autoconfig.JWTSpringComponentScan;

@SpringBootApplication
@Import({JWTSpringConfiguration.class, SpringPropertiesServerConfiguration.class, JWTSpringComponentScan.class})
public class JadiceWebViewerApplication {
    public static void main(String[] args) {
        SpringApplication.run(JadiceWebViewerApplication.class, args);
    }
}

Retrieving documents

The jadice web viewer has an URI-based approach to retrieve documents from different endpoints. By default, documents from http/https can be retrieved out-of-the-box. With the UriBasedDocumentDataProvider-interface you can define own URI-schemes and load documents you want to display.

MycompSchemeDocumentDataProvider.java

@UriScheme({"mycomp"})
public class MycompSchemeDocumentDataProvider implements UriBasedDocumentDataProvider {

  @Override
  public void read(Reader reader, UriSource source) throws JadiceException, IOException {
    // Retrieve the document here
  }

  @Override
  public void recover(Reader reader, UriHandle handle) throws RecoverFailedException, JadiceException {
    this.read(reader, new UriSource(handle.getUri()));
  }
}

app.component.ts

@Component({
  selector: "app-root",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.scss"],
  imports: [
    WebviewerModule.forRoot()
  ],
  standalone: true
})
export class AppComponent {
  
  source = {uri: "mycomp://ID12345", password: null}
}

Rect/Vue/TypeScript & others

The jadice web viewer is built with WebComponents that can be integrated in most JavaScript frameworks. Contact us if you need more information.