vibe-editor 0.0.0

package/src/scripts/js/utils/Mouse2MEI.js

@@ -0,0 +1,735 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Mouse2SVG = void 0;
+const constants_1 = require("../constants");
+const random_1 = require("./random");
+const mappings_1 = require("./mappings");
+const MeasureMatrix_1 = require("../datastructures/MeasureMatrix");
+const meiOperation = require("../utils/MEIOperations");
+const coordinates = require("./coordinates");
+const cq = require("./convenienceQueries");
+class Mouse2SVG {
+    constructor() {
+        this.lastSystemMouseEnter = null;
+        this.lastStaffMouseEnter = null;
+        this.lastMeasureMouseEnter = null;
+        this.lastLayerMouseEnter = null;
+        this.noteNewDur = "4";
+        this.noteBBoxes = new Array();
+        this.staffLineBBoxes = new Array();
+        this.measureMatrix = new MeasureMatrix_1.default();
+        //this.setMouseEnterElementListeners();
+        //this.findBBoxes();
+    }
+    /**
+     * Set Flags for current focused measure, staff, system and layer when mouse moves.
+     * @returns
+     */
+    setMouseEnterElementListeners() {
+        var that = this;
+        var mouseEventName = "mouseover";
+        var enteredFlag = "lastEntered";
+        var activeContainerFlag = "activeContainer";
+        this.container.addEventListener("mouseenter", function (e) {
+            Array.from(document.getElementsByClassName("vse-container")).forEach(ac => {
+                if (ac === that.container) {
+                    if (!that.container.classList.contains(activeContainerFlag)) {
+                        that.container.classList.add(activeContainerFlag);
+                    }
+                }
+                else {
+                    ac.classList.remove(activeContainerFlag);
+                }
+            });
+        });
+        this.container.addEventListener("mouseleave", function (e) {
+            Array.from(document.getElementsByClassName("vse-container")).forEach(ac => {
+                if (ac === that.container) {
+                    ac.classList.remove(activeContainerFlag);
+                }
+            });
+        });
+        this.interactionOverlay.querySelectorAll(".system").forEach(sy => {
+            sy.addEventListener(mouseEventName, function (e) {
+                e.preventDefault();
+                var target = e.target;
+                that.lastSystemMouseEnter = target.closest(".system");
+                if (!that.lastSystemMouseEnter.classList.contains(enteredFlag)) {
+                    cq.getInteractOverlay(that.containerId).querySelectorAll(".system").forEach(s => {
+                        s.classList.remove(enteredFlag);
+                    });
+                    that.lastSystemMouseEnter.classList.add(enteredFlag);
+                }
+            });
+        });
+        this.interactionOverlay.querySelectorAll(".staff").forEach(staff => {
+            staff.addEventListener(mouseEventName, function (e) {
+                var _a;
+                e.preventDefault();
+                var target = e.target;
+                that.lastStaffMouseEnter = target.closest(".staff");
+                (_a = that.lastStaffMouseEnter) === null || _a === void 0 ? void 0 : _a.dispatchEvent(new Event("currStaffChanged"));
+                if (!that.lastStaffMouseEnter.classList.contains(enteredFlag)) {
+                    cq.getInteractOverlay(that.containerId).querySelectorAll(".staff").forEach(s => {
+                        s.classList.remove(enteredFlag);
+                        that.getElementinVrvSVG(s.getAttribute("refId")).classList.remove(enteredFlag);
+                    });
+                    that.container.querySelectorAll(".onChord").forEach(oc => oc.classList.remove("onChord")); // reset onChord, so that only chords in the same staff are set
+                    that.lastStaffMouseEnter.classList.add(enteredFlag);
+                    that.getElementinVrvSVG(that.lastStaffMouseEnter.getAttribute("refId")).classList.add(enteredFlag);
+                }
+            });
+        });
+        this.interactionOverlay.querySelectorAll(".measure").forEach(measure => {
+            measure.addEventListener(mouseEventName, function (e) {
+                e.preventDefault();
+                var target = e.target;
+                that.lastMeasureMouseEnter = target.closest(".measure");
+                if (!that.lastMeasureMouseEnter.classList.contains(enteredFlag)) {
+                    cq.getInteractOverlay(that.containerId).querySelectorAll(".measure").forEach(m => {
+                        m.classList.remove(enteredFlag);
+                    });
+                    that.lastMeasureMouseEnter.classList.add(enteredFlag);
+                    //that.vrvSVG.querySelector("#"+that.lastMeasureMouseEnter.id).classList.add(enteredFlag)
+                }
+            });
+        });
+        this.interactionOverlay.querySelectorAll(".layer").forEach(layer => {
+            layer.addEventListener(mouseEventName, function (e) {
+                e.preventDefault();
+                var target = e.target;
+                that.lastLayerMouseEnter = target.closest(".layer");
+                if (!that.lastLayerMouseEnter.classList.contains(enteredFlag)) {
+                    cq.getInteractOverlay(that.containerId).querySelectorAll(".layer").forEach(l => {
+                        l.classList.remove(enteredFlag);
+                    });
+                    that.lastLayerMouseEnter.classList.add(enteredFlag);
+                }
+            });
+        });
+        return this;
+    }
+    setMouseEnterElements(refElement) {
+        var _a, _b, _c, _d, _e, _f, _g;
+        this.lastSystemMouseEnter = this.getElementInInteractOverlay((_a = refElement.closest(".system")) === null || _a === void 0 ? void 0 : _a.id);
+        this.lastMeasureMouseEnter = this.getElementInInteractOverlay((_b = refElement.closest(".measure")) === null || _b === void 0 ? void 0 : _b.id) || this.getElementInInteractOverlay((_c = refElement.querySelector(".measure")) === null || _c === void 0 ? void 0 : _c.id);
+        this.lastStaffMouseEnter = this.getElementInInteractOverlay((_d = refElement.closest(".staff")) === null || _d === void 0 ? void 0 : _d.id) || this.getElementInInteractOverlay((_e = refElement.querySelector(".staff")) === null || _e === void 0 ? void 0 : _e.id);
+        this.lastLayerMouseEnter = this.getElementInInteractOverlay((_f = refElement.closest(".layer")) === null || _f === void 0 ? void 0 : _f.id) || this.getElementInInteractOverlay((_g = refElement.querySelector(".layer")) === null || _g === void 0 ? void 0 : _g.id);
+        //this.update()
+    }
+    getMouseEnterElementByName(name) {
+        let e;
+        switch (name) {
+            case "system":
+                e = this.lastSystemMouseEnter;
+                break;
+            case "staff":
+                e = this.lastStaffMouseEnter;
+                break;
+            case "measure":
+                e = this.lastMeasureMouseEnter;
+                break;
+            case "layer":
+                e = this.lastLayerMouseEnter;
+                break;
+            default:
+                e = null;
+        }
+        return e;
+    }
+    findBBoxes() {
+        var notes = this.vrvSVG.querySelectorAll(".note, .rest, .mRest, .notehead");
+        var root = this.vrvSVG;
+        Array.from(notes).forEach(element => {
+            var interactionElement = this.interactionOverlay.querySelector("[refId=" + element.id + "]");
+            if (interactionElement === null)
+                return;
+            var relpt = coordinates.getDOMMatrixCoordinates(interactionElement, this.interactionOverlay);
+            let bb = {
+                id: element.id,
+                parentStaff: element.closest(".staff"),
+                parentLayer: element.closest(".layer"),
+                parentMeasure: element.closest(".measure"),
+                x: relpt.right,
+                y: relpt.y
+            };
+            this.noteBBoxes.push(bb);
+        });
+        // this.measureMatrix.populateFromSVG(document.querySelector(c._vrvSVGID_WITH_IDSELECTOR_));
+        this.measureMatrix.populateFromMEI(this.currentMEI);
+        var staves = cq.getVrvSVG(this.containerId).querySelectorAll(constants_1.constants._STAFF_WITH_CLASSSELECTOR_);
+        Array.from(staves).forEach(element => {
+            let g = cq.getVrvSVG(this.containerId).querySelectorAll("#" + element.id + " > path");
+            let staff = element;
+            let idxStaff = parseInt(element.getAttribute("n")) - 1;
+            let closestMeasure = element.closest(".measure");
+            let idxParentMeasure = parseInt(closestMeasure.getAttribute("n")) - 1;
+            let clefShape = this.measureMatrix.get(idxParentMeasure, idxStaff).clef;
+            Array.from(g).forEach((staffLine, idx) => {
+                if (staffLine.id === "") {
+                    staffLine.id = random_1.uuidv4();
+                }
+                staffLine.classList.add("staffLine");
+                staffLine.classList.add("Clef" + clefShape);
+                var map = null;
+                switch (clefShape) {
+                    case "G":
+                        map = mappings_1.idxNoteMapGClef;
+                        break;
+                    case "F":
+                        map = mappings_1.idxNoteMapFClef;
+                        break;
+                    case "C":
+                        map = mappings_1.idxNoteMapCClef;
+                        break;
+                    default:
+                        console.error("No Clef found");
+                        break;
+                }
+                staffLine.classList.add(map.get(idx * 2));
+                staffLine.classList.add("Clef" + clefShape);
+                //var interactionElement = this.interactionOverlay.querySelector("[refId=" + staffLine.id +"]")
+                var relpt = coordinates.getDOMMatrixCoordinates(staffLine, staffLine.closest("svg")); //this.vrvSVG)
+                let bb = {
+                    id: staffLine.parentElement.id,
+                    y: relpt.y,
+                    staffIdx: idx * 2,
+                    classList: staffLine.classList
+                };
+                this.staffLineBBoxes.push(bb);
+            });
+        });
+    }
+    /**
+     * Create Phantom Lines to detect clicks above and under the system
+     */
+    createPhantomLines(upperStaffBound, lowerStaffBound) {
+        this.phantomStaffLinesAbove = new Array();
+        this.phantomStaffLinesBelow = new Array();
+        var diffY = Math.abs(this.staffLineBBoxes[0].y - this.staffLineBBoxes[1].y);
+        //Above System
+        for (var i = 0; i < 9; i++) {
+            if (i === 0) {
+                this.phantomStaffLinesAbove.push({ y: this.staffLineBBoxes[upperStaffBound].y - diffY });
+            }
+            else {
+                this.phantomStaffLinesAbove.push({ y: this.phantomStaffLinesAbove[i - 1].y - diffY });
+            }
+        }
+        //Below System
+        for (var i = 0; i < 12; i++) {
+            if (i === 0) {
+                this.phantomStaffLinesBelow.push({ y: this.staffLineBBoxes[lowerStaffBound].y + diffY });
+            }
+            else {
+                this.phantomStaffLinesBelow.push({ y: this.phantomStaffLinesBelow[i - 1].y + diffY });
+            }
+        }
+    }
+    /**
+     * Define New Note at coordinates
+     * 1. Check if left of Note
+     * 2. Check position between staves
+     * 3. update
+     *
+     * @param x page Coordinate
+     * @param y page Coordinate
+     */
+    defineNote(x, y, options) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+        let staffIsEmpty = true;
+        let isLeftOfNote;
+        //let isRightOfNote: Boolean
+        let currentNearestNote = null;
+        let diffNote = null;
+        let leftRightPos;
+        let allIDs = Array.from(this.vrvSVG.querySelectorAll(".staff")).map(s => s.getAttribute("id"));
+        if (this.lastStaffMouseEnter === null) {
+            return;
+        }
+        let staffIdx = allIDs.indexOf((_a = this.lastStaffMouseEnter) === null || _a === void 0 ? void 0 : _a.getAttribute("refId"));
+        let upperStaffBound = staffIdx * 5 + 0;
+        let lowerStaffBound = staffIdx * 5 + 4;
+        let aboveSystem = (y < ((_b = this.staffLineBBoxes[upperStaffBound]) === null || _b === void 0 ? void 0 : _b.y)) ? true : false;
+        let belowSystem = (y > ((_c = this.staffLineBBoxes[lowerStaffBound]) === null || _c === void 0 ? void 0 : _c.y)) ? true : false;
+        let isInSystem = !aboveSystem && !belowSystem;
+        //this will cause that the duration of the chord will not be applied on inserted note
+        let isRestChord = false;
+        if (options.targetChord != undefined) {
+            isRestChord = options.targetChord.classList.contains("rest");
+        }
+        options.targetChord = isRestChord ? undefined : options.targetChord;
+        (_e = this.getElementinVrvSVG((_d = this.lastStaffMouseEnter) === null || _d === void 0 ? void 0 : _d.getAttribute("refId"))) === null || _e === void 0 ? void 0 : _e.querySelectorAll(".layer").forEach(l => {
+            if (l.hasChildNodes()) {
+                staffIsEmpty = false;
+            }
+        });
+        var currentStaffClef;
+        for (const [key, value] of (_g = this.getElementinVrvSVG((_f = this.lastStaffMouseEnter) === null || _f === void 0 ? void 0 : _f.getAttribute("refId"))) === null || _g === void 0 ? void 0 : _g.querySelector(".staffLine").classList.entries()) {
+            if (value.indexOf("Clef") !== -1) {
+                currentStaffClef = value;
+                break;
+            }
+        }
+        // Define relative position for click insert
+        // position should also consider right border of bounding box. Position should be 
+        if (!staffIsEmpty) {
+            let nbb = [];
+            this.noteBBoxes.forEach(bb => {
+                var _a;
+                if (bb.parentStaff.id === ((_a = this.lastStaffMouseEnter) === null || _a === void 0 ? void 0 : _a.getAttribute("refId"))) {
+                    nbb.push(bb);
+                }
+            });
+            nbb.forEach(bb => {
+                let zerocrossing = x - bb.x;
+                let tempDiff = Math.sqrt(Math.abs(x - bb.x) ** 2 + Math.abs(y - bb.y) ** 2);
+                if ((diffNote === null || Math.abs(tempDiff) < Math.abs(diffNote))) {
+                    diffNote = tempDiff;
+                    currentNearestNote = bb;
+                    isLeftOfNote = zerocrossing <= 0 ? true : false;
+                }
+            });
+            leftRightPos = isLeftOfNote ? "left" : "right";
+        }
+        if (isRestChord) {
+            leftRightPos = "left";
+        }
+        let currentNearestStaffLine = null;
+        let currentNearestLineIdx = null;
+        let isOverStaff;
+        //let isUnderStaff: Boolean;
+        let diffStaff = null;
+        let pname;
+        let oct;
+        let noteDefinition = new Array();
+        let nextPitchIdx;
+        if (!isInSystem) { //Phantom Line Stuff
+            this.phantomLines = new Array();
+            let currentNearestY;
+            this.createPhantomLines(upperStaffBound, lowerStaffBound);
+            let lineArr = aboveSystem ? this.phantomStaffLinesAbove : this.phantomStaffLinesBelow;
+            let aboveMap;
+            let belowMap;
+            switch (currentStaffClef) {
+                case "ClefG":
+                    aboveMap = mappings_1.idxNotePhantomMapAboveG;
+                    belowMap = mappings_1.idxNotePhantomMapBelowG;
+                    break;
+                case "ClefF":
+                    aboveMap = mappings_1.idxNotePhantomMapAboveF;
+                    belowMap = mappings_1.idxNotePhantomMapBelowF;
+                    break;
+                case "ClefC":
+                    aboveMap = mappings_1.idxNotePhantomMapAboveC;
+                    belowMap = mappings_1.idxNotePhantomMapBelowC;
+                    break;
+                default:
+                    console.log("NO CLEF FOUND");
+            }
+            let map = aboveSystem ? aboveMap : belowMap;
+            let mappingidx = 0;
+            lineArr.forEach((line, idx) => {
+                let tempDiff = y - line.y;
+                mappingidx++;
+                if (diffStaff === null || Math.abs(tempDiff) < Math.abs(diffStaff)) {
+                    this.phantomLines.push(line.y);
+                    //if(idx%2 !== 0){return} // take only Elements which are actually lines! (every second one)
+                    currentNearestY = line.y;
+                    diffStaff = tempDiff;
+                    currentNearestLineIdx = idx + mappingidx;
+                    isOverStaff = tempDiff <= 0 ? true : false;
+                }
+            });
+            // prepare center coordinate (Y) for snapping
+            let lineDist = Math.abs(lineArr[0].y - lineArr[1].y);
+            this.lineDist = lineDist / 2;
+            lineDist = isOverStaff ? -lineDist : lineDist;
+            if (Math.abs(currentNearestY - y) < Math.abs(lineDist / 2 + currentNearestY - y)) { // line pos < middleline pos
+                this.newNoteY = currentNearestY;
+                nextPitchIdx = currentNearestLineIdx;
+            }
+            else {
+                if (aboveSystem) {
+                    nextPitchIdx = isOverStaff ? currentNearestLineIdx + 1 : currentNearestLineIdx - 1;
+                }
+                else {
+                    nextPitchIdx = isOverStaff ? currentNearestLineIdx - 1 : currentNearestLineIdx + 1;
+                }
+                this.newNoteY = currentNearestY + lineDist / 2;
+            }
+            if (map.get(nextPitchIdx) == undefined) {
+                return;
+            } // cursor is outside of score
+            pname = map.get(nextPitchIdx).charAt(0);
+            oct = map.get(nextPitchIdx).charAt(1);
+        }
+        else {
+            // Decide if Staffline is given or not
+            this.phantomLines = undefined;
+            if (options.staffLineId == undefined) {
+                let sbb = [];
+                this.staffLineBBoxes.forEach(bb => { var _a; if (bb.id === ((_a = this.lastStaffMouseEnter) === null || _a === void 0 ? void 0 : _a.getAttribute("refId")))
+                    sbb.push(bb); });
+                sbb.forEach(bb => {
+                    let tempDiff = y - bb.y;
+                    if (diffStaff === null || Math.abs(tempDiff) < Math.abs(diffStaff)) {
+                        diffStaff = tempDiff;
+                        currentNearestStaffLine = bb;
+                        isOverStaff = tempDiff <= 0 ? true : false;
+                        //isUnderStaff = tempDiff > 0 ? true : false;
+                    }
+                });
+                // prepare center coordinate (Y) for snapping
+                if (sbb[0] == undefined || sbb[1] == undefined) {
+                    return;
+                }
+                let lineDist = Math.abs(sbb[0].y - sbb[1].y);
+                this.lineDist = lineDist / 2;
+                lineDist = isOverStaff ? -lineDist : lineDist;
+                if (Math.abs(currentNearestStaffLine.y - y) < Math.abs(lineDist / 2 + currentNearestStaffLine.y - y)) { // line pos < middleline pos
+                    this.newNoteY = currentNearestStaffLine.y; // on line
+                    nextPitchIdx = currentNearestStaffLine.staffIdx;
+                }
+                else {
+                    this.newNoteY = currentNearestStaffLine.y + lineDist / 2; // between lines
+                    nextPitchIdx = isOverStaff ? currentNearestStaffLine.staffIdx - 1 : currentNearestStaffLine.staffIdx + 1;
+                }
+                let map = null;
+                if (currentNearestStaffLine.classList.contains("ClefG")) {
+                    map = mappings_1.idxNoteMapGClef;
+                }
+                else if (currentNearestStaffLine.classList.contains("ClefF")) {
+                    map = mappings_1.idxNoteMapFClef;
+                }
+                else if (currentNearestStaffLine.classList.contains("ClefC")) {
+                    map = mappings_1.idxNoteMapCClef;
+                }
+                else {
+                    throw new Error("No Note to Clef Mapping found");
+                }
+                if (map.get(nextPitchIdx) == undefined) {
+                    return;
+                }
+                pname = map.get(nextPitchIdx).charAt(0);
+                oct = map.get(nextPitchIdx).charAt(1);
+            }
+            else {
+                let pitch;
+                try {
+                    pitch = cq.getInteractOverlay(this.containerId).querySelector("#" + options.staffLineId).getAttribute("class").split(" ");
+                }
+                catch (_k) {
+                    return;
+                }
+                let p = pitch.filter(function (obj) {
+                    let isPname = obj.charAt(0) === obj.charAt(0).toLowerCase(); // noch regexe?
+                    let isOct = !isNaN(parseInt(obj.charAt(1)));
+                    let length = obj.length === 2;
+                    return isPname && isOct && length;
+                });
+                pname = p[0].charAt(0);
+                oct = p[0].charAt(1);
+                this.newNoteY = this.staffLineBBoxes.filter(function (bb) {
+                    return bb.classList === cq.getInteractOverlay(this.containerId).querySelector("#" + options.staffLineId).classList;
+                })[0].y; // assert that length is 1 (all classlists are unique for )
+            }
+        }
+        //get relevant staffinfo
+        //var closestStaff = this.currentMEI.getElementById(currentNearestNote.id).closest("staff")
+        var closestStaff = this.currentMEI.getElementById((_h = this.lastStaffMouseEnter) === null || _h === void 0 ? void 0 : _h.getAttribute("refId"));
+        var closestMeasure = closestStaff.closest("measure");
+        var closestStaffIdx = parseInt(closestStaff.getAttribute("n")) - 1;
+        var closestMeasureIdx = parseInt(closestMeasure.getAttribute("n")) - 1;
+        var nearestNoteId = (currentNearestNote !== null) ? currentNearestNote.id : null;
+        if (nearestNoteId !== null) { // ensure note id to be in new note
+            nearestNoteId = this.vrvSVG.querySelector("#" + nearestNoteId).classList.contains("notehead") ? this.vrvSVG.querySelector("#" + nearestNoteId).closest(".note").id : nearestNoteId;
+        }
+        var keysig = this.measureMatrix.get(closestMeasureIdx, closestStaffIdx).keysig;
+        var accid;
+        if (this.container.querySelector(".alterBtn.selected") !== null) {
+            accid = mappings_1.modButtonToAccid.get(this.container.querySelector(".alterBtn.selected").id);
+        }
+        else if (keysig != undefined) {
+            accid = mappings_1.keysigToNotes.get(keysig);
+            accid = accid.filter((s) => { return s === pname; });
+            if (accid.length === 1) {
+                accid = keysig.charAt(1);
+            }
+        }
+        var newNote = {
+            id: random_1.uuidv4(),
+            pname: pname,
+            dur: this.getDurationNewNote(),
+            dots: this.getDotsNewNote(),
+            oct: oct,
+            keysig: keysig,
+            accid: accid,
+            nearestNoteId: nearestNoteId,
+            relPosX: leftRightPos,
+            staffId: (_j = this.lastStaffMouseEnter) === null || _j === void 0 ? void 0 : _j.getAttribute("refId"),
+            chordElement: options.targetChord,
+            rest: this.container.querySelector("#pauseNote").classList.contains("selected")
+        };
+        this.newNote = newNote;
+    }
+    /**
+     * Find Score Element nearest to given Position (e.g. Mouse)
+     * @param posX should be already transformed DOMPoint
+     * @param posY should be already transformed DOMPoint
+     * @param checkStaff check if vertical distance in the staff should be considered
+     * (for example: should be false, when check position for Annotations, should be true when placing notes in different staves)
+     * @param orientation only consider elements which are left or right of given coordinates
+     * @returns
+     */
+    findScoreTarget(posX, posY, checkStaff = true, orientation = { left: true, right: true }) {
+        var notes = this.getNoteBBoxes();
+        var nextNote;
+        var tempDist = Math.pow(10, 10);
+        var i = 0;
+        notes.forEach(n => {
+            var _a, _b, _c, _d;
+            var x;
+            var y;
+            if (((_a = this.getElementinVrvSVG(n.id)) === null || _a === void 0 ? void 0 : _a.closest(".chord")) && navigator.userAgent.toLowerCase().indexOf("firefox") > -1) { // special rule for firefox browsers
+                x = (_b = this.getElementinVrvSVG(n.id)) === null || _b === void 0 ? void 0 : _b.closest(".chord").getBoundingClientRect().x;
+                y = (_c = this.getElementinVrvSVG(n.id)) === null || _c === void 0 ? void 0 : _c.closest(".chord").getBoundingClientRect().y;
+            }
+            else {
+                x = n.x;
+                y = n.y;
+            }
+            //filter for left and right elements
+            if (!this.vrvSVG.querySelector("#" + n.id).classList.contains("mRest")) { //mRest are excluded from this rule
+                if (orientation.left === false) {
+                    if (x < posX)
+                        return; //exclude left elements
+                }
+                else if (orientation.right === false) {
+                    if (x > posX)
+                        return; // exclude right elements
+                }
+            }
+            var dist = Math.abs(x - posX);
+            var staffCondition = n.parentStaff === this.getElementinVrvSVG((_d = this.lastStaffMouseEnter) === null || _d === void 0 ? void 0 : _d.getAttribute("refId"));
+            if (checkStaff === false) {
+                staffCondition = true;
+                dist = Math.sqrt(Math.abs(x - posX) ** 2 + Math.abs(y - posY) ** 2);
+            }
+            if (dist < tempDist && staffCondition) { // define next note in staff bounds
+                tempDist = dist;
+                nextNote = n;
+            }
+            // var l = {x: x, posX: posX, dist: dist, tempDist: tempDist, nextNote: nextNote.id}
+            // console.log(i, l)
+            // i++
+        });
+        return nextNote;
+    }
+    ///// GETTER/ SETTER ///////
+    getLastMouseEnter() {
+        return { layer: this.lastLayerMouseEnter, staff: this.lastStaffMouseEnter, measure: this.lastMeasureMouseEnter, system: this.lastSystemMouseEnter };
+    }
+    getNewNote() {
+        return this.newNote;
+    }
+    getNewNoteY() {
+        return this.newNoteY;
+    }
+    getPhantomLines() {
+        return this.phantomLines;
+    }
+    getNoteBBoxes() {
+        return this.noteBBoxes;
+    }
+    getStaffLineBBoxes() {
+        return this.staffLineBBoxes;
+    }
+    setPnameNewNote(name) {
+        this.notePname = name;
+    }
+    setDurationNewNote(dur) {
+        this.noteNewDur = dur.toString();
+    }
+    /**
+     * Change note, chord or rest to given duration
+     * @param dur
+     * @returns
+     */
+    setMarkedNoteDurations(dur) {
+        var retVal = false;
+        var markedElements = this.vrvSVG.querySelectorAll(".note.marked, .rest.marked");
+        markedElements.forEach(m => {
+            var currMeiClone = this.currentMEI.cloneNode(true);
+            var meiElement = this.currentMEI.getElementById(m.id);
+            var oldMeiElement = meiElement.cloneNode(true);
+            var newMeiElement;
+            if (meiElement.closest("chord") !== null) {
+                oldMeiElement = meiElement.closest("chord").cloneNode(true);
+                meiElement.closest("chord").setAttribute("dur", dur.toString());
+                newMeiElement = meiElement.closest("chord");
+            }
+            else {
+                oldMeiElement = meiElement.cloneNode(true);
+                meiElement.setAttribute("dur", dur.toString());
+                newMeiElement = meiElement;
+            }
+            oldMeiElement.replaceWith(newMeiElement);
+            this.currentMEI = meiOperation.fillWithRests(newMeiElement, oldMeiElement, this.currentMEI);
+            //if(this.currentMEI.querySelectorAll(".changed").length ===  0){
+            var additionalElements = Array.from(newMeiElement.closest("layer").querySelectorAll("*[dur]"));
+            additionalElements = additionalElements.filter((v, i) => i > additionalElements.indexOf(newMeiElement));
+            //this.currentMEI = meiOperation.changeDuration(this.currentMEI, "reduce", additionalElements)
+            //additionalElements.unshift(oldMeiElement) // we need this information to determine the new duration of an element that has to be shortened
+            this.currentMEI = meiOperation.changeDuration(this.currentMEI, additionalElements, newMeiElement); //this.currentMEI = meiOperation.changeDuration(this.currentMEI, additionalElements)
+            //}
+            this.currentMEI.querySelectorAll(".changed").forEach(c => c.classList.remove("changed"));
+            //check if following events (notes, chords, rests) should be replaced 
+            if (meiOperation.elementIsOverfilling(meiElement, currMeiClone)) {
+                this.currentMEI = currMeiClone;
+            }
+            else {
+                retVal = true;
+            }
+        });
+        return retVal;
+    }
+    /**
+     * Change number of dots for note, chord or rest
+     * @param dots
+     * @returns
+     */
+    setMarkedNoteDots(dots) {
+        var retVal = false;
+        var markedElements = this.vrvSVG.querySelectorAll(".note.marked, .rest.marked");
+        markedElements.forEach(m => {
+            var currMeiClone = this.currentMEI.cloneNode(true);
+            var meiElement = this.currentMEI.getElementById(m.id);
+            var oldMeiElement = meiElement.cloneNode(true);
+            var newMeiElement;
+            if (meiElement.closest("chord") !== null) {
+                oldMeiElement = meiElement.closest("chord").cloneNode(true);
+                meiElement.closest("chord").setAttribute("dots", dots.toString());
+                newMeiElement = meiElement.closest("chord");
+            }
+            else {
+                oldMeiElement = meiElement.cloneNode(true);
+                meiElement.setAttribute("dots", dots.toString());
+                newMeiElement = meiElement;
+            }
+            oldMeiElement.replaceWith(newMeiElement);
+            this.currentMEI = meiOperation.fillWithRests(newMeiElement, oldMeiElement, this.currentMEI);
+            //if(this.currentMEI.querySelectorAll(".changed").length ===  0){
+            var additionalElements = Array.from(newMeiElement.closest("layer").querySelectorAll("*[dur]"));
+            additionalElements = additionalElements.filter((v, i) => i > additionalElements.indexOf(newMeiElement));
+            //this.currentMEI = meiOperation.changeDuration(this.currentMEI, "reduce", additionalElements)
+            //additionalElements.unshift(oldMeiElement) // we need this information to determine the new duration of an element that has to be shortened
+            this.currentMEI = meiOperation.changeDuration(this.currentMEI, additionalElements, newMeiElement, meiOperation.getAbsoluteRatio(newMeiElement) - meiOperation.getAbsoluteRatio(oldMeiElement)); //this.currentMEI = meiOperation.changeDuration(this.currentMEI, additionalElements)
+            //}
+            this.currentMEI.querySelectorAll(".changed").forEach(c => c.classList.remove("changed"));
+            if (meiOperation.elementIsOverfilling(meiElement, currMeiClone)) {
+                this.currentMEI = currMeiClone;
+            }
+            else {
+                retVal = true;
+            }
+        });
+        return retVal;
+    }
+    getElementinVrvSVG(id) {
+        if (id !== "" && id !== null) {
+            return this.vrvSVG.querySelector("#" + id);
+        }
+        return;
+    }
+    getElementInInteractOverlay(id) {
+        if (id !== "" && id !== null) {
+            return this.interactionOverlay.querySelector("#" + id);
+        }
+        return;
+    }
+    setDotsNewNote(dots) {
+        this.noteNewDots = dots.toString();
+    }
+    setCurrentMEI(xmlDoc) {
+        var _a;
+        this.currentMEI = xmlDoc;
+        if (((_a = this.noteBBoxes) === null || _a === void 0 ? void 0 : _a.length) === 0) {
+            this.findBBoxes();
+        }
+        return this;
+    }
+    setContainerId(id) {
+        this.containerId = id;
+        this.interactionOverlay = cq.getInteractOverlay(id);
+        this.vrvSVG = cq.getVrvSVG(id);
+        this.container = document.getElementById(id);
+        return this;
+    }
+    getCurrentMei() {
+        return this.currentMEI;
+    }
+    getMeasureMatrix() {
+        return this.measureMatrix;
+    }
+    getDurationNewNote() {
+        var dur;
+        var selEl = this.container.querySelector("#noteGroup .selected");
+        if (selEl === null) {
+            return "4";
+        }
+        switch (selEl.id) {
+            case "fullNote":
+                dur = 1;
+                break;
+            case "halfNote":
+                dur = 2;
+                break;
+            case "quarterNote":
+                dur = 4;
+                break;
+            case "eigthNote":
+                dur = 8;
+                break;
+            case "sixteenthNote":
+                dur = 16;
+                break;
+            case "thirtysecondNote":
+                dur = 32;
+                break;
+        }
+        return dur.toString(); //this.noteNewDur
+    }
+    getDotsNewNote() {
+        var dots;
+        var selEl = this.container.querySelector("#dotGroup .selected");
+        if (selEl === null) {
+            return "0";
+        }
+        switch (selEl.id) {
+            case "oneDot":
+                dots = "1";
+                break;
+            case "twoDot":
+                dots = "2";
+                break;
+        }
+        return dots;
+    }
+    getLineDist() {
+        return this.lineDist;
+    }
+    update() {
+        this.noteBBoxes.length = 0;
+        this.staffLineBBoxes.length = 0;
+        //this.updateOverlayCallback()
+        this.findBBoxes();
+        this.setMouseEnterElementListeners();
+        return this;
+    }
+    setUpdateOverlayCallback(updateOverlayCallback) {
+        this.updateOverlayCallback = updateOverlayCallback;
+        return this;
+    }
+}
+exports.Mouse2SVG = Mouse2SVG;