Skip to content

Commit deeb27a

Browse files
committed
Fix how autocomplete works for classes and properties, reduce complexity and reduce the amount of queries sent to the endpoint by 2. Bump to 0.1.5
1 parent b34a6cb commit deeb27a

File tree

12 files changed

+332
-165
lines changed

12 files changed

+332
-165
lines changed

README.md

Lines changed: 27 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ The editor retrieves metadata about the endpoint by directly querying the SPARQL
2525

2626
## 🚀 Use
2727

28-
1. Import from CDN
28+
1. Import from a CDN:
2929

3030
```html
3131
<script type="module" src="https://unpkg.com/@sib-swiss/sparql-editor"></script>
@@ -45,26 +45,37 @@ The editor retrieves metadata about the endpoint by directly querying the SPARQL
4545
<sparql-editor endpoint="https://sparql.uniprot.org/sparql/"></sparql-editor>
4646
```
4747

48-
You can customize the number of examples displayed on the main page, buttons color, and provide other HTML elements to be included under the SPARQL examples (e.g. about and links to relevant resources):
49-
50-
```html
51-
<sparql-editor
52-
endpoint="https://www.bgee.org/sparql/"
53-
examples-on-main-page="10"
54-
style="--btn-color: white; --btn-bg-color: #00709b;"
55-
>
56-
<h1>About</h1>
57-
<p>This SPARQL endpoint contains things</p>
58-
</sparql-editor>
59-
```
60-
6148
> [!WARNING]
6249
>
6350
> Metadata are retrieved by a few lightweight queries sent from client-side JavaScript when the editor is initialized, so your SPARQL **endpoint should accept CORS** (either from \*, which is recommended, or just from the URL where the editor is deployed)
6451
52+
### ⚙️ Available attributes
53+
54+
You can customize a few attributes when calling the custom element:
55+
56+
- the URL to the git repository where the query examples for this endpoint are stored (used to inform the user where they can submit a new example query),
57+
- the namespace used when saving a query as example (defaults to the endpoint URL + /.well-known/sparql-examples/ when not specified),
58+
- the number of examples displayed on the main page (defaults to 10),
59+
- buttons color.
60+
61+
You can also provide other HTML elements to be included under the SPARQL examples (e.g. about information and links to relevant resources):
62+
63+
```html
64+
<sparql-editor
65+
endpoint="https://www.bgee.org/sparql/"
66+
examples-repository="https://github.com/sib-swiss/sparql-examples"
67+
examples-namespace="https://sparql.uniprot.org/sparql/.well-known/sparql-examples/"
68+
examples-on-main-page="10"
69+
style="--btn-color: white; --btn-bg-color: #00709b;"
70+
>
71+
<h1>About</h1>
72+
<p>This SPARQL endpoint contains things</p>
73+
</sparql-editor>
74+
```
75+
6576
## 📝 Basic example
6677

67-
No need for a complex project you can integrate SPARQL editor in any HTML page by importing from a CDN.
78+
No need for a complex project you can integrate SPARQL editor in any HTML page by importing from a CDN!
6879

6980
Create a `index.html` file with:
7081

@@ -78,7 +89,7 @@ Create a `index.html` file with:
7889
<meta name="description" content="SPARQL editor demo page" />
7990
<link rel="icon" type="image/png" href="https://upload.wikimedia.org/wikipedia/commons/f/f3/Rdf_logo.svg" />
8091
<!-- Import the module from a CDN -->
81-
<script type="module" src="https://unpkg.com/@sib-swiss/sparql-editor@0.1.4"></script>
92+
<script type="module" src="https://unpkg.com/@sib-swiss/sparql-editor"></script>
8293
</head>
8394

8495
<body>

demo/bgee.html

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,10 @@
1313

1414
<body>
1515
<div>
16-
<sparql-editor endpoint="https://www.bgee.org/sparql/">
16+
<sparql-editor
17+
endpoint="https://www.bgee.org/sparql/"
18+
examples-repository="https://github.com/sib-swiss/sparql-examples"
19+
>
1720
<h4>About</h4>
1821
<p>
1922
Tutorial and documentation:
@@ -29,6 +32,14 @@ <h4>Other SPARQL editors for SIB endpoints</h4>
2932
<li><a href="/sparql-editor/uniprot">UniProt - protein knowledgebase</a></li>
3033
<li><a href="/sparql-editor/bgee">Bgee - gene expression</a></li>
3134
<li><a href="/sparql-editor/oma">OMA - Ortholog MAtrix</a></li>
35+
<li>
36+
<a href="/sparql-editor/swisslipids">SwissLipids - A knowledge resource for lipids and their biology</a>
37+
</li>
38+
<li>
39+
<a href="/sparql-editor/rhea"
40+
>Rhea - expert-curated knowledgebase of chemical and transport reactions of biological interest</a
41+
>
42+
</li>
3243
<li><a href="/sparql-editor/hamap">HAMAP - High-quality Automated and Manual Annotation of Proteins</a></li>
3344
<li><a href="/sparql-editor/dbgi">DBGI - The Digital Botanical Garden Initiative</a></li>
3445
</ul>

