Commit ecceda51 authored by Mathias Goebel's avatar Mathias Goebel 🎠
Browse files

chore: merge develop

parents 1aaeb657 46d99593
Pipeline #200328 passed with stages
in 4 minutes and 42 seconds
......@@ -2,6 +2,62 @@
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
## [1.11.0](https://gitlab.gwdg.de/subugoe/emo/Qviewer/compare/v1.10.0...v1.11.0) (2021-06-01)
### Features
* annotation panel shows annotation about current text type ([e6a3602](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/e6a36028375dd961d61e54f8ea89418033973458))
* default not highlight anything ([29155db](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/29155dbcab0e98ba4878995a31bbe170ffcba544))
* implement links functionality in annotations panel ([385244d](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/385244dbee2d58b7ed62d52a7117aa73e23a8004))
* to display a notification message if there are no annotations ([9482003](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/9482003e0e1b65ae4bf75bf6c5fd55132dde27f4))
### Bug Fixes
* refactored the logic of updating the annotations according to text types ([0b35918](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/0b35918baccbcd933b49df9591645d7fee31d416))
### Styling
* adjust icon size of annotations in text panel ([fe55b46](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/fe55b46c44c4c818afc3b6dfaa0dab2827e30671))
* adjust padding in tree view ([9ce0393](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/9ce0393cd6d3c0945b24c4faaf1efca1e1bca913)), closes [#255](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/issues/255)
* clean up panel toggles style ([df3fec1](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/df3fec110586857f3eaf2e98ad668a3d515fe83f)), closes [#258](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/issues/258)
* mark annotations in text panel ([b2bc222](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/b2bc222e8034419ea4ac77da33a67908073029c0))
* save space in annotations list ([72a1b7d](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/72a1b7dc616c8cdc3b81ccdfbc6a940f379f1e45)), closes [#261](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/issues/261)
### Docs
* adding explanation about linting exception ([045f616](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/045f61645ae38c6e0ec773757ac77cc6ae7352df))
* updated text according to review comments ([f102078](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/f10207842d159f211e4a38cc3181590685f75011))
### Refactoring
* changed notification title ([e684c2d](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/e684c2d50e1e6bbac9ee704dc2ee1fb8986040c0))
* move misc icons when header string is deactivated ([a56ec22](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/a56ec22ea868a05b121d1c14c3214fcc5b15a70f)), closes [#264](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/issues/264)
* refactor smallcaps css ([3e7959f](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/3e7959f18b48f5c3dccfce6670d97dc24fad660b)), closes [#259](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/issues/259)
* refactor TogglePanels ([45fbe13](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/45fbe13f3b4930b78dcd5c8bb00662ae79a484cd))
* updated style and added language change ([b85828a](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/b85828a0019bbd7c67b4ab3b0e52ace493f6f9a2))
* updated text style according to review comments ([7e6a20d](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/7e6a20d471c3252dee4324aaa75a2c6fdd84048c))
* used camel cases ([cb73038](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/cb730382d745173c207252d95e8aab440c42c362))
### Chore
* merge 'develop' into feature/[#237](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/issues/237)-annotation-links ([61d3cd4](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/61d3cd4b048af2d24fa23cac3a18f1f5811ff71a))
* merge branch 'develop' into feature/[#257](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/issues/257)-notifications ([dd589fc](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/dd589fcc512893c3369a74e54c8d8a75bd667803))
### Continuos Integration
* remove entry point ([0142122](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/014212243efcb80437c8322349054b704cb63abe))
* remove entry point ([3c63129](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/3c631299509c1d8c30b66667588ab43ff2da03bd))
* remove entry point ([4cdaefc](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/4cdaefce6ffc2a5ed00d04711ceaa32f326366c3))
* remove entry point ([0621347](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/0621347e73b9f44f632c57f8af12a3eb4421b8ab))
* remove entry point ([5e9afc2](https://gitlab.gwdg.de/subugoe/emo/Qviewer/-/commit/5e9afc2699919171f3cd048076f1ba6761b996bc))
## [1.10.0](https://gitlab.gwdg.de/subugoe/emo/Qviewer/compare/v1.9.0...v1.10.0) (2021-05-12)
......
{
"name": "@subugoe/tido",
"version": "1.10.0",
"version": "1.11.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
......
{
"name": "@subugoe/tido",
"version": "1.10.0",
"version": "1.11.0",
"description": "Text vIever for Digital Objects",
"productName": "TIDO",
"keywords": [
......
......@@ -20,6 +20,7 @@
<q-page-container class="root">
<router-view
:annotations="annotations"
:annotation-loading="annotationLoading"
:collection="collection"
:config="config"
:contenttypes="contentTypes"
......@@ -51,6 +52,7 @@ export default {
data() {
return {
annotations: [],
annotationLoading: false,
collection: {},
collectiontitle: '',
config: {},
......@@ -132,6 +134,9 @@ export default {
* @param string url
*/
async getAnnotations(url) {
this.annotations = [];
this.annotationLoading = false;
try {
const annotations = await this.request(url);
......@@ -150,6 +155,8 @@ export default {
} catch (err) {
this.annotations = [];
this.$q.notify({ message: 'No annotations available' });
} finally {
this.annotationLoading = true;
}
},
/**
......
......@@ -5,7 +5,7 @@
>
<q-list>
<q-item
v-for="annotation in filterAnnotationTypes(annotations)"
v-for="annotation in hotAnnotations"
:id="'list' + annotation.strippedId"
:key="annotation.strippedId"
clickable
......@@ -24,7 +24,7 @@
</q-item-section>
<q-item-section>
{{ annotation.body.value }}
<AnnotationUrls :content="annotation.body.value" />
</q-item-section>
</q-item>
</q-list>
......@@ -57,21 +57,34 @@
</q-page-sticky>
</div>
<div v-else>
<p>One does not simply show annotations.</p>
<div
v-else
class="q-pa-sm"
>
<Notification :message="$t(messages.none)" />
</div>
</template>
<script>
import * as Icons from '@quasar/extras/fontawesome-v5';
import AnnotationUrls from '@/components/urls.vue';
import Notification from '@/components/notification.vue';
export default {
name: 'Annotations',
components: {
AnnotationUrls,
Notification,
},
props: {
annotations: {
type: Array,
default: () => [],
},
annotationLoading: {
type: Boolean,
default: false,
},
config: {
type: Object,
default: () => {},
......@@ -79,27 +92,35 @@ export default {
},
data() {
return {
messages: {
none: 'noAnnotationMessage',
},
ids: [],
hotAnnotations: [],
};
},
computed: {
configuredTypes() {
const types = [];
this.config.annotations.types.forEach((type) => types.push(type.contenttype));
return types;
return this.config.annotations.types.map((type) => type.contenttype);
},
},
created() {
this.icons = Icons;
},
mounted() {
this.$root.$on('update-content', async () => {
await new Promise((resolve) => setTimeout(resolve, 1000));
this.$root.$on('update-annotations', (content) => {
const parser = new DOMParser();
const doc = parser.parseFromString(content, 'text/html');
const ids = [...document.querySelectorAll('.ab')].map((x) => x.id);
this.ids = [...doc.body.querySelectorAll('[id]')].map((el) => el.getAttribute('id'));
this.ids = ids;
const interval = setInterval(() => {
if (this.annotationLoading) {
this.hotAnnotations = this.filterAnnotationTypes();
clearInterval(interval);
}
}, 500);
});
},
methods: {
......@@ -108,7 +129,7 @@ export default {
const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
svg.setAttribute('aria-hidden', 'true');
svg.setAttribute('class', 'q-icon q-ml-sm');
svg.setAttribute('class', 'q-icon q-ml-xs');
svg.setAttribute('focusable', 'false');
svg.setAttribute('role', 'presentation');
svg.setAttribute('viewBox', viewBox);
......@@ -124,24 +145,19 @@ export default {
/**
* filter the configured annotation types (index.html)
*
* @return array of annotations excluding unconfigured ones
* @returns array of annotations
*/
filterAnnotationTypes() {
const types = [];
this.annotations.forEach((annotation) => {
let id = annotation.target.id.split('/');
return this.annotations.filter((annotation) => {
const annotationIds = this.ids.includes(this.stripAnnotationId(annotation.target.id));
id = id[id.length - 1];
if (this.configuredTypes.filter((type) => type === annotation.body['x-content-type']).length > 0 && this.ids.some((x) => id.startsWith(x))) {
types.push(annotation);
// function is triggered on list rendering, so we use it as init call to set up the text
if (this.configuredTypes.find((type) => type === annotation.body['x-content-type']) && annotationIds) {
this.setText(annotation);
annotation.status = this.config.annotations.show;
annotation.strippedId = this.stripAnnotationId(annotation.target.id);
}
return true;
});
return types;
},
getIcon(contentType) {
......@@ -201,24 +217,25 @@ export default {
};
</script>
<style>
<style lang="scss">
/* not in scope to style the text */
.q-item__section--avatar {
min-width: 24px;
}
.q-item__section--side {
padding-right: unset;
}
.q-item {
min-height: unset;
}
.annotation {
border-bottom: 2px solid;
padding-bottom: 2px;
background-color: $grey-4;
border-bottom: 1px solid;
/**
* adding a linting exception here,
* because 1px is invalid, but needed here
* adding a global rule for this would introduce unnecessary error proneness
*/
/* stylelint-disable */
margin: 0 1px;
padding: 1px 1px 2px 1px;
/* stylelint-enable */
white-space: nowrap;
@media (prefers-color-scheme: dark) {
background-color: $grey-9;
}
}
.annotation-disabled {
......@@ -231,3 +248,17 @@ export default {
}
</style>
<style lang="scss" scoped>
.q-item {
min-height: unset;
}
.q-item__section--avatar {
min-width: 24px;
}
.q-item__section--side {
padding-right: unset;
}
</style>
......@@ -112,15 +112,16 @@ export default {
fontsize() {
this.$refs.contentsize.style.fontSize = `${this.fontsize}px`;
},
activeTab(url) {
this.request(url, 'text').then((data) => {
if (this.supportType) {
this.getSupport(this.manifests[0].support);
}
this.content = data;
this.$root.$emit('update-content');
});
async activeTab(url) {
const data = await this.request(url, 'text');
if (this.supportType) {
this.getSupport(this.manifests[0].support);
}
this.content = data;
this.$root.$emit('update-annotations', data);
},
},
async created() {
......@@ -175,20 +176,20 @@ export default {
</script>
<style lang="scss" scoped>
.rtl {
direction: rtl;
}
.default-cursor {
cursor: default !important;
}
.item-content {
display: flex;
flex: 1;
flex-direction: column;
height: 100vh;
overflow: auto;
padding: 8px;
}
.rtl {
direction: rtl;
}
.default-cursor {
cursor: default !important;
}
.item-content {
display: flex;
flex: 1;
flex-direction: column;
height: 100vh;
overflow: auto;
padding: 8px;
}
</style>
<template>
<q-header :class="$q.dark.isActive ? 'bg-dark' : 'bg-secondary text-primary'">
<div class="header__wrap">
<q-toolbar>
<q-toolbar v-if="config.headers.info">
<Infobar
v-if="config.headers.info && manifests.length"
class="col-xs-9"
......@@ -10,6 +10,7 @@
:manifests="manifests"
/>
<div class="row no-wrap justify-end col-xs-3">
<!-- TODO: make component out of the following and re-use it to avoid duplication -->
<Language
v-if="standalone"
:config="config"
......@@ -34,6 +35,19 @@
v-if="config.headers.toggle"
:panels="panels"
/>
<div
v-if="!config.headers.info"
class="row no-wrap justify-end col-xs-3"
>
<!-- TODO: make component out of the following and re-use it to avoid duplication -->
<Language
v-if="standalone"
:config="config"
/>
<Color :projectcolors="projectcolors" />
<Softwareinfo />
</div>
</q-toolbar>
</div>
</div>
......
<template>
<q-card
bordered
flat
>
<q-card-section class="text-center">
<q-icon
:name="fasInfoCircle"
class="q-pr-sm"
color="red-9"
size="sm"
/>
<span class="text-body1 text-uppercase vertical-middle">{{ $t('notificationTitle') }}</span>
</q-card-section>
<q-separator inset />
<q-card-section class="text-body2 text-center">
{{ message }}
</q-card-section>
</q-card>
</template>
<script>
import { fasInfoCircle } from '@quasar/extras/fontawesome-v5';
export default {
name: 'Notification',
props: {
message: {
type: String,
default: () => '',
},
},
data() {
return {
};
},
created() {
this.fasInfoCircle = fasInfoCircle;
},
};
</script>
......@@ -35,6 +35,8 @@ export default {
Manuscript: 'Manuskript',
Metadata: 'Metadaten',
next: 'Näch.',
notificationTitle: 'Keine Annotationen verfügbar',
noAnnotationMessage: 'Die aktuelle Ansicht enthält keine Annotationen.',
Origin: 'Ursprung',
osdFullPage: 'Vollbildmodus wechseln',
osdHome: 'Ansicht zurücksetzen',
......
......@@ -35,6 +35,8 @@ export default {
Manuscript: 'Manuscript',
Metadata: 'Metadata',
next: 'Next',
notificationTitle: 'No Annotations available',
noAnnotationMessage: 'The current view has no annotations to display.',
Origin: 'Origin',
osdFullPage: 'Toggle full page',
osdHome: 'Go home',
......
......@@ -85,6 +85,10 @@ export default {
type: Array,
default: () => [],
},
annotationLoading: {
type: Boolean,
default: false,
},
collection: {
type: Object,
default: () => {},
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment