├── .gitattributes ├── .eslintignore ├── api ├── example.api.json ├── dev.api.json └── prod.api.json ├── Screenshots └── Figure1.png ├── src ├── assets │ ├── rdf_flyer.png │ ├── rdf_flyer_32.png │ ├── rdf_flyer_old.png │ └── rdf_flyer_32_old.png ├── background.html ├── store.js ├── components │ └── SearchBox │ │ ├── OntologyData │ │ ├── ontologies.js │ │ ├── tree.js │ │ ├── mock.js │ │ └── categories.js │ │ ├── table │ │ ├── template │ │ │ └── normal-filter.js │ │ ├── TableTemplate.js │ │ └── TableOptions.js │ │ └── SearchBox.vue ├── manifest.json ├── background.js ├── App.vue ├── main.js ├── css │ └── loader.css └── loader.js ├── bin └── load-into-chrome ├── .babelrc ├── test ├── unit │ ├── coverage │ │ ├── lcov-report │ │ │ ├── sort-arrow-sprite.png │ │ │ ├── prettify.css │ │ │ ├── SearchBox │ │ │ │ ├── OntologyData │ │ │ │ │ ├── ontologies.js.html │ │ │ │ │ ├── tree.js.html │ │ │ │ │ └── index.html │ │ │ │ ├── index.html │ │ │ │ └── SearchBox.vue.html │ │ │ ├── index.html │ │ │ ├── sorter.js │ │ │ ├── base.css │ │ │ └── prettify.js │ │ └── lcov.info │ ├── .eslintrc │ ├── specs │ │ └── SearchBox.spec.js │ ├── index.js │ └── karma.conf.js └── e2e │ ├── reports │ └── CHROME_83.0.4103.97_MAC_test.xml │ ├── specs │ └── test.js │ ├── custom-assertions │ └── elementCount.js │ ├── runner.js │ └── nightwatch.conf.js ├── Chrome Store Assets ├── Ontoclick Chrome Store Icon 128x128.png ├── Ontoclick Chrome Store Logo 440x280.png ├── Ontoclick Chrome Store Logo 920x680.png └── Ontoclick Chrome Store Marquee Tile 1400x560.png ├── config ├── test.env.js ├── dev.env.js ├── prod.env.js └── index.js ├── .gitignore ├── .editorconfig ├── index.html ├── .eslintrc.js ├── .github └── workflows │ └── main.yml ├── selenium-debug.log ├── package.json ├── README.md └── LICENSE /.gitattributes: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | build/*.js 2 | config/*.js 3 | -------------------------------------------------------------------------------- /api/example.api.json: -------------------------------------------------------------------------------- 1 | { 2 | "key": "EXAMPLE_API_KEY_123" 3 | } 4 | -------------------------------------------------------------------------------- /api/dev.api.json: -------------------------------------------------------------------------------- 1 | { 2 | "key": "fae307aa-db9d-43be-8f9d-1c04444ad4d4" 3 | } 4 | -------------------------------------------------------------------------------- /Screenshots/Figure1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azankl/Ontoclick/HEAD/Screenshots/Figure1.png -------------------------------------------------------------------------------- /src/assets/rdf_flyer.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azankl/Ontoclick/HEAD/src/assets/rdf_flyer.png -------------------------------------------------------------------------------- /src/assets/rdf_flyer_32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azankl/Ontoclick/HEAD/src/assets/rdf_flyer_32.png -------------------------------------------------------------------------------- /src/assets/rdf_flyer_old.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azankl/Ontoclick/HEAD/src/assets/rdf_flyer_old.png -------------------------------------------------------------------------------- /bin/load-into-chrome: -------------------------------------------------------------------------------- 1 | open -a "Google Chrome" --args --load-extension=$(pwd)/dist/ --app=chrome://extensions 2 | -------------------------------------------------------------------------------- /src/assets/rdf_flyer_32_old.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azankl/Ontoclick/HEAD/src/assets/rdf_flyer_32_old.png -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["es2015", "stage-2"], 3 | "plugins": ["transform-runtime"], 4 | "comments": false 5 | } 6 | -------------------------------------------------------------------------------- /api/prod.api.json: -------------------------------------------------------------------------------- 1 | { 2 | "ncbo_key": "fae307aa-db9d-43be-8f9d-1c04444ad4d4", 3 | "pryzm_key": "3156e102-4add-4098-926f-74fb1e49d38c" 4 | } 5 | 6 | -------------------------------------------------------------------------------- /test/unit/coverage/lcov-report/sort-arrow-sprite.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azankl/Ontoclick/HEAD/test/unit/coverage/lcov-report/sort-arrow-sprite.png -------------------------------------------------------------------------------- /test/unit/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "mocha": true 4 | }, 5 | "globals": { 6 | "expect": true, 7 | "sinon": true 8 | } 9 | } -------------------------------------------------------------------------------- /Chrome Store Assets/Ontoclick Chrome Store Icon 128x128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azankl/Ontoclick/HEAD/Chrome Store Assets/Ontoclick Chrome Store Icon 128x128.png -------------------------------------------------------------------------------- /Chrome Store Assets/Ontoclick Chrome Store Logo 440x280.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azankl/Ontoclick/HEAD/Chrome Store Assets/Ontoclick Chrome Store Logo 440x280.png -------------------------------------------------------------------------------- /Chrome Store Assets/Ontoclick Chrome Store Logo 920x680.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azankl/Ontoclick/HEAD/Chrome Store Assets/Ontoclick Chrome Store Logo 920x680.png -------------------------------------------------------------------------------- /config/test.env.js: -------------------------------------------------------------------------------- 1 | var merge = require('webpack-merge') 2 | var devEnv = require('./dev.env') 3 | 4 | module.exports = merge(devEnv, { 5 | NODE_ENV: '"testing"' 6 | }) 7 | -------------------------------------------------------------------------------- /src/background.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
4 | 5 || 1 47 | 2 48 | 3 49 | 4 50 | 5 51 | 6 52 | 7 | 53 | 54 | 55 | 56 | 57 | 58 | | export default [{
59 | "acronym": "HP",
60 | "name": "Human Phenotype Ontology",
61 | "categories": ["Health", "Phenotype", "Human"]
62 | }]
63 |
64 | |
| File | 54 |55 | | Statements | 56 |57 | | Branches | 58 |59 | | Functions | 60 |61 | | Lines | 62 |63 | |
|---|---|---|---|---|---|---|---|---|---|
| SearchBox.vue | 67 |55.56% | 69 |15/27 | 70 |70% | 71 |7/10 | 72 |33.33% | 73 |2/6 | 74 |45.45% | 75 |10/22 | 76 |
| File | 54 |55 | | Statements | 56 |57 | | Branches | 58 |59 | | Functions | 60 |61 | | Lines | 62 |63 | |
|---|---|---|---|---|---|---|---|---|---|
| SearchBox/ | 67 |55.56% | 69 |15/27 | 70 |70% | 71 |7/10 | 72 |33.33% | 73 |2/6 | 74 |45.45% | 75 |10/22 | 76 ||
| SearchBox/OntologyData/ | 80 |100% | 82 |45/45 | 83 |88.89% | 84 |16/18 | 85 |100% | 86 |6/6 | 87 |100% | 88 |40/40 | 89 |
| 1 51 | 2 52 | 3 53 | 4 54 | 5 55 | 6 56 | 7 57 | 8 58 | 9 59 | 10 60 | 11 61 | 12 62 | 13 63 | 14 64 | 15 65 | 16 66 | 17 67 | 18 68 | 19 69 | 20 70 | 21 71 | 22 72 | 23 73 | 24 74 | 25 75 | 26 76 | 27 | 1× 77 | 78 | 79 | 80 | 1× 81 | 82 | 1× 83 | 84 | 1× 85 | 1× 86 | 3× 87 | 3× 88 | 3× 89 | 90 | 91 | 92 | 93 | 3× 94 | 3× 95 | 96 | 97 | 98 | 99 | 1× 100 | 1× 101 | 102 | | import {
103 | categoryRoots,
104 | categoryMap
105 | } from './categories';
106 | import ontologies from './ontologies';
107 |
108 | let ontologyMap = {};
109 |
110 | ontologies.forEach(function(element) {
111 | element.categories.forEach(function(category) {
112 | Eif (categoryMap[category]) {
113 | categoryMap[category].children = categoryMap[category].children || []
114 | let ontology = {
115 | id: element.acronym,
116 | label: element.acronym + ': ' + element.name,
117 | type: 'ontology'
118 | }
119 | categoryMap[category].children.push(ontology)
120 | ontologyMap[element.acronym] = ontology
121 | }
122 | })
123 | })
124 |
125 | export const options = categoryRoots;
126 | export const ontologyByAcronym = ontologyMap;
127 |
128 | |
| File | 54 |55 | | Statements | 56 |57 | | Branches | 58 |59 | | Functions | 60 |61 | | Lines | 62 |63 | |
|---|---|---|---|---|---|---|---|---|---|
| categories.js | 67 |100% | 69 |26/26 | 70 |90% | 71 |9/10 | 72 |100% | 73 |3/3 | 74 |100% | 75 |26/26 | 76 ||
| ontologies.js | 80 |100% | 82 |2/2 | 83 |100% | 84 |0/0 | 85 |100% | 86 |0/0 | 87 |100% | 88 |1/1 | 89 ||
| tree.js | 93 |100% | 95 |17/17 | 96 |87.5% | 97 |7/8 | 98 |100% | 99 |3/3 | 100 |100% | 101 |13/13 | 102 |
20 |
21 | ### Publication
22 |
23 | *Ontoclick: a web browser extension to facilitate biomedical knowledge curation*\
24 | [BioRxiv](https://www.biorxiv.org/content/10.1101/2021.03.04.433993v2) or [Bioinformatics (Oxford University Press)](https://doi.org/10.1093/bioinformatics/btab520)
25 |
26 | ### Acknowledgements
27 |
28 | Ontoclick was born at [Health Hack Sydney](https://speakerdeck.com/azankl/ontoclick-pitch-healthhack-2017) in November 2017. Many thanks to Team Ontoclick, in particular Graham Towse from [LivingryLabs](https://www.livingrylabs.net/) for developing the first prototype. Many thanks to Anthony Xu, Yifei (Frank) Luo, Aravind Venkateswaran, and Lianguizi (Alisa) Zhou, for further improving this prototype.
29 |
30 | ### Install for Chrome
31 |
32 | Ontoclick is available on the Chrome Store [here](https://chrome.google.com/webstore/detail/ontoclick/nepbilmonlfaigoeldkbimkeihligbgf).
33 |
34 | ### Install for Firefox
35 |
36 | Ontoclick is available as a Firefox Add-On [here](https://addons.mozilla.org/en-US/firefox/addon/ontoclick/)
37 |
38 | ### How to Use the Extension
39 |
40 | 1. Visit a web page in your browser
41 | 2. Highlight the text you want to search for, right-click to show the browser context menu and select Ontoclick from the context menu.
42 | 3. The Ontoclick popup opens and displays matching ontology terms from the Human Phenotype Ontology.
43 | 4. Click on the '+' icon in front of a term to see more information about the term (if available).
44 | 5. Hover over a term to see additional icons:
45 | - click the 'copy' icon next to the Ontology ID to copy the Ontology ID
46 | - click the 'copy' icon next to the Label to copy the Ontology Label
47 | - click the 'copy' icon in the 'Actions' column to copy the Ontology ID _and_ the Label
48 | - click the 'highlighter' icon in the 'Actions' column to copy the highlighted text _and_ the Ontology ID _and_ the Label.
49 | - click the 'disk' icon in the 'Actions' column to save the highlighted text, Ontology ID and Label to Ontoclick's history list. The number in the right upper corner of the Ontoclick window shows the number of items saved to the history list. Click the 'download' icon to download the history list as a .CSV file. Click the 'eraser' icon to erase the history list.
50 | 6. If no suitable terms are retrieved, click on the triangle next to 'NCBO Bioportal Search' to re-run the search with a different concept recogniser. The result window will update immediately with the new results. The different concept recognisers all have their strengths and weaknesses, try different ones to see what gives the best results.
51 | 7. Click on the triangle next to 'Human Phenotype Ontology' to select another (or additional) ontologies. This only works when 'NCBO Bioportal Search' or 'NCBO Bioportal Annotator' are selected.
52 | 8. The Ontoclick Popup can also be launched without selecting any text:
53 | - right-click anywhere in the browser window and select Ontoclick from the context menu that appears
54 | - click the Ontoclick icon in the browser toolbar
55 | - in both cases, you can now type your search term into the Ontoclick Search bar
56 | - Please note: the history list function is not available when launching the Ontoclick popup from the toolbar icon
57 |
58 | ### Install From Source
59 |
60 | **Build Prerequisites**
61 |
62 | * [Yarn](https://yarnpkg.com/en/docs/install)
63 |
64 | ``` bash
65 | # install dependencies
66 | yarn install
67 |
68 | # build for production with minification
69 | yarn run build
70 |
71 | # To install, follow these steps:
72 | Go to Chrome:
73 | 1. Visit chrome://extensions
74 | 2. Enable developer options
75 | 3. Click 'Load unpacked extension...'
76 | 4. Select the ontoclick/dist/ folder
77 | ```
78 |
79 |
80 | ### Development Setup
81 |
82 | ``` bash
83 | # install dependencies
84 | yarn install
85 |
86 | # get your BioPortal REST API key from https://bioportal.bioontology.org/account
87 | open https://bioportal.bioontology.org/account
88 |
89 | # add your API key for development builds
90 | cp api/example.api.json api/dev.api.json
91 | open api/dev.api.json
92 |
93 | # add your API key for production builds
94 | cp api/example.api.json api/prod.api.json
95 | open api/prod.api.json
96 |
97 | # serve with hot reload at localhost:8080
98 | yarn run dev
99 |
100 | # build for production with minification
101 | yarn run build
102 |
103 | # run unit tests
104 | yarn run unit
105 |
106 | # run e2e tests
107 | yarn run e2e
108 |
109 | # run all tests
110 | yarn test
111 | ```
112 |
--------------------------------------------------------------------------------
/test/unit/coverage/lcov-report/base.css:
--------------------------------------------------------------------------------
1 | body, html {
2 | margin:0; padding: 0;
3 | height: 100%;
4 | }
5 | body {
6 | font-family: Helvetica Neue, Helvetica, Arial;
7 | font-size: 14px;
8 | color:#333;
9 | }
10 | .small { font-size: 12px; }
11 | *, *:after, *:before {
12 | -webkit-box-sizing:border-box;
13 | -moz-box-sizing:border-box;
14 | box-sizing:border-box;
15 | }
16 | h1 { font-size: 20px; margin: 0;}
17 | h2 { font-size: 14px; }
18 | pre {
19 | font: 12px/1.4 Consolas, "Liberation Mono", Menlo, Courier, monospace;
20 | margin: 0;
21 | padding: 0;
22 | -moz-tab-size: 2;
23 | -o-tab-size: 2;
24 | tab-size: 2;
25 | }
26 | a { color:#0074D9; text-decoration:none; }
27 | a:hover { text-decoration:underline; }
28 | .strong { font-weight: bold; }
29 | .space-top1 { padding: 10px 0 0 0; }
30 | .pad2y { padding: 20px 0; }
31 | .pad1y { padding: 10px 0; }
32 | .pad2x { padding: 0 20px; }
33 | .pad2 { padding: 20px; }
34 | .pad1 { padding: 10px; }
35 | .space-left2 { padding-left:55px; }
36 | .space-right2 { padding-right:20px; }
37 | .center { text-align:center; }
38 | .clearfix { display:block; }
39 | .clearfix:after {
40 | content:'';
41 | display:block;
42 | height:0;
43 | clear:both;
44 | visibility:hidden;
45 | }
46 | .fl { float: left; }
47 | @media only screen and (max-width:640px) {
48 | .col3 { width:100%; max-width:100%; }
49 | .hide-mobile { display:none!important; }
50 | }
51 |
52 | .quiet {
53 | color: #7f7f7f;
54 | color: rgba(0,0,0,0.5);
55 | }
56 | .quiet a { opacity: 0.7; }
57 |
58 | .fraction {
59 | font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace;
60 | font-size: 10px;
61 | color: #555;
62 | background: #E8E8E8;
63 | padding: 4px 5px;
64 | border-radius: 3px;
65 | vertical-align: middle;
66 | }
67 |
68 | div.path a:link, div.path a:visited { color: #333; }
69 | table.coverage {
70 | border-collapse: collapse;
71 | margin: 10px 0 0 0;
72 | padding: 0;
73 | }
74 |
75 | table.coverage td {
76 | margin: 0;
77 | padding: 0;
78 | vertical-align: top;
79 | }
80 | table.coverage td.line-count {
81 | text-align: right;
82 | padding: 0 5px 0 20px;
83 | }
84 | table.coverage td.line-coverage {
85 | text-align: right;
86 | padding-right: 10px;
87 | min-width:20px;
88 | }
89 |
90 | table.coverage td span.cline-any {
91 | display: inline-block;
92 | padding: 0 5px;
93 | width: 100%;
94 | }
95 | .missing-if-branch {
96 | display: inline-block;
97 | margin-right: 5px;
98 | border-radius: 3px;
99 | position: relative;
100 | padding: 0 4px;
101 | background: #333;
102 | color: yellow;
103 | }
104 |
105 | .skip-if-branch {
106 | display: none;
107 | margin-right: 10px;
108 | position: relative;
109 | padding: 0 4px;
110 | background: #ccc;
111 | color: white;
112 | }
113 | .missing-if-branch .typ, .skip-if-branch .typ {
114 | color: inherit !important;
115 | }
116 | .coverage-summary {
117 | border-collapse: collapse;
118 | width: 100%;
119 | }
120 | .coverage-summary tr { border-bottom: 1px solid #bbb; }
121 | .keyline-all { border: 1px solid #ddd; }
122 | .coverage-summary td, .coverage-summary th { padding: 10px; }
123 | .coverage-summary tbody { border: 1px solid #bbb; }
124 | .coverage-summary td { border-right: 1px solid #bbb; }
125 | .coverage-summary td:last-child { border-right: none; }
126 | .coverage-summary th {
127 | text-align: left;
128 | font-weight: normal;
129 | white-space: nowrap;
130 | }
131 | .coverage-summary th.file { border-right: none !important; }
132 | .coverage-summary th.pct { }
133 | .coverage-summary th.pic,
134 | .coverage-summary th.abs,
135 | .coverage-summary td.pct,
136 | .coverage-summary td.abs { text-align: right; }
137 | .coverage-summary td.file { white-space: nowrap; }
138 | .coverage-summary td.pic { min-width: 120px !important; }
139 | .coverage-summary tfoot td { }
140 |
141 | .coverage-summary .sorter {
142 | height: 10px;
143 | width: 7px;
144 | display: inline-block;
145 | margin-left: 0.5em;
146 | background: url(sort-arrow-sprite.png) no-repeat scroll 0 0 transparent;
147 | }
148 | .coverage-summary .sorted .sorter {
149 | background-position: 0 -20px;
150 | }
151 | .coverage-summary .sorted-desc .sorter {
152 | background-position: 0 -10px;
153 | }
154 | .status-line { height: 10px; }
155 | /* dark red */
156 | .red.solid, .status-line.low, .low .cover-fill { background:#C21F39 }
157 | .low .chart { border:1px solid #C21F39 }
158 | /* medium red */
159 | .cstat-no, .fstat-no, .cbranch-no, .cbranch-no { background:#F6C6CE }
160 | /* light red */
161 | .low, .cline-no { background:#FCE1E5 }
162 | /* light green */
163 | .high, .cline-yes { background:rgb(230,245,208) }
164 | /* medium green */
165 | .cstat-yes { background:rgb(161,215,106) }
166 | /* dark green */
167 | .status-line.high, .high .cover-fill { background:rgb(77,146,33) }
168 | .high .chart { border:1px solid rgb(77,146,33) }
169 | /* dark yellow (gold) */
170 | .medium .chart { border:1px solid #f9cd0b; }
171 | .status-line.medium, .medium .cover-fill { background: #f9cd0b; }
172 | /* light yellow */
173 | .medium { background: #fff4c2; }
174 | /* light gray */
175 | span.cline-neutral { background: #eaeaea; }
176 |
177 | .cbranch-no { background: yellow !important; color: #111; }
178 |
179 | .cstat-skip { background: #ddd; color: #111; }
180 | .fstat-skip { background: #ddd; color: #111 !important; }
181 | .cbranch-skip { background: #ddd !important; color: #111; }
182 |
183 |
184 | .cover-fill, .cover-empty {
185 | display:inline-block;
186 | height: 12px;
187 | }
188 | .chart {
189 | line-height: 0;
190 | }
191 | .cover-empty {
192 | background: white;
193 | }
194 | .cover-full {
195 | border-right: none !important;
196 | }
197 | pre.prettyprint {
198 | border: none !important;
199 | padding: 0 !important;
200 | margin: 0 !important;
201 | }
202 | .com { color: #999 !important; }
203 | .ignore-none { color: #999; font-weight: normal; }
204 |
205 | .wrapper {
206 | min-height: 100%;
207 | height: auto !important;
208 | height: 100%;
209 | margin: 0 auto -48px;
210 | }
211 | .footer, .push {
212 | height: 48px;
213 | }
214 |
--------------------------------------------------------------------------------
/test/unit/coverage/lcov-report/SearchBox/SearchBox.vue.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | | 1 51 | 2 52 | 3 53 | 4 54 | 5 55 | 6 56 | 7 57 | 8 58 | 9 59 | 10 60 | 11 61 | 12 62 | 13 63 | 14 64 | 15 65 | 16 66 | 17 67 | 18 68 | 19 69 | 20 70 | 21 71 | 22 72 | 23 73 | 24 74 | 25 75 | 26 76 | 27 77 | 28 78 | 29 79 | 30 80 | 31 81 | 32 82 | 33 83 | 34 84 | 35 85 | 36 86 | 37 87 | 38 88 | 39 89 | 40 90 | 41 91 | 42 92 | 43 93 | 44 94 | 45 95 | 46 96 | 47 97 | 48 98 | 49 99 | 50 100 | 51 101 | 52 102 | 53 103 | 54 104 | 55 105 | 56 106 | 57 107 | 58 108 | 59 109 | 60 110 | 61 111 | 62 112 | 63 113 | 64 114 | 65 115 | 66 116 | 67 117 | 68 118 | 69 119 | 70 120 | 71 121 | 72 122 | 73 123 | 74 124 | 75 125 | 76 126 | 77 127 | 78 128 | 79 129 | 80 130 | 81 131 | 82 132 | 83 133 | 84 134 | 85 135 | 86 136 | 87 137 | 88 138 | 89 139 | 90 140 | 91 141 | 92 142 | 93 143 | 94 144 | 95 145 | 96 146 | 97 147 | 98 148 | 99 149 | 100 150 | 101 | 151 | 152 | 153 | 154 | 155 | 156 | 157 | 158 | 159 | 160 | 161 | 162 | 163 | 164 | 165 | 166 | 167 | 168 | 169 | 170 | 171 | 172 | 173 | 174 | 175 | 176 | 177 | 178 | 179 | 180 | 1× 181 | 1× 182 | 183 | 184 | 185 | 1× 186 | 187 | 1× 188 | 189 | 190 | 191 | 192 | 193 | 194 | 195 | 196 | 197 | 198 | 199 | 200 | 201 | 202 | 203 | 204 | 1× 205 | 1× 206 | 1× 207 | 1× 208 | 1× 209 | 210 | 211 | 212 | 213 | 214 | 215 | 216 | 217 | 218 | 219 | 220 | 221 | 222 | 223 | 224 | 225 | 226 | 227 | 228 | 229 | 230 | 231 | 232 | 233 | 234 | 235 | 236 | 237 | 238 | 239 | 240 | 241 | 242 | 243 | 244 | 245 | 246 | 247 | 248 | 249 | 250 | | //
251 | //
252 | //
253 | //
254 | //
255 | //
256 | //
257 | //
258 | //
259 | //
260 | //
261 | //
262 | //
263 | //
264 | //
265 | //
266 | //
267 | //
268 | //
269 | //
270 | //
271 | //
272 | //
273 | //
274 | //
275 | //
276 | //
277 | //
278 | //
279 |
280 | import Treeselect from '@riophae/vue-treeselect'
281 | import {
282 | options,
283 | ontologyByAcronym
284 | } from './OntologyData/tree'
285 | import ontologies from './OntologyData/ontologies'
286 |
287 | function copyElementContent(srcElementId) {
288 | let srcElement = document.getElementById(srcElementId)
289 | var range = document.createRange();
290 | range.selectNodeContents(srcElement);
291 | let selection = document.getSelection();
292 | selection.removeAllRanges();
293 | selection.addRange(range);
294 | document.execCommand('Copy');
295 | selection.removeAllRanges();
296 | }
297 |
298 | export default {
299 | name: 'search-box',
300 | components: {
301 | Treeselect
302 | },
303 | data() {
304 | let query = document.location.search.match(/query=([^&]*)/)
305 | let ontology = document.location.search.match(/ontology=(.*)/)
306 | query = query ? unescape(query[1]) : undefined
307 | ontology = ontology ? unescape(ontology[1]) : undefined
308 | return {
309 | loading: true,
310 | url: 'https://data.bioontology.org/search',
311 | columns: ['notation', 'prefLabel' /*, 'Actions'*/ ],
312 | options: {
313 | initFilters: {
314 | 'GENERIC': query
315 | },
316 | sortable: [],
317 | perPage: 5,
318 | pagination: {
319 | chunk: 3
320 | },
321 | texts: {
322 | filterPlaceholder: 'Query'
323 | },
324 | skin: 'table table-hover'
325 | },
326 | query: query,
327 | ontologyValue: ontology ? [ontology] : [],
328 | ontologyOptions: options,
329 | results: [],
330 | request: null
331 | }
332 | },
333 | methods: {
334 | copyContent(srcElementId) {
335 | copyElementContent(srcElementId);
336 | window.parent.postMessage({
337 | type: 'copied'
338 | }, "*")
339 | },
340 | replaceWithContent(srcElementId) {
341 | copyElementContent(srcElementId);
342 | window.parent.postMessage({
343 | type: 'copied-paste'
344 | }, "*")
345 | },
346 | copyModel(model) {}
347 | }
348 | }
349 |
350 | |