demo/dbgi.html

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,12 +13,23 @@
1313

1414
<body>
1515
<div>
16-
<sparql-editor endpoint="https://biosoda.unil.ch/graphdb/repositories/emi-dbgi">
16+
<sparql-editor
17+
endpoint="https://biosoda.unil.ch/graphdb/repositories/emi-dbgi"
18+
examples-repository="https://github.com/sib-swiss/sparql-examples"
19+
>
1720
<h4>Other SPARQL editors for SIB endpoints</h4>
1821
<ul>
1922
<li><a href="/sparql-editor/uniprot">UniProt - protein knowledgebase</a></li>
2023
<li><a href="/sparql-editor/bgee">Bgee - gene expression</a></li>
2124
<li><a href="/sparql-editor/oma">OMA - Ortholog MAtrix</a></li>
25+
<li>
26+
<a href="/sparql-editor/swisslipids">SwissLipids - A knowledge resource for lipids and their biology</a>
27+
</li>
28+
<li>
29+
<a href="/sparql-editor/rhea"
30+
>Rhea - expert-curated knowledgebase of chemical and transport reactions of biological interest</a
31+
>
32+
</li>
2233
<li><a href="/sparql-editor/hamap">HAMAP - High-quality Automated and Manual Annotation of Proteins</a></li>
2334
<li><a href="/sparql-editor/dbgi">DBGI - The Digital Botanical Garden Initiative</a></li>
2435
</ul>

demo/hamap.html

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,12 +13,23 @@
1313

1414
<body>
1515
<div>
16-
<sparql-editor endpoint="https://hamap.expasy.org/sparql/">
16+
<sparql-editor
17+
endpoint="https://hamap.expasy.org/sparql/"
18+
examples-repository="https://github.com/sib-swiss/sparql-examples"
19+
>
1720
<h4>Other SPARQL editors for SIB endpoints</h4>
1821
<ul>
1922
<li><a href="/sparql-editor/uniprot">UniProt - protein knowledgebase</a></li>
2023
<li><a href="/sparql-editor/bgee">Bgee - gene expression</a></li>
2124
<li><a href="/sparql-editor/oma">OMA - Ortholog MAtrix</a></li>
25+
<li>
26+
<a href="/sparql-editor/swisslipids">SwissLipids - A knowledge resource for lipids and their biology</a>
27+
</li>
28+
<li>
29+
<a href="/sparql-editor/rhea"
30+
>Rhea - expert-curated knowledgebase of chemical and transport reactions of biological interest</a
31+
>
32+
</li>
2233
<li><a href="/sparql-editor/hamap">HAMAP - High-quality Automated and Manual Annotation of Proteins</a></li>
2334
<li><a href="/sparql-editor/dbgi">DBGI - The Digital Botanical Garden Initiative</a></li>
2435
</ul>

demo/index.html

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,15 @@
1515
<div>
1616
<h1>SPARQL editors for SIB endpoints</h1>
1717
<ul>
18-
<li><a href="uniprot">UniProt - protein knowledgebase</a></li>
19-
<li><a href="bgee">Bgee - gene expression</a></li>
18+
<li><a href="uniprot">UniProt - Protein knowledgebase</a></li>
19+
<li><a href="bgee">Bgee - Gene expression</a></li>
2020
<li><a href="oma">OMA - Ortholog MAtrix</a></li>
21+
<li><a href="swisslipids">SwissLipids - A knowledge resource for lipids and their biology</a></li>
22+
<li>
23+
<a href="rhea"
24+
>Rhea - expert-curated knowledgebase of chemical and transport reactions of biological interest</a
25+
>
26+
</li>
2127
<li><a href="hamap">HAMAP - High-quality Automated and Manual Annotation of Proteins</a></li>
2228
<li><a href="dbgi">DBGI - The Digital Botanical Garden Initiative</a></li>
2329
</ul>

demo/oma.html

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,10 @@
1313

1414
<body>
1515
<div>
16-
<sparql-editor endpoint="https://sparql.omabrowser.org/sparql/">
16+
<sparql-editor
17+
endpoint="https://sparql.omabrowser.org/sparql/"
18+
examples-repository="https://github.com/sib-swiss/sparql-examples"
19+
>
1720
<h4 class="space-margin space-top">About OMA SPARQL Endpoint</h4>
1821
<p class="query-text space-margin">
1922
The OMA SPARQL endpoint is reachable by using your preferable programming language or SPARQL interface through
@@ -48,6 +51,14 @@ <h4>Other SPARQL editors for SIB endpoints</h4>
4851
<li><a href="/sparql-editor/uniprot">UniProt - protein knowledgebase</a></li>
4952
<li><a href="/sparql-editor/bgee">Bgee - gene expression</a></li>
5053
<li><a href="/sparql-editor/oma">OMA - Ortholog MAtrix</a></li>
54+
<li>
55+
<a href="/sparql-editor/swisslipids">SwissLipids - A knowledge resource for lipids and their biology</a>
56+
</li>
57+
<li>
58+
<a href="/sparql-editor/rhea"
59+
>Rhea - expert-curated knowledgebase of chemical and transport reactions of biological interest</a
60+
>
61+
</li>
5162
<li><a href="/sparql-editor/hamap">HAMAP - High-quality Automated and Manual Annotation of Proteins</a></li>
5263
<li><a href="/sparql-editor/dbgi">DBGI - The Digital Botanical Garden Initiative</a></li>
5364
</ul>

demo/rhea.html

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<title>Rhea SPARQL editor</title>
7+
<meta name="description" content="SPARQL editor for the Rhea endpoint at the SIB" />
8+
<link rel="icon" type="image/png" href="https://upload.wikimedia.org/wikipedia/commons/f/f3/Rdf_logo.svg" />
9+
<link rel="stylesheet" href="styles.css" />
10+
11+
<script type="module" src="https://unpkg.com/@sib-swiss/sparql-editor"></script>
12+
</head>
13+
14+
<body>
15+
<div>
16+
<sparql-editor
17+
endpoint="https://sparql.rhea-db.org/sparql/"
18+
examples-repository="https://github.com/sib-swiss/sparql-examples"
19+
>
20+
<h4>About</h4>
21+
<p>
22+
This SPARQL endpoint contains Rhea reactions data (see
23+
<a href="https://www.rhea-db.org/statistics">statistics</a>), and a snapshot of ChEBI data matching the Rhea
24+
release. It is free to access and supports the SPARQL 1.1 Standard.
25+
</p>
26+
<p>
27+
The query timeout is 45 minutes. All triples are available in the default graph. There are two named graphs:
28+
<a href="http://sparql.rhea-db.org/rhea">Rhea</a> and <a href="http://sparql.rhea-db.org/chebi"> ChEBI</a>.
29+
</p>
30+
<h4>Documentation</h4>
31+
<ol>
32+
<li>
33+
<a href="/.well-known/void">Statistics</a> and
34+
<a href="https://ftp.expasy.org/databases/rhea/rdf/rhea_rdf_documentation.pdf">diagrams</a>
35+
</li>
36+
<li>
37+
<a href="https://github.com/sib-swiss/sparql-training/tree/master/rhea"
38+
>Tutorial on using SPARQL with Rhea</a
39+
>
40+
</li>
41+
<li><a href="/.well-known/sparql-examples/">Example queries</a></li>
42+
<li><a href="https://www.rhea-db.org/statistics">Release data</a></li>
43+
</ol>
44+
45+
<h4>Other SPARQL editors for SIB endpoints</h4>
46+
<ul>
47+
<li><a href="/sparql-editor/uniprot">UniProt - protein knowledgebase</a></li>
48+
<li><a href="/sparql-editor/bgee">Bgee - gene expression</a></li>
49+
<li><a href="/sparql-editor/oma">OMA - Ortholog MAtrix</a></li>
50+
<li>
51+
<a href="/sparql-editor/swisslipids">SwissLipids - A knowledge resource for lipids and their biology</a>
52+
</li>
53+
<li>
54+
<a href="/sparql-editor/rhea"
55+
>Rhea - expert-curated knowledgebase of chemical and transport reactions of biological interest</a
56+
>
57+
</li>
58+
<li><a href="/sparql-editor/hamap">HAMAP - High-quality Automated and Manual Annotation of Proteins</a></li>
59+
<li><a href="/sparql-editor/dbgi">DBGI - The Digital Botanical Garden Initiative</a></li>
60+
</ul>
61+
<p>You can check if an endpoint contains the <a href="/sparql-editor/check">necessary metadata here</a>.</p>
62+
</sparql-editor>
63+
</div>
64+
</body>
65+
</html>

