Skip to content

Commit b115a29

Browse files
authored
Merge pull request #491 from DDMAL/release/4.0.0
Release Neon v4.0.0
2 parents af8d1d1 + 8fa62d7 commit b115a29

File tree

163 files changed

+24146
-6161
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

163 files changed

+24146
-6161
lines changed

.travis.yml

Lines changed: 15 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,28 @@
11
language: node_js
22
node_js: 10
3-
os: osx
43
env:
5-
- HOMEBREW_NO_AUTO_UPDATE="1"
4+
- NODE_OPTIONS=--max_old_space_size=2048
5+
os: osx
6+
osx_image: xcode10.2
67
if: (branch = master OR branch = develop)
8+
cache:
9+
directories:
10+
- $HOME/Library/Caches/Homebrew
711
addons:
812
firefox: latest
9-
before_install:
10-
- brew install geckodriver
13+
chrome: stable
14+
homebrew:
15+
update: true
16+
packages:
17+
- geckodriver
18+
casks:
19+
- chromedriver
1120
install:
21+
- sudo safaridriver --enable
1222
- yarn install
1323
script:
1424
- yarn build
25+
- yarn upgrade verovio-dev
1526
- yarn start &
1627
- yarn test
1728
notifications:

README.md

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
Neon v 3.1.1
1+
Neon v4.0.0
22
=====
33
[![Build_Status](https://travis-ci.org/DDMAL/Neon.svg?branch=master)](https://travis-ci.org/DDMAL/Neon)
44
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
@@ -46,11 +46,12 @@ Neon has two main modes: viewer and editor. To learn how to use both, [read the
4646
Test
4747
----
4848

49-
Follow the instructions from above first. The tests for Neon use [Selenium](https://docs.seleniumhq.org/) and so require a web browser ([Firefox](https://mozilla.org/firefox)) and its driver ([geckodriver](https://github.com/mozilla/geckodriver)).
50-
On Mac install these with Homebrew:
51-
```
49+
Follow the instructions from above first. The tests for Neon use [Selenium](https://docs.seleniumhq.org/) and use Firefox, Safari, and Chrome. Their respective webdrivers are required. Safari 12 or greater is required. On Mac, Firefox and Chrome can be installed by:
50+
```shell
5251
brew cask install firefox
52+
brew cask install google-chrome
5353
brew install geckodriver
54+
brew cask install chromedriver
5455
```
5556
Then you can run the tests locally using `yarn test`. We use [jest](https://facebook.github.io/jest/) to script our tests.
5657

Lines changed: 259 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,259 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>JSDoc: Source: DisplayPanel/DisplayControls.js</title>
6+
7+
<script src="scripts/prettify/prettify.js"> </script>
8+
<script src="scripts/prettify/lang-css.js"> </script>
9+
<!--[if lt IE 9]>
10+
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
11+
<![endif]-->
12+
<link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
13+
<link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
14+
</head>
15+
16+
<body>
17+
18+
<div id="main">
19+
20+
<h1 class="page-title">Source: DisplayPanel/DisplayControls.js</h1>
21+
22+
23+
24+
25+
26+
27+
<section>
28+
<article>
29+
<pre class="prettyprint source linenums"><code>/** @module DisplayPanel/DisplayControls */
30+
31+
import * as Color from '../utils/Color.js';
32+
import Icons from '../img/icons.svg';
33+
34+
const $ = require('jquery');
35+
36+
var lastGlyphOpacity, lastImageOpacity;
37+
38+
/**
39+
* Initialize listeners and controls for display panel.
40+
* @param {string} meiClassName - The class used to signifiy the MEI element(s).
41+
* @param {string} background - The class used to signify the background.
42+
*/
43+
export function initDisplayControls (meiClassName, background) {
44+
setOpacityControls(meiClassName);
45+
setBackgroundOpacityControls(background);
46+
setHighlightControls();
47+
setBurgerControls();
48+
49+
$('#toggleDisplay').on('click', () => {
50+
if ($('#displayContents').is(':hidden')) {
51+
$('#displayContents').css('display', '');
52+
$('#toggleDisplay').attr('xlink:href', Icons + '#dropdown-down');
53+
} else {
54+
$('#displayContents').css('display', 'none');
55+
$('#toggleDisplay').attr('xlink:href', Icons + '#dropdown-side');
56+
}
57+
});
58+
}
59+
60+
/**
61+
* Set zoom control listener for button and slider
62+
* @param {ZoomHandler} zoomHandler - The zoomHandler, if it exists.
63+
*/
64+
export function setZoomControls (zoomHandler) {
65+
if (zoomHandler === undefined) {
66+
return;
67+
}
68+
$('#zoomSlider').val(100);
69+
$('#reset-zoom').click(() => {
70+
$('#zoomOutput').val(100);
71+
$('#zoomSlider').val(100);
72+
zoomHandler.resetZoomAndPan();
73+
});
74+
75+
$(document).on('input change', '#zoomSlider', () => {
76+
$('#zoomOutput').val($('#zoomSlider').val());
77+
zoomHandler.zoomTo($('#zoomOutput').val() / 100.0);
78+
});
79+
80+
$('body').on('keydown', (evt) => {
81+
let currentZoom = parseInt($('#zoomOutput').val());
82+
if (evt.key === '+') { // increase zoom by 20
83+
let newZoom = Math.min(currentZoom + 20, parseInt($('#zoomSlider').attr('max')));
84+
zoomHandler.zoomTo(newZoom / 100.0);
85+
$('#zoomOutput').val(newZoom);
86+
$('#zoomSlider').val(newZoom);
87+
} else if (evt.key === '-') { // decrease zoom by 20
88+
let newZoom = Math.max(currentZoom - 20, parseInt($('#zoomSlider').attr('min')));
89+
zoomHandler.zoomTo(newZoom / 100.0);
90+
$('#zoomOutput').val(newZoom);
91+
$('#zoomSlider').val(newZoom);
92+
} else if (evt.key === '0') {
93+
$('#zoomOutput').val(100);
94+
$('#zoomSlider').val(100);
95+
zoomHandler.resetZoomAndPan();
96+
}
97+
});
98+
}
99+
100+
/**
101+
* Set rendered MEI opacity button and slider listeners.
102+
* @param {string} meiClassName
103+
*/
104+
function setOpacityControls (meiClassName) {
105+
lastGlyphOpacity = 100;
106+
$('#opacitySlider').val(100);
107+
$('#reset-opacity').click(function () {
108+
// Definition scale is the root element of what is generated by verovio
109+
let lowerOpacity = lastGlyphOpacity &lt; 95 ? lastGlyphOpacity / 100.0 : 0;
110+
let newOpacity = $('#opacitySlider').val() === '100' ? lowerOpacity : 1;
111+
$('.' + meiClassName).css('opacity', newOpacity);
112+
113+
lastGlyphOpacity = Number($('#opacitySlider').val());
114+
$('#opacitySlider').val(newOpacity * 100);
115+
$('#opacityOutput').val(newOpacity * 100);
116+
});
117+
118+
$(document).on('input change', '#opacitySlider', () => {
119+
$('#opacityOutput').val($('#opacitySlider').val());
120+
lastGlyphOpacity = Number($('#opacitySlider').val());
121+
$('.' + meiClassName).css('opacity', $('#opacityOutput').val() / 100.0);
122+
});
123+
}
124+
125+
/**
126+
* Update MEI opacity to value from the slider.
127+
* @param {string} meiClassName
128+
*/
129+
export function setOpacityFromSlider (meiClassName) {
130+
$('#opacityOutput').val($('#opacitySlider').val());
131+
$('.' + meiClassName).css('opacity', $('#opacityOutput').val() / 100.0);
132+
}
133+
134+
/**
135+
* Set background image opacity button and slider listeners.
136+
* @param {string} background
137+
*/
138+
function setBackgroundOpacityControls (background) {
139+
lastImageOpacity = 100;
140+
$('#bgOpacitySlider').val(100);
141+
$('#reset-bg-opacity').click(function () {
142+
let lowerOpacity = lastImageOpacity &lt; 95 ? lastImageOpacity / 100.0 : 0;
143+
let newOpacity = $('#bgOpacitySlider').val() === '100' ? lowerOpacity : 1;
144+
document.getElementsByClassName(background)[0].style.opacity = newOpacity;
145+
146+
lastImageOpacity = Number($('#bgOpacitySlider').val());
147+
$('#bgOpacitySlider').val(newOpacity * 100);
148+
$('#bgOpacityOutput').val(newOpacity * 100);
149+
});
150+
151+
$(document).on('input change', '#bgOpacitySlider', function () {
152+
$('#bgOpacityOutput').val(parseInt($('#bgOpacitySlider').val()));
153+
lastImageOpacity = Number($('#bgOpacitySlider').val());
154+
document.getElementsByClassName(background)[0].style.opacity = $('#bgOpacityOutput').val() / 100.0;
155+
});
156+
}
157+
158+
/**
159+
* Set listener on staff highlighting checkbox.
160+
*/
161+
export function setHighlightControls () {
162+
$('#highlight-button').on('click', (evt) => {
163+
evt.stopPropagation();
164+
$('#highlight-dropdown').toggleClass('is-active');
165+
if ($('#highlight-dropdown').hasClass('is-active')) {
166+
$('body').one('click', highlightClickaway);
167+
$('#highlight-staff').on('click', () => {
168+
$('#highlight-dropdown').removeClass('is-active');
169+
$('.highlight-selected').removeClass('highlight-selected');
170+
$('#highlight-staff').addClass('highlight-selected');
171+
$('#highlight-type').html('&amp;nbsp;- Staff');
172+
Color.setGroupingHighlight('staff');
173+
});
174+
$('#highlight-syllable').on('click', () => {
175+
$('#highlight-dropdown').removeClass('is-active');
176+
$('.highlight-selected').removeClass('highlight-selected');
177+
$('#highlight-syllable').addClass('highlight-selected');
178+
$('#highlight-type').html('&amp;nbsp;- Syllable');
179+
Color.setGroupingHighlight('syllable');
180+
});
181+
$('#highlight-neume').on('click', () => {
182+
$('#highlight-dropdown').removeClass('is-active');
183+
$('.highlight-selected').removeClass('highlight-selected');
184+
$('#highlight-neume').addClass('highlight-selected');
185+
$('#highlight-type').html('&amp;nbsp;- Neume');
186+
Color.setGroupingHighlight('neume');
187+
});
188+
$('#highlight-none').on('click', () => {
189+
$('#highlight-dropdown').removeClass('is-active');
190+
$('.highlight-selected').removeClass('highlight-selected');
191+
$('#highlight-type').html('&amp;nbsp;- Off');
192+
Color.unsetGroupingHighlight();
193+
});
194+
} else {
195+
$('body').off('click', highlightClickaway);
196+
}
197+
});
198+
}
199+
200+
/**
201+
* Reset the highlight for different types based on the 'highlight-selected' class in the DOM.
202+
*/
203+
export function updateHighlight () {
204+
let highlightId = $('.highlight-selected').attr('id');
205+
switch (highlightId) {
206+
case 'highlight-staff':
207+
Color.setGroupingHighlight('staff');
208+
break;
209+
case 'highlight-syllable':
210+
Color.setGroupingHighlight('syllable');
211+
break;
212+
case 'highlight-neume':
213+
Color.setGroupingHighlight('neume');
214+
break;
215+
default:
216+
Color.unsetGroupingHighlight();
217+
}
218+
}
219+
220+
/**
221+
* Set listener on burger menu for smaller screens.
222+
*/
223+
function setBurgerControls () {
224+
$('#burgerMenu').on('click', () => {
225+
$(this).toggleClass('is-active');
226+
$('#navMenu').toggleClass('is-active');
227+
});
228+
}
229+
230+
/**
231+
* Clickaway listener for the highlight dropdown.
232+
*/
233+
function highlightClickaway () {
234+
$('body').off('click', highlightClickaway);
235+
$('#highlight-dropdown').removeClass('is-active');
236+
}
237+
</code></pre>
238+
</article>
239+
</section>
240+
241+
242+
243+
244+
</div>
245+
246+
<nav>
247+
<h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-DisplayPanel_DisplayControls.html">DisplayPanel/DisplayControls</a></li><li><a href="module-DisplayPanel_DisplayPanel.html">DisplayPanel/DisplayPanel</a></li><li><a href="module-InfoModule.html">InfoModule</a></li><li><a href="module-SingleView_Zoom.html">SingleView/Zoom</a></li><li><a href="module-SquareEdit_Contents.html">SquareEdit/Contents</a></li><li><a href="module-SquareEdit_Controls.html">SquareEdit/Controls</a></li><li><a href="module-SquareEdit_Grouping.html">SquareEdit/Grouping</a></li><li><a href="module-SquareEdit_SelectOptions.html">SquareEdit/SelectOptions</a></li><li><a href="module-SquareEdit_StaffTools.html">SquareEdit/StaffTools</a></li><li><a href="module-TextView.html">TextView</a></li><li><a href="module-utils_Color.html">utils/Color</a></li><li><a href="module-utils_Cursor.html">utils/Cursor</a></li><li><a href="module-utils_EditContents.html">utils/EditContents</a></li><li><a href="module-utils_EditControls.html">utils/EditControls</a></li><li><a href="module-utils_NeonManifest.html">utils/NeonManifest</a></li><li><a href="module-utils_Notification.html">utils/Notification</a></li><li><a href="module-utils_Resize.html">utils/Resize</a></li><li><a href="module-utils_Select.html">utils/Select</a></li><li><a href="module-utils_SelectTools.html">utils/SelectTools</a></li><li><a href="module-Validation.html">Validation</a></li><li><a href="module-Warnings.html">Warnings</a></li></ul><h3>Classes</h3><ul><li><a href="DivaView.html">DivaView</a></li><li><a href="DragHandler.html">DragHandler</a></li><li><a href="InsertHandler.html">InsertHandler</a></li><li><a href="module.exports.html">exports</a></li><li><a href="module-DisplayPanel_DisplayPanel-DisplayPanel.html">DisplayPanel</a></li><li><a href="module-InfoModule-InfoModule.html">InfoModule</a></li><li><a href="module-SingleView_Zoom.ViewBox.html">ViewBox</a></li><li><a href="module-SingleView_Zoom-ZoomHandler.html">ZoomHandler</a></li><li><a href="module-SquareEdit_StaffTools-SplitHandler.html">SplitHandler</a></li><li><a href="module-TextView-TextView.html">TextView</a></li><li><a href="module-utils_Notification-Notification.html">Notification</a></li><li><a href="module-utils_Resize-Resize.html">Resize</a></li><li><a href="NeonCore.html">NeonCore</a></li><li><a href="NeonView.html">NeonView</a></li><li><a href="SingleEditMode.html">SingleEditMode</a></li><li><a href="SingleView.html">SingleView</a></li></ul><h3>Global</h3><ul><li><a href="global.html#addBBoxListeners">addBBoxListeners</a></li><li><a href="global.html#addEventListener">addEventListener</a></li><li><a href="global.html#formatRaw">formatRaw</a></li><li><a href="global.html#handleNeonEvent">handleNeonEvent</a></li><li><a href="global.html#initEditModeControls">initEditModeControls</a></li><li><a href="global.html#initSelectByBBoxButton">initSelectByBBoxButton</a></li><li><a href="global.html#initTextEdit">initTextEdit</a></li><li><a href="global.html#postMessage">postMessage</a></li><li><a href="global.html#updateSylText">updateSylText</a></li></ul>
248+
</nav>
249+
250+
<br class="clear">
251+
252+
<footer>
253+
Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 3.6.2</a> on Mon Jul 15 2019 09:24:07 GMT-0400 (GMT-04:00)
254+
</footer>
255+
256+
<script> prettyPrint(); </script>
257+
<script src="scripts/linenumber.js"> </script>
258+
</body>
259+
</html>

0 commit comments

Comments
 (0)