Commit 031a45ee authored by dindigala's avatar dindigala
Browse files

Merge branch 'develop' into feature/#19-Optimizing-panel

parents 27e973b1 7849735c
Pipeline #140873 passed with stages
in 2 minutes and 38 seconds
......@@ -15,6 +15,27 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- item is now highlighted when the user clicks a nav navbuttons
- click events are bound for the zoom icons are now bound to the embracing buttons instead of the icons
## [0.0.11] - 2020-06-19
### Added
- config option (index.html): switch off the headerbars individually (e.g. Infobar, NavBar, ToggleBar)
### Changed
- default itemlabel from `Page` to `Sheet`
- config options: labels for item and manifest are gathered under `labels`
- header can also be switched off completely by setting the appropriate value to *false*
### Fixed
- items are highlighted consecutively when browsing by navbuttons
## [0.0.10] - 2020-06-17
### Added
- config option (index.html): switch off the header including all of it's components
## [0.0.9] - 2020-06-16
### Added
......
......@@ -93,48 +93,71 @@ Locate the `index.template.html` file inside the root of your project dir and fi
```html
<script id="emo-config" type="application/json">
{
"entrypoint": "https://ahikar-test.sub.uni-goettingen.de/api/textapi/ahikar/3r9ps/collection.json",
"itemlabel": "Page",
"manifestlabel": "Manuscript",
"standalone": true,
"entrypoint": "https://{server}{/prefix}/{collection}/collection.json",
"headers": {
"all": true,
"info": false,
"navigation": true,
"toggle": true
},
"labels": {
"item": "Sheet",
"manifest": "Manuscript"
},
"panels": {
"image": true,
"text": true,
"metadata": false,
"treeview": false
}
"text": false,
"metadata": true,
"treeview": true
},
"standalone": true
}
</script>
```
### The keys in detail
- **entrypoint:**
- **entrypoint**
- to link the viewer to a backend, the entrypoint should point to the collection you want to be displayed. (Further details below: [Connecting the Viewer to a Backend](#connecting-the-viewer-to-a-backend))
- **itemlabel:**
- **headers**
- **all**
- set this value to `false` if you want to completely switch off all the headerbars at once. This value is preceeding. If it's set to false, the other settings for the individual bars are not taken into account.
*(A use case might be to embed the Viewer into an existing website and you simply need more space)*
- **info**
- set this value to `false` if you want to switch off the Infobar (breadcrumbs)
- **navigation**
- set this value to `false` if you want to switch off the NavBar
- **toggle**
- set this value to `false` if you want to switch off the ToggleBar. Please *note*: if you turn this one off, you won't be able to toggle the panels anymore
All header values default to **true**
- **labels**
- **item**
- the label of the item respectively
Assuming your collection consists of letters, you'd maybe want to name it "letter" or just "sheet" for instance.
This change affects the captions of the navigational tools, e.g. the navbuttons in the header as well as the prefix of each treenode displayed and the metadata section
Defaults to "**Page**"
- **manifestlabel:**
- same as above related to the manifest title
Defaults to **Sheet**
Defaults to "**Manuscript**"
- **standalone:**
- denotes if the Viewer will be used as a single page application on it's own or if it will be embedded into an existing page. If you want to use it in the latter case, please toggle the value to "false". That way the language toggle in the footer section will not show up.
- **manifest**
- same as for `item` but related to the manifest title
Defaults to "**true**" (Note: do not quote this value since it is a boolean)
Defaults to **Manuscript**
- **panels:**
- it's a nested object. It's keys correspond to the panelnames, e.g. "treeview", "text", "image", "metadata".
- **panels**
- It's keys correspond to the panelnames, e.g. "treeview", "text", "image", "metadata".
Set either value to **false** if you don't want the Viewer to show the appropriate panel/s.
Defaults to **true** for every panel
- **standalone**
- denotes if the Viewer will be used as a single page application on it's own or if it will be embedded into an existing page. If you want to use it in the latter case, please toggle the value to "false". That way the language toggle in the footer section will not show up.
Defaults to **true**
## Dockerfile
The dockerfile is used at GitLab CI.
......
<template>
<div id="q-app">
<q-layout view="hHh lpr fFf">
<Header
<Header v-if="config.headers.all"
:collectiontitle="collectiontitle"
:config="config"
:itemurls="itemurls"
......@@ -115,7 +115,7 @@ export default {
urls.push(
{
label: obj.id,
labelKey: `${this.config.itemlabel} ${ctr += 1}`,
labelKey: `${this.config.labels.item} ${ctr += 1}`,
handler: (node) => {
if (this.itemurl === node.label) {
return;
......
......@@ -35,7 +35,7 @@
<q-list>
<q-item>
<q-item-section class="text-h6 caps">
{{ config.manifestlabel }} {{ sequenceindex + 1 }} / {{ manifests.length }}
{{ config.labels.manifest }} {{ sequenceindex + 1 }} / {{ manifests.length }}
</q-item-section>
</q-item>
<q-item>
......@@ -51,7 +51,7 @@
<q-list>
<q-item>
<q-item-section class="text-h6 caps">
{{ config.itemlabel }} {{ itemindex + 1 }} / {{ itemcount }}
{{ config.labels.item }} {{ itemindex + 1 }} / {{ itemcount }}
</q-item-section>
</q-item>
<q-item>
......
......@@ -19,14 +19,14 @@
{{ captionprev }}
</q-btn>
<q-input
<!-- <q-input
color="teal"
class="q-mb-md"
dense
min="1"
standout
type="number"
:placeholder="config.itemlabel"
:placeholder="config.labels.item"
>
<template v-slot:append>
<q-icon
......@@ -34,7 +34,7 @@
size="20px"
/>
</template>
</q-input>
</q-input> -->
<q-btn
unelevated
......
<template>
<q-header elevated class="bg-white text-black">
<div class="bar row justify-between items-center">
<Infobar v-if="manifests.length"
<Infobar v-if="config.headers.info && manifests.length"
class="col-xs-12 q-pl-md"
:collectiontitle="collectiontitle"
:manifests="manifests"
......@@ -10,7 +10,7 @@
</div>
<div class="bar row q-px-md justify-sm-between">
<Navbar
<Navbar v-if="config.headers.navigation"
class="
col
col-md-6
......@@ -25,7 +25,7 @@
:manifests="manifests"
/>
<Togglebar
<Togglebar v-if="config.headers.toggle"
class="
col
col-md-auto
......
......@@ -24,15 +24,23 @@
<script id="emo-config" type="application/json">
{
"entrypoint": "https://ahikar-test.sub.uni-goettingen.de/api/textapi/ahikar/3r9ps/collection.json",
"itemlabel": "Page",
"manifestlabel": "Manuscript",
"standalone": true,
"headers": {
"all": true,
"info": true,
"navigation": true,
"toggle": true
},
"labels": {
"item": "Sheet",
"manifest": "Manuscript"
},
"panels": {
"image": true,
"text": true,
"metadata": true,
"treeview": true
}
},
"standalone": true
}
</script>
......
......@@ -24,13 +24,13 @@ export default {
return this.sequenceindex < this.sequencecount - 1
&& lastindexes[this.sequenceindex] === this.itemindex
? `Next ${this.config.manifestlabel}`
: `Next ${this.config.itemlabel}`;
? `Next ${this.config.labels.manifest}`
: `Next ${this.config.labels.item}`;
},
captionprev() {
return this.sequenceindex > 0 && this.firstiteminsequence === this.itemindex
? `Prev ${this.config.manifestlabel}`
: `Prev ${this.config.itemlabel}`;
? `Prev ${this.config.labels.manifest}`
: `Prev ${this.config.labels.item}`;
},
computedsequenceindex() {
const itemcount = this.itemspersequence;
......
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