demo/swisslipids.html

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<title>SwissLipids SPARQL editor</title>
7+
<meta name="description" content="SPARQL editor for the SwissLipids endpoint at the SIB" />
8+
<link rel="icon" type="image/png" href="https://upload.wikimedia.org/wikipedia/commons/f/f3/Rdf_logo.svg" />
9+
<link rel="stylesheet" href="styles.css" />
10+
11+
<script type="module" src="https://unpkg.com/@sib-swiss/sparql-editor"></script>
12+
</head>
13+
14+
<body>
15+
<div>
16+
<sparql-editor
17+
endpoint="https://beta.sparql.swisslipids.org/"
18+
examples-repository="https://github.com/sib-swiss/sparql-examples"
19+
>
20+
<h4>About</h4>
21+
<p>
22+
This SPARQL endpoint contains all SwissLipids data. It is free to access and supports the
23+
<a href="http://www.w3.org/TR/sparql11-query/">SPARQL 1.1 Standard</a>.
24+
</p>
25+
<p>
26+
There are 15,271,348 triples in this release (2024_08_30). The query timeout is 45 minutes. All triples are
27+
available in the default graph. There are 3 named graphs.
28+
</p>
29+
<h4>Documentation</h4>
30+
<ol>
31+
<li><a href="/.well-known/void">Statistics and diagrams</a></li>
32+
<li><a href="/.well-known/sparql-examples/">Example queries</a></li>
33+
</ol>
34+
35+
<h4>Other SPARQL editors for SIB endpoints</h4>
36+
<ul>
37+
<li><a href="/sparql-editor/uniprot">UniProt - protein knowledgebase</a></li>
38+
<li><a href="/sparql-editor/bgee">Bgee - gene expression</a></li>
39+
<li><a href="/sparql-editor/oma">OMA - Ortholog MAtrix</a></li>
40+
<li>
41+
<a href="/sparql-editor/swisslipids">SwissLipids - A knowledge resource for lipids and their biology</a>
42+
</li>
43+
<li>
44+
<a href="/sparql-editor/rhea"
45+
>Rhea - expert-curated knowledgebase of chemical and transport reactions of biological interest</a
46+
>
47+
</li>
48+
<li><a href="/sparql-editor/hamap">HAMAP - High-quality Automated and Manual Annotation of Proteins</a></li>
49+
<li><a href="/sparql-editor/dbgi">DBGI - The Digital Botanical Garden Initiative</a></li>
50+
</ul>
51+
<p>You can check if an endpoint contains the <a href="/sparql-editor/check">necessary metadata here</a>.</p>
52+
</sparql-editor>
53+
</div>
54+
</body>
55+
</html>

demo/uniprot.html

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,10 @@
1313

1414
<body>
1515
<div>
16-
<sparql-editor endpoint="https://sparql.uniprot.org/sparql/">
16+
<sparql-editor
17+
endpoint="https://sparql.uniprot.org/sparql/"
18+
examples-repository="https://github.com/sib-swiss/sparql-examples"
19+
>
1720
<h4>About</h4>
1821
<p>
1922
This SPARQL endpoint contains all UniProt data. It is free to access and supports the
@@ -39,6 +42,14 @@ <h4>Other SPARQL editors for SIB endpoints</h4>
3942
<li><a href="/sparql-editor/uniprot">UniProt - protein knowledgebase</a></li>
4043
<li><a href="/sparql-editor/bgee">Bgee - gene expression</a></li>
4144
<li><a href="/sparql-editor/oma">OMA - Ortholog MAtrix</a></li>
45+
<li>
46+
<a href="/sparql-editor/swisslipids">SwissLipids - A knowledge resource for lipids and their biology</a>
47+
</li>
48+
<li>
49+
<a href="/sparql-editor/rhea"
50+
>Rhea - expert-curated knowledgebase of chemical and transport reactions of biological interest</a
51+
>
52+
</li>
4253
<li><a href="/sparql-editor/hamap">HAMAP - High-quality Automated and Manual Annotation of Proteins</a></li>
4354
<li><a href="/sparql-editor/dbgi">DBGI - The Digital Botanical Garden Initiative</a></li>
4455
</ul>

index.html

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,10 @@
1616
<body>
1717
<div>
1818
<!-- UNIPROT -->
19-
<sparql-editor endpoint="https://sparql.uniprot.org/sparql/">
19+
<sparql-editor
20+
endpoint="https://sparql.uniprot.org/sparql/"
21+
examples-repository="https://github.com/sib-swiss/sparql-examples"
22+
>
2023
<h4>About</h4>
2124
<p>
2225
This SPARQL endpoint contains all UniProt data. It is free to access and supports the

0 commit comments

Comments
 (0)