Commit c105aab6 authored by Matija Obreza's avatar Matija Obreza
Browse files

Docs: Updated README and index.html for new Config

parent ef4d3114
......@@ -12,8 +12,8 @@ Add Javascript dependencies to your page:
```html
<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.20/lodash.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded/dist/genesys-deps.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded/dist/genesys-ui.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded@1.0.0-alpha7/dist/genesys-deps.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded@1.0.0-alpha7/dist/genesys-ui.js"></script>
<!-- Optionally use bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" />
```
......@@ -21,26 +21,28 @@ Add Javascript dependencies to your page:
Add a container `<div>` to your HTML page and initialize the Genesys UI with the `<script>`:
```html
<div class="container-fluid mb-5" id="genesys-container"></div>
<script type="text/javascript">
// Embedded Genesys configuration
const genesysConfig = {
apiUrl: 'https://api.sandbox.genesys-pgr.org',
clientId: 'clientid@genesys',
clientKey: 'changeme',
filter: { institute: { code: ['ETH013'] } },
};
// Detect language from query string
const queryLang = document.location.search && document.location.search.substr(1) || undefined;
// Show UI
genesys.showGenesysUI(document.getElementById('genesys-container'), genesysConfig, queryLang);
// Or, to display ONLY "Collection Overview" use:
// genesys.showOverview(document.getElementById('genesys-container'), genesysConfig, queryLang);
</script>
<div class="container-fluid mb-5" id="genesys-container"></div>
<script type="text/javascript">
// Embedded Genesys configuration
const genesysConfig = {
apiUrl: 'https://api.sandbox.genesys-pgr.org', // Genesys API server
clientId: 'clientid@genesys', // Client ID
clientKey: 'changeme', // Client key
filter: {
institute: { code: [ 'ETH013' ] }, // Genesys data filter
},
shoppingCart: {
enabled: true, // Enable shopping cart
}
};
// Show UI
genesys.showGenesysUI(document.getElementById('genesys-container'), genesysConfig);
// Or, to display ONLY "Collection Overview" use:
// genesys.showOverview(document.getElementById('genesys-container'), genesysConfig);
</script>
```
**Note:** Please contact helpdesk@genesys-pgr.org to obtain API keys for use in your environment.
......@@ -57,3 +59,25 @@ to *@geneesys-pgr/ui-embedded*:
|`clientId` | **Required** | Please contact helpdesk@genesys-pgr.org to obtain API keys for use in your environment.<br />The API keys are limited to your website and will not work on a different domain. |
|`clientSecret` | **Required** | Ditto. |
|`filter` |`undefined` | Allows for narrowing the scope of requested accession data from Genesys API. <br />To filter for accessions from your genebank, use: `{ institute: { code: ['XXX000'] } }` with the FAO WIEWS Code of your genebank. Default `undefined` value will return all accessions. |
|`language`|`'en'`| Specify the language of the user interface.<br />Fully supported: `en`<br />Partially supported: `es` |
| `shoppingCart` | `{ ... }` | See *Shopping cart* configuration |
Additional configuration options are described below.
### Shopping cart options
The shopping cart is **disabled by default**. To allow users to add accessions to the cart, access the cart and submit requests for material you must explicity enable it in your configuration:
```
const genesysConfig = {
// Shopping cart enabled
shoppingCart: {
enabled: true,
},
};
```
|Property|Default|Description|
|---|---|---|
|`enabled`|`false`| Toggle Shopping cart functionality |
......@@ -58,23 +58,29 @@
<script src="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded@1.0.0-alpha7/dist/genesys-deps.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded@1.0.0-alpha7/dist/genesys-ui.js"></script>
<script type="text/javascript">
// Detect language from query string
const queryLang = document.location.search && document.location.search.substr(1) || undefined;
// Embedded Genesys configuration
const genesysConfig = {
apiUrl: 'https://api.sandbox.genesys-pgr.org', // Genesys API server
clientId: 'TDlQz.LUmnd6YIOtWr4kjnVEFi@api.sandbox.genesys-pgr.org', // Client ID
clientKey: 'gnE1dPz5CWnbn0IsFvL8iSP1QDxBpmU0', // Client key
filter: { institute: { code: ['COL003', 'BEL084'] } }, // Genesys data filter
filter: {
institute: { code: ['COL003', 'BEL084'] }, // Genesys data filter
},
language: queryLang,
shoppingCart: {
enabled: true,
}
};
// Detect language from query string
const queryLang = document.location.search && document.location.search.substr(1) || undefined;
// Show UI
genesys.showGenesysUI(document.getElementById('genesys-container'), genesysConfig, queryLang);
genesys.showGenesysUI(document.getElementById('genesys-container'), genesysConfig);
// Or, to display ONLY "Collection Overview" use:
// genesys.showOverview(document.getElementById('genesys-container'), genesysConfig, queryLang);
// genesys.showOverview(document.getElementById('genesys-container'), genesysConfig);
</script>
</body>
</html>
\ No newline at end of file
</html>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment