Skip to content

Commit 9341021

Browse files
authored
Merge pull request #233 from contentauth/js-sdk-v2
Add info on new JS library, deprecate old one
2 parents a0cb7d7 + fb53430 commit 9341021

16 files changed

+142
-56
lines changed

.gitignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@
1313
/docs/js-sdk/examples/quickstart/*.ts
1414
/docs/js-sdk/examples/view-manifest/*.ts
1515
/docs/js-sdk/examples/view-manifest/*.html
16+
/docs/c2pa-js/*.md
17+
/docs/c2pa-js/docs/*.md
1618
/docs/c2patool/*.md
1719
/docs/c2patool/docs/*.md
1820
/docs/c2pa-node/*.md

docs/c2pa-js/.gitkeep

Whitespace-only changes.

docs/js-sdk/deprecation-notice.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
:::warning Warning
2+
The legacy JavaScript library is deprecated and the repository has been renamed to [c2pa-js-legacy](https://github.com/contentauth/c2pa-js-legacy). The new JavaScript web library is now in the <https://github.com/contentauth/c2pa-js> repository. The old package will no longer be updated or supported.
3+
4+
If you're starting a new application, use the new library instead.
5+
:::

docs/js-sdk/getting-started/architecture.mdx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,9 @@ hide_table_of_contents: true
55
---
66

77
import { TransformWrapper, TransformComponent } from 'react-zoom-pan-pinch';
8+
import Deprecation from '../deprecation-notice.md';
9+
10+
<Deprecation name="deprecation" />
811

912
:::tip
1013
Zoom in by double-clicking or scrolling with your mouse or trackpad. Move the diagram by clicking and dragging.

docs/js-sdk/getting-started/overview.mdx

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,12 @@
11
---
2-
id: overview
3-
title: JavaScript library
2+
id: old-js-overview
3+
title: Legacy JavaScript library
44
---
55

6+
import Deprecation from '../deprecation-notice.md';
7+
8+
<Deprecation name="deprecation" />
9+
610
The CAI JavaScript library (sometimes referred to as the "JavaScript SDK") enables client JavaScript applications to view and verify [C2PA](https://c2pa.org/) data. It performs only **read** operations on C2PA manifests, unlike the [Rust library](../../rust-sdk/), and the [prerelease libraries](../../other-langs) which can both read and write manifests.
711

812
## What you should already know

docs/js-sdk/getting-started/quick-start.mdx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,9 @@ title: Quick start
55

66
import Tabs from '@theme/Tabs';
77
import TabItem from '@theme/TabItem';
8+
import Deprecation from '../deprecation-notice.md';
9+
10+
<Deprecation name="deprecation" />
811

912
## Prerequisites
1013

docs/js-sdk/guides/examples.md renamed to docs/js-sdk/guides/examples.mdx

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -3,23 +3,27 @@ id: examples
33
title: JavaScript examples
44
---
55

6+
import Deprecation from '../deprecation-notice.md';
7+
8+
<Deprecation name="deprecation" />
9+
610
JavaScript examples are in **[contentauth/c2pa-js-examples](https://github.com/contentauth/c2pa-js-examples)**. The examples are mirrored from the [examples directory in the contentauth/c2pa-js repository](https://github.com/contentauth/c2pa-js/tree/main/examples).
711

812
:::note
913
As noted in the [overview](../getting-started/overview#technologies-that-the-library-uses), the JavaScript library uses a number of modern JavaScript technologies such as WebAssembly (Wasm) and Web Workers. To understand the JavaScript examples, you should be familiar with these technologies, [TypeScript](https://www.typescriptlang.org/) and at least one bundler tool such as [Webpack](https://webpack.js.org/), [Rollup](https://rollupjs.org/), or [Vite](https://vitejs.dev/).
1014
:::
1115

12-
Additionally, the JavaScript examples use TypeScript for type safety.
16+
Additionally, the JavaScript examples use TypeScript for type safety.
1317

1418
## Examples
1519

16-
| Example | Tooling | UI framework | Notes |
17-
|---------|------------------------|--------------|-------|
18-
| [esm-imports](https://github.com/contentauth/c2pa-js/tree/main/examples/esm-imports) | None | None | The simplest example using vanilla JavaScript (ECMAScript).|
19-
| [minimal-ts-webpack](https://github.com/contentauth/c2pa-js/tree/main/examples/minimal-ts-webpack) | [Webpack](https://webpack.js.org/) | None | Uses TypeScript. |
20-
| [minimal-ts-rollup](https://github.com/contentauth/c2pa-js/tree/main/examples/minimal-ts-rollup) | [Rollup](https://rollupjs.org/) | None | Uses TypeScript. |
21-
| [minimal-ts-vite](https://github.com/contentauth/c2pa-js/tree/main/examples/minimal-ts-vite) | [Vite](https://vitejs.dev/)| None | Uses TypeScript.<br/>Includes multiple examples; see [below](#examples-in-minimal-ts-vite). |
22-
| [react-ts-vite](https://github.com/contentauth/c2pa-js/tree/main/examples/react-ts-vite) | [Vite](https://vitejs.dev/) | [React](https://react.dev/) | Uses TypeScript. |
20+
| Example | Tooling | UI framework | Notes |
21+
| -------------------------------------------------------------------------------------------------- | ---------------------------------- | --------------------------- | ------------------------------------------------------------------------------------------- |
22+
| [esm-imports](https://github.com/contentauth/c2pa-js/tree/main/examples/esm-imports) | None | None | The simplest example using vanilla JavaScript (ECMAScript). |
23+
| [minimal-ts-webpack](https://github.com/contentauth/c2pa-js/tree/main/examples/minimal-ts-webpack) | [Webpack](https://webpack.js.org/) | None | Uses TypeScript. |
24+
| [minimal-ts-rollup](https://github.com/contentauth/c2pa-js/tree/main/examples/minimal-ts-rollup) | [Rollup](https://rollupjs.org/) | None | Uses TypeScript. |
25+
| [minimal-ts-vite](https://github.com/contentauth/c2pa-js/tree/main/examples/minimal-ts-vite) | [Vite](https://vitejs.dev/) | None | Uses TypeScript.<br/>Includes multiple examples; see [below](#examples-in-minimal-ts-vite). |
26+
| [react-ts-vite](https://github.com/contentauth/c2pa-js/tree/main/examples/react-ts-vite) | [Vite](https://vitejs.dev/) | [React](https://react.dev/) | Uses TypeScript. |
2327

2428
### Minimal-ts-vite examples
2529

@@ -29,5 +33,4 @@ The `minimal-ts-vite` example directory contains these examples:
2933
- cdn: Illustrates loading the JavaScript library from a content delivery network (CDN).
3034
- check-provenance: Illustrates how to determine whether asset files have provenance.
3135
- quick-start: Dumps the manifest store and active manifest to the JavaScript developer console.
32-
- web-components: Displays a test image with the Content Credentials pin, using c2pa-wc
33-
36+
- web-components: Displays a test image with the Content Credentials pin, using c2pa-wc

docs/js-sdk/guides/hosting.mdx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,10 @@ id: hosting
33
title: Hosting C2PA assets
44
---
55

6+
import Deprecation from '../deprecation-notice.md';
7+
8+
<Deprecation name="deprecation" />
9+
610
## Cross-origin (CORS) support
711

812
Processing images from a URL or DOM selector requires the

docs/js-sdk/guides/selectors.mdx

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,10 @@ id: selectors
33
title: Selectors
44
---
55

6+
import Deprecation from '../deprecation-notice.md';
7+
8+
<Deprecation name="deprecation" />
9+
610
[Selectors](https://github.com/contentauth/c2pa-js/tree/main/packages/c2pa/src/selectors) are convenience functions that return useful data from manifest objects. The selector functions are:
711

812
- [`selectEditsAndActivity`](../../js-sdk/api/c2pa.selecteditsandactivity) - Returns a formatted list of manifest edits and activity.
@@ -42,19 +46,19 @@ The result is an `editsAndActivity` object such as this:
4246
id: 'COLOR_ADJUSTMENTS',
4347
icon: 'https://cai-assertions.adobe.com/icons/color-palette-dark.svg',
4448
label: 'Color adjustments',
45-
description: 'Changed tone, saturation, etc.'
49+
description: 'Changed tone, saturation, etc.',
4650
},
4751
{
4852
id: 'IMPORT',
4953
icon: 'https://cai-assertions.adobe.com/icons/import-dark.svg',
5054
label: 'Imported assets',
51-
description: 'Added images, videos, etc.'
55+
description: 'Added images, videos, etc.',
5256
},
5357
{
5458
id: 'TRANSFORM',
5559
icon: 'https://cai-assertions.adobe.com/icons/group-dark.svg',
5660
label: 'Size and position adjustments',
57-
description: 'Changed size, orientation, direction, or position'
58-
}
59-
]
61+
description: 'Changed size, orientation, direction, or position',
62+
},
63+
];
6064
```

docs/js-sdk/guides/validation.mdx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,10 @@ id: validation
33
title: Validation & errors
44
---
55

6+
import Deprecation from '../deprecation-notice.md';
7+
8+
<Deprecation name="deprecation" />
9+
610
Part of processing an asset involves [validating the manifests](https://c2pa.org/specifications/specifications/1.4/specs/C2PA_Specification.html#_validation) that it contains. During validation, errors can occur in the active manifest and in ingredients.
711

812
## Validation errors in the active manifest

0 commit comments

Comments
 (0)