Skip to content

Commit 3c0bd84

Browse files
lossyroblossyrob
authored
Merge pull request #47 from lossyrob/feature/rde/collection-assets
Add collection assets and summaries
2 parents cb72d81 + d4d7f1a commit 3c0bd84

File tree

11 files changed

+5366
-1537
lines changed

11 files changed

+5366
-1537
lines changed

‎package-lock.json

Lines changed: 4811 additions & 1108 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@
3838
"spdx-license-ids": "^3.0.5",
3939
"spdx-to-html": "^0.3.2",
4040
"v-clipboard": "^2.2.2",
41-
"vue": "^2.6.10",
41+
"vue": "^2.6.12",
4242
"vue-async-computed": "^3.7.0",
4343
"vue-hot-reload-api": "^2.3.4",
4444
"vue-meta": "^2.2.2",
@@ -60,7 +60,7 @@
6060
"git-exec-and-restage": "^1.1.1",
6161
"husky": "^3.0.5",
6262
"lint-staged": "^9.3.0",
63-
"netlify-cli": "^2.15.0",
63+
"netlify-cli": "^2.53.0",
6464
"parcel-bundler": "^1.12.3",
6565
"prettier": "^1.18.2",
6666
"vue-template-compiler": "^2.6.10"

‎src/components/AssetTab.vue

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
<template>
2+
<b-tab
3+
title="Assets"
4+
:active="active"
5+
key="assets"
6+
>
7+
<div class="table-responsive assets">
8+
<table class="table table-striped">
9+
<thead>
10+
<tr>
11+
<th>Name</th>
12+
<th v-if="hasBands > 0">Band(s)</th>
13+
<th>Roles</th>
14+
<th>Content-Type</th>
15+
</tr>
16+
</thead>
17+
<tbody>
18+
<tr v-for="asset in assets" :key="asset.key">
19+
<td>
20+
<!-- eslint-disable-next-line vue/max-attributes-per-line vue/no-v-html -->
21+
<a
22+
:href="asset.href"
23+
:title="asset.key"
24+
v-html="asset.label"
25+
/>
26+
</td>
27+
<td v-if="hasBands">{{ asset.bandNames }}</td>
28+
<td>
29+
<code>{{ asset.roleNames }}</code>
30+
</td>
31+
<td>
32+
<code>{{ asset.type }}</code>
33+
</td>
34+
</tr>
35+
</tbody>
36+
</table>
37+
</div>
38+
</b-tab>
39+
</template>
40+
41+
<script>
42+
43+
export default {
44+
name: "AssetTab",
45+
props: ["assets", "bands", "active", "hasBands"]
46+
};
47+
48+
</script>

‎src/components/Catalog.vue

