diff --git a/Readme.md b/Readme.md index 5916c703f94072af19583150e30ebb123b220a3f..53606dd9570a9e8b13a3ff5f40c1e41410c46dfd 100644 --- a/Readme.md +++ b/Readme.md @@ -1,2 +1,44 @@ -# Geolinker widget -tbd +# Histhub widget +The histhub widget can display sameas resources from histhub linking services. You can integrate it into your site and display links to other providers. __The widget and the apis are in beta status. They may change in the future.__ +## Webcomponent +The widget itself is a [webc omponent](https://en.wikipedia.org/wiki/Web_Components). It integrates smoothly into an existing website. You just need to add some markup and load a javascript file. +## Integration +Just have a look at the examp,e folder. There you can find a set of working examples. +```html + + + + + + +``` +```html + + +``` +## API +### Endpoint +The endpoint defines the restapi, where the widget makes the call to get the links. Currently we provide three endpoints for different resource types. +* Tagcloud https://api.tagcloud.histhub.ch/v1/sameas/ +* Geolinker https://api.geolinker.histhub.ch/v1/sameas/ +* Geolinker https://api.geolinker.histhub.ch/v1/similarto/ +* Orgalinker https://api.orgalinker.histhub.ch/v1/sameas/ + +Choose one of the endpoint to get links for your resource +### Resolver +The endpoint uses different technologies to generate the links. Those technologies calls resolver. You need to define a resolver to get the links for your preferences. + +__Tagcloud and Orgalinker__ + +For those two services we provide the `resolvermanual` . The links provided by this resolver are done by humans. See examle 1 and example 2 + +__Geolinker__ + +The geolinker provides for the `sameas` endpoint the `resolverneo4j` resolver. The links provided by this resolver are done semiautomatical. See example 3 + +For the `similarto` endpoint the geolinker provides a `elasticsearchresolver`. The data are guessed based on a matching algorithm. See example 4 + +### Location +The location is an optional parameter. By default the widget uses the current window.location.href to make the request. You can specify the url to look for over the url parameter + + diff --git a/examlpe/index.html b/examlpe/index.html index 5a9b70bd822440dcc1dcf9470fe1b0a31f6c95c2..bf94e8c1007786e0e02e314dfc41173258bbb1db 100644 --- a/examlpe/index.html +++ b/examlpe/index.html @@ -2,19 +2,32 @@ - Histhub widget + Example of the histhub widget (beta) + - -

Links from tagcloud

- -
- -

Links from orgalinker

-
- -

Links from orgalinker

-
+
+

Example of the histhub widget (beta)

+

The histhub widget can fetch sameas resources for different resoucrces. It makes a simple http request to one of the backends and gets a list of links from there. It finally renders the links in a list and display them.

+ +

Example 1: Links from tagcloud dodis: Aussenpolitik (allg.)

+
+ +

Example 2: Links from orgalinker dodis: Lombard, Odier & Cie

+
+ +

Example 3: Links (sameas) from geolinker dodis: Diedenhofen

+
+ +

Example 4: Links (similarto) from geolinker dodis: Diedenhofen

+
+
diff --git a/src/histhub-widget.js b/src/histhub-widget.js index a32ede366fae0f6b51e7bc1a022c0ab081446372..e880111b6a25e405daf6f9fe8e46656bab13afac 100644 --- a/src/histhub-widget.js +++ b/src/histhub-widget.js @@ -2,11 +2,12 @@ const template = document.createElement('template'); template.innerHTML = ` @@ -122,10 +123,11 @@ const buildLinks = () => this.links.map((link) => { let anchor = null; let href = null; - + // check f we get an array or an object if (typeof link === "object") { const provider = Object.keys(link)[0]; - if (typeof provider !== "string" && provider !== "") { + // often we do not have information about the provider + if (typeof provider === "string" && provider !== "") { anchor = provider; } else { anchor = link[provider]; @@ -135,6 +137,7 @@ href = link; anchor = link; } + // build the list return `
  • ${anchor}
  • `; }); this._linksSlot.innerHTML = ``;