diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md
new file mode 100644
index 000000000..5efafaed4
--- /dev/null
+++ b/.github/ISSUE_TEMPLATE/feature_request.md
@@ -0,0 +1,20 @@
+---
+name: Feature request
+about: Suggest a feature to be implemented in Edirom
+title: "[ftr]"
+labels: 'Type: feature request'
+assignees: ''
+
+---
+
+**Is your feature request related to a problem? Please describe.**
+A clear and concise description of what the problem is.
+
+**Describe the solution you'd like**
+A clear and concise description of what you want to happen.
+
+**Describe alternatives you've considered**
+A clear and concise description of any alternative solutions or features you've considered.
+
+**Additional context**
+Add any other context or screenshots about the feature request here.
diff --git a/.github/ISSUE_TEMPLATE/problem-report.md b/.github/ISSUE_TEMPLATE/problem-report.md
new file mode 100644
index 000000000..c3dffd459
--- /dev/null
+++ b/.github/ISSUE_TEMPLATE/problem-report.md
@@ -0,0 +1,38 @@
+---
+name: Problem report
+about: Create a report to a problem
+title: "[BUG]"
+assignees: ''
+
+---
+
+**Describe the problem**
+A clear and concise description of what the problem is.
+
+**To Reproduce**
+Steps to reproduce the behavior, e.g.:
+1. Go to '...' [e.g. https://klarinettenquintett.weber-gesamtausgabe.de]
+2. Click on '....'
+3. Scroll down to '....'
+4. See error
+
+**Expected behavior**
+A clear and concise description of what you expected to happen.
+
+**Data**
+Please provide a link to your data (e.g. https://github.com/Edirom/EditionExample) to see the problem or an extract of your data to reproduce the problem.
+
+**Edirom information**
+ - Version of Edirom [e.g. Release v1.0.0-beta.4 (Emeritus), see [releases](https://github.com/Edirom/Edirom-Online/releases)]
+ - Add any other context, that might be helpful
+
+**Environment information**
+- Browser [e.g. Chrome, Safari, Firefox]
+- Version of your MEI files [e.g. 5.0]
+- Add any other context, that might be helpful
+
+**Screenshots**
+If applicable, add screenshots to help explain your problem.
+
+**Additional context**
+Add any other context about the problem here.
diff --git a/.github/images/EdiromOnline_BargheerFiedellieder_2013.jpg b/.github/images/EdiromOnline_BargheerFiedellieder_2013.jpg
new file mode 100644
index 000000000..92ef084c7
Binary files /dev/null and b/.github/images/EdiromOnline_BargheerFiedellieder_2013.jpg differ
diff --git a/.github/images/EdiromOnline_WeberFreischuetz_2015.jpg b/.github/images/EdiromOnline_WeberFreischuetz_2015.jpg
new file mode 100644
index 000000000..f2ce99f34
Binary files /dev/null and b/.github/images/EdiromOnline_WeberFreischuetz_2015.jpg differ
diff --git a/.github/images/EdiromOnline_WeberKlarinettenquintettOp34_2022.jpg b/.github/images/EdiromOnline_WeberKlarinettenquintettOp34_2022.jpg
new file mode 100644
index 000000000..8c8637790
Binary files /dev/null and b/.github/images/EdiromOnline_WeberKlarinettenquintettOp34_2022.jpg differ
diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
new file mode 100644
index 000000000..d78f1945a
--- /dev/null
+++ b/.github/pull_request_template.md
@@ -0,0 +1,26 @@
+## Description, Context and related Issue
+
+
+
+Refs #
+
+## How Has This Been Tested?
+
+
+
+## Types of changes
+
+- [ ] Bug fix (non-breaking change which fixes an issue)
+- [ ] New feature (non-breaking change which adds functionality)
+- [ ] Breaking change (fix or feature that would cause existing functionality to change)
+- [ ] Documentation Update
+
+## Checklist
+
+
+- [ ] My change requires a change to the documentation.
+- [ ] I have updated the documentation accordingly.
+- [ ] I have performed a self-review of my code
+- [ ] I have read the [CONTRIBUTING](https://github.com/Edirom/Edirom-Online/blob/develop/CONTRIBUTING.md) document.
+- [ ] I have added tests to cover my changes.
+- [ ] All new and existing tests passed.
diff --git a/.github/workflows/pre-release.yml b/.github/workflows/pre-release.yml
index e88f94a7d..965e7f225 100644
--- a/.github/workflows/pre-release.yml
+++ b/.github/workflows/pre-release.yml
@@ -23,7 +23,9 @@ jobs:
steps:
- name: Chekout repository
- uses: actions/checkout@a5ac7e51b41094c92402da3b24376905380afc29 # v4.1.6
+ uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7
+ with:
+ submodules: 'recursive'
- name: Get short sha
uses: benjlevesque/short-sha@599815c8ee942a9616c92bcfb4f947a3b670ab0b # v3.0
@@ -36,7 +38,7 @@ jobs:
- name: Upload Artifacts to action run
if: github.repository == 'Edirom/Edirom-Online'
- uses: actions/upload-artifact@65462800fd760344b1a7b4382951275a0abb4808 # v4.3.3
+ uses: actions/upload-artifact@50769540e7f4bd5e21e526ee35c689e35e0d6874 # v4.4.0
with:
# The name that the artifact will be made available under
name: EdiromOnline_${{ steps.short-sha.outputs.sha }}.zip
diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md
new file mode 100644
index 000000000..dcf292b6c
--- /dev/null
+++ b/CODE_OF_CONDUCT.md
@@ -0,0 +1,133 @@
+
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+We as members, contributors, and leaders pledge to make participation in our
+community a harassment-free experience for everyone, regardless of age, body
+size, visible or invisible disability, ethnicity, sex characteristics, gender
+identity and expression, level of experience, education, socio-economic status,
+nationality, personal appearance, race, caste, color, religion, or sexual
+identity and orientation.
+
+We pledge to act and interact in ways that contribute to an open, welcoming,
+diverse, inclusive, and healthy community.
+
+## Our Standards
+
+Examples of behavior that contributes to a positive environment for our
+community include:
+
+* Demonstrating empathy and kindness toward other people
+* Being respectful of differing opinions, viewpoints, and experiences
+* Giving and gracefully accepting constructive feedback
+* Accepting responsibility and apologizing to those affected by our mistakes,
+ and learning from the experience
+* Focusing on what is best not just for us as individuals, but for the overall
+ community
+
+Examples of unacceptable behavior include:
+
+* The use of sexualized language or imagery, and sexual attention or advances of
+ any kind
+* Trolling, insulting or derogatory comments, and personal or political attacks
+* Public or private harassment
+* Publishing others' private information, such as a physical or email address,
+ without their explicit permission
+* Other conduct which could reasonably be considered inappropriate in a
+ professional setting
+
+## Enforcement Responsibilities
+
+Community leaders are responsible for clarifying and enforcing our standards of
+acceptable behavior and will take appropriate and fair corrective action in
+response to any behavior that they deem inappropriate, threatening, offensive,
+or harmful.
+
+Community leaders have the right and responsibility to remove, edit, or reject
+comments, commits, code, wiki edits, issues, and other contributions that are
+not aligned to this Code of Conduct, and will communicate reasons for moderation
+decisions when appropriate.
+
+## Scope
+
+This Code of Conduct applies within all community spaces, and also applies when
+an individual is officially representing the community in public spaces.
+Examples of representing our community include using an official email address,
+posting via an official social media account, or acting as an appointed
+representative at an online or offline event.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported to the community leaders responsible for enforcement at
+info@edirom.de.
+All complaints will be reviewed and investigated promptly and fairly.
+
+All community leaders are obligated to respect the privacy and security of the
+reporter of any incident.
+
+## Enforcement Guidelines
+
+Community leaders will follow these Community Impact Guidelines in determining
+the consequences for any action they deem in violation of this Code of Conduct:
+
+### 1. Correction
+
+**Community Impact**: Use of inappropriate language or other behavior deemed
+unprofessional or unwelcome in the community.
+
+**Consequence**: A private, written warning from community leaders, providing
+clarity around the nature of the violation and an explanation of why the
+behavior was inappropriate. A public apology may be requested.
+
+### 2. Warning
+
+**Community Impact**: A violation through a single incident or series of
+actions.
+
+**Consequence**: A warning with consequences for continued behavior. No
+interaction with the people involved, including unsolicited interaction with
+those enforcing the Code of Conduct, for a specified period of time. This
+includes avoiding interactions in community spaces as well as external channels
+like social media. Violating these terms may lead to a temporary or permanent
+ban.
+
+### 3. Temporary Ban
+
+**Community Impact**: A serious violation of community standards, including
+sustained inappropriate behavior.
+
+**Consequence**: A temporary ban from any sort of interaction or public
+communication with the community for a specified period of time. No public or
+private interaction with the people involved, including unsolicited interaction
+with those enforcing the Code of Conduct, is allowed during this period.
+Violating these terms may lead to a permanent ban.
+
+### 4. Permanent Ban
+
+**Community Impact**: Demonstrating a pattern of violation of community
+standards, including sustained inappropriate behavior, harassment of an
+individual, or aggression toward or disparagement of classes of individuals.
+
+**Consequence**: A permanent ban from any sort of public interaction within the
+community.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage],
+version 2.1, available at
+[https://www.contributor-covenant.org/version/2/1/code_of_conduct.html][v2.1].
+
+Community Impact Guidelines were inspired by
+[Mozilla's code of conduct enforcement ladder][Mozilla CoC].
+
+For answers to common questions about this code of conduct, see the FAQ at
+[https://www.contributor-covenant.org/faq][FAQ]. Translations are available at
+[https://www.contributor-covenant.org/translations][translations].
+
+[homepage]: https://www.contributor-covenant.org
+[v2.1]: https://www.contributor-covenant.org/version/2/1/code_of_conduct.html
+[Mozilla CoC]: https://github.com/mozilla/diversity
+[FAQ]: https://www.contributor-covenant.org/faq
+[translations]: https://www.contributor-covenant.org/translations
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index e07179ce3..9c4c8f89d 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -1,208 +1,58 @@
# Edirom Online Contributing Guidelines
-# General Guidelines
+- [How to contribute](#how-to-contribute)
+ * [Bug reports](#bug-reports)
+ * [Feature requests](#feature-requests)
+ * [Contributing code and documentation](#contributing-code-and-documentation)
+ + [Commit messages](#commit-messages)
+- [Release Process](#release-process)
+- [Versioning](#versioning)
-* do not combine code-linting and content work in one commit
+## How to contribute
-## Whitespace handling
+Edirom-Online is a free and open-source software and we appreciate to receive contributions from our community!
+So first of all, thank you for considering contributing to Edirom-Online! When you do so, please try to follow these guidelines.
-1. Use whitespaces, not tabs to indent code
-2. Close file with a newline character
+### Bug reports
-# XQuery Styleguide
+If you think you found a bug in Edirom-Online, first please search our [issues list](https://github.com/Edirom/Edirom-Online/issues) in case a similar issue has already been opened. If not, please [open an issue](https://github.com/Edirom/Edirom-Online/issues/new?assignees=&labels=&projects=&template=problem-report.md&title=%5BBUG%5D). We implemented a [template](https://github.com/Edirom/Edirom-Online/blob/develop/.github/ISSUE_TEMPLATE/problem-report.md) for problems and bugs to get as much information about the bug as possible, e.g. how the problem can be reproduced. Provide as much information as you can.
-For formatting of XQuery files we generally rely on the basic configuration of Synchrosoft’s oXygen XML software family and its “Format & Indent” function.
+### Feature requests
-## xqDoc
+If you think, Edirom-Online should have a feature that does not exist already, please search our [issues list](https://github.com/Edirom/Edirom-Online/issues) in case a wish for a similar feature was already reported. If not, please [open an issue](https://github.com/Edirom/Edirom-Online/issues/new?assignees=&labels=Type%3A+feature+request&projects=&template=feature_request.md&title=%5Bftr%5D) and describe the feature using our [template](https://github.com/Edirom/Edirom-Online/blob/develop/.github/ISSUE_TEMPLATE/feature_request.md) for new features.
-We use [xqDoc](https://xqdoc.org) for documenting the XQueries in this repository. Please refer to the section [xqDoc Comments](https://xqdoc.org/xqdoc_comments_doc.html) of the xqDoc-website for details on formatting the documentation comment blocks.
+### Contributing code and documentation
-* XQuery modules must have a library module xqDoc comment preceding the module declaration.
-* Function declarations must have a library module xqDoc function comment preceding the function.
+If you would like to contribute to Edirom-Online developing a new feature or working on a bug fix, your contribution is highly appreciated and we kindly ask you to take the following guidelines into concern.
+The active contributors have agreed to organise their work along the so-called 'git-flow-workflow' ([Driessen 2010](https://nvie.com/posts/a-successful-git-branching-model/)) to foster a clean and traceable development process. The following instructions will ensure this workflow.
-## XQuery document structure
+* Check the [network graph](https://github.com/Edirom/Edirom-Online/network) to see all the other forks of other persons to make sure, nobody else is already working on the topic, you want to start to address.
+* Please discuss your idea first in an [issue](https://github.com/Edirom/Edirom-Online/issues). If there is no issue for your idea yet, please **open an issue**. There might be different ways to solve a problem and we want to make sure to find the right approach before spending time on a PR that cannot be merged.
+* **Fork** the `Edirom/Edirom-Online` repository into your own account, e.g. `username/Edirom-Online`. (Exception: If you plan to develop in a team (only in this case!), open a dedicated branch on the Edirom-Online repository.)
+* Create a **dedicated branch** for your fix or feature on your repository, e.g. `ftr-some-new-feature`.
+* Make your changes, while you can commit to your branch as many times as you like.
+* It is essential to **test** your modifications before committing or issuing a pull request. A recommended way is running a local eXist-db v5.3.0+ container and deploying your local build of Edirom Online together with some test-data, e.g. the [Edirom Edition Example](https://github.com/Edirom/EditionExample). For other deployment methods, please see our documentation in the [wiki](https://github.com/Edirom/Edirom-Online/wiki).
+* After finishing your work, you can open a **pull request** to `Edirom/Edirom-Online` and fill in our [PR-template](https://github.com/Edirom/Edirom-Online/tree/develop/.github/pull_request_template.md) to describe what your pull request wants to implement. Make sure, that you MUST address the developer-branch.
+* Each pull request should implement ONE feature or bugfix. If you want to add or fix more than one thing, submit more than one pull request.
+* Your submission will be **reviewed** afterwards. If you are asked to make changes, you can push these changes to your original branch and the pull request will be automatically updated.
+* You may then delete your dedicated branch, after your pull request was merged into the `Edirom/Edirom-Online` repository.
-### XQuery version declaration
+#### Commit messages
-```xquery
-xquery version 3.1;
-```
+Please make sure to provide meaningful and understandable commit messsages, that should have the following structure and content:
+* `summary`: use imperative and summarize changes in around 50 characters or less, e.g. "Remove deprecated methods"
+* `body`: explain what, why and how e.g. "This commit adds ... Specifically, we have added ..."
+* `footer`: reference or close issues using e.g. `Refs #123, 456` or `Refs #206`or `Fixes #210` or `Closes #789`
-### Beginning comments
+## Release Process
-For now, the beginning comments should only include the following:
+Releases are discussed and declared by the Edirom community. The planned scope of features and bug fixes of upcoming releases can be read from corresponding [milestones](https://github.com/Edirom/Edirom-Online/milestones), and eventually you can also see here where contributions are most urgent needed. The Edirom community uses the functionality of Github projects to track the development of Edirom-Online using the project [Edirom Development](https://github.com/orgs/Edirom/projects/4/views/1).
-```xquery
-(:
- : Copyright: For LICENSE-Details please refer to the LICENSE file in the root directory of this repository.
- :)
+The most recent 'stable' version of MEI is always found on the 'main' branch, where all releases are tagged from. The most recent 'work in progress' is found on the 'develop' branch.
- ```
-The beginning comments and the structuring comments (see below) of the prolog are separated by a blank line.
+## Versioning
-### Prolog
+The Edirom-Online Versions follow the ['semantic' versioning scheme](http://semver.org), 'X.Y.Z'. 'X' is a major release, often defined by the presence of backward-incompatible changes to the schema. 'Y' is a minor release, defined by backward compatible changes (i.e., added, but not removed, features). 'Z' is the 'patch' number, indicating a release that fixes or clarifies existing functionality.
-1. The parts of the prolog, are introduced by a comment followed by a new line.
-2. The below form of the comments and the order of the parts is prescriptive.
-3. Each part of the prolog ends with a blank line.
-```xquery
-(: IMPORTS ================================================================= :)
-
-```
-
-Sort imports by type:
-1. All `import module namespace` statements registered with eXist-db
-2. All `import module namespace` statements of custom modules that are not registered with eXist-db. Always use relative URIs for unregistered `import module namespace` statements.
-3. Separate groups with a blank line.
-4. In the groups sort alphabetically by prefix.
-
-```xquery
-(: NAMESPACE DECLARATIONS ================================================== :)
-
-```
-
-All `declare namespace` statements, sorted alphabetically by prefix.
-
-```xquery
-(: OPTION DECLARATIONS ===================================================== :)
-
-
-```
-All `declare option` statements.
-
-```xquery
-(: VARIABLE DECLARATIONS =================================================== :)
-
-```
-1. Use `declare variable` statements for all required external parameters
-2. All global variable declarations, i.e. `declare variable` statements.
-3. Separate these two groups with a blank line.
-4. In the groups, sort alphabetically.
-
-```xquery
-(: FUNCTION DECLARATIONS =================================================== :)
-
-```
-
-1. All `declare function` statements.
-2. All function declarations have to be preceded by an xqDoc comment.
-3. The xqDoc comment and function declaration belonging together are not separated by blank lines – not even one ;-)
-4. The comment-function-groups are separated by blank lines.
-
-A prototypical example:
-
-```xquery
-(: FUNCTION DECLARATIONS =========================================== :)
-
-(:~
- :
- :)
-declare function eg:addComment($comment as xs:string, $function as function())
-as xs:string
-{
- …
-}
-
-(:~
- :)
-declare function eg:addComment($comment as xs:string, $function as function())
-as xs:string
-{
- …
-}
-```
-
-### Query body
-
-The Query body start after a structuring comment as follows:
-
-```xquery
-(: QUERY BODY ============================================================== :)
-
-```
-
-#### Strings
-
-Note: this is derived from the current usage in Edirom-Online code
-
-* escape with U+00027 APOSTROPHE: `'`
-
-### Literal results
-
-TODO: how should literal results be indented, especially when they are long, e.g., as in the case of [getAudioPlayer.xql](add/data/xql/getAudioPlayer.xql).
-
-### let statements
-
-Short variable definitions should be in a single line:
-
-```xquery
-let $lang := 'de'
-```
-
-Longer assignments, especially when the contain if-else-statements or FLWOR-expressions, should break after `:=` and then indent a further level, before following the rules applicable to the respective statements, e.g.:
-
-```xquery
-let $elems :=
- for $p in $participants
- let $id := substring-after($p, '#')
- return doc($doc)/id($id)
-```
-
-### Function declarations
-
-```xquery
-(:~
- : XQdoc comment
- :
- …
- :
- :)
-declare function prefix:function-name( $paramOne as datatype, §paramTwo as datatype )
-as datatype
-{
- …
-};
-
-```
-
-- [ ] at the moment return datatypes and opening curly braces of function declarations are still in the same line as the `declare function` statement
-- [ ] break long function argument
-
-### HowTo ToDo:s
-
-- [ ] literal results formatting
-- [ ] nested return statements
-- [ ] parenthesis placement
-
-
-# Javascript
-
-## AJAX calls
-
-The class `EdiromOnline.controller.AJAXController` provides a central method `doAJAXRequest` for performing AJAX requests. The method is provided globally as `window.doAJAXRequest`.
-
-`doAJAXRequest` takes the following arguments:
-
-* `url`: The URL of the requestet site or end point.
-* `method`: The HTTP method like `PUT`, `GET`, `POST`.
-* `params`: An object containing key-value-pairs of parameters for the request.
-* `successFn`: A callback function which is called when the AJAX request was successfull.
-* `retryNo`: The number of retries, if the requests fails. Standard is 2 retries.
-* `async`: Defines the async parameter for AJAX calls. Default is 'true'.
-
-An example of using the function would be:
-
-```javascript
-window.doAJAXRequest('data/xql/getAnnotationMeta.xql',
- 'GET',
- {
- uri: uri,
- lang: lang
- },
- Ext.bind(function(response){
- view.setMeta(response.responseText);
- }, this)
-);
-```
diff --git a/README.md b/README.md
index 49a4b0d66..b3d3e9676 100644
--- a/README.md
+++ b/README.md
@@ -1,14 +1,60 @@
-[](https://github.com/Edirom/Edirom-Online/actions/workflows/docker-ci.yml)
+[](https://github.com/Edirom/Edirom-Online/actions/workflows/docker-ci.yml) [](https://nfdi4culture.de/id/E3648) [](CODE_OF_CONDUCT.md)
-# Edirom Online
+
+
+**[Show cases](https://github.com/Edirom/Edirom-Online#-Show-cases) •
+[Get started](https://github.com/Edirom/Edirom-Online#-Get-started) •
+[Dependencies](https://github.com/Edirom/Edirom-Online#-Dependencies) •
+[Roadmap](https://github.com/Edirom/Edirom-Online#-Roadmap) •
+[Contributing](https://github.com/Edirom/Edirom-Online#-Contributing) •
+[Get in touch](https://github.com/Edirom/Edirom-Online#-Get-in-touch) •
+[Code of Conduct](https://github.com/Edirom/Edirom-Online#-Code-of-Conduct) •
+[License](https://github.com/Edirom/Edirom-Online#-License)**
-Edirom Online is a web application written in XQuery and JavaScript, and designed for deployment in [eXist-db](https://exist-db.org/). It is based on the work of the [_Edirom_-Project](https://edirom.de/edirom-projekt/) that originally was funded by the German Research Foundation (DFG). This software brings paperbased historio-critical editions of music texts to the web.
+
-The software is still under high development and has to be seen as beta software.
+# Edirom-Online
-## Cloning this repository
+Edirom-Online is a software for the **presentation and analysis of critical musical editions** in a digital format, particularly in the fields of musicology and philology. Edirom-Online supports various data formats commonly used in digital humanities, such as [TEI] (Text Encoding Initiative) for textual data and [MEI] (Music Encoding Initiative) for musical data, that is visualized with [Verovio]. This allows for the integration of different data formats, starting in the early days with texts, images and music and adding audio and even film within a single edition.
+The Edirom idea was born in 2004 at [Musikwissenschaftliches Seminar Detmold/Paderborn] and even after several years of Edirom development, the success of Edirom based on the same core concepts as in the beginning continues with numerous projects using and developing Edirom tools and creating digital musical editions with this software. Edirom tools were originally developed by the project [Entwicklung von Werkzeugen für digitale Formen wissenschaftlich-kritischer Musikeditionen] (2006–2012) funded by the DFG. The development of Edirom is now maintained as a community effort while being strongly supported and accompanied by [Virtueller Forschungsverbund Edirom] (ViFE), primarily based at [Paderborn University]. ViFE aims to provide tools for scholars working with digital texts and music, especially those involved in editing historical documents.
-Since this repository uses submodules for e.g. fonts, it is necessary to clone the repository with the recursive addition.
+## Show cases
+
+To get some practical insights, look at these projects and editions that already use Edirom-Online.
+
+**Clarinet quintet op.34 by Weber**
+
+The third version of Webers clarinet quintet op.34 was created 2022 by Virtueller Forschungsverbund Edirom (ViFE) honoring Prof. Dr. Joachim Veit on the occasion of his retirement. The edition includes digital facsimiles, music that is encoded in MEI and visualized with , annotations and texts.
+ * publication of [Webers clarinet quintet]
+
+ 
+
+**Freischütz Digital**
+
+The digital edition of Webers Freischütz was developed by the project "[Freischütz Digital] – Paradigmatische Umsetzung eines genuin digitalen Editionskonzepts" (BMBF, 2012–2015). Several demonstrators were developed and integrated into the Edirom-Online, e.g. 'Dynamic Score Rendering' and 'Genetic Text Stages'.
+ * publication of [Webers Freischütz]
+ * code of [Freischütz: Edirom-Online]
+
+
+
+**Bargheer: Fiedellieder plus**
+
+"Carl Louis Bargheer: Fiedellieder plus - Eine digitale Edition" was created 2013 as a students project at Musikwissenschaftliches Seminar Detmold/Paderborn with an early version of Edirom-Online.
+ * publication of [Bargheers Fiedellieder]
+ * code of [Bargheer: Edirom-Online]
+ * data of [Bargheer: Edition]
+
+ 
+
+
+## Get started
+
+Edirom Online is a web application written in XQuery and JavaScript, and designed for deployment in [eXist-db].
+Please be aware, the software is still under high development and has to be seen as beta software.
+
+### Cloning this repository
+
+Since this repository uses submodules for e.g. fonts, it is necessary to clone the repository recursively.
```bash
git clone --recursive
@@ -20,39 +66,101 @@ If the submodules are not yet present after cloning, you can update them with:
git submodule update --init --recursive
```
-## Dependencies
-
-Edirom Online depends heavily on the JavaScript framework [Ext JS](https://www.sencha.com/products/extjs) which is included in parts in our code base. We use Ext JS 4.2.1 in the GPL version. Edirom Online also includes the Raphaël javscript library (, MIT License) and the ACE editor (, BSD license).
-
-## Contributing
-
### Building locally
-For building Edirom Online you need *Sencha Cmd* installed on your system. You might want to refer to the [Sencha Cmd System Setup](https://docs.sencha.com/cmd/7.5.0/guides/intro_to_cmd.html#intro_to_cmd_-_system_setup) section for more details.
+For building Edirom Online you need *Sencha Cmd* installed on your system. You might want to refer to the [Sencha Cmd System Setup] section for more details.
-Alternatively we recommend to use a container image for building, e.g. [bwbohl/sencha-cmd](https://github.com/bwbohl/sencha-cmd/pkgs/container/sencha-cmd)
+Alternatively, we recommend to use a Docker container image for building, e.g. [bwbohl/sencha-cmd]
```bash
docker run --rm -it -v /ABSOLUTE/PATH/TO/YOUR/LOCAL/EDIROM-ONLINE/CLONE:/app --name ediBuild ghcr.io/bwbohl/sencha-cmd:latest
```
-When you have your system preapared with all Sencha Cmd prerequisites or you have your docker container running you have to execute a sencha build command through calling the build script included in this repository with one of the sencha build-type options (please refer to [sencha app build reference](https://docs.sencha.com/cmd/guides/advanced_cmd/cmd_reference.html#advanced_cmd-_-cmd_reference_-_sencha_app_build) for details), either in your native shell or in the container shell, e.g.:
+When you have your system prepared with all Sencha Cmd prerequisites or you have your docker container running you are now set up to execute the sencha build command. Do this by calling the build script included in this repository with one of the sencha build-type options (please refer to [sencha app build reference] for details), either in your native shell or in the container shell, e.g.:
```bash
./build.sh testing
```
-### Testing locally
+### Starting an Edirom instance locally
+
+* prepare **exist-db**
+ * also see [exist-db via Docker]
+ * `docker run -it -d -p 8080:8080 -p 8443:8443 --name exist stadlerpeter/existdb:6` (see stadlerpeter/existdb)
+ * open in browser: `http://localhost:8080` (Note: there were problems opening this in Safari)
+ * Login with "admin:[empty]"
+* build and deploy **xar of Edirom**
+ * also see [building Edirom locally] above
+ * at `http://localhost:8080/exist/apps/dashboard/admin#` (signed-in) go to "Package Manager" then "Upload" and select the xar file which (supposed above build-method was used) was built at `/PATH_TO_LOCAL_EDIROM_REPO/build-xar/Edirom-Online-1.0.0-beta.5-[TIMESTAMP].xar`
+* build **xar of sample data** for deploying at exist-db
+ * also see [building sample data]
+ * at `http://localhost:8080/exist/apps/dashboard/admin#` (signed-in) go to "Package Manager" then "Upload" and select the xar file which (supposed above build-method was used) was built at `/PATH_TO_LOCAL_EDIROM_EDITION_EXAMPLE_REPO/build/EditionExample-0.1.xar`
+* in **eXist-db Package Manager** click on the "Edirom Online" entry - you will be directed to the running Edirom at `http://localhost:8080/exist/apps/Edirom-Online/index.html`
+
+## Dependencies
+
+Edirom Online depends heavily on the JavaScript framework [Ext JS] which is included in parts in our code base. We use Ext JS 4.2.1 in the GPL version. Edirom Online also includes the [Raphaël] javascript library (MIT License) and the [ACE] editor (BSD license).
-It is essential to Test your modifications before committing or issuing a pull request. A recommended way is running a local eXist-db v5.3 container and deploying your local build of Edirom Online together with some test-data, e.g. the [Edirom Edition Example](https://github.com/Edirom/EditionExample).
+## Roadmap
-## Other deployment methods
+Until today Edirom-Online and its features were developed as one application with strong dependencies on the JavaScript framework [Ext JS] (current version Ext JS 4.2.1) like mentioned above. Frontend and backend are currently living in this one application. Regarding to Edirom-Onlines release plans ExtJS is planned to be updated in the near future until ExtJS 7.0.0.
+With the help and under the guidance of the project "[Edirom-Online Reloaded]" (funded by the DFG, 2024–2026) Edirom will exprerience some major updates and improvements to achieve sustainability of the software, e.g features and functionalites will be modularized as [edirom web components] and also a separation of frontend and backend and a crucial reduction of dependencies especially regarding frameworks is envisaged. In addition [ZenMEM] will continue to support and coordinate the sustainable development of the Edirom-Online software.
+See the [Edirom-Online milestones] for more details.
-Please see our documentation in the [wiki](https://github.com/Edirom/Edirom-Online/wiki).
+## Contributing
+
+After all this information, you decided to conribute to Edirom-Online, that is awesome! We prepared a [CONTRIBUTING] file to help start your Edirom-Aventure now.
+
+## Get in touch
+
+Even if you are not ready (yet) to contribute to this wonderful project, maybe instead you just have a question or want to get to know the people involved in the project a little better, here are some ideas for you:
+* there is an [Edirom mailinglist] with the option for selfsubscription
+* the edirom community is meeting regularly every month at the first wednesday of a month, more information will be promoted via the mailinglist
+* start a discussion at [GitHub Discussions]
+
+## Code of Conduct
+
+Please note that this project is released with a [Contributor Code of Conduct]. By participating in this project you agree to abide by its terms.
## License
-Edirom Online is released to the public under the terms of the [GNU GPL v.3]() open source license.
+Edirom Online is released to the public under the terms of the [GNU GPL v.3] open source license.
+
+[Musikwissenschaftliches Seminar Detmold/Paderborn]: https://www.muwi-detmold-paderborn.de/
+[TEI]: https://tei-c.org/
+[MEI]: https://music-encoding.org/
+[Virtueller Forschungsverbund Edirom]: https://github.com/Edirom
+[Paderborn University]: https://www.uni-paderborn.de/en/
+[Entwicklung von Werkzeugen für digitale Formen wissenschaftlich-kritischer Musikeditionen]: https://edirom.de/edirom-projekt/
+[Webers clarinet quintet]: https://klarinettenquintett.weber-gesamtausgabe.de/
+[Freischütz digital]: https://freischuetz-digital.de/
+[Webers Freischütz]: https://edition.freischuetz-digital.de/
+[Freischütz: Edirom-Online]: https://github.com/Freischuetz-Digital/Edirom-Online
+[Bargheers Fiedellieder]: https://bargheer.edirom.de/index.html
+[Bargheer: Edirom-Online]: https://github.com/Edirom/Bargheer-EdiromOnline
+[Bargheer: Edition]: https://github.com/Edirom/Bargheer-Edition
+[eXist-db]: https://exist-db.org/
+[Verovio]: https://www.verovio.org/index.xhtml
+[Ext JS]: https://www.sencha.com/products/extjs
+[Raphaël]: http://raphaeljs.com
+[ACE]: http://ace.ajax.org
+[edirom web components]: https://github.com/Edirom/edirom-web-components-demonstrator
+[Edirom-Online Reloaded]: https://www.uni-paderborn.de/projekt/1332
+[Edirom-Online milestones]: https://github.com/Edirom/Edirom-Online/milestones
+[ZenMEM]: https://www.uni-paderborn.de/zenmem
+[CONTRIBUTING]: CONTRIBUTING.md
+[Sencha Cmd System Setup]: https://docs.sencha.com/cmd/7.5.0/guides/intro_to_cmd.html#intro_to_cmd_-_system_setup
+[bwbohl/sencha-cmd]: https://github.com/bwbohl/sencha-cmd/pkgs/container/sencha-cmd
+[sencha app build reference]: https://docs.sencha.com/cmd/guides/advanced_cmd/cmd_reference.html#advanced_cmd-_-cmd_reference_-_sencha_app_build
+[exist-db via Docker]: https://exist-db.org/exist/apps/doc/docker
+[stadlerpeter/existdb]: https://hub.docker.com/r/stadlerpeter/existdb
+[building Edirom locally]: https://github.com/Edirom/Edirom-Online?tab=readme-ov-file#building-locally
+[building sample data]: https://github.com/Edirom/EditionExample?tab=readme-ov-file#building
+[Edirom mailinglist]: https://lists.uni-paderborn.de/mailman/listinfo/edirom-l
+[GitHub Discussions]: https://github.com/Edirom/Edirom-Online/discussions
+[Contributor Code of Conduct]: CODE_OF_CONDUCT.md
+[GNU GPL v.3]: http://www.gnu.org/copyleft/gpl.html
+
diff --git a/app/controller/window/source/MeasureBasedView.js b/app/controller/window/source/MeasureBasedView.js
index dd051b7e9..ba688e5fc 100644
--- a/app/controller/window/source/MeasureBasedView.js
+++ b/app/controller/window/source/MeasureBasedView.js
@@ -156,7 +156,17 @@ Ext.define('EdiromOnline.controller.window.source.MeasureBasedView', {
onAnnotationsVisibilityChange: function(viewer, visible, pageId, uri, sourceView, args) {
var me = this;
+
+ if(debug !== null && debug) {
+ console.log('controller: MeasureBasedView: onAnnotationsVisibilityChange');
+ }
+
if(visible) {
+
+ if(debug !== null && debug) {
+ console.log('visible: ' + visible);
+ }
+
window.doAJAXRequest('data/xql/getAnnotationsOnPage.xql',
'GET',
{
@@ -176,6 +186,11 @@ Ext.define('EdiromOnline.controller.window.source.MeasureBasedView', {
}, this)
);
}else {
+
+ if(debug !== null && debug) {
+ console.log('visible: ' + visible);
+ }
+
viewer.removeShapes('annotations');
}
},
diff --git a/app/controller/window/source/SourceView.js b/app/controller/window/source/SourceView.js
index a5a7b1606..cf427fbd3 100644
--- a/app/controller/window/source/SourceView.js
+++ b/app/controller/window/source/SourceView.js
@@ -37,6 +37,10 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
onSourceViewRendered: function(view) {
var me = this;
+ if(debug !== null && debug) {
+ console.log('Controller: SourceView: onSourceViewRendered');
+ }
+
if(view.initialized) return;
view.initialized = true;
@@ -53,8 +57,11 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
ToolsController.addAnnotationVisibilityListener(view.id, Ext.bind(view.checkGlobalAnnotationVisibility, view));
view.checkGlobalAnnotationVisibility(ToolsController.areAnnotationsVisible());
+ if(debug !== null && debug) {
+ console.log('Controller: SourceView: onSourceViewRendered. getMovements');
+ }
window.doAJAXRequest('data/xql/getMovements.xql',
- 'GET',
+ 'GET',
{
uri: view.uri
},
@@ -69,12 +76,16 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
me.movementsLoaded(movements, view);
}, this)
);
-
+
+ if(debug !== null && debug) {
+ console.log('Controller: SourceView: onSourceViewRendered: getAnnotationInfos');
+ }
+
window.doAJAXRequest('data/xql/getAnnotationInfos.xql',
'GET',
{
uri: view.uri,
- lang: getPreference('application_language')
+ lang: getPreference('application_language')//TODO lang
},
Ext.bind(function(response){
var me = this;
@@ -82,6 +93,10 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
data = Ext.JSON.decode(data);
+ if(debug !== null && debug) {
+ console.log(data);
+ }
+
var priorities = Ext.create('Ext.data.Store', {
fields: ['id', 'name'],
data: data['priorities']
@@ -91,12 +106,14 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
data: data['categories']
});
+ //TODO why not save to object store?
+
me.annotInfosLoaded(priorities, categories, view);
}, this)
);
-
+
window.doAJAXRequest('data/xql/getOverlays.xql',
- 'GET',
+ 'GET',
{
uri: view.uri
},
@@ -129,7 +146,7 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
var me = this;
window.doAJAXRequest('data/xql/getMovementsFirstPage.xql',
- 'GET',
+ 'GET',
{
uri: view.uri,
movementId: movementId
@@ -153,7 +170,7 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
// If there is now active page, we don't need to load measures
if(typeof view.getActivePage() == 'undefined') return;
-
+
var pageId = view.getActivePage().get('id');
me.fetchMeasures(view.uri, pageId, Ext.bind(me.measuresOnPageLoaded, me, [view, pageId], true));
@@ -164,7 +181,7 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
fetchMeasures: function(uri, pageId, fn) {
window.doAJAXRequest('data/xql/getMeasuresOnPage.xql',
- 'GET',
+ 'GET',
{
uri: uri,
pageId: pageId
@@ -193,21 +210,27 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
onAnnotationsVisibilityChange: function(view, visible) {
var me = this;
+ if(debug !== null && debug) {
+ console.log('controller: SourceView: onAnnotationsVisibilityChange');
+ }
+
if(visible) {
-
+
+ if(debug !== null && debug) {
+ console.log('visible: ' + visible);
+ }
+
// If there is now active page, we don't need to load annotations
if(typeof view.getActivePage() == 'undefined') return;
-
+
var pageId = view.getActivePage().get('id');
- var lang = getPreference('application_language');
window.doAJAXRequest('data/xql/getAnnotationsOnPage.xql',
'GET',
{
uri: view.uri,
- pageId: pageId,
- lang: lang
+ pageId: pageId
},
Ext.bind(function(response){
var me = this;
@@ -221,24 +244,24 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
me.annotationsLoaded(annotations, view, pageId);
}, this)
);
-
+
} else {
view.hideAnnotations();
}
},
-
+
annotationsLoaded: function (annotations, view, pageId) {
-
+
if (pageId != view.getActivePage().get('id')) return;
-
+
view.showAnnotations(annotations);
},
-
+
onGotoMeasureByName: function (view, measure, movementId) {
var me = this;
-
+
window.doAJAXRequest('data/xql/getMeasurePage.xql',
- 'GET',
+ 'GET',
{
id: view.uri,
measure: measure,
@@ -250,13 +273,13 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
}, me)
);
},
-
+
onGotoMeasure: function (view, measureId) {
-
+
var me = this;
-
+
window.doAJAXRequest('data/xql/getMeasure.xql',
- 'GET',
+ 'GET',
{
id: view.uri,
measureId: measureId
@@ -267,25 +290,25 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
}, me)
);
},
-
+
gotoMeasure: function (result, view) {
var me = this;
-
+
var measureId = result.measureId;
var movementId = result.movementId;
var measureCount = result.measureCount;
-
+
if (measureId != '' && movementId != '') {
view.showMeasure(movementId, measureId, measureCount);
}
},
-
+
onGotoZone: function (view, zoneId) {
-
+
var me = this;
-
+
window.doAJAXRequest('data/xql/getZone.xql',
- 'GET',
+ 'GET',
{
uri: view.uri,
zoneId: zoneId
@@ -296,15 +319,15 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
}, this)
);
},
-
+
gotoZone: function (result, view) {
var me = this;
-
+
var zoneId = result.zoneId;
var pageId = result.pageId;
-
+
if (zoneId != '' && pageId != '') {
-
+
if (view.imageSet == null) {
view.on('afterImagesLoaded', Ext.bind(view.showZone, view,[result], false), view,[ {
single: true
@@ -318,10 +341,10 @@ Ext.define('EdiromOnline.controller.window.source.SourceView', {
}
}
},
-
+
onSourceViewDestroyed: function (view) {
var me = this;
-
+
ToolsController.removeMeasureVisibilityListener(view.id);
ToolsController.removeAnnotationVisibilityListener(view.id);
}
diff --git a/app/view/window/image/OpenSeaDragonViewer.js b/app/view/window/image/OpenSeaDragonViewer.js
index 0c6fa75f0..de7eb6c83 100644
--- a/app/view/window/image/OpenSeaDragonViewer.js
+++ b/app/view/window/image/OpenSeaDragonViewer.js
@@ -24,19 +24,19 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
},
layout: 'fit',
-
+
border: 0,
-
+
viewer: null,
-
+
imageWidth: 0,
imageHeight: 0,
-
+
imagePrefix: null,
-
+
shapes: null,
partLabel: null,
-
+
annotTipWidth: 220,
annotTipMaxWidth: 300,
annotTipHeight: 140,
@@ -45,12 +45,12 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
initComponent: function () {
var me = this;
-
+
me.imagePrefix = getPreference('image_prefix');
-
+
me.addEvents('zoomChanged',
'imageChanged');
-
+
var openseadragonEvents;
if (me.partLabel != null) {
@@ -64,19 +64,19 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
else {
openseadragonEvents = '';
};
-
+
me.html = '' + openseadragonEvents;
me.shapes = new Ext.util.MixedCollection();
-
+
me.callParent();
-
+
me.on('afterrender', me.initSurface, me, {single: true});
},
initSurface: function() {
var me = this;
-
+
me.viewer = OpenSeadragon({
id: me.id + '_openseadragon',
showNavigator: false,
@@ -86,25 +86,25 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
me.viewer.addHandler('zoom', function(event){ me.fireEvent('zoomChanged', event.zoom);});
me.viewer.gestureSettingsMouse.clickToZoom = false;
},
-
+
clear: function() {
var me = this;
me.rect = null;
},
-
+
showImage: function(path, width, height, pageId) {
var me = this;
-
+
me.imageHeight = height;
me.imageWidth = width;
me.imgPath = path;
me.imgId = pageId;
-
+
var iiifPath = path;
if(!path.startsWith("http")) {
iiifPath = me.imagePrefix + path.replace(new RegExp('\/', 'g'), '!');
}
-
+
me.viewer.open({
"@context": "http://iiif.io/api/image/2/context.json",
"@id": iiifPath,
@@ -122,34 +122,30 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
});
me.fireEvent('imageChanged', me, path, pageId);
},
-
- removeShapes: function() {
-
- },
-
+
fitInImage: function() {
-
+
var me = this;
me.viewer.viewport.goHome();
},
-
+
setZoomAndCenter: function(z) {
-
+
var me = this;
me.viewer.viewport.zoomTo(z);
},
-
+
getActualRect: function() {
-
+
var me = this;
-
+
var viewportBounds = me.viewer.viewport.getBounds();
var imageBounds = me.viewer.viewport.viewportToImageRectangle(viewportBounds.x, viewportBounds.y, viewportBounds.width, viewportBounds.height);
var x = (imageBounds.x < 0?0:imageBounds.x);
var y = (imageBounds.y < 0?0:imageBounds.y);
var width = (imageBounds.width > me.imageWidth?me.imageWidth:imageBounds.width);
var height = (imageBounds.height > me.imageHeight?me.imageHeight:imageBounds.height);
-
+
return {
x: x,
y: y,
@@ -157,9 +153,9 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
height: height
};
},
-
+
showRect: function(x, y, width, height, highlight) {
-
+
var me = this;
me.rect = {
x:x,
@@ -172,9 +168,9 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
var rect = me.viewer.viewport.imageToViewportRectangle(x, y, width, height);
me.viewer.viewport.fitBoundsWithConstraints(rect);
},
-
+
addMeasures: function(shapes) {
-
+
var me = this;
me.shapes.add('measures', shapes);
@@ -192,10 +188,10 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
measure.id = me.id + '_' + id;
measure.className = "measure";
measure.innerHTML = '' + name + '';
-
+
var point = me.viewer.viewport.imageToViewportCoordinates(x, y);
var rect = me.viewer.viewport.imageToViewportRectangle(x, y, width, height);
-
+
me.viewer.addOverlay({
element: measure,
location: new OpenSeadragon.Rect(point.x, point.y, rect.width, rect.height)
@@ -209,17 +205,17 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
});
});
},
-
+
addSVGOverlay: function(overlayId, overlay, name, uri, fn) {
-
+
var me = this;
-
+
var svgId = me.id + '_' + overlayId;
var overlayOSD = me.viewer.getOverlayById(svgId);
if (overlayOSD !== null ) {
return;
}
-
+
overlay.each(function(overlay){
if (overlay.get('svg') !== null) {
parser = new DOMParser;
@@ -239,7 +235,7 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
}
});
},
-
+
removeSVGOverlay: function(overlayId) {
var me = this;
var svgId = me.id + '_' + overlayId;
@@ -248,12 +244,25 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
overlayOSD.destroy();
}
},
-
+
removeShapes: function(groupName) {
-
+
+ if(debug !== null && debug) {
+ console.log('view: OpenSeaDragonView: removeShapes');
+ console.log(groupName);
+ }
+
var me = this;
- if(!me.shapes.containsKey(groupName)) return;
+ //abort if me.shapes does not contain key
+ if(!me.shapes.containsKey(groupName)) {
+ if(debug !== null && debug) {
+ console.log('me.shapes does not contain key: ' + groupName);
+ }
+ return;
+ }
+
+ // create function for each shape
var fn = function(shape) {
var id;
@@ -264,6 +273,11 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
id = shape.id;
}
+ if(debug !== null && debug) {
+ console.log('me.id: ' + me.id);
+ console.log('+shape.id: ' + me.id + '_' + id);
+ }
+
me.viewer.removeOverlay(me.id + '_' + id);
};
@@ -274,35 +288,60 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
me.shapes.add(groupName, []);
},
-
+
+
highlightShape: function(event, owner, shape) {
-
+
var elem = Ext.get(shape);
elem.addCls('highlighted');
-
+
var annotId = elem.getAttribute('data-edirom-annot-id');
Ext.select('div[data-edirom-annot-id=' + annotId + ']', this.el).addCls('combinedHighlight');
Ext.select('span[data-edirom-annot-id=' + annotId + ']', this.el).addCls('combinedHighlight');
},
deHighlightShape: function(event, owner, shape) {
-
+
var elem = Ext.get(shape);
elem.removeCls('highlighted');
-
+
var annotId = elem.getAttribute('data-edirom-annot-id');
Ext.select('div[data-edirom-annot-id=' + annotId + ']', this.el).removeCls('combinedHighlight');
Ext.select('span[data-edirom-annot-id=' + annotId + ']', this.el).removeCls('combinedHighlight');
},
-
+
addAnnotations: function(annotations) {
-
+
var me = this;
+ if(debug !== null && debug) {
+ console.log('controller: OpenseaDragonView: addAnnotaitons');
+ console.log('annotations RAW');
+ console.log(annotations);
+ }
+
+ //add empty annotations array to shapes
me.shapes.add('annotations', []);
+ // template for annotation element
+ //TODO: currently unused
+ //var dh = Ext.DomHelper;
+ //var tpl = dh.createTemplate('');
+ //tpl.compile();
+
+ if(debug !== null && debug) {
+ console.log('me.shapes annotations');
+ console.log(me.shapes.get('annotations'));
+ }
+
+ // iterate over annotations
annotations.each(function(annotation) {
+ if(debug !== null && debug) {
+ console.log('Processing annotation…');
+ console.log(annotation);
+ }
+
var annoId = annotation.get('id');
var name = annotation.get('title');
var uri = annotation.get('uri');
@@ -310,53 +349,61 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
var priority = annotation.get('priority');
var fn = annotation.get('fn');
var plist = Ext.Array.toArray(annotation.get('plist'));
-
+
+ //push plist to me.shapes annotations
+ Ext.Array.push(me.shapes.get('annotations'), plist);
+
+ //iterate over an annotations plist
Ext.Array.each(plist, function(shape) {
- var id = shape.id;
+ var id = shape.id; //pattern from XQL 'annotation_' || $annoId || '_' || string($p/@xml:id)
var x = shape.ulx;
var y = shape.uly;
var width = shape.lrx - shape.ulx;
var height = shape.lry - shape.uly;
var partType = shape.type;
-
+
var anno = me.viewer.getOverlayById(me.id + '_' + id);
if(anno === null) {
-
+
var anno = document.createElement('div');
anno.id = me.id + '_' + id;
anno.className = 'annotation';
+ // annoIcon: has to be nearly identical to annoIcon in else
var annoIcon = document.createElement('div');
- annoIcon.id = annoId + '_' + anno.id + '_inner';
+ annoIcon.id = anno.id + annoId;
annoIcon.className = 'annotIcon ' + categories + ' ' + priority + ' ' + partType;
anno.append(annoIcon);
-
+
var point = me.viewer.viewport.imageToViewportCoordinates(x, y);
var rect = me.viewer.viewport.imageToViewportRectangle(x, y, width, height);
-
+
me.viewer.addOverlay({element:anno, location:new OpenSeadragon.Rect(point.x, point.y, rect.width, rect.height)});
-
+
}else {
-
+
+ // annoIcon: has to be nearly identical to annoIcon in if
var anno = me.el.getById(me.id + '_' + id);
var annoIcon = document.createElement('div');
- annoIcon.id = annoId + '_' + anno.id + '_inner';
+ annoIcon.id = anno.id + annoId;
annoIcon.className = 'annotIcon ' + categories + ' ' + priority + ' ' + partType;
anno.dom.append(annoIcon);
}
- Ext.Array.push(me.shapes.get('annotations'), annoId + '_' + anno.id + '_inner');
- var annoIcon = me.el.getById(annoId + '_' + anno.id + '_inner');
-
+ // retrieve dom element of annotationIcon to bind actions
+ var annoIcon = me.el.getById(annoIcon.id);
+
+ // bind onclick action to annotation icon
annoIcon.on('click', me.openShapeLink, me, {
single: true,
stopEvent : true,
fn: fn
});
+ // create the tooltip for the annotation
var tip = Ext.create('Ext.tip.ToolTip', {
- target: annoId + '_' + anno.id + '_inner',
+ target: annoIcon.id,
cls: 'annotationTip',
width: me.annotTipWidth,
maxWidth: me.annotTipMaxWidth,
@@ -368,6 +415,7 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
html: getLangString('Annotation_plus_Title', name)
});
+ // bind function to fetch the contents for the annotation tooltip
tip.on('afterrender', function() {
window.doAJAXRequest('data/xql/getAnnotation.xql',
'GET',
@@ -388,6 +436,7 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
}, this);
}, tip);
+ // delay hiding the annotation tooltip
tip.on('beforehide', function() {
if(this.el.hasCls('mouseOverAnnot')) {
Ext.Function.defer(function(){
@@ -397,28 +446,33 @@ Ext.define('EdiromOnline.view.window.image.OpenSeaDragonViewer', {
}
}, tip);
});
+ if(debug !== null && debug) {
+ console.log('me.shapes annotations');
+ console.log(me.shapes.get('annotations'));
+ }
});
},
-
+
getShapes: function(groupName) {
-
+
var me = this;
var shapes = me.shapes.get(groupName);
return (shapes == null || typeof shapes === 'undefined'?[]:shapes);
},
-
+
getShapeElem: function(shapeId) {
-
+
+ if(debug !== null && debug) {
+ console.log('view: OpenSeaDragonView: getShapeElem: ' + shapeId);
+ }
var me = this;
- var elem = me.el.getById(me.id + '_' + shapeId);
- if(elem === null)
- elem = me.el.getById(shapeId);
-
+ var elem = me.el.getById(me.id + '_' + shapeId);//TODO causes problems || me.el.getById(shapeId);
+
return elem;
},
-
+
listenForShapeLink: function(e, dom, args) {
-
+
var me = this;
if(e.button != 0) return;
diff --git a/app/view/window/source/MeasureBasedView.js b/app/view/window/source/MeasureBasedView.js
index 3cc15da77..dcad4abc1 100644
--- a/app/view/window/source/MeasureBasedView.js
+++ b/app/view/window/source/MeasureBasedView.js
@@ -19,7 +19,7 @@
*/
Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
extend: 'EdiromOnline.view.window.View',
-
+
requires: [
'EdiromOnline.view.window.image.ImageViewer',
'EdiromOnline.view.window.image.OpenSeaDragonViewer',
@@ -27,7 +27,7 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
'Ext.selection.CheckboxModel',
'Ext.layout.container.Border'
],
-
+
alias : 'widget.measureBasedView',
layout: {
@@ -36,11 +36,11 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
},
border: 0,
-
+
cls: 'measureBasedView',
-
+
measures: null,
-
+
initComponent: function () {
var me = this;
@@ -54,15 +54,16 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
this.callParent();
},
-
+
getUri: function() {
return this.owner.uri;
},
-
+
createToolbarEntries: function() {
var me = this;
+ // create movementComboBox
me.mdivSelector = Ext.create('Ext.form.ComboBox', {
store: Ext.create('Ext.data.Store', {
fields: ['id', 'name'],
@@ -75,6 +76,9 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
margin: '0 0 0 0',
id: 'mdiv_combo_' + me.id,
hidden: true,
+ cls: 'movementCombo',
+ disabled: false,
+ disabledCls: 'x-disabled',
listeners:{
scope: me,
'select': me.setMdiv
@@ -83,11 +87,11 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
me.measureSpinner = Ext.create('EdiromOnline.view.window.source.MeasureSpinner', {
width: 121,
- cls: 'pageSpinner', //TODO
+ cls: 'pageSpinner', //TODO adjust class to measureSpinner and add in SCSS
owner: me,
hidden: true
});
-
+
me.intervalSpinner = Ext.create('EdiromOnline.view.window.source.IntervalSpinner', {
value: 1,
maxValue: 99,
@@ -95,9 +99,9 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
hideLabel: true,
hidden: true
});
-
+
me.intervalSpinner.on('change', me.measureSpinner.onIntervalChange, me.measureSpinner);
-
+
me.voiceFilter = Ext.create('Ext.button.Button', {
handler: function() {
me.showVoiceFilterDialog();
@@ -108,23 +112,23 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
disabled: true,
hidden: true
});
-
+
var settingsContainer = Ext.create('Ext.container.Container', {
layout: 'hbox'
});
settingsContainer.add(me.voiceFilter);
-
+
me.separator1 = Ext.create('Ext.toolbar.Separator', {hidden: true});
me.separator2 = Ext.create('Ext.toolbar.Separator', {hidden: true});
-
+
return [me.mdivSelector, me.separator1, me.measureSpinner, me.intervalSpinner, me.separator2, settingsContainer];
},
-
+
fitFacsimile: function() {
var me = this;
me.setMeasure(me.measureSpinner.combo, me.measureSpinner.combo.getStore());
},
-
+
hideToolbarEntries: function() {
var me = this;
me.mdivSelector.hide();
@@ -134,7 +138,7 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
me.separator1.hide();
me.separator2.hide();
},
-
+
showToolbarEntries: function() {
var me = this;
me.mdivSelector.show();
@@ -147,25 +151,44 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
setMdiv: function(combo, records, eOpts) {
var me = this;
-
+
if(me.mdivSelected == combo.getValue()) return;
-
+
me.mdivSelected = combo.getValue();
me.fireEvent('mdivSelected', me.mdivSelected, me);
},
setMovements: function(movements) {
var me = this;
+
+ // set view movements to submitted movements
me.movements = movements;
-
+
+ // initialize variable data
var data = [];
+
+ // create a reduced array from me.movements in variable data without movements wrapper
movements.data.each(function(elem) {
data.push(elem.data);
});
+
+ console.log(me.mdivSelector);
+
+ // push data variable to view's mdivSelector store
me.mdivSelector.getStore().loadData(data);
-
+
+ // ? set a value on mdivSelector
if(me.owner.window.internalIdType != 'measure')
me.mdivSelector.setValue(data[0]['id']);
+
+ // check if data contains more than one item and save to variable as boolean
+ var isDisabled = ((data.length <= 1) ? true : false);
+
+ // set disabled state on views mdivSelector
+ if (isDisabled) {
+ me.mdivSelector.disable();
+ }
+
},
setMeasures: function(measures) {
@@ -179,31 +202,31 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
}else if(me.imageSet.getCount() > 0)
*/
-
+
me.measureSpinner.setMeasure(me.measures.getAt(0));
},
-
+
showMeasure: function(movementId, measureId, measureCount) {
var me = this;
-
-
+
+
// if(me.mdivSelector.getValue() != movementId) {
me.mdivSelector.setValue(movementId);
me.setMdiv(me.mdivSelector);
// }
-
+
if(typeof me.measures === 'undefined' || me.measures === null) {
-
+
Ext.defer(me.showMeasure, 300, me, [movementId, measureId, measureCount], false);
return;
}
-
+
me.measureSpinner.setMeasure(measureId, measureCount);
},
-
+
setMeasure: function(combo, store, measureCount) {
-
+
var me = this;
if(typeof store.getById !== 'function')
@@ -215,69 +238,69 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
});
var id = combo.getValue();
-
+
me.measures = store.getById(id);
-
+
if(me.measures === null){
return;
}
-
+
Ext.Array.each(me.measures.get('measures'), function(m) {
-
+
var voice = m['voice'];
var partLabel = m['partLabel'];
-
+
if(voice == 'score' || me.parts.getById(voice.substr(1)).get('selected')) {
-
+
var viewer = me.viewers.get(voice);
-
+
if(typeof viewer == 'undefined') {
viewer = Ext.create('EdiromOnline.view.window.source.HorizontalMeasureViewer', {
owner: me,
partLabel: partLabel
});
-
+
me.viewers.add(voice, viewer);
me.add(viewer);
}
-
+
viewer.show();
}
});
Ext.Array.each(me.measures.get('measures'), function(m) {
-
+
var voice = m['voice'];
-
+
if(voice == 'score' || me.parts.getById(voice.substr(1)).get('selected')) {
var viewer = me.viewers.get(voice);
-
+
viewer.setMeasure(m, measureCount);
}
});
},
-
+
reloadDisplay: function() {
var me = this;
-
+
var measureCount = me.intervalSpinner.getValue();
me.measureSpinner.reloadMeasure(measureCount);
},
-
+
setParts: function(parts) {
var me = this;
-
+
me.parts = parts;
if(me.parts.getTotalCount() > 0)
me.voiceFilter.enable();
-
+
me.setMdiv(me.mdivSelector);
},
-
+
showVoiceFilterDialog: function() {
-
+
var me = this;
-
+
me.grid = Ext.create('Ext.grid.Panel', {
border: false,
flex: 1,
@@ -285,7 +308,7 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
columns: [{ text: 'Part', dataIndex: 'label', flex: 1 }],
store: me.parts
});
-
+
me.partsDialog = Ext.create('Ext.window.Window', {
title: 'Parts selection',
height: 400,
@@ -326,45 +349,45 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
}
]
});
-
+
me.partsDialog.show();
-
+
me.grid.getSelectionModel().deselectAll(true);
-
+
me.parts.each(function(record) {
-
+
if(record.get('selected'))
me.grid.getSelectionModel().select(record, true, true);
});
},
-
+
onPartsSelectionChange: function() {
-
+
var me = this;
-
+
var selected = me.grid.getSelectionModel().getSelection();
me.parts.each(function(record) {
- record.set('selected', Ext.Array.contains(selected, record));
+ record.set('selected', Ext.Array.contains(selected, record));
});
-
+
me.partsDialog.close();
me.reloadDisplay();
},
-
+
getContentConfig: function() {
var me = this;
return {
id: this.id
};
},
-
+
setContentConfig: function(config) {
var me = this;
try {
me.reloadDisplay();
}catch(e) {}
},
-
+
annotationFilterChanged: function(visibleCategories, visiblePriorities) {
var me = this;
@@ -376,25 +399,25 @@ Ext.define('EdiromOnline.view.window.source.MeasureBasedView', {
Ext.define('EdiromOnline.view.window.source.HorizontalMeasureViewer', {
extend: 'Ext.panel.Panel',
-
+
mixins: {
observable: 'Ext.util.Observable'
},
-
+
alias : 'widget.horizontalMeasureViewer',
-
+
layout: {
type: 'hbox',
align: 'stretch'
},
/*layout: 'fit',*/
-
+
flex: 1,
-
+
border: false,
-
+
partLabel: '',
-
+
style: {
borderColor: 'black',
borderStyle: 'solid',
@@ -403,23 +426,23 @@ Ext.define('EdiromOnline.view.window.source.HorizontalMeasureViewer', {
borderLeft: 0,
borderRight: 0
},
-
+
initComponent: function () {
var me = this;
-
+
me.addEvents('showMeasure',
'measureVisibilityChange',
'annotationsVisibilityChange',
'overlayVisibilityChange');
-
+
// SourceView
me.owner.owner.on('measureVisibilityChange', me.onMeasureVisibilityChange, me);
me.owner.owner.on('annotationsVisibilityChange', me.onAnnotationsVisibilityChange, me);
me.owner.owner.on('overlayVisiblityChange', me.onOverlayVisibilityChange, me);
-
+
var image_server = getPreference('image_server');
- var viewer = null;
+ var viewer = null;
if(image_server === 'leaflet'){
viewer = Ext.create('EdiromOnline.view.window.image.LeafletFacsimile', {flex: 1, width: '100%', partLabel: me.partLabel});
}
@@ -428,9 +451,9 @@ Ext.define('EdiromOnline.view.window.source.HorizontalMeasureViewer', {
}else {
viewer = Ext.create('EdiromOnline.view.window.image.ImageViewer', {flex: 1, partLabel: me.partLabel});
}
-
+
viewer.on('imageChanged', me.onViewerImageChange, me);
-
+
me.imageViewers = [viewer];
me.items = [
@@ -439,63 +462,63 @@ Ext.define('EdiromOnline.view.window.source.HorizontalMeasureViewer', {
me.callParent();
},
-
+
onMeasureVisibilityChange: function(view, state) {
var me = this;
-
+
Ext.Array.each(me.imageViewers, function(viewer) {
if(viewer.isVisible()) {
me.fireEvent('measureVisibilityChange', viewer, state, viewer.imgId, me.owner.owner.uri);
}
});
},
-
+
onAnnotationsVisibilityChange: function(view, state) {
var me = this;
-
+
Ext.Array.each(me.imageViewers, function(viewer) {
if(viewer.isVisible()) {
me.fireEvent('annotationsVisibilityChange', viewer, state, viewer.imgId, me.owner.owner.uri, me.owner.owner);
}
});
},
-
+
onOverlayVisibilityChange: function(view, state) {
var me = this;
-
+
Ext.Array.each(me.imageViewers, function(viewer) {
if(viewer.isVisible()) {
me.fireEvent('overlayVisiblityChange', viewer, me.owner.owner.overlaysVisible, viewer.imgId, me.owner.owner.uri, me.owner.owner);
}
});
},
-
+
onViewerImageChange: function(viewer, path, pageId) {
var me = this;
me.fireEvent('measureVisibilityChange', viewer, me.owner.owner.measuresVisible, viewer.imgId, me.owner.owner.uri);
me.fireEvent('annotationsVisibilityChange', viewer, me.owner.owner.annotationsVisible, viewer.imgId, me.owner.owner.uri, me.owner.owner);
me.fireEvent('overlayVisiblityChange', viewer, me.owner.owner.overlaysVisible, viewer.imgId, me.owner.owner.uri, me.owner.owner);
},
-
+
setMeasure: function(measure, measureCount) {
var me = this;
-
+
if(me.measure == measure && me.owner.intervalSpinner.getValue() == measureCount) return;
-
+
me.measure = measure;
if(typeof measureCount != 'undefined' && typeof measureCount != 'object' ) me.owner.intervalSpinner.setValue(measureCount);
-
+
me.fireEvent('showMeasure', me, me.owner.getUri(), me.measure['id'], me.owner.intervalSpinner.getValue());
},
-
+
showMeasure: function(data) {
-
+
var me = this;
-
+
Ext.Array.each(me.imageViewers, function(viewer) {
viewer.hide();
});
-
+
var grouped = {};
var groupKeys = [];
var overallWidth = 0;
@@ -503,11 +526,11 @@ Ext.define('EdiromOnline.view.window.source.HorizontalMeasureViewer', {
var actPage = '';
var actSystem = 0;
var lastULX = 0;
-
+
var image_server = getPreference('image_server');
-
+
Ext.Array.each(data, function(d) {
-
+
var pageId = d['pageId'];
if(actPage != pageId) {
viewerCount++;
@@ -515,31 +538,31 @@ Ext.define('EdiromOnline.view.window.source.HorizontalMeasureViewer', {
actSystem = 0;
lastULX = 0;
}
-
+
var ulx = d['ulx'];
if(lastULX > Number(ulx)) {
viewerCount++;
actSystem++;
}
-
+
lastULX = Number(ulx);
-
+
var groupKey = pageId + '_' + actSystem;
Ext.Array.include(groupKeys, groupKey);
-
+
if(typeof grouped[groupKey] == 'undefined')
grouped[groupKey] = {pageId: pageId, width: 0, measures: []};
-
+
grouped[groupKey].measures.push(d);
var width = Number(d['lrx']) - Number(d['ulx']);
grouped[groupKey].width += width;
overallWidth += width;
-
+
if(typeof me.imageViewers[viewerCount - 1] == 'undefined') {
-
-
- var viewer = null;
+
+
+ var viewer = null;
if(image_server === 'leaflet'){
viewer = Ext.create('EdiromOnline.view.window.image.LeafletFacsimile', {height: '100%', flex:1});
} else if(image_server === 'openseadragon'){
@@ -547,16 +570,16 @@ Ext.define('EdiromOnline.view.window.source.HorizontalMeasureViewer', {
} else{
viewer = Ext.create('EdiromOnline.view.window.image.ImageViewer', {flex: 1});
}
-
+
viewer.on('imageChanged', me.onViewerImageChange, me);
-
+
me.imageViewers[viewerCount - 1] = viewer;
me.add(me.imageViewers[viewerCount - 1]);
}
-
+
me.imageViewers[viewerCount - 1].show();
});
-
+
/*
[{
measureId:"bar-1211019",
@@ -572,92 +595,103 @@ Ext.define('EdiromOnline.view.window.source.HorizontalMeasureViewer', {
},{
measureId:"bar-12120210",
zoneId:"zone_bar-12120210",
- pageId:"facsimile-121102",
- path: "edition-74338555/work-1/source-12/00000008.jpg",
- width: "1307",
- height: "948",
- ulx: "139",
- uly: "51",
- lrx: "315",
+ pageId:"facsimile-121102",
+ path: "edition-74338555/work-1/source-12/00000008.jpg",
+ width: "1307",
+ height: "948",
+ ulx: "139",
+ uly: "51",
+ lrx: "315",
lry: "836"
}]
*/
-
+
for(var i = 0; i < viewerCount; i++) {
-
+
var viewer = me.imageViewers[i];
var group = grouped[groupKeys[i]];
viewer.flex = group.width / overallWidth;
}
-
+
me.forceComponentLayout();
-
+
for(var i = 0; i < viewerCount; i++) {
-
+
var viewer = me.imageViewers[i];
var group = grouped[groupKeys[i]];
-
+
if(group.measures[0]['path'] != viewer.imgPath || image_server === 'leaflet') {
viewer.clear();
viewer.showImage(group.measures[0]['path'], group.measures[0]['width'], group.measures[0]['height'], group.measures[0]['pageId']);
}
-
+
var ulx = Number.MAX_VALUE;
var uly = Number.MAX_VALUE;
var lrx = Number.MIN_VALUE;
var lry = Number.MIN_VALUE;
-
+
Ext.Array.each(group.measures, function(d) {
if(Number(d['ulx']) < ulx) ulx = Number(d['ulx']);
if(Number(d['uly']) < uly) uly = Number(d['uly']);
if(Number(d['lrx']) > lrx) lrx = Number(d['lrx']);
if(Number(d['lry']) > lry) lry = Number(d['lry']);
});
-
+
var width = lrx - ulx;
var height = lry - uly;
-
+
viewer.showRect(ulx, uly, width, height, true);
}
},
-
+
annotationFilterChanged: function(visibleCategories, visiblePriorities) {
var me = this;
var image_server = getPreference('image_server');
-
+
Ext.Array.each(me.imageViewers, function(viewer) {
var annotations = viewer.getShapes('annotations');
- if(image_server === 'leaflet'){
+ if(image_server === 'leaflet'){
//viewer.removeShapes('annotations');
viewer.addAnnotations(annotations);
//viewer.removeDeselectedAnnotations(visibleCategories, visiblePriorities);
-
+
}
else{
var fn = Ext.bind(function(annotation) {
- var annotDiv = viewer.getShapeElem(annotation);
-
- var className = annotDiv.dom.className.replace('annotIcon', '').trim();
- var classes = className.split(' ');
-
- var hasCategory = false;
- var hasPriority = false;
-
- for(var i = 0; i < classes.length; i++) {
- hasCategory |= Ext.Array.contains(visibleCategories, classes[i]);
- hasPriority |= Ext.Array.contains(visiblePriorities, classes[i]);
- }
-
- if(hasCategory & hasPriority)
- annotDiv.removeCls('hidden');
- else
- annotDiv.addCls('hidden');
- }, me);
-
+ var annotDiv = viewer.getShapeElem(annotation.id);
+
+ var className = annotDiv.dom.className.replace('annotIcon', '').trim();
+ var classes = className.split(' ');
+
+ var matchesCategoryFilter = false;
+ var matchesPriorityFilter = false;
+
+ // iterate over annotation class attribute values to see if they match visibleCategories or visiblePriorities
+ for(var i = 0; i < classes.length; i++) {
+ matchesCategoryFilter |= Ext.Array.contains(visibleCategories, classes[i]);
+
+ matchesPriorityFilter |= Ext.Array.contains(visiblePriorities, classes[i]);
+ }
+
+ // if filter results are falsey check if visibleCategories are undefined and if so assign true
+ if( matchesCategoryFilter == false & visibleCategories == 'undefined') {
+ matchesCategoryFilter = true;
+ }
+ // if filter results are falsey check if visibleCategories are undefined and if so assign true
+ if( matchesPriorityFilter == false & visiblePriorities == 'undefined') {
+ matchesPriorityFilter = true;
+ }
+
+ if(matchesCategoryFilter & matchesPriorityFilter)
+ annotDiv.removeCls('hidden');
+ else
+ annotDiv.addCls('hidden');
+ }, me);
+
if (typeof annotations !== 'undefined') {
if(annotations.each)
annotations.each(fn);
@@ -677,21 +711,21 @@ Ext.define('EdiromOnline.view.window.source.MeasureSpinner', {
alias : 'widget.measureSpinner',
layout: 'hbox',
-
+
mdivSelected: -1,
-
+
combo: null,
initComponent: function () {
var me = this;
-
+
me.items = [
];
me.callParent();
-
+
if(me.owner.mdivSelected)
- me.mdivSelected = me.owner.mdivSelected;
+ me.mdivSelected = me.owner.mdivSelected;
},
next: function() {
@@ -722,15 +756,15 @@ Ext.define('EdiromOnline.view.window.source.MeasureSpinner', {
if(this.combo !== null){
this.combo.setValue(id);
this.owner.setMeasure(this.combo, this.combo.store, measureCount);
- }
-
+ }
+
},
-
+
setStore: function(store) {
var me = this;
-
+
me.removeAll();
-
+
me.combo = Ext.create('Ext.form.ComboBox', {
width: 35,
hideTrigger: true,
@@ -741,7 +775,7 @@ Ext.define('EdiromOnline.view.window.source.MeasureSpinner', {
cls: 'pageInputBox',
autoSelect: true
});
-
+
me.add([
{
xtype: 'button',
@@ -766,7 +800,7 @@ Ext.define('EdiromOnline.view.window.source.MeasureSpinner', {
this.combo.on('select', this.owner.setMeasure, this.owner);
},
-
+
onIntervalChange: function(field, newValue, oldValue, opts) {
this.owner.setMeasure(this.combo, this.combo.store);
}
@@ -774,10 +808,10 @@ Ext.define('EdiromOnline.view.window.source.MeasureSpinner', {
Ext.define('EdiromOnline.view.window.source.IntervalSpinner', {
extend: 'Ext.form.Spinner',
-
+
step: 1,
size: 4,
-
+
onSpinUp: function() {
var me = this;
if (!me.readOnly) {
@@ -785,7 +819,7 @@ Ext.define('EdiromOnline.view.window.source.IntervalSpinner', {
if(me.getValue() !== '') {
val = parseInt(me.getValue());
}
-
+
if(val + me.step <= me.maxValue)
me.setValue(val + me.step);
}
@@ -797,7 +831,7 @@ Ext.define('EdiromOnline.view.window.source.IntervalSpinner', {
if(me.getValue() !== '') {
val = parseInt(me.getValue());
}
-
+
if(val - me.step >= me.minValue)
me.setValue(val - me.step);
}
diff --git a/app/view/window/source/PageBasedView.js b/app/view/window/source/PageBasedView.js
index da81e662f..ae0feaaf9 100644
--- a/app/view/window/source/PageBasedView.js
+++ b/app/view/window/source/PageBasedView.js
@@ -34,18 +34,19 @@ Ext.define('EdiromOnline.view.window.source.PageBasedView', {
imageSet: null,
imageToShow: null,
-
+
cls: 'pageBasedView',
-
+
initComponent: function () {
-
+
var me = this;
-
+
me.addEvents('overlayVisibilityChange');
me.owner.on('overlayVisiblityChange', me.onOverlayVisibilityChange, me);
-
+
var image_server = getPreference('image_server');
-
+
+ //TODO leaflet deprecation
if(image_server === 'leaflet'){
me.imageViewer = Ext.create('EdiromOnline.view.window.image.LeafletFacsimile', {flex: 1, width: '100%'});
//Ext.create('EdiromOnline.view.window.image.LeafletFacsimile');
@@ -54,60 +55,128 @@ Ext.define('EdiromOnline.view.window.source.PageBasedView', {
}else{
me.imageViewer = Ext.create('EdiromOnline.view.window.image.ImageViewer');
}
-
+
this.items = [
me.imageViewer
];
me.callParent();
-
+
me.imageViewer.on('zoomChanged', me.updateZoom, me);
},
annotationFilterChanged: function(visibleCategories, visiblePriorities) {
+
var me = this;
-
+
+ if(debug !== null && debug) {
+ console.log('View: PageBasedView: annotationFilterChanged');
+ console.log('visibleCategories');
+ console.log(visibleCategories);
+ console.log('visiblePriorities');
+ console.log(visiblePriorities);
+ }
+
+ //TODO leaflet deprecation
var image_server = getPreference('image_server');
-
- var annotations = me.imageViewer.getShapes('annotations');
-
- if(image_server === 'leaflet'){
- me.imageViewer.removeShapes('annotations');
- me.imageViewer.addAnnotations(annotations);
- me.imageViewer.removeDeselectedAnnotations(visibleCategories, visiblePriorities);
- return;
+
+ var annotations = me.imageViewer.getShapes('annotations');
+
+ if(debug !== null && debug) {
+ console.log('View: PageBasedView: annotationFilterChanged: annotations');
+ console.log(annotations);
+ console.log(me.imageViewer.shapes.get('annotations'));
+ }
+
+ //TODO leaflet deprecation
+ if(image_server === 'leaflet'){
+ me.imageViewer.removeShapes('annotations');
+ me.imageViewer.addAnnotations(annotations);
+ me.imageViewer.removeDeselectedAnnotations(visibleCategories, visiblePriorities);
+ return;
}
-
- var fn = Ext.bind(function(annotation) {
- var annotDiv = this.imageViewer.getShapeElem(annotation);
-
- var className = annotDiv.dom.className.replace('annotIcon', '').trim();
-
- var classes = className.split(' ');
-
- var hasCategory = false;
- var hasPriority = false;
-
- for(var i = 0; i < classes.length; i++) {
- hasCategory |= Ext.Array.contains(visibleCategories, classes[i]);
-
- hasPriority |= Ext.Array.contains(visiblePriorities, classes[i]);
+
+ // define function to apply to relevant element IDs
+ var fn = Ext.bind(function(annotationId) {
+
+ var annotDiv = Ext.get(annotationId);
+ var classList = annotDiv.dom.classList;
+ var prioritiesCategories = Ext.Array.toArray(classList);
+ Ext.Array.remove(prioritiesCategories, 'measure');
+ Ext.Array.remove(prioritiesCategories, 'annoIcon');
+
+ if(debug !== null && debug) {
+ console.log('View: PageBasedView: annotationFilterChanged: annotations fn');
+ console.log(annotationId);
+ console.log(annotDiv);
+ console.log(classList);
+ console.log(prioritiesCategories);
+ }
+
+ // create category and priority match variables
+ var matchesCategoryFilter = false;
+ var matchesPriorityFilter = false;
+
+ // iterate over annotation class attribute values to see if they match visibleCategories or visiblePriorities
+ for(var i = 0; i < prioritiesCategories.length; i++) {
+ matchesCategoryFilter |= Ext.Array.contains(visibleCategories, prioritiesCategories[i]);
+
+ matchesPriorityFilter |= Ext.Array.contains(visiblePriorities, prioritiesCategories[i]);
}
-
- if(hasCategory & hasPriority)
+
+ if(debug !== null && debug) {
+ console.log(matchesCategoryFilter);
+ console.log(matchesPriorityFilter);
+ }
+
+ // if filter results are false check if visibleCategories are undefined and if so assign true
+ if( matchesCategoryFilter == false && visibleCategories == 'undefined') {
+ matchesCategoryFilter = true;
+ }
+
+ // if filter results are falsey check if visibleCategories are undefined and if so assign true
+ if( matchesPriorityFilter == false && visiblePriorities == 'undefined') {
+ matchesPriorityFilter = true;
+ }
+
+ // depending on match results assign or remove class 'hidden'
+ if(matchesCategoryFilter & matchesPriorityFilter)
annotDiv.removeCls('hidden');
else
annotDiv.addCls('hidden');
}, me);
- if(annotations.each)
- annotations.each(fn);
- else
- Ext.Array.each(annotations, fn);
+
+ var annotationDivIds = [];
+
+ Ext.Array.each(annotations, function(annotation) {
+
+ if(debug !== null && debug) {
+ console.log('annotation');
+ console.log(annotation);
+ console.log('me');
+ console.log(me);
+ console.log('me.owner.owner');
+ console.log(me.owner.owner);
+ }
+
+ var annotDiv = me.imageViewer.getShapeElem(annotation.id);
+ var children = Ext.Array.toArray(annotDiv.dom.childNodes);
+
+ // Ext.Array.push(annotationDivIds, annotation.id);
+ Ext.Array.push(annotationDivIds, Ext.Array.pluck(children, 'id'));
+ });
+
+ if(debug !== null && debug) {
+ console.log(annotationDivIds);
+ }
+
+ Ext.Array.each(annotationDivIds, fn);
},
+
setImageSet: function(imageSet) {
-
+
var me = this;
me.imageSet = imageSet;
@@ -119,7 +188,7 @@ Ext.define('EdiromOnline.view.window.source.PageBasedView', {
}else if(me.imageSet.getCount() > 0)
me.pageSpinner.setPage(me.imageSet.getAt(0));
-
+
me.owner.fireEvent('afterImagesLoaded', me.owner, imageSet);
},
@@ -136,7 +205,7 @@ Ext.define('EdiromOnline.view.window.source.PageBasedView', {
me.imageViewer.showImage(me.activePage.get('path'),
me.activePage.get('width'), me.activePage.get('height'));
-
+
if(me.owner.measuresVisible)
me.owner.fireEvent('measureVisibilityChange', me.owner, true);
@@ -145,7 +214,7 @@ Ext.define('EdiromOnline.view.window.source.PageBasedView', {
var layers = Object.keys(me.owner.overlaysVisible);
Ext.Array.each(layers, function(layer) {
- me.owner.fireEvent('overlayVisiblityChange', me.owner, layer, me.owner.overlaysVisible[layer]);
+ me.owner.fireEvent('overlayVisiblityChange', me.owner, layer, me.owner.overlaysVisible[layer]);
});
},
@@ -170,7 +239,7 @@ Ext.define('EdiromOnline.view.window.source.PageBasedView', {
var me = this;
var image_server = getPreference('image_server');
-
+
if(image_server === 'digilib'){
me.zoomSlider = Ext.create('Ext.slider.Single', {
width: 140,
@@ -213,9 +282,9 @@ Ext.define('EdiromOnline.view.window.source.PageBasedView', {
cls: 'pageSpinner',
owner: me
});
-
+
me.separator = Ext.create('Ext.toolbar.Separator');
-
+
if(image_server === 'digilib' || image_server === 'openseadragon'){
return [me.zoomSlider, me.separator, me.pageSpinner];
}
@@ -223,30 +292,30 @@ Ext.define('EdiromOnline.view.window.source.PageBasedView', {
return [me.pageSpinner];
}
},
-
+
hideToolbarEntries: function() {
var me = this;
if(typeof me.zoomSlider !== 'undefined'){
me.zoomSlider.hide();
- }
+ }
me.pageSpinner.hide();
if(typeof me.separator !== 'undefined'){
me.separator.hide();
- }
+ }
},
-
+
showToolbarEntries: function() {
var me = this;
if(typeof me.zoomSlider !== 'undefined'){
me.zoomSlider.show();
- }
+ }
me.pageSpinner.show();
if(typeof me.separator !== 'undefined'){
me.separator.show();
- }
-
+ }
+
},
-
+
fitFacsimile: function() {
this.imageViewer.fitInImage();
},
@@ -270,17 +339,17 @@ Ext.define('EdiromOnline.view.window.source.PageBasedView', {
me.imageViewer.showRect(x, y, width, height, true);
},
-
+
showAnnotations: function(annotations) {
var me = this;
me.imageViewer.addAnnotations(annotations);
},
-
+
onOverlayVisibilityChange: function(view, state) {
var me = this;
me.fireEvent('overlayVisiblityChange', me, me.owner.overlaysVisible, me.getActivePage().get('id'), me.owner.uri, me.owner);
},
-
+
hideAnnotations: function() {
var me = this;
me.imageViewer.removeShapes('annotations');
@@ -291,13 +360,13 @@ Ext.define('EdiromOnline.view.window.source.PageBasedView', {
this.zoomSlider.suspendEvents();
this.zoomSlider.setValue(Math.round(zoom * 100));
this.zoomSlider.resumeEvents();
- }
+ }
},
zoomChanged: function(slider) {
this.imageViewer.setZoomAndCenter(slider.getValue() / 100);
},
-
+
getContentConfig: function() {
var me = this;
return {
@@ -305,9 +374,9 @@ Ext.define('EdiromOnline.view.window.source.PageBasedView', {
rect: me.imageViewer.getActualRect()
};
},
-
+
setContentConfig: function(config) {
var me = this;
- me.imageViewer.showRect(config.rect.x, config.rect.y, config.rect.width, config.rect.height, false);
+ me.imageViewer.showRect(config.rect.x, config.rect.y, config.rect.width, config.rect.height, false);
}
});
diff --git a/app/view/window/source/SourceView.js b/app/view/window/source/SourceView.js
index 9a1f064e1..77c73b58a 100644
--- a/app/view/window/source/SourceView.js
+++ b/app/view/window/source/SourceView.js
@@ -146,62 +146,91 @@ Ext.define('EdiromOnline.view.window.source.SourceView', {
setAnnotationFilter: function(priorities, categories) {
var me = this;
- var prioritiesItems = [];
- priorities.each(function(priority) {
- prioritiesItems.push({
- text: priority.get('name'),
- priorityId: priority.get('id'),
- checked: true,
- handler: Ext.bind(me.annotationFilterChanged, me)
+ if(debug !== null && debug) {
+ console.log('View: SourceView: setAnnotationFilter');
+ console.log('priorities');
+ console.log(priorities);
+ console.log('categories');
+ console.log(categories);
+
+ }
+
+ if(priorities.data.length > 0) {
+ var prioritiesItems = [];
+ priorities.each(function(priority) {
+ prioritiesItems.push({
+ text: priority.get('name'),
+ priorityId: priority.get('id'),
+ checked: true,
+ handler: Ext.bind(me.annotationFilterChanged, me)
+ });
});
- });
- me.annotPrioritiesMenu = Ext.create('Ext.menu.Menu', {
- items: prioritiesItems
- });
+ me.annotPrioritiesMenu = Ext.create('Ext.menu.Menu', {
+ items: prioritiesItems
+ });
- me.annotMenu.menu.add({
- id: me.id + '_annotCategoryFilter',
- text: getLangString('view.window.source.SourceView_prioMenu'),
- menu: me.annotPrioritiesMenu
- });
+ me.annotMenu.menu.add({
+ id: me.id + '_annotCategoryFilter',
+ text: getLangString('view.window.source.SourceView_prioMenu'),
+ menu: me.annotPrioritiesMenu
+ });
+ }
- var categoriesItems = [];
- categories.each(function(category) {
- categoriesItems.push({
- text: category.get('name'),
- categoryId: category.get('id'),
- checked: true,
- handler: Ext.bind(me.annotationFilterChanged, me)
+ if(categories.data.length > 0){
+ var categoriesItems = [];
+ categories.each(function(category) {
+ categoriesItems.push({
+ text: category.get('name'),
+ categoryId: category.get('id'),
+ checked: true,
+ handler: Ext.bind(me.annotationFilterChanged, me)
+ });
});
- });
- me.annotCategoriesMenu = Ext.create('Ext.menu.Menu', {
- items: categoriesItems
- });
+ me.annotCategoriesMenu = Ext.create('Ext.menu.Menu', {
+ items: categoriesItems
+ });
- me.annotMenu.menu.add({
- id: me.id + '_annotPriorityFilter',
- text: getLangString('view.window.source.SourceView_categoriesMenu'),
- menu: me.annotCategoriesMenu
- });
+ me.annotMenu.menu.add({
+ id: me.id + '_annotPriorityFilter',
+ text: getLangString('view.window.source.SourceView_categoriesMenu'),
+ menu: me.annotCategoriesMenu
+ });
+ }
},
annotationFilterChanged: function(item, event) {
var me = this;
+ // if me.annotationsVisible is false do nothing
if(!me.annotationsVisible) return;
+ // set visible Priorities
var visiblePriorities = [];
- me.annotPrioritiesMenu.items.each(function(item) {
- if(item.checked)
- visiblePriorities.push(item.priorityId);
- });
+
+ // iterate over corresponding menu to get priorities
+ if(me.annotPrioritiesMenu != null && me.annotPrioritiesMenu.items.length != 0) {
+ me.annotPrioritiesMenu.items.each(function(item) {
+ if(item.checked)
+ visiblePriorities.push(item.priorityId);
+ });
+ } else {
+ visiblePriorities.push('undefined');
+ }
+
+ // set visible categories
var visibleCategories = [];
- me.annotCategoriesMenu.items.each(function(item) {
- if(item.checked)
- visibleCategories.push(item.categoryId);
- });
+
+ // iterate over corresponding menu to get categories
+ if(me.annotCategoriesMenu != null && me.annotCategoriesMenu.items.length != 0) {
+ me.annotCategoriesMenu.items.each(function(item) {
+ if(item.checked)
+ visibleCategories.push(item.categoryId);
+ });
+ } else {
+ visibleCategories.push('undefined');
+ }
me.pageBasedView.annotationFilterChanged(visibleCategories, visiblePriorities);
me.measureBasedView.annotationFilterChanged(visibleCategories, visiblePriorities);
@@ -210,10 +239,16 @@ Ext.define('EdiromOnline.view.window.source.SourceView', {
setMovements: function(movements) {
var me = this;
+ // set me.movements to submitted JSON array
me.movements = movements;
+
+ // set meovements for measureBaseView
me.measureBasedView.setMovements(movements);
+ // initialize movementItems variable
var movementItems = [];
+
+ // iterate over submitted movements and push them to movementItems variable
movements.each(function(movement) {
movementItems.push({
text: movement.get('name'),
@@ -221,9 +256,16 @@ Ext.define('EdiromOnline.view.window.source.SourceView', {
});
});
+ // check if contains more than one item and save to variable as boolean
+ var isDisabled = ((movementItems.length <= 1) ? true : false);
+
+ // add gotoMovement entry to goto menu
me.gotoMenu.menu.add({
id: me.id + '_gotoMovement',
text: getLangString('view.window.source.SourceView_gotoMovement'),
+ cls: 'gotoMovement',
+ disabled: isDisabled,
+ disabledCls: 'x-disabled',
menu: {
items: movementItems
}
@@ -557,12 +599,18 @@ Ext.define('EdiromOnline.view.window.source.GotoMsg', {
me.title = getLangString('view.window.source.SourceView_GotoMsg_Title');
+ // check if contains more than one item and save to variable as boolean
+ var isDisabled = ((me.movements.data.length <= 1) ? true : false);
+
me.combo = Ext.create('Ext.form.ComboBox', {
fieldLabel: getLangString('view.window.source.SourceView_GotoMsg_MovmentNumber'),
store: me.movements,
queryMode: 'local',
displayField: 'name',
- valueField: 'id'
+ valueField: 'id',
+ cls: 'gotoMovement',
+ disabled: isDisabled,
+ disabledCls: 'x-disabled'
});
me.field = Ext.create('Ext.form.field.Text', {
diff --git a/app/view/window/source/VerovioView.js b/app/view/window/source/VerovioView.js
index 86bc6d2a1..dfae365f7 100644
--- a/app/view/window/source/VerovioView.js
+++ b/app/view/window/source/VerovioView.js
@@ -85,20 +85,31 @@ Ext.define('EdiromOnline.view.window.source.VerovioView', {
setMovements: function (movements) {
var me = this;
-
+
+ // set me.movements to submitted JSON array
me.movements = movements;
-
+
+ // initialize movementItems variable
var movementItems =[];
+
+ // iterate over submitted movements and push them to movementItems variable
movements.each(function (movement) {
movementItems.push({
text: movement. get ('name'),
handler: Ext.bind(me.showMovement, me, movement. get ('id'), true)
});
});
-
+
+ // check if contains more than one item and save to variable as boolean
+ var isDisabled = ((movementItems.length <= 1) ? true : false);
+
+ // add gotoMovement entry to goto menu
me.gotoMenu.menu.add({
id: me.id + '_gotoMovement',
text: getLangString('view.window.source.SourceView_gotoMovement'),
+ cls: 'gotoMovement',
+ disabled: isDisabled,
+ disabledCls: 'x-disabled',
menu: {
items: movementItems
}
diff --git a/app/view/window/text/TextFacsimileSplitView.js b/app/view/window/text/TextFacsimileSplitView.js
index d0605307c..3f7dc558d 100644
--- a/app/view/window/text/TextFacsimileSplitView.js
+++ b/app/view/window/text/TextFacsimileSplitView.js
@@ -45,8 +45,11 @@ Ext.define('EdiromOnline.view.window.text.TextFacsimileSplitView', {
if(me.image_server === 'leaflet'){
me.imageViewer = Ext.create('EdiromOnline.view.window.image.LeafletFacsimile');
- }
- else{
+ }else if(image_server === "openseadragon") {
+ me.imageViewer = Ext.create(
+ "EdiromOnline.view.window.image.OpenSeaDragonViewer",
+ );
+ }else{
me.imageViewer = Ext.create('EdiromOnline.view.window.image.ImageViewer');
}
@@ -87,7 +90,7 @@ Ext.define('EdiromOnline.view.window.text.TextFacsimileSplitView', {
var me = this;
- if(me.image_server === 'digilib'){
+ if(me.image_server === 'digilib' || me.image_server === 'openseadragon'){
me.zoomSlider = Ext.create('Ext.slider.Single', {
width: 140,
value: 100,
diff --git a/packages/eoTheme/sass/etc/annotation.scss b/packages/eoTheme/sass/etc/annotation.scss
index 4af210889..5602b7687 100755
--- a/packages/eoTheme/sass/etc/annotation.scss
+++ b/packages/eoTheme/sass/etc/annotation.scss
@@ -292,6 +292,7 @@ $content_baseFont_size: 14px;
right: 10px;
top: 10px;
overflow: auto;
+ cursor: pointer;
}
.annotationViewContent .contentBox {
diff --git a/packages/eoTheme/sass/var/form/field/Base.scss b/packages/eoTheme/sass/var/form/field/Base.scss
new file mode 100644
index 000000000..9d1a50a35
--- /dev/null
+++ b/packages/eoTheme/sass/var/form/field/Base.scss
@@ -0,0 +1,7 @@
+.x-form-item {
+
+ &.x-disabled {
+ opacity: 0.5;
+ }
+
+}
\ No newline at end of file
diff --git a/packages/eoTheme/sass/var/menu/Menu.scss b/packages/eoTheme/sass/var/menu/Menu.scss
index 606b266a2..b02bb30ae 100644
--- a/packages/eoTheme/sass/var/menu/Menu.scss
+++ b/packages/eoTheme/sass/var/menu/Menu.scss
@@ -10,4 +10,8 @@ $menu-border-color: darken($window-base-color,15%);
top: 3px !important;
}
+ .x-disabled {
+ opacity: 0.5;
+ }
+
}