@uurtech/jdf 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +9 -9
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
# jdf.js
|
|
2
2
|
|
|
3
|
-
[](https://www.npmjs.com/package/
|
|
3
|
+
[](https://www.npmjs.com/package/@uurtech/jdf)
|
|
4
4
|
[](LICENSE)
|
|
5
5
|
|
|
6
6
|
Render [JDF (JSON Document Format)](https://github.com/uurtech/jdf) files in any web page with a single tag. Like PDF.js — but the file you point at is plain JSON, so you can also generate it, diff it, and edit it with any tool.
|
|
7
7
|
|
|
8
8
|
```html
|
|
9
|
-
<link rel="stylesheet" href="https://unpkg.com/
|
|
10
|
-
<script type="module" src="https://unpkg.com/
|
|
9
|
+
<link rel="stylesheet" href="https://unpkg.com/@uurtech/jdf/dist/jdfjs.css">
|
|
10
|
+
<script type="module" src="https://unpkg.com/@uurtech/jdf"></script>
|
|
11
11
|
|
|
12
12
|
<jdf src="/whitepaper.jdf"></jdf>
|
|
13
13
|
```
|
|
@@ -17,13 +17,13 @@ That's the whole thing. Every `<jdf>` tag on the page is detected on load and re
|
|
|
17
17
|
## Install
|
|
18
18
|
|
|
19
19
|
```bash
|
|
20
|
-
npm install
|
|
20
|
+
npm install @uurtech/jdf
|
|
21
21
|
```
|
|
22
22
|
|
|
23
23
|
Or via CDN — no install at all:
|
|
24
24
|
|
|
25
25
|
```html
|
|
26
|
-
<script type="module" src="https://unpkg.com/
|
|
26
|
+
<script type="module" src="https://unpkg.com/@uurtech/jdf"></script>
|
|
27
27
|
```
|
|
28
28
|
|
|
29
29
|
## Usage
|
|
@@ -66,8 +66,8 @@ document.querySelector("jdf").setAttribute("src", "/other.jdf");
|
|
|
66
66
|
For full control, install via npm and call the JS API directly:
|
|
67
67
|
|
|
68
68
|
```js
|
|
69
|
-
import { embed, render, JDFViewer, jdf } from "
|
|
70
|
-
import "
|
|
69
|
+
import { embed, render, JDFViewer, jdf } from "@uurtech/jdf";
|
|
70
|
+
import "@uurtech/jdf/style.css";
|
|
71
71
|
|
|
72
72
|
// 1. Embed by URL into any container
|
|
73
73
|
const v = await embed("#viewer", "/doc.jdf", {
|
|
@@ -84,7 +84,7 @@ v.setZoom(1.5);
|
|
|
84
84
|
v.destroy();
|
|
85
85
|
|
|
86
86
|
// 2. Render an in-memory document (no fetch)
|
|
87
|
-
import type { JdfDocument } from "
|
|
87
|
+
import type { JdfDocument } from "@uurtech/jdf";
|
|
88
88
|
const doc: JdfDocument = {
|
|
89
89
|
$jdf: "1.0.0",
|
|
90
90
|
meta: { title: "Generated", pageSize: "A4" },
|
|
@@ -107,7 +107,7 @@ v3.setDocument(otherDoc); // hot-swap
|
|
|
107
107
|
Auto-init runs on `DOMContentLoaded` and watches the DOM with a `MutationObserver`, so `<jdf>` tags added later are picked up automatically. To trigger a manual scan after a route change:
|
|
108
108
|
|
|
109
109
|
```js
|
|
110
|
-
import { jdf } from "
|
|
110
|
+
import { jdf } from "@uurtech/jdf";
|
|
111
111
|
jdf(); // scan the whole document
|
|
112
112
|
jdf(myContainer); // scan only inside myContainer
|
|
113
113
|
```
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@uurtech/jdf",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.1",
|
|
4
4
|
"description": "Render JDF (JSON Document Format) documents in the browser. Drop-in replacement for embedding PDFs — point at a .jdf file and it appears on the page, fully styled, searchable, with a clickable TOC.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "Ugur Kazdal <ugur@uurtech.com>",
|