Note that you will need a Keycloak server along with a client id for the domain you are running this html on.
You can find the documentation of these activities in the [esign activities documentation](https://gitlab.tugraz.at/dbp/esign/signature/-/tree/master/src).
#### Attributes
## Adapt app
-`lang` (optional, default: `de`): set to `de` or `en` for German or English
### Functionality
- example `lang="de"`
-`entry-point-url` (optional, default is the TU Graz entry point url): entry point url to access the api
You can add multiple attributes to the `<dbp-signature>` tag.
- example `entry-point-url="https://api-dev.tugraz.at"`
-`auth` object: you need to set that object property for the auth token
| attribute name | value | Link to description |
- example auth property: `{token: "THE_BEARER_TOKEN"}`
|----------------|-------| ------------|
- note: most often this should be an attribute that is not set directly, but subscribed at a provider
-`lang` (optional, default: `de`): set to `de` or `en` for German or English
- example `lang="de"`
#### Slots
You use templates tags to inject slots into the activity.
These templates will be converted to div containers when the page is loaded and will not show up before that.
##### additional-information
The content of this slot will be shown below the other text and can be used to provide
further information about the verification process. For example a link to a page with
more information about verifying a document with Adobe Reader can be provided.
Example:
```html
<dbp-signature-verificationlang="de">
<templateslot="additional-information">
<dbp-translatedsubscribe="lang">
<divslot="de">
<atarget="_blank"href="#german-link">
Weitere Information zur Verifikation mit Adobe Reader
</a>
</div>
<divslot="en">
<atarget="_blank"href="#english-link">
More information about verification with Adobe Reader
</a>
</div>
</dbp-translated>
</template>
</dbp-signature-verification>
```
## "dbp-signature" Slots
These are common slots for the appshell. You can find the documentation of these slot in the `README.md` of the appshell webcomponent.
## Design Notes
To ensure a uniform and responsive design the activity should occupy 100% of the window width
when the activity width is less than 768 px.
## Mandatory attributes
If you are not using the `provider-root` attribute to "terminate" all provider attributes
If you are not using the `provider-root` attribute to "terminate" all provider attributes
you need to manually add these attributes so that the topic will work properly:
you need to manually add these attributes so that the topic will work properly:
```html
```html
<dbp-signature
<dbp-signature
auth
auth
requested-login-status
requested-login-status
analytics-event
analytics-event
initial-file-handling-state
initial-file-handling-state
clipboard-files
clipboard-files
>
>
</dbp-signature>
</dbp-signature>
```
```
### Design
For frontend design customizations, such as logo, colors, font, favicon, and more, take a look at the [theming documentation](https://dbp-demo.tugraz.at/dev-guide/frontend/theming/).
## "dbp-signature" slots
These are common slots for the app-shell. You can find the documentation of these slots in the [app-shell documentation](https://gitlab.tugraz.at/dbp/web-components/toolkit/-/tree/master/packages/app-shell).
For the app specific slots take a look at the [esign activities documentation](https://gitlab.tugraz.at/dbp/esign/signature/-/tree/master/src).
Here you can find the individual activities of the `esign` app. If you want to use the whole app look at [esign](https://gitlab.tugraz.at/dbp/esign/signature).
<!-- ## Usage of an activity
TODO add description how to only use an activity alone here
-->
## Activities
### Shared Attributes
These attributes are available for all activities listed here:
-`lang` (optional, default: `de`): set to `de` or `en` for German or English
- example `lang="de"`
### dbp-qualified-signature-pdf-upload
You can use this activity to qualifiedly sign PDF documents like this:
