@startinblox/components-ds4go 3.3.1 → 3.3.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +1423 -1903
- package/package.json +1 -1
- package/src/components/modal/ds4go-catalog-modal.ts +14 -561
- package/src/components/solid-dsp-catalog.ts +15 -5
package/package.json
CHANGED
|
@@ -14,8 +14,6 @@ import { customElement, property, state } from "lit/decorators.js";
|
|
|
14
14
|
import { ifDefined } from "lit/directives/if-defined.js";
|
|
15
15
|
import { unsafeHTML } from "lit/directives/unsafe-html.js";
|
|
16
16
|
|
|
17
|
-
export type Ds4goCatalogModalProps = rdf.ValidM18Object;
|
|
18
|
-
|
|
19
17
|
@customElement("ds4go-catalog-modal")
|
|
20
18
|
@localized()
|
|
21
19
|
export class Ds4goCatalogModal extends TemsObjectHandler {
|
|
@@ -23,9 +21,6 @@ export class Ds4goCatalogModal extends TemsObjectHandler {
|
|
|
23
21
|
${unsafeCSS(ModalStyle)}
|
|
24
22
|
`;
|
|
25
23
|
|
|
26
|
-
@property({ attribute: false, type: Object })
|
|
27
|
-
object: Ds4goCatalogModalProps["object"] = { "@id": "" };
|
|
28
|
-
|
|
29
24
|
@property({ attribute: false })
|
|
30
25
|
dspStore?: any;
|
|
31
26
|
|
|
@@ -2175,547 +2170,10 @@ ${JSON.stringify(this.testResult, null, 2)}</pre
|
|
|
2175
2170
|
`;
|
|
2176
2171
|
}
|
|
2177
2172
|
|
|
2178
|
-
_renderModal(): TemplateResultOrSymbol {
|
|
2179
|
-
if (!this.object || !this.object["@type"]) {
|
|
2180
|
-
return nothing;
|
|
2181
|
-
}
|
|
2182
|
-
|
|
2183
|
-
return html`${this.renderTemplateWhenWith(
|
|
2184
|
-
[rdf.RDFTYPE_OBJECT, "images"],
|
|
2185
|
-
this._renderImageArray,
|
|
2186
|
-
)}
|
|
2187
|
-
<div class="modal-box">
|
|
2188
|
-
<div class="modal-content">
|
|
2189
|
-
${this.renderTemplateWhenWith(
|
|
2190
|
-
["providers", rdf.RDFTYPE_OBJECT],
|
|
2191
|
-
() => {
|
|
2192
|
-
return html`<div class="provider-line">
|
|
2193
|
-
${this.object.providers.map(
|
|
2194
|
-
(provider: rdf.Provider) =>
|
|
2195
|
-
html`<div>
|
|
2196
|
-
${this._renderButton(
|
|
2197
|
-
html`<icon-material-symbols-rss-feed-rounded></icon-material-symbols-rss-feed-rounded>`,
|
|
2198
|
-
"sm",
|
|
2199
|
-
provider.name || "",
|
|
2200
|
-
"link-color",
|
|
2201
|
-
)}
|
|
2202
|
-
${this._renderBgImg(
|
|
2203
|
-
provider.image?.url || "",
|
|
2204
|
-
"provider-logo",
|
|
2205
|
-
)}
|
|
2206
|
-
</div>`,
|
|
2207
|
-
)}
|
|
2208
|
-
</div>`;
|
|
2209
|
-
},
|
|
2210
|
-
)}
|
|
2211
|
-
${this.renderTemplateWhenWith(
|
|
2212
|
-
[
|
|
2213
|
-
[
|
|
2214
|
-
rdf.RDFTYPE_PROVIDER,
|
|
2215
|
-
rdf.RDFTYPE_SERVICE,
|
|
2216
|
-
rdf.RDFTYPE_DATAOFFER,
|
|
2217
|
-
],
|
|
2218
|
-
],
|
|
2219
|
-
() => this._renderDivision("h2", this.object.name),
|
|
2220
|
-
)}
|
|
2221
|
-
${this.renderTemplateWhenWith([rdf.RDFTYPE_OBJECT, "title"], () =>
|
|
2222
|
-
this._renderDivision("h2", this.object.title),
|
|
2223
|
-
)}
|
|
2224
|
-
${this.renderTemplateWhenWith(
|
|
2225
|
-
[rdf.RDFTYPE_DATAOFFER],
|
|
2226
|
-
this._renderDataOfferBadgeRow,
|
|
2227
|
-
)}
|
|
2228
|
-
${this.renderTemplateWhenWith(
|
|
2229
|
-
[rdf.RDFTYPE_OBJECT, "keywords"],
|
|
2230
|
-
() =>
|
|
2231
|
-
html`<div class="badges">
|
|
2232
|
-
${this.object.keywords.map((keyword: rdf.NamedResource) =>
|
|
2233
|
-
this._renderBadge("information", keyword.name ?? ""),
|
|
2234
|
-
)}
|
|
2235
|
-
</div>`,
|
|
2236
|
-
)}
|
|
2237
|
-
${this.renderTemplateWhenWith(
|
|
2238
|
-
["description"],
|
|
2239
|
-
this._renderDescription,
|
|
2240
|
-
)}
|
|
2241
|
-
${this.isType(rdf.RDFTYPE_SERVICE)
|
|
2242
|
-
? this._renderServiceSpecificModal()
|
|
2243
|
-
: this._renderColumns(
|
|
2244
|
-
html`${this.renderTemplateWhenWith(
|
|
2245
|
-
[rdf.RDFTYPE_3D_OBJECT],
|
|
2246
|
-
() => {
|
|
2247
|
-
return html`${this.renderTemplateWhenWith(
|
|
2248
|
-
[["categories", "time_period"]],
|
|
2249
|
-
() =>
|
|
2250
|
-
html`<div
|
|
2251
|
-
class="flex flex-row flex-1 align-items-flex-start justify-content-space-between full-width"
|
|
2252
|
-
>
|
|
2253
|
-
${this.renderTemplateWhenWith(
|
|
2254
|
-
["categories[]"],
|
|
2255
|
-
() =>
|
|
2256
|
-
html`<div class="flex-1 half">
|
|
2257
|
-
${this._renderDivision("h3", msg("Category"))}
|
|
2258
|
-
${this._renderCategoryBadgeComponent()}
|
|
2259
|
-
</div>`,
|
|
2260
|
-
)}
|
|
2261
|
-
${this.renderTemplateWhenWith(["time_period"], () => {
|
|
2262
|
-
return html`<div class="flex-1 half">
|
|
2263
|
-
${this._renderDivision("h3", msg("Time period"))}
|
|
2264
|
-
<div class="badges">
|
|
2265
|
-
${this._renderBadge(
|
|
2266
|
-
"information",
|
|
2267
|
-
this.object.time_period,
|
|
2268
|
-
)}
|
|
2269
|
-
<div></div>
|
|
2270
|
-
</div>
|
|
2271
|
-
</div>`;
|
|
2272
|
-
})}
|
|
2273
|
-
</div>`,
|
|
2274
|
-
)}
|
|
2275
|
-
${this.renderTemplateWhenWith(
|
|
2276
|
-
[["country", "location"]],
|
|
2277
|
-
() =>
|
|
2278
|
-
html`<div
|
|
2279
|
-
class="flex flex-row flex-1 align-items-flex-start justify-content-space-between full-width"
|
|
2280
|
-
>
|
|
2281
|
-
${this.renderTemplateWhenWith(["country"], () => {
|
|
2282
|
-
return html`<div class="flex-1 half">
|
|
2283
|
-
${this._renderDivision("h3", msg("Country"))}
|
|
2284
|
-
${this._renderDivision(
|
|
2285
|
-
"body-m",
|
|
2286
|
-
this.object.country,
|
|
2287
|
-
)}
|
|
2288
|
-
</div>`;
|
|
2289
|
-
})}
|
|
2290
|
-
${this.renderTemplateWhenWith(["location"], () => {
|
|
2291
|
-
return html`<div class="flex-1 half">
|
|
2292
|
-
${this._renderDivision("h3", msg("Location"))}
|
|
2293
|
-
${this._renderDivision(
|
|
2294
|
-
"body-m",
|
|
2295
|
-
`${this.object.location?.address} ${this.object.location?.city} ${this.object.location?.state}`,
|
|
2296
|
-
)}
|
|
2297
|
-
</div>`;
|
|
2298
|
-
})}
|
|
2299
|
-
</div>`,
|
|
2300
|
-
)}
|
|
2301
|
-
${this.renderTemplateWhenWith(
|
|
2302
|
-
["actual_representation"],
|
|
2303
|
-
() => {
|
|
2304
|
-
return html`<div class="flex flex-1 flex-column">
|
|
2305
|
-
${this._renderDivision(
|
|
2306
|
-
"h3",
|
|
2307
|
-
msg("Actual representation"),
|
|
2308
|
-
)}
|
|
2309
|
-
${this._renderDivision(
|
|
2310
|
-
"body-m",
|
|
2311
|
-
this.object.actual_representation,
|
|
2312
|
-
)}
|
|
2313
|
-
</div>`;
|
|
2314
|
-
},
|
|
2315
|
-
)}
|
|
2316
|
-
${this.renderTemplateWhenWith(
|
|
2317
|
-
[
|
|
2318
|
-
[
|
|
2319
|
-
"format",
|
|
2320
|
-
"file_size",
|
|
2321
|
-
"year",
|
|
2322
|
-
"texture",
|
|
2323
|
-
"texture_formats",
|
|
2324
|
-
"texture_resolution",
|
|
2325
|
-
"is_low_polygons",
|
|
2326
|
-
"polygons",
|
|
2327
|
-
"ai",
|
|
2328
|
-
"allow_ai",
|
|
2329
|
-
],
|
|
2330
|
-
],
|
|
2331
|
-
() => {
|
|
2332
|
-
return html`<div
|
|
2333
|
-
class="metadata-section flex flex-column flex-1 align-items-flex-start justify-content-space-between"
|
|
2334
|
-
>
|
|
2335
|
-
${this._renderDivision("h2", msg("Technical"))}
|
|
2336
|
-
${this.renderTemplateWhenWith(
|
|
2337
|
-
[["format", "file_size"]],
|
|
2338
|
-
() => {
|
|
2339
|
-
return html`<div
|
|
2340
|
-
class="flex flex-row flex-1 align-items-flex-start justify-content-space-between full-width"
|
|
2341
|
-
>
|
|
2342
|
-
${this.renderTemplateWhenWith(
|
|
2343
|
-
["format"],
|
|
2344
|
-
() =>
|
|
2345
|
-
html`<div class="half">
|
|
2346
|
-
${this._renderTitleValueDivision(
|
|
2347
|
-
msg("Format file"),
|
|
2348
|
-
this.object.format.name,
|
|
2349
|
-
)}
|
|
2350
|
-
</div>`,
|
|
2351
|
-
)}${this.renderTemplateWhenWith(
|
|
2352
|
-
["file_size"],
|
|
2353
|
-
() =>
|
|
2354
|
-
html`<div class="half">
|
|
2355
|
-
${this._renderTitleValueDivision(
|
|
2356
|
-
msg("File size"),
|
|
2357
|
-
this.object.file_size,
|
|
2358
|
-
)}
|
|
2359
|
-
</div>`,
|
|
2360
|
-
)}
|
|
2361
|
-
</div>`;
|
|
2362
|
-
},
|
|
2363
|
-
)}
|
|
2364
|
-
${this.renderTemplateWhenWith(["year"], () => {
|
|
2365
|
-
return html`<div class="flex flex-1 flex-column">
|
|
2366
|
-
${this._renderTitleValueDivision(
|
|
2367
|
-
msg("Year of creation"),
|
|
2368
|
-
this.object.year,
|
|
2369
|
-
)}
|
|
2370
|
-
</div>`;
|
|
2371
|
-
})}
|
|
2372
|
-
${this.renderTemplateWhenWith(["texture"], () => {
|
|
2373
|
-
return html`<div class="flex flex-1 flex-column">
|
|
2374
|
-
${this._renderTitleValueDivision(
|
|
2375
|
-
msg("Texture"),
|
|
2376
|
-
this.object.texture,
|
|
2377
|
-
)}
|
|
2378
|
-
</div>`;
|
|
2379
|
-
})}
|
|
2380
|
-
${this.renderTemplateWhenWith(
|
|
2381
|
-
["texture_formats"],
|
|
2382
|
-
() => {
|
|
2383
|
-
return html`<div class="flex flex-1 flex-column">
|
|
2384
|
-
${this._renderTitleValueDivision(
|
|
2385
|
-
msg("Texture formats"),
|
|
2386
|
-
this.object.texture_formats,
|
|
2387
|
-
)}
|
|
2388
|
-
</div>`;
|
|
2389
|
-
},
|
|
2390
|
-
)}
|
|
2391
|
-
${this.renderTemplateWhenWith(
|
|
2392
|
-
["texture_resolution"],
|
|
2393
|
-
() => {
|
|
2394
|
-
return html`<div class="flex flex-1 flex-column">
|
|
2395
|
-
${this._renderTitleValueDivision(
|
|
2396
|
-
msg("Texture resolution"),
|
|
2397
|
-
this.object.texture_resolution,
|
|
2398
|
-
)}
|
|
2399
|
-
</div>`;
|
|
2400
|
-
},
|
|
2401
|
-
)}
|
|
2402
|
-
<div class="flex flex-1 flex-column">
|
|
2403
|
-
${this._renderDivision("h4", msg("Low-poly"))}
|
|
2404
|
-
${this._renderBoolean(this.object.is_low_polygons)}
|
|
2405
|
-
</div>
|
|
2406
|
-
<div
|
|
2407
|
-
class="flex flex-row flex-1 align-items-flex-start justify-content-space-between full-width"
|
|
2408
|
-
>
|
|
2409
|
-
<div class="flex flex-column half">
|
|
2410
|
-
${this._renderDivision("h4", msg("AI-generated"))}
|
|
2411
|
-
${this._renderBoolean(this.object.ai)}
|
|
2412
|
-
</div>
|
|
2413
|
-
<div class="flex flex-column half">
|
|
2414
|
-
${this._renderDivision(
|
|
2415
|
-
"h4",
|
|
2416
|
-
msg("Allowed for AI"),
|
|
2417
|
-
)}
|
|
2418
|
-
${this._renderBoolean(this.object.allow_ai)}
|
|
2419
|
-
</div>
|
|
2420
|
-
</div>
|
|
2421
|
-
</div>`;
|
|
2422
|
-
},
|
|
2423
|
-
)}
|
|
2424
|
-
${this.renderTemplateWhenWith(
|
|
2425
|
-
[["prices", "rights_holder", "creator", "licenses"]],
|
|
2426
|
-
() => {
|
|
2427
|
-
return html`<div
|
|
2428
|
-
class="metadata-section flex flex-column flex-1 align-items-flex-start justify-content-space-between"
|
|
2429
|
-
>
|
|
2430
|
-
${this._renderDivision("h2", msg("Informations"))}
|
|
2431
|
-
${this.renderTemplateWhenWith(["prices"], () =>
|
|
2432
|
-
this._renderTitleValueDivision(
|
|
2433
|
-
msg("Prices"),
|
|
2434
|
-
this.object.prices,
|
|
2435
|
-
),
|
|
2436
|
-
)}
|
|
2437
|
-
${this.renderTemplateWhenWith(["rights_holder"], () =>
|
|
2438
|
-
this._renderTitleValueDivision(
|
|
2439
|
-
msg("Rights holder"),
|
|
2440
|
-
this.object.rights_holder,
|
|
2441
|
-
),
|
|
2442
|
-
)}
|
|
2443
|
-
${this.renderTemplateWhenWith(["creator"], () =>
|
|
2444
|
-
this._renderTitleValueDivision(
|
|
2445
|
-
msg("Creator"),
|
|
2446
|
-
this.object.creator,
|
|
2447
|
-
),
|
|
2448
|
-
)}
|
|
2449
|
-
${this.renderTemplateWhenWith(
|
|
2450
|
-
["licences"],
|
|
2451
|
-
this._renderLicences,
|
|
2452
|
-
)}
|
|
2453
|
-
</div>`;
|
|
2454
|
-
},
|
|
2455
|
-
)}
|
|
2456
|
-
${this.renderTemplateWhenWith([["providers"]], () => {
|
|
2457
|
-
if (this.object.providers.length === 0) {
|
|
2458
|
-
return nothing;
|
|
2459
|
-
}
|
|
2460
|
-
return html`<div
|
|
2461
|
-
class="metadata-section flex flex-column flex-1 align-items-flex-start justify-content-space-between"
|
|
2462
|
-
>
|
|
2463
|
-
${this._renderDivision(
|
|
2464
|
-
"h2",
|
|
2465
|
-
this.object.providers.length === 1
|
|
2466
|
-
? msg("Provider")
|
|
2467
|
-
: msg("Providers"),
|
|
2468
|
-
)}
|
|
2469
|
-
${this.object.providers.map(
|
|
2470
|
-
(provider: rdf.Provider) => {
|
|
2471
|
-
const serviceNames: string[] = [];
|
|
2472
|
-
if (provider.services) {
|
|
2473
|
-
provider.services.map((service: rdf.Service) => {
|
|
2474
|
-
if (service.name)
|
|
2475
|
-
serviceNames.push(service.name);
|
|
2476
|
-
});
|
|
2477
|
-
}
|
|
2478
|
-
return html`<div class="flex flex-column metadata-provider">
|
|
2479
|
-
<div class="flex flex-row flex-1 align-items-flex-start justify-content-space-between full-width">
|
|
2480
|
-
${
|
|
2481
|
-
provider.image?.url
|
|
2482
|
-
? html`<img
|
|
2483
|
-
src="${provider.image.url}"
|
|
2484
|
-
alt=${provider.name}
|
|
2485
|
-
class="default-img"
|
|
2486
|
-
/>`
|
|
2487
|
-
: nothing
|
|
2488
|
-
}
|
|
2489
|
-
<div class="flex flex-column flex-1">
|
|
2490
|
-
${this._renderDivision(
|
|
2491
|
-
"h4",
|
|
2492
|
-
msg("Provider information"),
|
|
2493
|
-
)}
|
|
2494
|
-
${this._renderDivision(
|
|
2495
|
-
"body-m",
|
|
2496
|
-
provider.name ?? "",
|
|
2497
|
-
)}
|
|
2498
|
-
</div>
|
|
2499
|
-
</div>
|
|
2500
|
-
${
|
|
2501
|
-
serviceNames.length !== 0
|
|
2502
|
-
? html`${this._renderDivision(
|
|
2503
|
-
"h4",
|
|
2504
|
-
this.object.providers.length === 1
|
|
2505
|
-
? msg("Service provided")
|
|
2506
|
-
: msg("Services provided"),
|
|
2507
|
-
)}
|
|
2508
|
-
${this._renderDivision(
|
|
2509
|
-
"body-m",
|
|
2510
|
-
this.object.providers.length === 1
|
|
2511
|
-
? serviceNames.toString()
|
|
2512
|
-
: serviceNames.join(", "),
|
|
2513
|
-
)}`
|
|
2514
|
-
: nothing
|
|
2515
|
-
}${
|
|
2516
|
-
provider.contact_url
|
|
2517
|
-
? html`<div class="flex flex-column flex-1">
|
|
2518
|
-
${this._renderDivision(
|
|
2519
|
-
"h4",
|
|
2520
|
-
msg("Contact details"),
|
|
2521
|
-
)}
|
|
2522
|
-
${this._renderDivision(
|
|
2523
|
-
"body-m",
|
|
2524
|
-
provider.contact_url,
|
|
2525
|
-
)}
|
|
2526
|
-
</div>`
|
|
2527
|
-
: nothing
|
|
2528
|
-
}
|
|
2529
|
-
</div>
|
|
2530
|
-
</div>`;
|
|
2531
|
-
},
|
|
2532
|
-
)}
|
|
2533
|
-
</div>`;
|
|
2534
|
-
})}`;
|
|
2535
|
-
},
|
|
2536
|
-
)}${this.renderTemplateWhenWith(
|
|
2537
|
-
[rdf.RDFTYPE_MEDIA_OBJECT, "language"],
|
|
2538
|
-
() =>
|
|
2539
|
-
this._renderTitleValueDivision(
|
|
2540
|
-
msg("Language"),
|
|
2541
|
-
this.object.language.name,
|
|
2542
|
-
),
|
|
2543
|
-
)}${this.renderTemplateWhenWith(
|
|
2544
|
-
[rdf.RDFTYPE_MEDIA_OBJECT, "creation_date"],
|
|
2545
|
-
() =>
|
|
2546
|
-
this._renderTitleValueDivision(
|
|
2547
|
-
msg("Published Date"),
|
|
2548
|
-
formatDate(this.object.creation_date),
|
|
2549
|
-
),
|
|
2550
|
-
)}${this.renderTemplateWhenWith(
|
|
2551
|
-
[rdf.RDFTYPE_MEDIA_OBJECT, "update_date"],
|
|
2552
|
-
() =>
|
|
2553
|
-
this._renderTitleValueDivision(
|
|
2554
|
-
msg("Update Date"),
|
|
2555
|
-
formatDate(this.object.update_date),
|
|
2556
|
-
),
|
|
2557
|
-
)}${this.renderTemplateWhenWith(
|
|
2558
|
-
[rdf.RDFTYPE_MEDIA_OBJECT, "licences"],
|
|
2559
|
-
this._renderLicences,
|
|
2560
|
-
)}${this.renderTemplateWhenWith(
|
|
2561
|
-
[rdf.RDFTYPE_MEDIA_OBJECT, "location"],
|
|
2562
|
-
() =>
|
|
2563
|
-
this._renderTitleValueDivision(
|
|
2564
|
-
msg("Location"),
|
|
2565
|
-
`${
|
|
2566
|
-
this.object.location?.address
|
|
2567
|
-
? `${this.object.location.address}, `
|
|
2568
|
-
: ""
|
|
2569
|
-
}${this.object.location?.city ?? ""} ${
|
|
2570
|
-
this.object.location?.country ?? ""
|
|
2571
|
-
}`,
|
|
2572
|
-
),
|
|
2573
|
-
)}${this.renderTemplateWhenWith(
|
|
2574
|
-
[rdf.RDFTYPE_FACT_CHECKING_OBJECT, "organisation"],
|
|
2575
|
-
() =>
|
|
2576
|
-
this._renderTitleValueDivision(
|
|
2577
|
-
msg("Organisation"),
|
|
2578
|
-
this.object.organisation,
|
|
2579
|
-
),
|
|
2580
|
-
)}${this.renderTemplateWhenWith(
|
|
2581
|
-
[rdf.RDFTYPE_FACT_CHECKING_OBJECT, "person"],
|
|
2582
|
-
() =>
|
|
2583
|
-
this._renderTitleValueDivision(
|
|
2584
|
-
msg("Person"),
|
|
2585
|
-
this.object.person,
|
|
2586
|
-
),
|
|
2587
|
-
)}${this.renderTemplateWhenWith(
|
|
2588
|
-
[rdf.RDFTYPE_FACT_CHECKING_OBJECT, "version"],
|
|
2589
|
-
() =>
|
|
2590
|
-
this._renderTitleValueDivision(
|
|
2591
|
-
msg("Version"),
|
|
2592
|
-
this.object.version,
|
|
2593
|
-
),
|
|
2594
|
-
)}${this.renderTemplateWhenWith(
|
|
2595
|
-
[rdf.RDFTYPE_DATAOFFER, "providers"],
|
|
2596
|
-
this._renderAboutProvider,
|
|
2597
|
-
)}${this.renderTemplateWhenWith(
|
|
2598
|
-
[rdf.RDFTYPE_DATAOFFER, "services"],
|
|
2599
|
-
this._renderCompatibleServices,
|
|
2600
|
-
)}${this.renderTemplateWhenWith(
|
|
2601
|
-
[rdf.RDFTYPE_INTERACTIVE_INFOGRAPHICS_OBJECT, "instruction"],
|
|
2602
|
-
() => {
|
|
2603
|
-
return html`${this._renderDivision(
|
|
2604
|
-
"h4",
|
|
2605
|
-
msg("Instruction"),
|
|
2606
|
-
)}
|
|
2607
|
-
${this._renderButton(
|
|
2608
|
-
undefined,
|
|
2609
|
-
"sm",
|
|
2610
|
-
this.object.instruction,
|
|
2611
|
-
"outline-gray",
|
|
2612
|
-
)}`;
|
|
2613
|
-
},
|
|
2614
|
-
)}${this.renderTemplateWhenWith(
|
|
2615
|
-
[rdf.RDFTYPE_MEDIA_OBJECT, "editor"],
|
|
2616
|
-
() =>
|
|
2617
|
-
this._renderTitleValueDivision(
|
|
2618
|
-
msg("Editor"),
|
|
2619
|
-
this.object.editor,
|
|
2620
|
-
),
|
|
2621
|
-
)}${this.renderTemplateWhenWith(
|
|
2622
|
-
[rdf.RDFTYPE_MEDIA_OBJECT, "original_language"],
|
|
2623
|
-
() =>
|
|
2624
|
-
this._renderTitleValueDivision(
|
|
2625
|
-
msg("Original Language"),
|
|
2626
|
-
this.object.original_language,
|
|
2627
|
-
),
|
|
2628
|
-
)}${this.renderTemplateWhenWith(
|
|
2629
|
-
[rdf.RDFTYPE_MEDIA_OBJECT, "contributors"],
|
|
2630
|
-
() =>
|
|
2631
|
-
this._renderTitleValueDivision(
|
|
2632
|
-
msg("Contributors"),
|
|
2633
|
-
this.object.contributors,
|
|
2634
|
-
),
|
|
2635
|
-
)}${this.renderTemplateWhenWith(
|
|
2636
|
-
[rdf.RDFTYPE_MEDIA_OBJECT, "publication_service"],
|
|
2637
|
-
() =>
|
|
2638
|
-
this._renderTitleValueDivision(
|
|
2639
|
-
msg("Publication Service"),
|
|
2640
|
-
this.object.publication_service,
|
|
2641
|
-
),
|
|
2642
|
-
)}${this.renderTemplateWhenWith(
|
|
2643
|
-
[rdf.RDFTYPE_OBJECT, "assets[]"],
|
|
2644
|
-
() => {
|
|
2645
|
-
return html`
|
|
2646
|
-
${this._renderDivision("h4", msg("Accessible Assets"))}
|
|
2647
|
-
<div class="assets-rows">
|
|
2648
|
-
${this.object.assets.map((asset: rdf.Asset) => {
|
|
2649
|
-
return html`
|
|
2650
|
-
<div
|
|
2651
|
-
class="asset-row flex flex-row align-items-center flex-1"
|
|
2652
|
-
>
|
|
2653
|
-
<div class="asset-format">
|
|
2654
|
-
<p>
|
|
2655
|
-
${asset.format ? asset.format.name : nothing}
|
|
2656
|
-
</p>
|
|
2657
|
-
</div>
|
|
2658
|
-
<div class="flex flex-column">
|
|
2659
|
-
${asset.name
|
|
2660
|
-
? html`<p>${asset.name}</p>`
|
|
2661
|
-
: nothing}
|
|
2662
|
-
${asset.size
|
|
2663
|
-
? html`<p>${asset.size}</p>`
|
|
2664
|
-
: nothing}
|
|
2665
|
-
</div>
|
|
2666
|
-
</div>
|
|
2667
|
-
`;
|
|
2668
|
-
})}
|
|
2669
|
-
</div>
|
|
2670
|
-
`;
|
|
2671
|
-
},
|
|
2672
|
-
)}`,
|
|
2673
|
-
this.renderTemplateWhenWith(["offers"], this._renderOffers),
|
|
2674
|
-
this.renderTemplateWhenWith(
|
|
2675
|
-
[rdf.RDFTYPE_PROVIDER, "services"],
|
|
2676
|
-
this._renderCompatibleServices,
|
|
2677
|
-
),
|
|
2678
|
-
this.renderTemplateWhenWith(
|
|
2679
|
-
[rdf.RDFTYPE_PROVIDER, "data_offers"],
|
|
2680
|
-
this._renderCompatibleDataOffers,
|
|
2681
|
-
),
|
|
2682
|
-
)}${this.renderTemplateWhenWith(
|
|
2683
|
-
[rdf.RDFTYPE_PROVIDER, "contact_url"],
|
|
2684
|
-
() =>
|
|
2685
|
-
html`<div class="flex flex-column flex-1">
|
|
2686
|
-
${this._renderDivision("h4", msg("Contact"))}
|
|
2687
|
-
${this._renderDivision("body-m", this.object.contact_url)}
|
|
2688
|
-
</div>`,
|
|
2689
|
-
)}
|
|
2690
|
-
</div>
|
|
2691
|
-
</div> `;
|
|
2692
|
-
}
|
|
2693
|
-
|
|
2694
2173
|
_closeModal() {
|
|
2695
2174
|
this.dispatchEvent(new CustomEvent("close"));
|
|
2696
2175
|
}
|
|
2697
2176
|
|
|
2698
|
-
_addBookmark() {
|
|
2699
|
-
this.dispatchEvent(
|
|
2700
|
-
new CustomEvent("bookmark", {
|
|
2701
|
-
detail: { add: true, object: this.object },
|
|
2702
|
-
}),
|
|
2703
|
-
);
|
|
2704
|
-
}
|
|
2705
|
-
|
|
2706
|
-
_removeBookmark() {
|
|
2707
|
-
this.dispatchEvent(
|
|
2708
|
-
new CustomEvent("bookmark", {
|
|
2709
|
-
detail: { add: false, object: this.object },
|
|
2710
|
-
}),
|
|
2711
|
-
);
|
|
2712
|
-
}
|
|
2713
|
-
|
|
2714
|
-
_purchase() {
|
|
2715
|
-
console.warn(msg("Disabled for POC"));
|
|
2716
|
-
this.dispatchEvent(new CustomEvent("purchase"));
|
|
2717
|
-
}
|
|
2718
|
-
|
|
2719
2177
|
_renderPolicySelection(): TemplateResult {
|
|
2720
2178
|
const policies = this.availablePolicies || [];
|
|
2721
2179
|
|
|
@@ -2831,26 +2289,21 @@ ${JSON.stringify(this.testResult, null, 2)}</pre
|
|
|
2831
2289
|
type="outline-gray"
|
|
2832
2290
|
.iconLeft=${html`<icon-material-symbols-close-rounded></icon-material-symbols-close-rounded>`}
|
|
2833
2291
|
></tems-button>
|
|
2834
|
-
|
|
2835
|
-
|
|
2836
|
-
|
|
2837
|
-
|
|
2838
|
-
|
|
2839
|
-
|
|
2840
|
-
|
|
2841
|
-
|
|
2842
|
-
|
|
2843
|
-
|
|
2844
|
-
|
|
2845
|
-
|
|
2846
|
-
|
|
2847
|
-
|
|
2848
|
-
>${msg("Integrate Externally")}</tems-button
|
|
2849
|
-
>
|
|
2850
|
-
${this._renderNegotiationButton()}`
|
|
2851
|
-
: nothing}
|
|
2292
|
+
<tems-button disabled="">${msg("Integrate Externally")}</tems-button>
|
|
2293
|
+
${this._renderNegotiationButton()}
|
|
2294
|
+
</div>
|
|
2295
|
+
<div class="modal-content-wrapper">
|
|
2296
|
+
<div class="modal-box">
|
|
2297
|
+
<div class="modal-content">
|
|
2298
|
+
${this._renderDivision("h2", this.object.name)}
|
|
2299
|
+
${this.renderTemplateWhenWith(
|
|
2300
|
+
["description"],
|
|
2301
|
+
this._renderDescription,
|
|
2302
|
+
)}
|
|
2303
|
+
${this._renderServiceSpecificModal()}
|
|
2304
|
+
</div>
|
|
2305
|
+
</div>
|
|
2852
2306
|
</div>
|
|
2853
|
-
<div class="modal-content-wrapper">${this._renderModal()}</div>
|
|
2854
2307
|
</div>`;
|
|
2855
2308
|
}
|
|
2856
2309
|
}
|
|
@@ -86,7 +86,7 @@ export class DSPCatalog extends OrbitDSPComponent {
|
|
|
86
86
|
document.removeEventListener("dsp-connector-ready", listener);
|
|
87
87
|
};
|
|
88
88
|
document.addEventListener("dsp-connector-ready", listener);
|
|
89
|
-
|
|
89
|
+
return;
|
|
90
90
|
}
|
|
91
91
|
|
|
92
92
|
if (objSrc) {
|
|
@@ -110,6 +110,8 @@ export class DSPCatalog extends OrbitDSPComponent {
|
|
|
110
110
|
e.preventDefault();
|
|
111
111
|
if (this.route) {
|
|
112
112
|
if ("use-id" in (this.component.routeAttributes || {})) {
|
|
113
|
+
this.object = e.detail;
|
|
114
|
+
this.dataSrc = e.detail["@id"];
|
|
113
115
|
utils.requestNavigation(this.route, e.detail["@id"]);
|
|
114
116
|
} else {
|
|
115
117
|
const rdfType = e.detail["@type"]?.at(-1) ?? e.detail["@type"];
|
|
@@ -131,13 +133,20 @@ export class DSPCatalog extends OrbitDSPComponent {
|
|
|
131
133
|
|
|
132
134
|
_closeModal(e: Event) {
|
|
133
135
|
e.preventDefault();
|
|
134
|
-
if (this.route)
|
|
136
|
+
if (this.route) {
|
|
137
|
+
utils.requestNavigation(this.route, this.defaultDataSrc);
|
|
138
|
+
this.dataSrc = undefined;
|
|
139
|
+
this.object = undefined;
|
|
140
|
+
}
|
|
135
141
|
}
|
|
136
142
|
|
|
137
143
|
_closeModalFromBackground(e: Event) {
|
|
138
144
|
e.preventDefault();
|
|
139
|
-
if (this.route && e.target?.classList.contains("modal"))
|
|
145
|
+
if (this.route && e.target?.classList.contains("modal")) {
|
|
140
146
|
utils.requestNavigation(this.route, this.defaultDataSrc);
|
|
147
|
+
this.dataSrc = undefined;
|
|
148
|
+
this.object = undefined;
|
|
149
|
+
}
|
|
141
150
|
}
|
|
142
151
|
|
|
143
152
|
_resultCountUpdate(e: Event) {
|
|
@@ -220,10 +229,11 @@ export class DSPCatalog extends OrbitDSPComponent {
|
|
|
220
229
|
class="modal"
|
|
221
230
|
@click=${this._closeModalFromBackground}
|
|
222
231
|
>
|
|
223
|
-
<ds4go-catalog
|
|
232
|
+
<ds4go-catalog-modal
|
|
224
233
|
.object=${this.object}
|
|
234
|
+
.dspStore=${window.dspStore}
|
|
225
235
|
@close=${this._closeModal}
|
|
226
|
-
></ds4go-catalog>
|
|
236
|
+
></ds4go-catalog-modal>
|
|
227
237
|
</div>`
|
|
228
238
|
: nothing}
|
|
229
239
|
</div>
|