Compare commits
No commits in common. "master" and "feat/opensearch" have entirely different histories.
master
...
feat/opens
2
package-lock.json
generated
2
package-lock.json
generated
|
|
@ -15,7 +15,7 @@
|
||||||
"class-transformer": "^0.5.1",
|
"class-transformer": "^0.5.1",
|
||||||
"dayjs": "^1.10.7",
|
"dayjs": "^1.10.7",
|
||||||
"dompurify": "^3.1.6",
|
"dompurify": "^3.1.6",
|
||||||
"leaflet": "^1.9.4",
|
"leaflet": "^1.7.1",
|
||||||
"qs": "^6.10.1",
|
"qs": "^6.10.1",
|
||||||
"rxjs": "^7.5.5",
|
"rxjs": "^7.5.5",
|
||||||
"vue": "^3.2.47",
|
"vue": "^3.2.47",
|
||||||
|
|
|
||||||
|
|
@ -18,7 +18,7 @@
|
||||||
"class-transformer": "^0.5.1",
|
"class-transformer": "^0.5.1",
|
||||||
"dayjs": "^1.10.7",
|
"dayjs": "^1.10.7",
|
||||||
"dompurify": "^3.1.6",
|
"dompurify": "^3.1.6",
|
||||||
"leaflet": "^1.9.4",
|
"leaflet": "^1.7.1",
|
||||||
"qs": "^6.10.1",
|
"qs": "^6.10.1",
|
||||||
"rxjs": "^7.5.5",
|
"rxjs": "^7.5.5",
|
||||||
"vue": "^3.2.47",
|
"vue": "^3.2.47",
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,9 @@
|
||||||
<template>
|
<template>
|
||||||
|
<div class="container-fluid">
|
||||||
|
<div class="development-notice">
|
||||||
|
DEVELOPMENT SITE <br> >> Only for development purposes <<
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<!-- <HelloWorld msg="Welcome to Your Vue.js plus TypeScript App" /> -->
|
<!-- <HelloWorld msg="Welcome to Your Vue.js plus TypeScript App" /> -->
|
||||||
<nav class="navbar navbar-light border-bottom" role="navigation" aria-label="main navigation">
|
<nav class="navbar navbar-light border-bottom" role="navigation" aria-label="main navigation">
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
|
|
@ -161,7 +166,6 @@ export default App;
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
@import 'leaflet/dist/leaflet.css';
|
|
||||||
// #app {
|
// #app {
|
||||||
// font-family: Avenir, Helvetica, Arial, sans-serif;
|
// font-family: Avenir, Helvetica, Arial, sans-serif;
|
||||||
// -webkit-font-smoothing: antialiased;
|
// -webkit-font-smoothing: antialiased;
|
||||||
|
|
|
||||||
56
src/app.ts
56
src/app.ts
|
|
@ -1,4 +1,5 @@
|
||||||
import { Component, Vue, Watch } from "vue-facing-decorator";
|
import { Component, Vue, Watch } from "vue-facing-decorator";
|
||||||
|
// import { RouteLocation } from "vue-router";
|
||||||
import HomeViewComponent from "./views/home-view/home-view-component.vue";
|
import HomeViewComponent from "./views/home-view/home-view-component.vue";
|
||||||
import HelpViewComponent from "./views/help-view/help-view-component.vue";
|
import HelpViewComponent from "./views/help-view/help-view-component.vue";
|
||||||
import MapViewComponent from "./views/map-view/map-view.component.vue";
|
import MapViewComponent from "./views/map-view/map-view.component.vue";
|
||||||
|
|
@ -10,10 +11,27 @@ import ContactViewComponent from "./views/contact-view/contact-view-component.vu
|
||||||
import SitelinkViewComponent from "./views/sitelink-view/sitelink-view-component.vue";
|
import SitelinkViewComponent from "./views/sitelink-view/sitelink-view-component.vue";
|
||||||
import ImprintViewComponent from "./views/imprint-view/imprint-view-component.vue";
|
import ImprintViewComponent from "./views/imprint-view/imprint-view-component.vue";
|
||||||
import TermsViewComponent from "./views/terms-view/terms-view-component";
|
import TermsViewComponent from "./views/terms-view/terms-view-component";
|
||||||
|
// import { VUE_API } from "./constants";
|
||||||
|
// import VsInput from "./components/vs-input/vs-input.vue";
|
||||||
|
// import VsResult from "./components/vs-result/vs-result.vue";
|
||||||
|
// import FacetCategory from "./components/face-category/facet-category.vue";
|
||||||
|
// import ActiveFacetCategory from "./components/active-facet-category/active-facet-category.vue";
|
||||||
|
|
||||||
|
// import { SolrSettings } from "@/models/solr";
|
||||||
|
// import { DatasetService } from "./services/dataset.service";
|
||||||
|
// import { Suggestion } from "./models/dataset";
|
||||||
|
// import { SolrResponse, FacetFields, FacetItem, FacetResults, FacetInstance } from "./models/headers";
|
||||||
|
// import { ActiveFilterCategories } from "@/models/solr";
|
||||||
|
|
||||||
|
// https://devsoniq.com/how-to-toggle-bulma-css-navbar-in-your-vue-js-project/
|
||||||
@Component({
|
@Component({
|
||||||
components: {
|
components: {
|
||||||
|
// HelloWorld,
|
||||||
HomeViewComponent,
|
HomeViewComponent,
|
||||||
|
// VsInput,
|
||||||
|
// VsResult,
|
||||||
|
// FacetCategory,
|
||||||
|
// ActiveFacetCategory,
|
||||||
HelpViewComponent,
|
HelpViewComponent,
|
||||||
MapViewComponent,
|
MapViewComponent,
|
||||||
SearchViewComponent,
|
SearchViewComponent,
|
||||||
|
|
@ -30,40 +48,38 @@ export default class App extends Vue {
|
||||||
public active = false;
|
public active = false;
|
||||||
public portal = "https://data.tethys.at/login"; // VUE_API + "/login";
|
public portal = "https://data.tethys.at/login"; // VUE_API + "/login";
|
||||||
|
|
||||||
/**
|
|
||||||
* Computed property that returns the current year.
|
|
||||||
* @returns {number} The current year as a number.
|
|
||||||
*/
|
|
||||||
get currentYear() {
|
get currentYear() {
|
||||||
return new Date().getFullYear();
|
return new Date().getFullYear();
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Lifecycle hook called when the component is mounted.
|
|
||||||
* Currently empty, but can be used to add setup logic when the component is mounted.
|
|
||||||
*/
|
|
||||||
mounted(): void {
|
mounted(): void {
|
||||||
|
// const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll(".navbar-burger"), 0);
|
||||||
|
// // Check if there are any navbar burgers
|
||||||
|
// if ($navbarBurgers.length > 0) {
|
||||||
|
// // Add a click event on each of them
|
||||||
|
// $navbarBurgers.forEach((elNavBurger) => {
|
||||||
|
// elNavBurger.addEventListener("click", () => {
|
||||||
|
// // Get the target from the "data-target" attribute
|
||||||
|
// const targetNavbar = elNavBurger.dataset.target;
|
||||||
|
// const $target = document.getElementById(targetNavbar);
|
||||||
|
// // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
|
||||||
|
// elNavBurger.classList.toggle("is-active");
|
||||||
|
// $target?.classList.toggle("is-active");
|
||||||
|
// });
|
||||||
|
// });
|
||||||
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Toggles the visibility of the mobile menu.
|
|
||||||
* @param {MouseEvent} event - The mouse event triggered by the user's interaction.
|
|
||||||
*/
|
|
||||||
public showMobilemenu(event: MouseEvent): void {
|
public showMobilemenu(event: MouseEvent): void {
|
||||||
// Prevent the default behavior of the event (e.g., following a link)
|
// Don't follow the link
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
// Toggle the active state of the mobile menu
|
|
||||||
this.active = !this.active;
|
this.active = !this.active;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Watcher that triggers when the route changes.
|
|
||||||
* It deactivates the mobile menu by setting `active` to false.
|
|
||||||
*/
|
|
||||||
@Watch("$route")
|
@Watch("$route")
|
||||||
protected oRouteChangedChanged(): void {
|
protected oRouteChangedChanged(): void {
|
||||||
// Close the mobile menu when the route changes
|
//(to: RouteLocation, from: RouteLocation): void {
|
||||||
|
// console.log("setting " + from.path + " to " + to.path);
|
||||||
this.active = false;
|
this.active = false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -79,11 +79,11 @@ export default class FacetCategory extends Vue {
|
||||||
}
|
}
|
||||||
|
|
||||||
toggle(): void {
|
toggle(): void {
|
||||||
this.collapsed = !this.collapsed;
|
if (this.collapsed == true) {
|
||||||
|
this.collapsed = false;
|
||||||
// Scroll to the top of the page only when collapsing
|
} else if (this.collapsed == false) {
|
||||||
if (this.collapsed) {
|
this.collapsed = true;
|
||||||
this.scrollTop();
|
//list.children("li:gt(4)").hide();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -94,19 +94,6 @@ export default class FacetCategory extends Vue {
|
||||||
filterItem.category = this.filterName;
|
filterItem.category = this.filterName;
|
||||||
filterItem.active = true;
|
filterItem.active = true;
|
||||||
// this.$emit("filter", filterItem);
|
// this.$emit("filter", filterItem);
|
||||||
|
|
||||||
// Scroll to the top of the page when activating a new filter
|
|
||||||
this.scrollTop();
|
|
||||||
|
|
||||||
return filterItem;
|
return filterItem;
|
||||||
}
|
}
|
||||||
|
|
||||||
scrollTop(): void {
|
|
||||||
setTimeout(() => {
|
|
||||||
window.scrollTo({
|
|
||||||
top: 0,
|
|
||||||
behavior: 'smooth' // Smooth scroll to the top
|
|
||||||
});
|
|
||||||
}, 50); // Delay to allow the DOM to update
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,112 +0,0 @@
|
||||||
import { Component, Prop, Vue } from 'vue-facing-decorator';
|
|
||||||
import * as L from 'leaflet';
|
|
||||||
import 'leaflet/dist/leaflet.css';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
name: 'Minimap',
|
|
||||||
})
|
|
||||||
export default class Minimap extends Vue {
|
|
||||||
@Prop({ type: Array, required: true }) bounds!: L.LatLngBoundsLiteral;
|
|
||||||
|
|
||||||
// private originalCenter: L.LatLngExpression = [47.71, 13.55]; // Original center
|
|
||||||
// private originalZoom: number = 6; // Original zoom level
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Lifecycle hook called when the component is mounted.
|
|
||||||
* Initializes the Leaflet map, sets up base layers, and adds either a circle or rectangle
|
|
||||||
* based on the `bounds` prop passed to the component.
|
|
||||||
*/
|
|
||||||
mounted() {
|
|
||||||
// Initialize the map with specific center and zoom
|
|
||||||
const map = L.map('map', {
|
|
||||||
center: [47.71, 13.55], // Initial center coordinates
|
|
||||||
zoomControl: true, // Enable zoom controls
|
|
||||||
zoom: 6, // Initial zoom level
|
|
||||||
minZoom: 5, // Minimum zoom level allowed
|
|
||||||
maxBounds: [
|
|
||||||
[44.0, 9.0], // Southwest corner of the bounding box
|
|
||||||
[51.0, 18.0] // Northeast corner of the bounding box
|
|
||||||
],
|
|
||||||
maxBoundsViscosity: 1.0 // Prevent map from being dragged outside the defined bounds
|
|
||||||
});
|
|
||||||
|
|
||||||
// Remove Leaflet logo and text
|
|
||||||
map.attributionControl.setPrefix(false);
|
|
||||||
|
|
||||||
// Add basemap.at tile layer to the map
|
|
||||||
const basemapAtLayer = L.tileLayer('https://maps{s}.wien.gv.at/basemap/geolandbasemap/normal/google3857/{z}/{y}/{x}.png', {
|
|
||||||
attribution: '<a href="https://www.basemap.at">basemap.at</a>',
|
|
||||||
noWrap: true,
|
|
||||||
subdomains: ['', '1', '2', '3', '4']
|
|
||||||
}).addTo(map);
|
|
||||||
|
|
||||||
// Add Esri imagery tile layer
|
|
||||||
const esriImageryLayer = L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
|
|
||||||
attribution: 'Tiles © <a href="https://www.esri.com/" target="_blank">Esri</a>'
|
|
||||||
});
|
|
||||||
|
|
||||||
// Add Esri topo map tile layer
|
|
||||||
const esriTopoLayer = L.tileLayer('https://server.arcgisonline.com/arcgis/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}', {
|
|
||||||
attribution: 'Tiles © <a href="https://www.esri.com/" target="_blank">Esri</a>'
|
|
||||||
});
|
|
||||||
|
|
||||||
// Define available base maps for the user to toggle between
|
|
||||||
const baseMaps = {
|
|
||||||
// "OpenStreetMap": openStreetMapLayer,
|
|
||||||
"basemap.at": basemapAtLayer,
|
|
||||||
"ESRI Imagery": esriImageryLayer,
|
|
||||||
"ESRI Topo": esriTopoLayer
|
|
||||||
};
|
|
||||||
|
|
||||||
// Define available base maps for the user to toggle between
|
|
||||||
L.control.layers(baseMaps).addTo(map);
|
|
||||||
|
|
||||||
const [southWest, northEast] = this.bounds;
|
|
||||||
|
|
||||||
if (southWest[0] === northEast[0] || southWest[1] === northEast[1]) {
|
|
||||||
// If y_min and y_max (and x_min and x_max) are equal, generate a circle
|
|
||||||
const center = [southWest[0], southWest[1]] as [number, number];
|
|
||||||
// Add a CircleMarker to the map at the center of the bounds. This kind of marker is used to maintain constant size regardless of zoom level
|
|
||||||
const circleMarker = L.circleMarker(center, {
|
|
||||||
color: '#30D5C8', // Outline color
|
|
||||||
fillColor: '#336699', // Fill color
|
|
||||||
fillOpacity: 1, // Opacity of the fill
|
|
||||||
opacity: 0.5, // Outline opacity
|
|
||||||
weight: 10, // Outline weight (thickness)
|
|
||||||
radius: 10 // Radius in pixels
|
|
||||||
}).addTo(map);
|
|
||||||
|
|
||||||
// Manually create a small bounding box around the marker's center to fit bounds
|
|
||||||
const buffer = 0.01; // Buffer size around the marker. Adjust this value to control the area around the marker
|
|
||||||
const markerBounds = L.latLngBounds(
|
|
||||||
[center[0] - buffer, center[1] - buffer], // Southwest corner of the bounding box
|
|
||||||
[center[0] + buffer, center[1] + buffer] // Northeast corner of the bounding box
|
|
||||||
);
|
|
||||||
|
|
||||||
// Add a click event handler to the CircleMarker
|
|
||||||
circleMarker.on('click', () => {
|
|
||||||
map.fitBounds(markerBounds, { padding: [10, 10] }); // Adjust map to fit within marker bounds
|
|
||||||
});
|
|
||||||
|
|
||||||
// Automatically adjust the map's view to fit the marker's bounds
|
|
||||||
map.fitBounds(markerBounds, { padding: [10, 10] });
|
|
||||||
|
|
||||||
} else {
|
|
||||||
// If bounds are not equal, draw a rectangle
|
|
||||||
const rectangle = L.rectangle(this.bounds, {
|
|
||||||
color: '#30D5C8', // Rectangle outline color //Alternative color: 336699
|
|
||||||
weight: 2, // Outline thickness
|
|
||||||
opacity: 1 // Opacity of the rectangle outline
|
|
||||||
}).addTo(map);
|
|
||||||
|
|
||||||
// Add a click event handler to the Rectangle
|
|
||||||
rectangle.on('click', () => {
|
|
||||||
map.fitBounds(this.bounds, { padding: [18, 18] }); // Adjust map to fit within rectangle bounds
|
|
||||||
});
|
|
||||||
|
|
||||||
// Automatically adjust the map's view to fit the rectangle's bounds with padding
|
|
||||||
map.fitBounds(this.bounds, { padding: [18, 18] });
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
@ -1,16 +0,0 @@
|
||||||
<!-- Contains the template and references the TypeScript logic. -->
|
|
||||||
<template>
|
|
||||||
<div id="map" style="height: 300px;"></div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import Minimap from './Minimap';
|
|
||||||
export default Minimap;
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
#map {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,3 +1,5 @@
|
||||||
|
// declare const POINT_URL: string;
|
||||||
|
// declare const EDGE_URL: string;
|
||||||
declare const APP_URL: string;
|
declare const APP_URL: string;
|
||||||
declare const VUE_API: string;
|
declare const VUE_API: string;
|
||||||
// declare const SOLR_HOST: string;
|
// declare const SOLR_HOST: string;
|
||||||
|
|
@ -7,6 +9,8 @@ declare const VUE_API: string;
|
||||||
declare const OPEN_HOST: string;
|
declare const OPEN_HOST: string;
|
||||||
declare const OPEN_CORE: string;
|
declare const OPEN_CORE: string;
|
||||||
|
|
||||||
|
// const _EDGE_URL = EDGE_URL;
|
||||||
|
// const _POINT_URL = POINT_URL;
|
||||||
const _APP_URL = APP_URL;
|
const _APP_URL = APP_URL;
|
||||||
const _VUE_API = VUE_API;
|
const _VUE_API = VUE_API;
|
||||||
// const _SOLR_HOST = SOLR_HOST;
|
// const _SOLR_HOST = SOLR_HOST;
|
||||||
|
|
@ -16,6 +20,8 @@ const _VUE_API = VUE_API;
|
||||||
const _OPEN_HOST = OPEN_HOST;
|
const _OPEN_HOST = OPEN_HOST;
|
||||||
const _OPEN_CORE = OPEN_CORE;
|
const _OPEN_CORE = OPEN_CORE;
|
||||||
|
|
||||||
|
// export { _EDGE_URL as EDGE_URL };
|
||||||
|
// export { _POINT_URL as POINT_URL };
|
||||||
export { _APP_URL as APP_URL };
|
export { _APP_URL as APP_URL };
|
||||||
export { _VUE_API as VUE_API };
|
export { _VUE_API as VUE_API };
|
||||||
// export { _SOLR_HOST as SOLR_HOST };
|
// export { _SOLR_HOST as SOLR_HOST };
|
||||||
|
|
|
||||||
|
|
@ -332,19 +332,6 @@ export class DbDataset {
|
||||||
return "";
|
return "";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Provides the bounds of the publication for the Leaflet minimap */
|
|
||||||
public get Bounds(): L.LatLngBoundsLiteral | string {
|
|
||||||
if (this.coverage != undefined) {
|
|
||||||
return [
|
|
||||||
[Number(this.coverage.y_min), Number(this.coverage.x_min)], // Southwest corner
|
|
||||||
[Number(this.coverage.y_max), Number(this.coverage.x_max)] // Northeast corner
|
|
||||||
];
|
|
||||||
} else {
|
|
||||||
return "";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
}
|
||||||
type Nullable<T> = T | undefined;
|
type Nullable<T> = T | undefined;
|
||||||
|
|
||||||
|
|
|
||||||
698
src/search_page.html
Normal file
698
src/search_page.html
Normal file
|
|
@ -0,0 +1,698 @@
|
||||||
|
<div class="columns">
|
||||||
|
|
||||||
|
<div class="column is-9 results_column" style="padding-top: 1.2rem; padding-right: 0.5rem">
|
||||||
|
<div class="column" id="loading_bar" style="padding-top: 0px; display: none">
|
||||||
|
<div class="column" style="padding-top: 0; padding-bottom: 0; margin-bottom: 0"></div>
|
||||||
|
<div class="card" style="margin-bottom: 0px">
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="content">
|
||||||
|
<noscript>It appears that your Javascript is disabled. To view results on
|
||||||
|
this page, you will need to enable it. You might want to visit our
|
||||||
|
<a href="/lite/results">lite results</a>.
|
||||||
|
</noscript>
|
||||||
|
<progress class="progress is-large" max="100">60%</progress>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="results">
|
||||||
|
<div class="column" style="padding-top: 0">
|
||||||
|
<div class="card" style="margin-bottom: 0px">
|
||||||
|
<div class="card-content">
|
||||||
|
<div class="content">
|
||||||
|
It looks like you're not logged in right now. you will need to
|
||||||
|
<a href="/login" target="_self">login to Pro</a> or become a
|
||||||
|
<a href="https://coil.com/?ref=InfinitySearch2229" target="_self">Coil Member</a>
|
||||||
|
to access the results.
|
||||||
|
<div class="block"></div>
|
||||||
|
<div class="columns" style="text-align: center">
|
||||||
|
<div class="column is-one-third">
|
||||||
|
<a class="button" style="width: 100%" href="/login" target="_self">Login</a>
|
||||||
|
</div>
|
||||||
|
<div class="column is-one-third">
|
||||||
|
<a class="button" style="width: 100%" href="/pro" target="_self">Learn more about
|
||||||
|
Infinity Pro</a>
|
||||||
|
</div>
|
||||||
|
<div class="column is-one-third">
|
||||||
|
<a class="button" style="width: 100%"
|
||||||
|
href="https://coil.com/?ref=InfinitySearch2229" target="_self">Learn more about
|
||||||
|
Coil</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div hidden="" id="id-custom-tab-page">
|
||||||
|
<div class="columns" style="margin-top: 1rem">
|
||||||
|
<div class="column is-one-quarter is-offset-2">
|
||||||
|
<p class="heading">Current Tabs</p>
|
||||||
|
<div id="id-current-tab-list">
|
||||||
|
<nav class="level is-mobile" id="id-web-tab">
|
||||||
|
<div class="level-item has-text-centered is-capitalized">web</div>
|
||||||
|
<div class="level-item has-text-centered is-one-quarter">
|
||||||
|
<div style="order: 2; margin-left: auto; margin-right: 0.5rem">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
<img class="handle trash" src="/static/images/fa/trash-alt.svg"
|
||||||
|
id="id-remove-tab-icon-web" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
margin-left: 0.5rem;
|
||||||
|
" onclick="removeTab(this);" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
<nav class="level is-mobile" id="id-images-tab">
|
||||||
|
<div class="level-item has-text-centered is-capitalized">
|
||||||
|
images
|
||||||
|
</div>
|
||||||
|
<div class="level-item has-text-centered is-one-quarter">
|
||||||
|
<div style="order: 2; margin-left: auto; margin-right: 0.5rem">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
<img class="handle trash" src="/static/images/fa/trash-alt.svg"
|
||||||
|
id="id-remove-tab-icon-images" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
margin-left: 0.5rem;
|
||||||
|
" onclick="removeTab(this);" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
<nav class="level is-mobile" id="id-videos-tab">
|
||||||
|
<div class="level-item has-text-centered is-capitalized">
|
||||||
|
videos
|
||||||
|
</div>
|
||||||
|
<div class="level-item has-text-centered is-one-quarter">
|
||||||
|
<div style="order: 2; margin-left: auto; margin-right: 0.5rem">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
<img class="handle trash" src="/static/images/fa/trash-alt.svg"
|
||||||
|
id="id-remove-tab-icon-videos" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
margin-left: 0.5rem;
|
||||||
|
" onclick="removeTab(this);" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
<nav class="level is-mobile" id="id-homepages-tab">
|
||||||
|
<div class="level-item has-text-centered is-capitalized">
|
||||||
|
homepages
|
||||||
|
</div>
|
||||||
|
<div class="level-item has-text-centered is-one-quarter">
|
||||||
|
<div style="order: 2; margin-left: auto; margin-right: 0.5rem">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
<img class="handle trash" src="/static/images/fa/trash-alt.svg"
|
||||||
|
id="id-remove-tab-icon-homepages" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
margin-left: 0.5rem;
|
||||||
|
" onclick="removeTab(this);" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
<nav class="level is-mobile" id="id-food-tab">
|
||||||
|
<div class="level-item has-text-centered is-capitalized">
|
||||||
|
food
|
||||||
|
</div>
|
||||||
|
<div class="level-item has-text-centered is-one-quarter">
|
||||||
|
<div style="order: 2; margin-left: auto; margin-right: 0.5rem">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
<img class="handle trash" src="/static/images/fa/trash-alt.svg"
|
||||||
|
id="id-remove-tab-icon-food" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
margin-left: 0.5rem;
|
||||||
|
" onclick="removeTab(this);" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
<nav class="level is-mobile" id="id-books-tab">
|
||||||
|
<div class="level-item has-text-centered is-capitalized">
|
||||||
|
books
|
||||||
|
</div>
|
||||||
|
<div class="level-item has-text-centered is-one-quarter">
|
||||||
|
<div style="order: 2; margin-left: auto; margin-right: 0.5rem">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
<img class="handle trash" src="/static/images/fa/trash-alt.svg"
|
||||||
|
id="id-remove-tab-icon-books" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
margin-left: 0.5rem;
|
||||||
|
" onclick="removeTab(this);" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
<nav class="level is-mobile" id="id-movies-tab">
|
||||||
|
<div class="level-item has-text-centered is-capitalized">
|
||||||
|
movies
|
||||||
|
</div>
|
||||||
|
<div class="level-item has-text-centered is-one-quarter">
|
||||||
|
<div style="order: 2; margin-left: auto; margin-right: 0.5rem">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
<img class="handle trash" src="/static/images/fa/trash-alt.svg"
|
||||||
|
id="id-remove-tab-icon-movies" style="
|
||||||
|
cursor: pointer;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
margin-left: 0.5rem;
|
||||||
|
" onclick="removeTab(this);" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="column is-one-quarter is-offset-1">
|
||||||
|
<p class="heading">Add New Tabs</p>
|
||||||
|
<nav class="level">
|
||||||
|
<div class="level-item">
|
||||||
|
<div class="select">
|
||||||
|
<select id="id-add-tab-selector" style="
|
||||||
|
font-family: BlinkMacSystemFont, -apple-system, 'Segoe UI',
|
||||||
|
Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans',
|
||||||
|
'Droid Sans', 'Helvetica Neue', Helvetica, Arial,
|
||||||
|
sans-serif;
|
||||||
|
">
|
||||||
|
<option id="id-tab-selector-web" value="web" style="display: none">
|
||||||
|
Web
|
||||||
|
</option>
|
||||||
|
<option id="id-tab-selector-images" value="images" style="display: none">
|
||||||
|
Images
|
||||||
|
</option>
|
||||||
|
<option id="id-tab-selector-videos" value="videos" style="display: none">
|
||||||
|
Videos
|
||||||
|
</option>
|
||||||
|
<option id="id-tab-selector-homepages" value="homepages" style="display: none">
|
||||||
|
Homepages
|
||||||
|
</option>
|
||||||
|
<option id="id-tab-selector-general" value="general">
|
||||||
|
General
|
||||||
|
</option>
|
||||||
|
<option id="id-tab-selector-food" value="food" style="display: none">
|
||||||
|
Food
|
||||||
|
</option>
|
||||||
|
<option id="id-tab-selector-books" value="books" style="display: none">
|
||||||
|
Books
|
||||||
|
</option>
|
||||||
|
<option id="id-tab-selector-movies" value="movies" style="display: none">
|
||||||
|
Movies
|
||||||
|
</option>
|
||||||
|
<option id="id-tab-selector-music" value="music">
|
||||||
|
Music
|
||||||
|
</option>
|
||||||
|
<option id="id-tab-selector-infinity" value="infinity">
|
||||||
|
Infinity
|
||||||
|
</option>
|
||||||
|
<option id="id-tab-selector-edu" value="edu">Edu</option>
|
||||||
|
<option id="id-tab-selector-pdf" value="pdf">Pdf</option>
|
||||||
|
<option id="id-tab-selector-qa" value="qa">Qa</option>
|
||||||
|
<option id="id-tab-selector-reddit" value="reddit">
|
||||||
|
Reddit
|
||||||
|
</option>
|
||||||
|
<option id="id-tab-selector-fandom" value="fandom">
|
||||||
|
Fandom
|
||||||
|
</option>
|
||||||
|
<option id="id-tab-selector-coil" value="coil">Coil</option>
|
||||||
|
<option id="id-tab-selector-no_js" value="no_js">
|
||||||
|
No Javascript
|
||||||
|
</option>
|
||||||
|
<option id="id-tab-selector-decentralized" value="decentralized">
|
||||||
|
Decentralized
|
||||||
|
</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="level-item">
|
||||||
|
<button class="button" id="id-add-tab-button" onclick="addTab();" style="
|
||||||
|
font-family: BlinkMacSystemFont, -apple-system, 'Segoe UI',
|
||||||
|
Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans',
|
||||||
|
'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||||
|
">
|
||||||
|
Add
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
<br />
|
||||||
|
<nav class="level">
|
||||||
|
<div class="level-item">
|
||||||
|
<button class="button" id="id-update-tabs-button" style="
|
||||||
|
order: 2;
|
||||||
|
margin-left: auto;
|
||||||
|
font-family: BlinkMacSystemFont, -apple-system, 'Segoe UI',
|
||||||
|
Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans',
|
||||||
|
'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||||
|
" onclick="resetTabsToOriginal();">
|
||||||
|
Reset
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
<div id="id-custom-tabs-error"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<div id="id-side-bar" class="column is-3 sidebar_column" style="padding-top: 1.2rem; padding-right: 1.5rem">
|
||||||
|
<div id="externals" class="">
|
||||||
|
<div class="card" name="external_card" style="margin-bottom: 0px">
|
||||||
|
<header class="card-header">
|
||||||
|
<p class="card-header-title" style="font-weight: normal; padding-right: 5px">
|
||||||
|
<a id="https://en.wikipedia.org/w/index.php?search="
|
||||||
|
href="https://en.wikipedia.org/w/index.php?search=test" name="external_link_0"
|
||||||
|
style="display: block" rel="noreferrer noopener" target="_self">
|
||||||
|
<img onerror="imgError(this)" src="/static/images/favicons/wikipedia.ico"
|
||||||
|
name="external_icon_0'" class="external-icon" />
|
||||||
|
<span hidden="" class="external-text" name="external_text_0"
|
||||||
|
style="font-size: 0.95rem; display: inline">
|
||||||
|
Wikipedia Results
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<span class="clickableIcon" onclick="removeExternalClickable(this)" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 6px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 12px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
</span>
|
||||||
|
</header>
|
||||||
|
</div>
|
||||||
|
<div class="card" name="external_card" style="margin-bottom: 0px">
|
||||||
|
<header class="card-header">
|
||||||
|
<p class="card-header-title" style="font-weight: normal; padding-right: 5px">
|
||||||
|
<a id="https://duckduckgo.com/?q=" href="https://duckduckgo.com/?q=test" name="external_link_1"
|
||||||
|
style="display: block" rel="noreferrer noopener" target="_self">
|
||||||
|
<img onerror="imgError(this)" src="/static/images/favicons/duckduckgo.ico"
|
||||||
|
name="external_icon_1'" class="external-icon" />
|
||||||
|
<span hidden="" class="external-text" name="external_text_1"
|
||||||
|
style="font-size: 0.95rem; display: inline">
|
||||||
|
DuckDuckGo Results
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<span class="clickableIcon" onclick="removeExternalClickable(this)" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 6px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 12px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
</span>
|
||||||
|
</header>
|
||||||
|
</div>
|
||||||
|
<div class="card" name="external_card" style="margin-bottom: 0px">
|
||||||
|
<header class="card-header">
|
||||||
|
<p class="card-header-title" style="font-weight: normal; padding-right: 5px">
|
||||||
|
<a id="https://www.google.com/search?q=" href="https://www.google.com/search?q=test"
|
||||||
|
name="external_link_2" style="display: block" rel="noreferrer noopener" target="_self">
|
||||||
|
<img onerror="imgError(this)" src="/static/images/favicons/google.ico"
|
||||||
|
name="external_icon_2'" class="external-icon" />
|
||||||
|
<span hidden="" class="external-text" name="external_text_2"
|
||||||
|
style="font-size: 0.95rem; display: inline">
|
||||||
|
Google Results
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<span class="clickableIcon" onclick="removeExternalClickable(this)" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 6px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 12px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
</span>
|
||||||
|
</header>
|
||||||
|
</div>
|
||||||
|
<div class="card" name="external_card" style="margin-bottom: 0px">
|
||||||
|
<header class="card-header">
|
||||||
|
<p class="card-header-title" style="font-weight: normal; padding-right: 5px">
|
||||||
|
<a id="https://www.youtube.com/results?search_query="
|
||||||
|
href="https://www.youtube.com/results?search_query=test" name="external_link_3"
|
||||||
|
style="display: block" rel="noreferrer noopener" target="_self">
|
||||||
|
<img onerror="imgError(this)" src="/static/images/favicons/youtube.svg"
|
||||||
|
name="external_icon_3'" class="external-icon" />
|
||||||
|
<span hidden="" class="external-text" name="external_text_3"
|
||||||
|
style="font-size: 0.95rem; display: inline">
|
||||||
|
Youtube Results
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<span class="clickableIcon" onclick="removeExternalClickable(this)" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 6px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 12px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
</span>
|
||||||
|
</header>
|
||||||
|
</div>
|
||||||
|
<div class="card" name="external_card" style="margin-bottom: 0px">
|
||||||
|
<header class="card-header">
|
||||||
|
<p class="card-header-title" style="font-weight: normal; padding-right: 5px">
|
||||||
|
<a id="https://www.amazon.com/s?k=" href="https://www.amazon.com/s?k=test"
|
||||||
|
name="external_link_4" style="display: block" rel="noreferrer noopener" target="_self">
|
||||||
|
<img onerror="imgError(this)" src="/static/images/favicons/amazon.ico"
|
||||||
|
name="external_icon_4'" class="external-icon" />
|
||||||
|
<span hidden="" class="external-text" name="external_text_4"
|
||||||
|
style="font-size: 0.95rem; display: inline">
|
||||||
|
Amazon Results
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<span class="clickableIcon" onclick="removeExternalClickable(this)" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 6px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 12px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
</span>
|
||||||
|
</header>
|
||||||
|
</div>
|
||||||
|
<div class="card" name="external_card" style="margin-bottom: 0px">
|
||||||
|
<header class="card-header">
|
||||||
|
<p class="card-header-title" style="font-weight: normal; padding-right: 5px">
|
||||||
|
<a id="https://twitter.com/search?q=" href="https://twitter.com/search?q=test"
|
||||||
|
name="external_link_5" style="display: block" rel="noreferrer noopener" target="_self">
|
||||||
|
<img onerror="imgError(this)" src="/static/images/favicons/twitter.png"
|
||||||
|
name="external_icon_5'" class="external-icon" />
|
||||||
|
<span hidden="" class="external-text" name="external_text_5"
|
||||||
|
style="font-size: 0.95rem; display: inline">
|
||||||
|
Twitter Results
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<span class="clickableIcon" onclick="removeExternalClickable(this)" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 6px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 12px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
</span>
|
||||||
|
</header>
|
||||||
|
</div>
|
||||||
|
<div class="card" name="external_card" style="margin-bottom: 0px">
|
||||||
|
<header class="card-header">
|
||||||
|
<p class="card-header-title" style="font-weight: normal; padding-right: 5px">
|
||||||
|
<a id="https://www.reddit.com/search/?q=" href="https://www.reddit.com/search/?q=test"
|
||||||
|
name="external_link_6" style="display: block" rel="noreferrer noopener" target="_self">
|
||||||
|
<img onerror="imgError(this)" src="/static/images/favicons/reddit.ico"
|
||||||
|
name="external_icon_6'" class="external-icon" />
|
||||||
|
<span hidden="" class="external-text" name="external_text_6"
|
||||||
|
style="font-size: 0.95rem; display: inline">
|
||||||
|
Reddit Results
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<span class="clickableIcon" onclick="removeExternalClickable(this)" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 6px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 12px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
</span>
|
||||||
|
</header>
|
||||||
|
</div>
|
||||||
|
<div class="card" name="external_card" style="margin-bottom: 0px">
|
||||||
|
<header class="card-header">
|
||||||
|
<p class="card-header-title" style="font-weight: normal; padding-right: 5px">
|
||||||
|
<a id="https://github.com/search?q=" href="https://github.com/search?q=test"
|
||||||
|
name="external_link_7" style="display: block" rel="noreferrer noopener" target="_self">
|
||||||
|
<img onerror="imgError(this)" src="/static/images/favicons/github.ico"
|
||||||
|
name="external_icon_7'" class="external-icon" />
|
||||||
|
<span hidden="" class="external-text" name="external_text_7"
|
||||||
|
style="font-size: 0.95rem; display: inline">
|
||||||
|
GitHub Results
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<span class="clickableIcon" onclick="removeExternalClickable(this)" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 6px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 12px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
</span>
|
||||||
|
</header>
|
||||||
|
</div>
|
||||||
|
<div class="card" name="external_card" style="margin-bottom: 0px">
|
||||||
|
<header class="card-header">
|
||||||
|
<p class="card-header-title" style="font-weight: normal; padding-right: 5px">
|
||||||
|
<a id="https://www.reuters.com/search/news?blob="
|
||||||
|
href="https://www.reuters.com/search/news?blob=test" name="external_link_8"
|
||||||
|
style="display: block" rel="noreferrer noopener" target="_self">
|
||||||
|
<img onerror="imgError(this)" src="/static/images/favicons/reuters.ico"
|
||||||
|
name="external_icon_8'" class="external-icon" />
|
||||||
|
<span hidden="" class="external-text" name="external_text_8"
|
||||||
|
style="font-size: 0.95rem; display: inline">
|
||||||
|
Reuters Results
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
<span class="clickableIcon" onclick="removeExternalClickable(this)" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 6px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
">
|
||||||
|
<img class="handle fa-ellipsis-v" src="/static/images/fa/ellipsis-v.svg" style="
|
||||||
|
cursor: pointer;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
margin-right: 12px;
|
||||||
|
min-width: 0.5em;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
" />
|
||||||
|
</span>
|
||||||
|
</header>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="externals_menu">
|
||||||
|
<div class="card is-fullwidth" id="plus-minus-info" style="
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
margin-bottom: 0px;
|
||||||
|
height: 2.5rem;
|
||||||
|
padding: 0.7rem;
|
||||||
|
">
|
||||||
|
<div class="columns is-vcentered is-mobile">
|
||||||
|
<div class="column" style="text-align: center">
|
||||||
|
<button class="button is-small" id="external_add" style="
|
||||||
|
border-color: transparent;
|
||||||
|
font-family: BlinkMacSystemFont, -apple-system, 'Segoe UI',
|
||||||
|
Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans',
|
||||||
|
'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||||
|
">
|
||||||
|
<img src="/static/images/fa/plus.svg" class="cl-external-link-img" />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="column is-narrow" style="text-align: center">|</div>
|
||||||
|
<div class="column" style="text-align: center">
|
||||||
|
<button class="button is-small" id="external_minus" style="
|
||||||
|
border-color: transparent;
|
||||||
|
font-family: BlinkMacSystemFont, -apple-system, 'Segoe UI',
|
||||||
|
Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans',
|
||||||
|
'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||||
|
">
|
||||||
|
<img src="/static/images/fa/minus.svg" class="cl-external-link-img" />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="column is-narrow" style="text-align: center">|</div>
|
||||||
|
<div class="column" style="text-align: center">
|
||||||
|
<div id="external-info-button" style="text-align: center">
|
||||||
|
<div style="cursor: pointer" id="externals_layout_button"
|
||||||
|
onclick="toggleExternalsLayout();">
|
||||||
|
<img id="id-externals-layout-img" class="cl-external-link-img"
|
||||||
|
src="/static/images/fa/list.svg" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="external_link_add_box" style="margin: 0.5rem" hidden="">
|
||||||
|
<div class="box is-fullwidth is" style="margin: 0; padding: 0.5rem">
|
||||||
|
<input class="input is-small" id="new_external_label" placeholder="Search Label" style="
|
||||||
|
margin: 0.25rem;
|
||||||
|
font-family: BlinkMacSystemFont, -apple-system, 'Segoe UI', Roboto,
|
||||||
|
Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans',
|
||||||
|
'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||||
|
" />
|
||||||
|
<input class="input is-small" id="new_external_link"
|
||||||
|
placeholder="Search Link (https://is.com/results?q=)" style="
|
||||||
|
margin: 0.25rem;
|
||||||
|
font-family: BlinkMacSystemFont, -apple-system, 'Segoe UI', Roboto,
|
||||||
|
Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans',
|
||||||
|
'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||||
|
" />
|
||||||
|
<input class="input is-small" id="new_external_icon"
|
||||||
|
placeholder="Icon Link (https://is.com/img.png)" style="
|
||||||
|
margin: 0.25rem;
|
||||||
|
font-family: BlinkMacSystemFont, -apple-system, 'Segoe UI', Roboto,
|
||||||
|
Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans',
|
||||||
|
'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||||
|
" />
|
||||||
|
</div>
|
||||||
|
<button class="button is-small is-outlined" id="external_input_add" style="
|
||||||
|
float: right;
|
||||||
|
margin: 0.5rem;
|
||||||
|
font-family: BlinkMacSystemFont, -apple-system, 'Segoe UI', Roboto,
|
||||||
|
Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans',
|
||||||
|
'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||||
|
">
|
||||||
|
Add
|
||||||
|
</button>
|
||||||
|
<button class="button is-small is-outlined is-danger" id="external_input_cancel" style="
|
||||||
|
float: right;
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
font-family: BlinkMacSystemFont, -apple-system, 'Segoe UI', Roboto,
|
||||||
|
Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans',
|
||||||
|
'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||||
|
">
|
||||||
|
Cancel
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div id="external_input_defaults" hidden="">
|
||||||
|
<button class="button is-small is-outlined is-danger" id="external_input_defaults_button" style="
|
||||||
|
float: right;
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
font-family: BlinkMacSystemFont, -apple-system, 'Segoe UI', Roboto,
|
||||||
|
Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans',
|
||||||
|
'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||||
|
">
|
||||||
|
Reset
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<br />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
@ -1,4 +1,3 @@
|
||||||
// detail-dataset.component.ts
|
|
||||||
import { Component, Vue, Prop } from "vue-facing-decorator";
|
import { Component, Vue, Prop } from "vue-facing-decorator";
|
||||||
import { DbDataset } from "@/models/dataset";
|
import { DbDataset } from "@/models/dataset";
|
||||||
import DatasetService from "../../services/dataset.service";
|
import DatasetService from "../../services/dataset.service";
|
||||||
|
|
@ -10,14 +9,11 @@ import { Suggestion } from "@/models/dataset";
|
||||||
import { VUE_API } from "@/constants";
|
import { VUE_API } from "@/constants";
|
||||||
// import DataMetricsBadge from "data-metrics-badge/dist/data-metrics-badge.js";
|
// import DataMetricsBadge from "data-metrics-badge/dist/data-metrics-badge.js";
|
||||||
// import DataMetricsBadge from "@/components/datacite/DataMetricsBadge.vue";
|
// import DataMetricsBadge from "@/components/datacite/DataMetricsBadge.vue";
|
||||||
import Minimap from '@/components/minimap/Minimap.vue';
|
|
||||||
import * as L from 'leaflet';
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
name: "DatasetDetailComponent",
|
name: "DatasetDetailComponent",
|
||||||
components: {
|
components: {
|
||||||
VsInput,
|
VsInput,
|
||||||
Minimap
|
|
||||||
// DataMetricsBadge, // Commented out but prepared for future use
|
// DataMetricsBadge, // Commented out but prepared for future use
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
@ -232,18 +228,4 @@ export default class DatasetDetailComponent extends Vue {
|
||||||
citation += ", Wien";
|
citation += ", Wien";
|
||||||
return citation;
|
return citation;
|
||||||
}
|
}
|
||||||
|
|
||||||
accessNotFromDoi(): boolean {
|
|
||||||
const host = window.location.host;
|
|
||||||
const parts = host.split(".");
|
|
||||||
if (parts[0] === "doi") {
|
|
||||||
console.log("From DOI");
|
|
||||||
// If in DOI subdomain, open external search in a new window
|
|
||||||
return false;
|
|
||||||
} else {
|
|
||||||
console.log("Not From DOI");
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,3 @@
|
||||||
<!-- detail-dataset.component.vue -->
|
|
||||||
<template v-if="datasetId">
|
<template v-if="datasetId">
|
||||||
|
|
||||||
<div class="container-fluid banner mz-5">
|
<div class="container-fluid banner mz-5">
|
||||||
|
|
@ -171,19 +170,13 @@
|
||||||
<!-- <data-metrics-badge v-bind:doi="dataset.identifier.value" display="small"></data-metrics-badge> -->
|
<!-- <data-metrics-badge v-bind:doi="dataset.identifier.value" display="small"></data-metrics-badge> -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="card">
|
|
||||||
<div class="column">
|
|
||||||
<!-- <h3 class="label uppercase">MAP</h3> -->
|
|
||||||
<Minimap :bounds="dataset.Bounds"></Minimap>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Sidebar card showing dataset keywords -->
|
<!-- Sidebar card showing dataset keywords -->
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="column">
|
<div class="column">
|
||||||
<h3 class="label uppercase">Schlüsselwörter/Keywords</h3>
|
<h3 class="label uppercase">Schlüsselwörter/Keywords</h3>
|
||||||
<p v-if="dataset.hasOwnProperty('subjects')">
|
<p v-if="dataset.hasOwnProperty('subjects')">
|
||||||
<!-- Iterate through subjects and display them as router links -->
|
<!-- Iterate through subjects and display them as router links -->
|
||||||
<span v-if="accessNotFromDoi()">
|
|
||||||
<span v-for="(subject, index) in dataset.subjects" :key="subject.value">
|
<span v-for="(subject, index) in dataset.subjects" :key="subject.value">
|
||||||
<router-link
|
<router-link
|
||||||
:to="{ name: 'Search', params: { display: subject.value, type: 'subjects' } }"
|
:to="{ name: 'Search', params: { display: subject.value, type: 'subjects' } }"
|
||||||
|
|
@ -194,11 +187,6 @@
|
||||||
<!-- Add a comma and space after each keyword except the last one -->
|
<!-- Add a comma and space after each keyword except the last one -->
|
||||||
<span v-if="index < dataset.subjects.length - 1">, </span>
|
<span v-if="index < dataset.subjects.length - 1">, </span>
|
||||||
</span>
|
</span>
|
||||||
</span>
|
|
||||||
|
|
||||||
<span v-else>
|
|
||||||
{{ dataset.subjects.map((u) => u.value).join(", ") }}
|
|
||||||
</span>
|
|
||||||
</p>
|
</p>
|
||||||
<p v-else>-</p>
|
<p v-else>-</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -356,13 +344,11 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import Minimap from "@/components/Minimap.vue";
|
|
||||||
import DatasetDetailComponent from "./dataset-detail.component";
|
import DatasetDetailComponent from "./dataset-detail.component";
|
||||||
export default DatasetDetailComponent;
|
export default DatasetDetailComponent;
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
// @import 'leaflet/dist/leaflet.css';
|
|
||||||
.section {
|
.section {
|
||||||
font-size: 0.8rem;
|
font-size: 0.8rem;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
|
|
||||||
|
|
@ -23,8 +23,7 @@
|
||||||
<!-- Display message if no results found -->
|
<!-- Display message if no results found -->
|
||||||
<div v-else-if="results.length == 0">
|
<div v-else-if="results.length == 0">
|
||||||
<div class="p-1 mb-0 text-sm bg-[#d8f4f7] rounded-lg" role="alert">
|
<div class="p-1 mb-0 text-sm bg-[#d8f4f7] rounded-lg" role="alert">
|
||||||
<!-- <span class="font-medium pl-5">Your search yielded <strong> 0</strong> results.</span> -->
|
<span class="font-medium pl-5">Your search yielded <strong> 0</strong> results.</span>
|
||||||
<span class="font-medium pl-5">Your search term</span> <span class="font-semibold">{{ "'" + stringSearchTerm + "'" }}</span> yielded <strong>0</strong> results:
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user