Lines changed: 35 additions & 79 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
<b-alert v-if="errored" variant="danger" show>
44
<p>{{ _entity.message }}</p>
55
<p>Please note that some servers don't allow external access via web browsers (e.g., when CORS headers are not present).</p>
6+
<p>Errored URL: {{ url }}</p>
67
<p><a href="#" @click="$router.go(-1)">Go back</a></p>
78
</b-alert>
89
<b-spinner v-else-if="!loaded" label="Loading..."></b-spinner>
@@ -124,6 +125,13 @@
124125
striped
125126
/>
126127
</b-tab>
128+
<AssetTab
129+
v-if="visibleTabs.includes('assets')"
130+
:assets="assets"
131+
:bands="bands"
132+
:hasBands="hasBands"
133+
:active="false"
134+
></AssetTab>
127135
</b-tabs>
128136
</b-col>
129137
<b-col
@@ -132,79 +140,15 @@
132140
>
133141
<b-card bg-variant="light">
134142
<div v-if="spatialExtent" id="locator-map" />
135-
<div class="table-responsive metadata">
136-
<table class="table">
137-
<tbody>
138-
<tr>
139-
<td class="group" colspan="2">
140-
<h4>Metadata</h4>
141-
</td>
142-
</tr>
143-
<tr>
144-
<td class="title">STAC Version</td>
145-
<td>{{ stacVersion }}</td>
146-
</tr>
147-
<tr v-if="keywords">
148-
<td class="title">Keywords</td>
149-
<td>{{ keywords }}</td>
150-
</tr>
151-
<tr v-if="license">
152-
<td class="title">License</td>
153-
<!-- eslint-disable-next-line vue/no-v-html -->
154-
<td v-html="license" />
155-
</tr>
156-
<tr v-if="temporalExtent">
157-
<td class="title">Temporal Extent</td>
158-
<td>{{ temporalExtent }}</td>
159-
</tr>
160-
<template v-for="(props, ext) in propertyList">
161-
<tr v-if="ext" :key="ext">
162-
<td class="group" colspan="2">
163-
<h4>{{ ext }}</h4>
164-
</td>
165-
</tr>
166-
<tr v-for="prop in props" :key="prop.key">
167-
<td class="title">
168-
<!-- eslint-disable-next-line vue/no-v-html -->
169-
<span :title="prop.key" v-html="prop.label" />
170-
</td>
171-
<!-- eslint-disable-next-line vue/no-v-html -->
172-
<td v-html="prop.value" />
173-
</tr>
174-
</template>
175-
<template v-if="providers">
176-
<tr>
177-
<td colspan="2" class="group">
178-
<h4>
179-
<template v-if="providers.length === 1">
180-
Provider
181-
</template>
182-
<template v-if="providers.length !== 1">
183-
Providers
184-
</template>
185-
</h4>
186-
</td>
187-
</tr>
188-
<template v-for="(provider, index) in providers">
189-
<tr :key="provider.url + index">
190-
<td colspan="2" class="provider">
191-
<a :href="provider.url">{{ provider.name }}</a>
192-
<em v-if="provider.roles"
193-
>({{(Array.isArray(provider.roles) ? provider.roles : []).join(", ") }})</em
194-
>
195-
<!-- eslint-disable-next-line vue/no-v-html vue/max-attributes-per-line -->
196-
<div
197-
v-if="provider.description"
198-
class="description"
199-
v-html="provider.description"
200-
/>
201-
</td>
202-
</tr>
203-
</template>
204-
</template>
205-
</tbody>
206-
</table>
207-
</div>
143+
<MetadataSidebar
144+
:properties="properties"
145+
:summaries="summaries"
146+
:stacVersion="stacVersion"
147+
:keywords="keywords"
148+
:license="license"
149+
:temporalExtent="temporalExtent"
150+
:providers="providers"
151+
/>
208152
</b-card>
209153
</b-col>
210154
</b-row>
@@ -227,6 +171,10 @@ import Leaflet from "leaflet";
227171
import { mapActions, mapGetters } from "vuex";
228172
229173
import common from "./common";
174+
import AssetTab from './AssetTab.vue'
175+
import MetadataSidebar from './MetadataSidebar.vue'
176+
177+
import { transformCatalog } from "../migrate"
230178
231179
const ITEMS_PER_PAGE = 25;
232180
@@ -259,6 +207,7 @@ export default {
259207
required: true
260208
}
261209
},
210+
components: { AssetTab, MetadataSidebar },
262211
data() {
263212
return {
264213
externalItemCount: 0,
@@ -359,6 +308,9 @@ export default {
359308
computed: {
360309
...common.computed,
361310
...mapGetters(["getEntity"]),
311+
_entity() {
312+
return transformCatalog(this.getEntity(this.url));
313+
},
362314
_description() {
363315
return this.catalog.description;
364316
},
@@ -595,6 +547,9 @@ export default {
595547
596548
return dataCatalog;
597549
},
550+
properties() {
551+
return this._properties;
552+
},
598553
spatialExtent() {
599554
const { spatial } = this.extent;
600555
@@ -611,9 +566,8 @@ export default {
611566
612567
return bbox;
613568
},
614-
stacVersion() {
615-
// REQUIRED
616-
return this.catalog.stac_version;
569+
summaries() {
570+
return this.catalog.summaries;
617571
},
618572
tabIndex: {
619573
get: function() {
@@ -654,7 +608,9 @@ export default {
654608
return [
655609
this.childCount > 0 && "catalogs",
656610
(this.hasExternalItems || this.itemCount > 0) && "items",
657-
this.bands.length > 0 && "bands"
611+
this.bands.length > 0 && "bands",
612+
this.summaries && "summaries",
613+
this.assets && this.assets.length > 0 && "assets"
658614
].filter(x => x != null && x !== false);
659615
}
660616
},
@@ -771,8 +727,8 @@ export default {
771727
},
772728
syncWithQueryState(qs) {
773729
this.selectedTab = qs.t;
774-
this.currentChildPage = Number(qs.cp) || this.currentChildPage;
775-
this.currentItemPage = Number(qs.ip) || this.currentItemPage;
730+
this.currentChildPage = Number(qs.cp) || 1;
731+
this.currentItemPage = Number(qs.ip) || 1;
776732
777733
// If we have external items, the b-table needs to "stay" on page 1 as
778734
// the items list only contains the number of items we want to show.

0 commit comments

Comments
 (0)