create endings dialog, will remove buttons

AaronDavidNewman · Sep 3, 2024 · a80707b · a80707b
1 parent 59eec58
commit a80707b
Show file tree

Hide file tree

Showing 17 changed files with 490 additions and 285 deletions.
diff --git a/build/styles/dialogs.css b/build/styles/dialogs.css
@@ -225,72 +225,17 @@ button.nav-link {
 .attributeModal .buttonContainer .button-right {
 	margin-left:5px;
 }
-
-
-.attributeModal .buttonContainer button {
-	border-radius:3px;
-	padding: 2px 4px;
-	width:100px;
-	height:25px;
-}
-
-.attributeModal .buttonContainer .ok-button {
-	border:#9cee9d 1px ridge;
-}
-
-.attributeModal .buttonContainer .ok-button:hover {
-	background:#334488;
-	color: #fff;
-	transition-duration: 0.5s;
-	transition-timing-function:ease;
-}
-
-.attributeModal .buttonContainer .cancel-button:hover {
-	background:#884433;
-	color: #fff;
-	transition-duration: 0.5s;
-	transition-timing-function:ease;
-}
-
-.attributeModal .buttonContainer .remove-button:hover {
-	background:#664433;
-	color: #ded;
-	transition-duration: 0.5s;
-	transition-timing-function:ease;
-}
-
-.attributeModal .buttonContainer .remove-button:hover .icon-cancel-circle  {
-	background:#664433;
-	color: #ded;
-}
-
-.attributeModal .buttonContainer .remove-button .icon-cancel-circle {
-	float:left;
-	color:#933;
-}
-
-.attributeModal .buttonContainer .ok-button:hover {
-	background:#334488;
-	color: #fff;
-	transition-duration: 0.5s;
-	transition-timing-function:ease;
-}
-
-
-.attributeModal .buttonContainer .cancel-button {
-	border:#dc8899 1px ridge;
-}
-
-.attributeModal .buttonContainer .remove-button {
-	border:#dc8899 1px ridge;
-}
-
-
 .attributeModal h2 {
 	text-align:center;
 	font-size:1.2em;
 }
 
+.smoControlContainer .button-array-buttons button.repetext {
+  font-size: 0.8em;
+  font-style: italic;
+  flex: 4 1 220px;
+  width: 120px;
+}
 .attributeModal.tempoTextMode #dialog-tempo-duration,
 .attributeModal.tempoTextMode #dialog-tempo-bpm ,
 .attributeModal.tempoDurationMode #dialog-tempo-tempoText {
@@ -417,7 +362,7 @@ button.nav-link {
 .attributeModal .smoControl.buttonArray .button-array-row{
   display: flex;
   flex-flow: row nowrap;
-  justify-content:space-between;
+  justify-content:flex-start;
 }
 .button-array-buttons {
   display: flex;

diff --git a/build/styles/ribbon.css b/build/styles/ribbon.css
@@ -381,6 +381,10 @@ button.addChord .left-text .icon {
 	left:10px;
 }
 
+.controls-top .ribbonButtonContainer .ribbon-button-text.icon-smo.icon {
+  position: absolute;
+  left: 12px;
+}
 .controls-top button.articulation {
 	width:50px;
 }

diff --git a/src/application/exports.ts b/src/application/exports.ts
@@ -49,6 +49,7 @@ import { SuiInstrumentDialog } from '../ui/dialogs/instrument';
 import { SuiTimeSignatureDialog } from '../ui/dialogs/timeSignature';
 import { SuiTempoDialog } from '../ui/dialogs/tempo';
 import { SuiNoteHeadAdapter, SuiNoteHeadDialog, SuiNoteHeadButtonComponent } from '../ui/dialogs/noteHead';
+import { SuiEndingsAdapter, SuiEndingsDialog, SuiEndingsButtonComponent } from '../ui/dialogs/endings';
 import { SuiScoreIdentificationDialog } from '../ui/dialogs/scoreId';
 import { SuiScorePreferencesDialog } from '../ui/dialogs/preferences';
 import { SuiPageLayoutDialog } from '../ui/dialogs/pageLayout';
@@ -199,7 +200,7 @@ export const Smo = {
     SuiPartInfoDialog, SuiOrnamentDialog, SuiOrnamentButtonComponent, 
     SuiArticulationDialog, SuiArticulationButtonComponent, SuiArticulationAdapter,
     SuiMicrotoneAdapter, SuiMicrotoneButtonComponent, SuiMicrotoneDialog,
-    SuiNoteHeadAdapter, SuiNoteHeadDialog,
+    SuiNoteHeadAdapter, SuiNoteHeadDialog, SuiEndingsAdapter, SuiEndingsDialog, SuiEndingsButtonComponent,
     SuiNoteHeadButtonComponent,    
     /* SuiLoadActionsDialog, SuiSaveActionsDialog, */
     SuiPrintFileDialog, SuiSaveFileDialog, SuiSaveXmlDialog, SuiSaveVexDialog,

diff --git a/src/render/sui/scoreView.ts b/src/render/sui/scoreView.ts
@@ -178,6 +178,24 @@ export abstract class SuiScoreView {
       }
       this._renderChangedMeasures(SmoSelection.getMeasureList([selection]));
     }
+    /**
+     * Modifiy a set of columns, e.g. tempo, time, key.  This has different undo behavior, don't 
+     * pend on the result because there may be a combination of operations.
+     * @param label 
+     * @param selections 
+     * @param actor 
+     */
+    modifyColumnsSelectionsNoWait(label: string, selections: SmoSelection[], actor: updateSingleSelectionFunc) {
+      this.undoColumnRange(label, selections);
+      selections.forEach((selection) => {
+        const altSelection = this._getEquivalentSelection(selection);
+        actor(this.score, selection);
+        if (altSelection) {
+          actor(this.storeScore, altSelection);
+        }  
+      });
+      this._renderChangedMeasures(selections);
+    }
   /**
    * This is used in some Smoosic demos and pens.
    * @param action any action, but most usefully a SuiScoreView method
@@ -264,7 +282,15 @@ export abstract class SuiScoreView {
   _undoScorePreferences(label: string) {
     this.storeUndo.addBuffer(label, UndoBuffer.bufferTypes.SCORE_ATTRIBUTES, SmoSelector.default, this.storeScore, UndoBuffer.bufferSubtypes.NONE);
   }
-
+  undoColumnRange(label: string, measureSelections: SmoSelection[]) {
+    const checked: Record<number, boolean> = {};
+    measureSelections.forEach((measureSelection) => {
+      if (!checked[measureSelection.selector.measure]) {
+        checked[measureSelection.selector.measure] = true;
+        this._undoColumn(label, measureSelection.selector.measure);
+      }
+    });
+  }
   undoMeasureRange(label: string, measureSelections: SmoSelection[]) {
     measureSelections.forEach((measureSelection) => {
       const equiv = this._getEquivalentSelection(measureSelection);

diff --git a/src/render/vex/glyphDimensions.ts b/src/render/vex/glyphDimensions.ts
@@ -14,6 +14,9 @@ export class vexGlyph {
   static barWidth(b: SmoBarline): number {
     const str = SmoBarline.barlineString(b);
     const cc = vexGlyph.dimensions[str];
+    if (typeof(cc) === 'undefined') {
+      return 0;
+    }
     return cc.width + cc.spacingRight;
   }
   static accidentalWidth(accidental: string): number {

diff --git a/src/smo/data/measureModifiers.ts b/src/smo/data/measureModifiers.ts
@@ -322,7 +322,7 @@ export class SmoRepeatSymbol extends SmoMeasureModifierBase {
     Coda: 1,
     Segno: 2,
     Dc: 3,
-    ToCoda: 1,
+    ToCoda: 10,
     DcAlCoda: 4,
     DcAlFine: 5,
     Ds: 6,

diff --git a/src/smo/data/music.ts b/src/smo/data/music.ts
@@ -542,7 +542,7 @@ export class SmoMusic {
         { letter: 'b', accidental: 'b', role: '6'},
         { letter: 'b', accidental: 'n', role: '7/7'},
         { letter: 'c', accidental: 'b', role: 'b7'},
-        { letter: 'b', accidental: '#', role: '7'}
+        { letter: 'c', accidental: 'n', role: '7'}
       ], 'd': [
         { letter: 'd', accidental: 'n', role: 'tonic' },
         { letter: 'd', accidental: '#', role: '7/2' },

diff --git a/src/smo/xform/undo.ts b/src/smo/xform/undo.ts
@@ -153,8 +153,6 @@ export class UndoBuffer {
    */
   addBuffer(title: string, type: number, selector: SmoSelector, obj: any, subtype: number) {
     this.checkNull();
-    let i = 0;
-    let j = 0;
     if (typeof(type) !== 'number' || type < UndoBuffer.bufferTypes.FIRST || type > UndoBuffer.bufferTypes.LAST) {
       throw 'Undo failure: illegal buffer type ' + type;
     }
@@ -169,8 +167,8 @@ export class UndoBuffer {
       // RECTANGLE obj is {score, topLeft, bottomRight}
       // where the last 2 are selectors
       const measures = [];
-      for (i = obj.topLeft.staff; i <= obj.bottomRight.staff; ++i) {
-        for (j = obj.topLeft.measure; j <= obj.bottomRight.measure; ++j) {
+      for (let i = obj.topLeft.staff; i <= obj.bottomRight.staff; ++i) {
+        for (let j = obj.topLeft.measure; j <= obj.bottomRight.measure; ++j) {
           measures.push(UndoBuffer.serializeMeasure(obj.score.staves[i].measures[j]));
         }
       }
@@ -295,17 +293,21 @@ export class UndoBuffer {
           return [buf.json.startSelector.measure, buf.json.endSelector.measure];
         }
         if (buf.type === UndoBuffer.bufferTypes.COLUMN) {
-          min = buf.json.measureIndex;
+          if (min < 0) {
+            min = buf.json.measureIndex;
+          } else {
+            min = Math.min(min, buf.json.measureIndex);
+          }          
           buf.json.measures.forEach((mmjson: SmoMeasureParamsSer) => {
             max = Math.max(max, mmjson.measureNumber.measureIndex);
           });
-          return [min, max];
-        }
-        if (min < 0) {
-          min = buf.selector.measure;
+        } else {
+          if (min < 0) {
+            min = buf.selector.measure;
+          }
+          max = Math.max(max, buf.selector.measure);
+          min = Math.min(min, buf.selector.measure);
         }
-        max = Math.max(max, buf.selector.measure);
-        min = Math.min(min, buf.selector.measure);
       }
     }
     return [Math.max(0, min), max];
@@ -336,8 +338,6 @@ export class UndoBuffer {
    * @returns 
    */
   undo(score: SmoScore, staffMap: Record<number, number>, pop: boolean): SmoScore {
-    let i = 0;
-    let j = 0;
     let mix = 0;
     let bufset: UndoSet | null = this.popUndoSet();
     if (!bufset) {
@@ -346,15 +346,15 @@ export class UndoBuffer {
     for (let i = 0; i < bufset.buffers.length; ++i) {
       const buf = bufset.buffers[bufset.buffers.length - (i + 1)];
       if (buf.type === UndoBuffer.bufferTypes.RECTANGLE) {
-        for (i = buf.json.topLeft.staff; i <= buf.json.bottomRight.staff; ++i) {
-          for (j = buf.json.topLeft.measure; j <= buf.json.bottomRight.measure; ++j) {
+        for (let j = buf.json.topLeft.staff; j <= buf.json.bottomRight.staff; ++j) {
+          for (let k = buf.json.topLeft.measure; k <= buf.json.bottomRight.measure; ++k) {
             const measure = SmoMeasure.deserialize(buf.json.measures[mix]);
             mix += 1;
             const selector = SmoSelector.default;
-            if (typeof(staffMap[i]) === 'number') {
-              selector.staff = staffMap[i];
-              measure.measureNumber.staffId = staffMap[i];
-              selector.measure = j;
+            if (typeof(staffMap[j]) === 'number') {
+              selector.staff = staffMap[j];
+              measure.measureNumber.staffId = staffMap[j];
+              selector.measure = k;
               score.replaceMeasure(selector, measure);
             }
           }
@@ -380,12 +380,12 @@ export class UndoBuffer {
       } else if (buf.type === UndoBuffer.bufferTypes.SCORE_ATTRIBUTES) {
         smoSerialize.serializedMerge(SmoScore.preferences, buf.json, score);
       } else if (buf.type === UndoBuffer.bufferTypes.COLUMN) {
-        for (i = 0; i < score.staves.length; ++i) {
-          const measure = SmoMeasure.deserialize(buf.json.measures[i]);
+        for (let j = 0; j < score.staves.length; ++j) {
+          const measure = SmoMeasure.deserialize(buf.json.measures[j]);
           const selector = SmoSelector.default;
-          if (typeof(staffMap[i]) === 'number') {
-            selector.staff = staffMap[i];
-            measure.measureNumber.staffId = staffMap[i];
+          if (typeof(staffMap[j]) === 'number') {
+            selector.staff = staffMap[j];
+            measure.measureNumber.staffId = staffMap[j];
             selector.measure = buf.json.measureIndex;
             score.replaceMeasure(selector, measure);
           }

diff --git a/src/styles/dialogs.css b/src/styles/dialogs.css
@@ -225,72 +225,17 @@ button.nav-link {
 .attributeModal .buttonContainer .button-right {
 	margin-left:5px;
 }
-
-
-.attributeModal .buttonContainer button {
-	border-radius:3px;
-	padding: 2px 4px;
-	width:100px;
-	height:25px;
-}
-
-.attributeModal .buttonContainer .ok-button {
-	border:#9cee9d 1px ridge;
-}
-
-.attributeModal .buttonContainer .ok-button:hover {
-	background:#334488;
-	color: #fff;
-	transition-duration: 0.5s;
-	transition-timing-function:ease;
-}
-
-.attributeModal .buttonContainer .cancel-button:hover {
-	background:#884433;
-	color: #fff;
-	transition-duration: 0.5s;
-	transition-timing-function:ease;
-}
-
-.attributeModal .buttonContainer .remove-button:hover {
-	background:#664433;
-	color: #ded;
-	transition-duration: 0.5s;
-	transition-timing-function:ease;
-}
-
-.attributeModal .buttonContainer .remove-button:hover .icon-cancel-circle  {
-	background:#664433;
-	color: #ded;
-}
-
-.attributeModal .buttonContainer .remove-button .icon-cancel-circle {
-	float:left;
-	color:#933;
-}
-
-.attributeModal .buttonContainer .ok-button:hover {
-	background:#334488;
-	color: #fff;
-	transition-duration: 0.5s;
-	transition-timing-function:ease;
-}
-
-
-.attributeModal .buttonContainer .cancel-button {
-	border:#dc8899 1px ridge;
-}
-
-.attributeModal .buttonContainer .remove-button {
-	border:#dc8899 1px ridge;
-}
-
-
 .attributeModal h2 {
 	text-align:center;
 	font-size:1.2em;
 }
 
+.smoControlContainer .button-array-buttons button.repetext {
+  font-size: 0.8em;
+  font-style: italic;
+  flex: 4 1 220px;
+  width: 120px;
+}
 .attributeModal.tempoTextMode #dialog-tempo-duration,
 .attributeModal.tempoTextMode #dialog-tempo-bpm ,
 .attributeModal.tempoDurationMode #dialog-tempo-tempoText {
@@ -417,7 +362,7 @@ button.nav-link {
 .attributeModal .smoControl.buttonArray .button-array-row{
   display: flex;
   flex-flow: row nowrap;
-  justify-content:space-between;
+  justify-content:flex-start;
 }
 .button-array-buttons {
   display: flex;

diff --git a/src/styles/ribbon.css b/src/styles/ribbon.css
@@ -381,6 +381,10 @@ button.addChord .left-text .icon {
 	left:10px;
 }
 
+.controls-top .ribbonButtonContainer .ribbon-button-text.icon-smo.icon {
+  position: absolute;
+  left: 12px;
+}
 .controls-top button.articulation {
 	width:50px;
 }