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

Use @edge and @latest in README and demo pages

- @latest does yet have Subset and Dataset support!
parent 4bc91fd4
......@@ -36,7 +36,7 @@ pages:
- rm -rf public
- mkdir -p public
# Copy files
- cp index.html public/
- cp index.html edge.html public/
- find public
artifacts:
paths:
......
......@@ -12,13 +12,13 @@ Explore the demo at https://genesys-pgr.p.gitlab.croptrust.org/ui-embedded/
Add Javascript dependencies to your page:
```html
<script src="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded@1.1.0/dist/genesys-deps.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded@1.1.0/dist/genesys-ui.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>
<!-- Recommended: Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" />
<!-- Genesys UI CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded@1.1.0/dist/genesys-deps.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded/dist/genesys-deps.css" />
```
Add a container `<div>` to your HTML page and initialize the Genesys UI with the `<script>`:
......
<!DOCTYPE html>
<html>
<head>
<title>Embedded Genesys: Development version</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes" />
<meta name="author" content="Genesys Team, helpdesk@genesys-pgr.org" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css"
integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous" />
<!-- Genesys UI CSS-->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded@edge/dist/genesys-deps.css" />
</head>
<body>
<!--[if lt IE 7]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<div class="container">
<div class="jumbotron small">
<h1 class="display-6">Embedded Genesys <code>@edge</code></h1>
<p class="lead">This page demonstrates the development version of <em>Embedded Genesys</em>. You may want
to explore the <a href="index.html" target="genesys-ui-latest">current release</a> instead.<br />
The development release is available as <a
href="https://www.npmjs.com/package/@genesys-pgr/ui-embedded@edge" target="_blank">@genesys-pgr/ui-embedded@edge</a>.</p>
</div>
<ul class="nav">
<li class="nav-item">
<a class="nav-link active" href="#/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#/overview">Overview</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#/cart">Cart</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#/map">Map</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#/subsets">Subsets</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#/datasets">Datasets</a>
</li>
<li class="nav-item">
<a class="nav-link" href="edge.html">EN</a>
</li>
<li class="nav-item">
<a class="nav-link" href="edge.html?es">ES</a>
</li>
<li class="nav-item">
<a class="nav-link" href="edge.html?zh-TW">ZH-TW</a>
</li>
</ul>
</div>
<hr />
<div class="container mb-5" id="genesys-container"></div>
<hr />
<div class="container">
<p>Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque cursus convallis fermentum. Fusce varius,
massa ut dictum tempor, lacus eros eleifend eros, vel fringilla neque lacus sit amet lacus. Pellentesque habitant
morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus condimentum tincidunt dolor at
interdum. Mauris bibendum tellus quis leo finibus tempus. Nunc aliquam a ligula at mattis. Suspendisse tincidunt
felis nec auctor ultrices.</p>
</div>
<script src="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded@edge/dist/genesys-deps.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded@edge/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.genesys-pgr.org', // Genesys API server
clientId: 'dkDK7.rFJGS6CuMhysUcdFHiGi@api.genesys-pgr.org', // Client ID
clientKey: 'YlbHqhm3QqUaEt6nq7C3oMgBXo64WzLr', // Client key
captchaSiteKey: '6LfD6h0UAAAAAOmsQB3tpAtcWsWaggcrb155aDNT', // Public ReCaptcha site key
language: queryLang,
title: 'Alliance genebanks:', // HTML title prefix
filter: {
institute: { code: ['COL003', 'BEL084'] }, // Genesys data filter
},
accession: {
pdci: true, // Show PDCI
subsets: true, // Show list of subsets
datasets: true, // Show list of datasets
},
shoppingCart: {
enabled: true, // Enable shopping cart
},
map: {
height: '500px',
}
};
// Show UI
genesys.showGenesysUI(document.getElementById('genesys-container'), genesysConfig);
// Or, to display ONLY "Collection Overview" use:
// genesys.showOverview(document.getElementById('genesys-container'), genesysConfig);
</script>
</body>
</html>
......@@ -9,7 +9,7 @@
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css"
integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous" />
<!-- Genesys UI CSS-->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded@1.1.0/dist/genesys-deps.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded/dist/genesys-deps.css" />
</head>
<body>
......@@ -22,8 +22,9 @@
<h1 class="display-6">Embedded Genesys</h1>
<p class="lead">This page demonstrates embedding Genesys data for <code>COL003</code> and <code>BEL084</code>
from <a href="https://www.genesys-pgr.org" target="_blank">Genesys</a> in a 3rd-party website.<br />
The current release of the Javascript library is available on <a
href="https://www.npmjs.com/package/@genesys-pgr/ui-embedded">npmjs.com</a>.</p>
The current release of the library is available on <a
href="https://www.npmjs.com/package/@genesys-pgr/ui-embedded" target="_blank">npmjs.com</a></p>
<p class="lead">Try out the <a href="edge.html" target="genesys-ui-edge">current development</a> version!</p>
</div>
<ul class="nav">
<li class="nav-item">
......@@ -38,12 +39,6 @@
<li class="nav-item">
<a class="nav-link" href="#/map">Map</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#/subsets">Subsets</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#/datasets">Datasets</a>
</li>
<li class="nav-item">
<a class="nav-link" href="index.html">EN</a>
</li>
......@@ -66,8 +61,8 @@
felis nec auctor ultrices.</p>
</div>
<script src="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded@1.1.0/dist/genesys-deps.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@genesys-pgr/ui-embedded@1.1.0/dist/genesys-ui.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 type="text/javascript">
// Detect language from query string
const queryLang = document.location.search && document.location.search.substr(1) || undefined;
......
{
"name": "@genesys-pgr/ui-embedded",
"version": "1.2.0-alpha",
"version": "1.2.0-alpha1",
"publishConfig": {
"access": "public"
},
......@@ -30,7 +30,8 @@
"serve": "webpack-dev-server --config config/webpack-development.config.js",
"serve:production": "cross-env NODE_ENV=production NODE_OPTIONS=--max_old_space_size=8192 webpack-dev-server --config config/webpack-production.config.js",
"analyze": "webpack --config config/webpack-analyze.config.js",
"eslint": "eslint . --ext .js,.jsx,.ts,.tsx"
"eslint": "eslint . --ext .js,.jsx,.ts,.tsx",
"publish": "echo yarn build && npm publish --tag edge --dry-run"
},
"resolutions": {
"@types/react": "^16.0.0",
......
Supports Markdown
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