Skip to content

Commit

Permalink
Merge branch 'notification-type-fix' into existing-out-of-bounds-fix
Browse files Browse the repository at this point in the history
  • Loading branch information
jinh0 committed Jul 18, 2022
2 parents 6acb4bc + cd384af commit 42fbcb7
Show file tree
Hide file tree
Showing 14 changed files with 372 additions and 197 deletions.
19 changes: 18 additions & 1 deletion assets/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -567,12 +567,12 @@ a:hover {
z-index: 8;
position: fixed;
}

.neon-notification {
padding: 0.4rem 0.8rem 0.4rem 0.8rem;
margin: 0.5rem;
font-weight: 600;
background: #589ed5;
opacity: 0.9;
color: #ffffff;
border-radius: 4px;
z-index: 8;
Expand All @@ -581,6 +581,23 @@ a:hover {
animation: slideInFromLeft 0.2s ease-in-out 0s forwards;
}

.neon-notification-default {
background: #589ed5;
}

.neon-notification-error {
background: #df546a;
}

.neon-notification-warning {
/* background: #fae095; */
background: #f5c144;
}

.neon-notification-success {
background: #6dc492;
}


/* Section: Loading Animation */

Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "Neon",
"version": "4.1.0",
"version": "5.0.0",
"description": "A web-based editor for correcting MEI-Neume files",
"main": "server.js",
"license": "MIT",
Expand Down
20 changes: 10 additions & 10 deletions src/SquareEdit/Grouping.ts
Original file line number Diff line number Diff line change
Expand Up @@ -62,11 +62,11 @@ export function mergeStaves (): void {
};
neonView.edit(editorAction, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Staff Merged');
Notification.queueNotification('Staff Merged', 'success');
SelectOptions.endOptionsSelection();
neonView.updateForCurrentPage();
} else {
Notification.queueNotification('Merge Failed');
Notification.queueNotification('Merge Failed', 'error');
}
});
}
Expand Down Expand Up @@ -155,9 +155,9 @@ export function initGroupingListeners (): void {
};
neonView.edit(editorAction, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Ligature Toggled');
Notification.queueNotification('Ligature Toggled', 'success');
} else {
Notification.queueNotification('Ligature Toggle Failed');
Notification.queueNotification('Ligature Toggle Failed', 'error');
}
endGroupingSelection();
neonView.updateForCurrentPage();
Expand Down Expand Up @@ -269,9 +269,9 @@ export function initGroupingListeners (): void {
chainAction.param = param;
neonView.edit(chainAction, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Toggled Syllable Link');
Notification.queueNotification('Toggled Syllable Link', 'success');
} else {
Notification.queueNotification('Failed to Toggle Syllable Link');
Notification.queueNotification('Failed to Toggle Syllable Link', 'error');
}
endGroupingSelection();
neonView.updateForCurrentPage();
Expand Down Expand Up @@ -359,15 +359,15 @@ function groupingAction (action: 'group' | 'ungroup', groupType: 'neume' | 'nc',
neonView.edit(editorAction, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
if (action === 'group') {
Notification.queueNotification('Grouping Success');
Notification.queueNotification('Grouping Success', 'success');
} else {
Notification.queueNotification('Ungrouping Success');
Notification.queueNotification('Ungrouping Success', 'success');
}
} else {
if (action === 'group') {
Notification.queueNotification('Grouping Failed');
Notification.queueNotification('Grouping Failed', 'error');
} else {
Notification.queueNotification('Ungrouping Failed');
Notification.queueNotification('Ungrouping Failed', 'error');
}
}
neonView.updateForCurrentPage();
Expand Down
7 changes: 6 additions & 1 deletion src/SquareEdit/InsertHandler.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import NeonView from '../NeonView';
import { EditorAction, InsertAction } from '../Types';
import * as d3 from 'd3';
import { getSVGRelCoords, Point } from '../utils/Coordinates';
import { getSVGRelCoords, isOutOfSVGBounds, Point } from '../utils/Coordinates';
import { queueNotification } from '../utils/Notification';

/**
* Class that handles insert mode, events, and actions.
Expand Down Expand Up @@ -210,7 +211,11 @@ class InsertHandler {
handler = (function handler (evt: MouseEvent): void {
evt.stopPropagation();

// If the cursor is out of bounds, nothing should be inserted.
const cursor = getSVGRelCoords(evt.clientX, evt.clientY);
if (isOutOfSVGBounds(cursor.x, cursor.y))
return queueNotification('[FAIL] Glyph was placed out of bounds! Insertion failed.', 'error');

const editorAction: InsertAction = {
action: 'insert',
param: {
Expand Down
4 changes: 2 additions & 2 deletions src/SquareEdit/NeumeTools.ts
Original file line number Diff line number Diff line change
Expand Up @@ -58,11 +58,11 @@ export class SplitNeumeHandler {
this.neonView.edit(editorAction, this.neonView.view.getCurrentPageURI()).then(async (result) => {
if (result) {
await this.neonView.updateForCurrentPage();
Notification.queueNotification('Split action successful');
Notification.queueNotification('Split action successful', 'success');
}
else {
await this.neonView.updateForCurrentPage();
Notification.queueNotification('Split action failed');
Notification.queueNotification('Split action failed', 'error');
}
// this.neonView.updateForCurrentPage();
// const dragHandler = new DragHandler(this.neonView, '.neume');
Expand Down
52 changes: 26 additions & 26 deletions src/SquareEdit/SelectOptions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -192,9 +192,9 @@ export function insertToSyllableHandler(): void {
};
neonView.edit(chainAction, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Insert Success');
Notification.queueNotification('Insert Success', 'success');
} else {
Notification.queueNotification('Insert Failed XoX');
Notification.queueNotification('Insert Failed XoX', 'error');
}
endOptionsSelection();
neonView.updateForCurrentPage();
Expand Down Expand Up @@ -223,9 +223,9 @@ export function moveOuttaSyllableHandler(): void {
};
neonView.edit(chainAction, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Move Success');
Notification.queueNotification('Move Success', 'success');
} else {
Notification.queueNotification('Move Failed XoX');
Notification.queueNotification('Move Failed XoX', 'error');
}
endOptionsSelection();
neonView.updateForCurrentPage();
Expand Down Expand Up @@ -308,9 +308,9 @@ export function triggerNcActions (nc: SVGGraphicsElement): void {
const unsetLiquescentAnticlockwise = unsetLiquescentAnticlockwiseAction(nc.id);
neonView.edit({ action: 'chain', param: [ unsetInclinatum, unsetVirga, unsetVirgaReversed, unsetLiquescentClockwise, unsetLiquescentAnticlockwise ] }, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Shape Changed');
Notification.queueNotification('Shape Changed', 'success');
} else {
Notification.queueNotification('Shape Change Failed');
Notification.queueNotification('Shape Change Failed', 'error');
}
endOptionsSelection();
neonView.updateForCurrentPage();
Expand All @@ -333,9 +333,9 @@ export function triggerNcActions (nc: SVGGraphicsElement): void {
};
neonView.edit({ action: 'chain', param: [ unsetVirga, unsetVirgaReversed, unsetLiquescentClockwise, unsetLiquescentAnticlockwise, setInclinatum ] } , neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Shape Changed');
Notification.queueNotification('Shape Changed', 'success');
} else {
Notification.queueNotification('Shape Change Failed');
Notification.queueNotification('Shape Change Failed', 'error');
}
endOptionsSelection();
neonView.updateForCurrentPage();
Expand All @@ -358,9 +358,9 @@ export function triggerNcActions (nc: SVGGraphicsElement): void {
};
neonView.edit({ action: 'chain', param: [ unsetVirgaReversed, unsetInclinatum, unsetLiquescentClockwise, unsetLiquescentAnticlockwise, setVirga ] }, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Shape Changed');
Notification.queueNotification('Shape Changed', 'success');
} else {
Notification.queueNotification('Shape Change Failed');
Notification.queueNotification('Shape Change Failed', 'error');
}
endOptionsSelection();
neonView.updateForCurrentPage();
Expand All @@ -383,9 +383,9 @@ export function triggerNcActions (nc: SVGGraphicsElement): void {
};
neonView.edit({ action: 'chain', param: [ unsetInclinatum, unsetVirga, unsetLiquescentClockwise, unsetLiquescentAnticlockwise, setVirgaReversed ] }, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Shape Changed');
Notification.queueNotification('Shape Changed', 'success');
} else {
Notification.queueNotification('Shape Change Failed');
Notification.queueNotification('Shape Change Failed', 'error');
}
endOptionsSelection();
neonView.updateForCurrentPage();
Expand All @@ -408,9 +408,9 @@ export function triggerNcActions (nc: SVGGraphicsElement): void {
};
neonView.edit({ action: 'chain', param: [ unsetInclinatum, unsetVirga, unsetVirgaReversed, unsetLiquescentAnticlockwise, setLiquescentClockwise ] }, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Shape Changed');
Notification.queueNotification('Shape Changed', 'success');
} else {
Notification.queueNotification('Shape Change Failed');
Notification.queueNotification('Shape Change Failed', 'error');
}
endOptionsSelection();
neonView.updateForCurrentPage();
Expand All @@ -433,9 +433,9 @@ export function triggerNcActions (nc: SVGGraphicsElement): void {
};
neonView.edit({ action: 'chain', param: [ unsetInclinatum, unsetVirga, unsetVirgaReversed, unsetLiquescentClockwise, setLiquescentAnticlockwise ] }, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Shape Changed');
Notification.queueNotification('Shape Changed', 'success');
} else {
Notification.queueNotification('Shape Change Failed');
Notification.queueNotification('Shape Change Failed', 'error');
}
endOptionsSelection();
neonView.updateForCurrentPage();
Expand Down Expand Up @@ -556,9 +556,9 @@ export function triggerNeumeActions (): void {
};
neonView.edit(changeGroupingAction, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Grouping Changed');
Notification.queueNotification('Grouping Changed', 'success');
} else {
Notification.queueNotification('Grouping Failed');
Notification.queueNotification('Grouping Failed', 'error');
}
endOptionsSelection();
neonView.updateForCurrentPage();
Expand Down Expand Up @@ -610,9 +610,9 @@ export function triggerClefActions (clef: SVGGraphicsElement): void {
};
neonView.edit(setCClef, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Shape Changed');
Notification.queueNotification('Shape Changed', 'success');
} else {
Notification.queueNotification('Shape Change Failed');
Notification.queueNotification('Shape Change Failed', 'error');
}
endOptionsSelection();
neonView.updateForCurrentPage();
Expand All @@ -629,9 +629,9 @@ export function triggerClefActions (clef: SVGGraphicsElement): void {
};
neonView.edit(setFClef, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Shape Changed');
Notification.queueNotification('Shape Changed', 'success');
} else {
Notification.queueNotification('Shape Change Failed');
Notification.queueNotification('Shape Change Failed', 'error');
}
endOptionsSelection();
neonView.updateForCurrentPage();
Expand Down Expand Up @@ -681,9 +681,9 @@ export function triggerAccidActions (accid: SVGGraphicsElement): void {
};
neonView.edit(changeToFlat, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Shape Changed');
Notification.queueNotification('Shape Changed', 'success');
} else {
Notification.queueNotification('Shape Change Failed');
Notification.queueNotification('Shape Change Failed', 'error');
}
endOptionsSelection();
neonView.updateForCurrentPage();
Expand All @@ -701,9 +701,9 @@ export function triggerAccidActions (accid: SVGGraphicsElement): void {
};
neonView.edit(changeToNatural, neonView.view.getCurrentPageURI()).then((result) => {
if (result) {
Notification.queueNotification('Shape Changed');
Notification.queueNotification('Shape Changed', 'success');
} else {
Notification.queueNotification('Shape Change Failed');
Notification.queueNotification('Shape Change Failed', 'error');
}
endOptionsSelection();
neonView.updateForCurrentPage();
Expand Down
2 changes: 1 addition & 1 deletion src/SquareEdit/StaffTools.ts
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ export class SplitStaffHandler {
this.neonView.edit(editorAction, this.neonView.view.getCurrentPageURI()).then(async (result) => {
if (result) {
await this.neonView.updateForCurrentPage();
Notification.queueNotification('Split action successful');
Notification.queueNotification('Split action successful', 'success');
}
const dragHandler = new DragHandler(this.neonView, '.staff');
this.splitDisable();
Expand Down
21 changes: 11 additions & 10 deletions src/utils/ConvertMei.ts
Original file line number Diff line number Diff line change
Expand Up @@ -118,7 +118,7 @@ export function convertSbToStaff(sbBasedMei: string): string {
for (const neume of neumes) {
if (neume.getElementsByTagName('nc').length === 0) {
// neume.remove();
Notification.queueNotification('This file contains a neume without neume component!');
Notification.queueNotification('This file contains a neume without neume component!', 'warning');
}
}

Expand All @@ -127,7 +127,7 @@ export function convertSbToStaff(sbBasedMei: string): string {
for (const syllable of syllables) {
if (syllable.getElementsByTagName('neume').length === 0) {
// syllable.remove();
Notification.queueNotification('This file contains a syllable without neume!');
Notification.queueNotification('This file contains a syllable without neume!', 'warning');
}
}

Expand Down Expand Up @@ -238,7 +238,8 @@ export function convertSbToStaff(sbBasedMei: string): string {
// Update syllable arrays for each syllable
const syllableIdx = newSyllables.indexOf(syllable);

// Toggle-linked syllables: Check the PRECEDING syllable
// For each toggle-linked syllable
// Set @precedes and @follows to make sure pointing to the correct syllable
if (syllable.hasAttribute('precedes')) {
// Get xml:id of the next syllable (without the #, if it exists)
const nextSyllableId = syllable.getAttribute('precedes').replace('#', '');
Expand All @@ -257,21 +258,21 @@ export function convertSbToStaff(sbBasedMei: string): string {
// Condition 1: The next (following) syllable cannot be found
if (!nextSyllable) {
const sylText = getSyllableText(syllable);
Notification.queueNotification(`Missing the 2nd part of the toggle-linked syllable (${sylText})`);
Notification.queueNotification(`Missing the 2nd part of the toggle-linked syllable (${sylText})`, 'error');
continue;
}

// Condition 2: The next syllable has been found, but the @follows attribute does NOT EXIST
if (!nextSyllable.hasAttribute('follows')) {
const sylText = getSyllableText(syllable);
Notification.queueNotification(`The 2nd part of the toggle-linked syllable (${sylText}) does not link to any syllable`);
Notification.queueNotification(`The 2nd part of the toggle-linked syllable (${sylText}) does not link to any syllable`, 'error');
continue;
}

// Condition 3: The next syllable's @follows attribute exists, but it is not in the correct format #id
if (nextSyllable.getAttribute('follows') != '#' + syllable.getAttribute('xml:id')) {
const sylText = getSyllableText(syllable);
Notification.queueNotification(`The 2nd part of the toggle-linked syllable (${sylText}) links to the wrong syllable`);
Notification.queueNotification(`The 2nd part of the toggle-linked syllable (${sylText}) links to the wrong syllable`, 'error');
continue;
}

Expand All @@ -285,7 +286,7 @@ export function convertSbToStaff(sbBasedMei: string): string {
.map((syllable) => getSyllableText(syllable));

const sylsText = [sylText, ...unexpectedSylsText].join(' - ');
Notification.queueNotification(`Unexpected syllable(s) inside toggle-linked syllable: ${sylsText}`);
Notification.queueNotification(`Unexpected syllable(s) inside toggle-linked syllable: ${sylsText}`, 'error');
}
}
// Toggle-linked syllables: Check the FOLLOWING syllable
Expand All @@ -296,21 +297,21 @@ export function convertSbToStaff(sbBasedMei: string): string {
// Condition 1: The previous syllable does not exist
if (!prevSyllable) {
const sylText = getSyllableText(syllable);
Notification.queueNotification(`Missing the 1st part of the toggle-linked syllable (${sylText})`);
Notification.queueNotification(`Missing the 1st part of the toggle-linked syllable (${sylText})`, 'error');
continue;
}

// Condition 2: The previous syllable exists, but the @precedes attribute does NOT EXIST
if (!prevSyllable.hasAttribute('precedes')) {
const sylText = getSyllableText(prevSyllable);
Notification.queueNotification(`The 1st part of the toggle-linked syllable (${sylText}) does not link to any syllable`);
Notification.queueNotification(`The 1st part of the toggle-linked syllable (${sylText}) does not link to any syllable`, 'error');
continue;
}

// Condition 3: The previous syllable's @precedes attribute exists, but it is not in the correct format #id
if (prevSyllable.getAttribute('precedes') != '#' + syllable.getAttribute('xml:id')) {
const sylText = getSyllableText(prevSyllable);
Notification.queueNotification(`The 1st part of the toggle-linked syllable (${sylText}) links to the wrong syllable`);
Notification.queueNotification(`The 1st part of the toggle-linked syllable (${sylText}) links to the wrong syllable`, 'error');
}
}
}
Expand Down
Loading

0 comments on commit 42fbcb7

Please sign in to comment.