smoosic 1.0.36 → 1.0.38

package/release/styles/dialogs.css

@@ -250,7 +250,7 @@ body .vueDialogContainer>div {
 body.showVueDialog .vueDialogContainer, 
 body.showVueDialog .modal{
   position:absolute;
-	display:block;
+	/* display:block;  */
 	z-index:3;
 }
 .draggable-button {
@@ -495,14 +495,29 @@ button.nav-link {
 	margin:10px;
 }
 
+.helpDialog .button-left,
 .attributeModal .buttonContainer .button-left {
 	margin-right:5px;
 }
+.helpDialog .button-left {
+  padding-left: 10px;
+}
+.helpDialog .button-right {
+  padding-right: 10px;
+}
+.prev-topic-text {
+  margin-left: 5px;
+}
+.next-topic-text {
+  margin-right: 5px;
+}
+.helpDialog .button-center,
 .attributeModal .buttonContainer .button-center {
 	margin-right:5px;
 	margin-left:5px;
 }
 
+.helpDialog .button-right,
 .attributeModal .buttonContainer .button-right {
 	margin-left:5px;
 }
@@ -900,7 +915,7 @@ body.bugReport .bug-modal {
   display: flex;
 }
 
-.bug-modal .modal {
+.modal.show {
   display: block;
 }
 .bug-title {
@@ -923,17 +938,15 @@ body.splashScreen .bugDialog {
 
 }
 
-.helpDialog  {
-    display:none;
-}
+
 /* change did not get propogated */
-body.showHelpDialog .helpDialog {
+#help-dialog-container .helpDialog {
 	display:flex;
   overflow: hidden;
 	background: #eef;
   flex: 1 0 100%;
   flex-flow:column wrap;
-  overflow:auto;
+  overflow-y:auto;
 	margin: 8px;
 	padding: 10px;
   position: absolute;
@@ -984,7 +997,7 @@ body.showHelpDialog .helpDialog {
   position: absolute;
   left: 2px;
 }
-body.showHelpDialog .helpDialog button.close {
+.helpDialog button.close {
   position: absolute;
   right: 5px;
   color: red;
@@ -1161,7 +1174,7 @@ button.translate-submit-button {
   border-radius: 4px;
 }
 
-#renderProgress {
+#render-progress {
   display: none;
   width:200px;
   height:25px;
@@ -1175,20 +1188,14 @@ button.translate-submit-button {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 0.8em;
 }
-#renderProgress:after {
-	margin: -25px 0 0 100px;
-	padding:0;
-	display:inline-block;
-	content: attr(value) '%';
-}
-#renderProgress[value]::-webkit-progress-bar {
+#render-progress[value]::-webkit-progress-bar {
   background-color:#eee;
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
 }
 
-#renderProgress[value]::-webkit-progress-value {
+#render-progress[value]::-webkit-progress-value {
   background: #F70;
 }
-body.show-render-progress #renderProgress {
+body.progress-modal #render-progress {
   display: block;
 }

package/release/styles/general.css

@@ -1,15 +1,22 @@
-.pitch-preview {
-    cursor: default;
-    pointer-events: none;
+.musicContainer {
     user-select: none;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
 }
 
-.note-entry-caret {
-    user-select: none;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-}
+.pitch-preview {
+    cursor: default;
+    pointer-events: none;
+    /*user-select: none;*/
+    /*-webkit-user-select: none;*/
+    /*-moz-user-select: none;*/
+    /*-ms-user-select: none;*/
+}
+
+/*.note-entry-caret {*/
+/*    user-select: none;*/
+/*    -webkit-user-select: none;*/
+/*    -moz-user-select: none;*/
+/*    -ms-user-select: none;*/
+/*}*/

package/release/styles/media.css

@@ -131,7 +131,7 @@ body {
 }
 /* override bootstrap */
 body.modal {
-  display: block; 
+  display: block;
 }
 li.nav-item button.nav-link {
   text-align: left;
@@ -167,7 +167,7 @@ h1 {
 .testTitle {
 	height: 20px;
 	font-size:1.2em;
-    margin:0;
+  margin:0;
 }
 
 #birdy {
@@ -319,6 +319,15 @@ body.printing .printFrame {
     flex-flow:column nowrap;
     flex: 1 1 auto;
   }
+  .musicRelief .score-container div {
+    background-color: #fff;
+  }
+  .horizontal.musicRelief {
+    flex-flow:row nowrap;
+  }
+  .horizontal.musicRelief .score-container {
+    display: flex;
+  }
   .workspace {
     padding-top: 2px;
     position:relative;
@@ -330,7 +339,6 @@ body.printing .printFrame {
 
 .musicRelief {
 	background:#99a;
-
 }
 .media {
 	display:flex;
@@ -344,8 +352,8 @@ body.printing .printFrame {
     display:none;
 }
 
-.musicContainer {
-    position: relative;
+.score-container {
+  position: relative;
 	background:#fff;
 }
 .overlay {

package/release/styles/ribbon.css

@@ -192,6 +192,9 @@ body.alt-key button.hover-text .ribbon-button-hotkey {
 .hide {
   display: none !important;
 }
+.invisible {
+  visibility: hidden !important;
+}
 .controls-top button.duration.expanded.tuplet span.ribbon-button-hotkey  {
 	font-size:1em;
   padding-left: 7px;

package/src/application/exports.ts

@@ -37,7 +37,7 @@ import { SuiTransposeScoreDialogVue} from '../ui/dialogs/transposeScore';
 import { SuiMeasureFormatDialogVue } from '../ui/dialogs/measureFormat';
 import { SuiInsertMeasuresVue } from '../ui/dialogs/addMeasure';
 import { SuiInstrumentDialogVue } from '../ui/dialogs/instrument';
-import { SuiTimeSignatureDialog } from '../ui/dialogs/timeSignature';
+import { SuiTimeSignatureDialogVue } from '../ui/dialogs/timeSignature';
 import { SuiTempoDialog } from '../ui/dialogs/tempo';
 import { SuiNoteHeadDialog } from '../ui/dialogs/noteHead';
 import { SuiEndingsDialogVue } from '../ui/dialogs/endings';
@@ -153,7 +153,7 @@ import { SmoOperation } from '../smo/xform/operations';
 import { ScoreRoadMapBuilder } from '../smo/xform/roadmap';
 import {
     SmoRehearsalMark, SmoMeasureFormat, SmoBarline, SmoRepeatSymbol,
-    SmoVolta, SmoMeasureText, SmoTempoText, TimeSignature, measureModifierDynamicCtorInit
+    SmoVolta, SmoMeasureText, SmoTempo, SmoTimeSignature, measureModifierDynamicCtorInit
 } from '../smo/data/measureModifiers';
 import { SmoToXml } from '../smo/mxml/smoToXml';
 import { MidiToSmo } from '../smo/midi/midiToSmo';
@@ -357,7 +357,7 @@ export const Smo = {
   GlobalLayoutNumberAttributesArray,
   SuiTransposeScoreDialogVue,
   SuiScoreFontDialogVue, SuiPageLayoutDialogVue, SuiMeasureFormatDialogVue, SuiInsertMeasuresVue,
-  SuiTimeSignatureDialog,SuiTextBlockDialog, SuiLyricDialog, SuiChordChangeDialog,
+  SuiTimeSignatureDialogVue,SuiTextBlockDialog, SuiLyricDialog, SuiChordChangeDialog,
   SuiSlurAttributesDialog, SuiPedalMarkingDialog, SuiTieAttributesDialog, SuiVoltaAttributeDialog,
   SuiHairpinAttributesDialog, SuiStaffGroupDialogVue,
   SuiScorePreferencesDialogVue,
@@ -400,7 +400,7 @@ SuiPitchComposite,
   // score modifiers
   SmoSystemGroup, SmoAudioPlayerSettings, SmoTextGroup,
   // measure modifiers
-  SmoRehearsalMark, SmoMeasureFormat, SmoBarline, SmoRepeatSymbol,  SmoVolta, SmoMeasureText, SmoTempoText, TimeSignature,
+  SmoRehearsalMark, SmoMeasureFormat, SmoBarline, SmoRepeatSymbol,  SmoVolta, SmoMeasureText, SmoTempo, SmoTimeSignature,
   measureModifierDynamicCtorInit,
   // note modifiers
   SmoOrnament, noteModifierDynamicCtorInit,

package/src/render/audio/musicCursor.ts

@@ -72,7 +72,7 @@ export const  defaultClearAudioAnimationHandler = (delay: number) => {
     }
     const screenBox = SvgHelpers.boxPoints(x, y, width, height);
     const fillParams: Record<string, string> = {};
-    console.log(`topbox xy ${measure.svg.logicalBox.x}, ${measure.svg.logicalBox.y} x ${x}, ${y}`);
+    // console.log(`topbox xy ${measure.svg.logicalBox.x}, ${measure.svg.logicalBox.y} x ${x}, ${y}`);
     fillParams['fill-opacity'] = '0.5';
     fillParams['fill'] = '#4444ff';
     const ctx = context.getContext();

package/src/render/sui/NoteEntryCaret.ts

@@ -203,7 +203,10 @@ export class NoteEntryCaret {
 		}
 
 		const staveNote = vexNote as StaveNote;
-		const noteHeads = staveNote.noteHeads;
+    if (!staveNote.noteHeads) {
+      return;
+    }
+		const noteHeads = staveNote.noteHeads;    
 
 		this.vexNoteLeftDisplacedHeadPx = staveNote.getMetrics().leftDisplacedHeadPx;
 		this.vexNoteRightDisplacedHeadPx = staveNote.getMetrics().rightDisplacedHeadPx;

package/src/render/sui/formatter.ts

@@ -16,7 +16,7 @@ import { SmoStaffHairpin, SmoStaffTextBracket, SmoTabStave } from '../../smo/dat
 import { layoutDebug } from './layoutDebug';
 import { ScaledPageLayout, SmoLayoutManager, SmoPageLayout } from '../../smo/data/scoreModifiers';
 import { SmoMeasure, ISmoBeamGroup } from '../../smo/data/measure';
-import { TimeSignature, SmoTempoText } from '../../smo/data//measureModifiers';
+import { SmoTimeSignature, SmoTempo } from '../../smo/data//measureModifiers';
 import { SvgPageMap } from './svgPageMap';
 import { VexFlow, defaultMeasurePadding } from '../../common/vex';
 import { TextFormatter } from '../../common/textformatter';
@@ -831,7 +831,7 @@ export class SuiLayoutFormatter {
    * @param score 
    */
   calculateBeginningSymbols(systemIndex: number, measure: SmoMeasure,
-    clefLast: string, keySigLast: string, timeSigLast: TimeSignature, tempoLast: SmoTempoText) {
+    clefLast: string, keySigLast: string, timeSigLast: SmoTimeSignature, tempoLast: SmoTempo) {
     // The key signature is set based on the transpose index already, i.e. an Eb part in concert C already has 3 sharps.
     const xposeScore = this.score?.preferences?.transposingScore && (this.score?.isPartExposed() === false);
     // const xposeOffset = xposeScore ? measure.transposeIndex : 0;
@@ -850,7 +850,7 @@ export class SuiLayoutFormatter {
       measure.svg.forceTempo = tempo.display && measure.svg.rowInSystem === 0;
     } else if (tempo && tempoLast) {
       // otherwise get tempo from the measure prior.  But only one tempo per system.
-      if (!SmoTempoText.eq(tempo, tempoLast) && measure.svg.rowInSystem === 0) {
+      if (!SmoTempo.eq(tempo, tempoLast) && measure.svg.rowInSystem === 0) {
         measure.svg.forceTempo = tempo.display;
       }
     } else if (tempo) {

package/src/render/sui/mapper.ts

@@ -159,7 +159,7 @@ export abstract class SuiMapper {
         this.localModifiers.push({ index, selection: sel, modifier: volta, box: volta.logicalBox ?? SvgBox.default });
         index += 1;
       });
-      sel.measure.getModifiersByType('SmoTempoText').forEach((tempo) => {
+      sel.measure.getModifiersByType('SmoTempo').forEach((tempo) => {
         this.localModifiers.push({ index, selection: sel, modifier: tempo, box: tempo.logicalBox ?? SvgBox.default });
         index += 1;
       });

package/src/render/sui/scoreView.ts

@@ -23,8 +23,8 @@ import { ScoreRenderParams } from './scoreRender';
 import { SmoOperation } from '../../smo/xform/operations';
 import { SuiAudioPlayer } from '../audio/player';
 import { SuiAudioAnimationParams } from '../audio/musicCursor';
-import { SmoTempoText } from '../../smo/data/measureModifiers';
-import { TimeSignature } from '../../smo/data/measureModifiers';
+import { SmoTempo } from '../../smo/data/measureModifiers';
+import { SmoTimeSignature } from '../../smo/data/measureModifiers';
 import { ref, Ref } from 'vue';
 import { SvgBox, SvgPoint } from '../../smo/data/common';
 import { layoutDebug } from './layoutDebug';
@@ -685,8 +685,8 @@ export abstract class SuiScoreView implements layoutProvider {
         }
         nStave.measures.forEach((measure: SmoMeasure, ix) => {
           const srcMeasure = srcStave.measures[ix];
-          measure.tempo = new SmoTempoText(srcMeasure.tempo.serialize());
-          measure.timeSignature = new TimeSignature(srcMeasure.timeSignature);
+          measure.tempo = new SmoTempo(srcMeasure.tempo.serialize());
+          measure.timeSignature = new SmoTimeSignature(srcMeasure.timeSignature);
           measure.keySignature = srcMeasure.keySignature;
         });
         staffMap.push(i);

package/src/render/sui/scoreViewOperations.ts

@@ -14,8 +14,8 @@ import { SmoTextGroup } from '../../smo/data/scoreText';
 import { SmoDynamicText, SmoNoteModifierBase, SmoGraceNote, SmoArticulation, 
   SmoOrnament, SmoLyric, SmoMicrotone, SmoArpeggio, SmoArpeggioType, SmoClefChange, 
   SmoTabNote} from '../../smo/data/noteModifiers';
-import { SmoTempoText, SmoVolta, SmoBarline, SmoRepeatSymbol, 
-  SmoRehearsalMark, SmoMeasureFormat, TimeSignature } from '../../smo/data/measureModifiers';
+import { SmoTempo, SmoVolta, SmoBarline, SmoRepeatSymbol, 
+  SmoRehearsalMark, SmoMeasureFormat, SmoTimeSignature } from '../../smo/data/measureModifiers';
 import { UndoBuffer } from '../../smo/xform/undo';
 import {
   SmoOperation, createStaffModifierType, MakeTupletOperation
@@ -525,7 +525,7 @@ export class SuiScoreViewOperations extends SuiScoreView {
    * Set the time signature for a selection
    * @param timeSignature actual time signature
    */
-  async setTimeSignature(timeSignature: TimeSignature): Promise<void> {
+  async setTimeSignature(timeSignature: SmoTimeSignature): Promise<void> {
     this._undoScore('Set time signature');
     const selections = this.tracker.selections;
     const altSelections = this._getEquivalentSelections(selections);
@@ -627,9 +627,9 @@ export class SuiScoreViewOperations extends SuiScoreView {
    * @param scoreMode if true, update whole score.  Else selections
    * @returns 
    */
-  async updateTempoScore(measure: SmoMeasure, tempo: SmoTempoText, scoreMode: boolean, selectionMode: boolean): Promise<void> {
+  async updateTempoScore(measure: SmoMeasure, tempo: SmoTempo, scoreMode: boolean, selectionMode: boolean): Promise<void> {
     let measureIndex = 0;    
-    const originalTempo = new SmoTempoText(measure.tempo);
+    const originalTempo = new SmoTempo(measure.tempo);
     this._undoColumn('update tempo', measure.measureNumber.measureIndex);
     let startMeasure = measure.measureNumber.measureIndex;
     let endMeasure = this.score.staves[0].measures.length;
@@ -641,14 +641,14 @@ export class SuiScoreViewOperations extends SuiScoreView {
       }
     }
     // If we are only changing the position of the text, it only affects the tempo measure.
-    if (SmoTempoText.eq(originalTempo, tempo) && tempo.yOffset !== originalTempo.yOffset && endMeasure > startMeasure) {
+    if (SmoTempo.eq(originalTempo, tempo) && tempo.yOffset !== originalTempo.yOffset && endMeasure > startMeasure) {
       endMeasure = startMeasure + 1;          
     }
     for (measureIndex = startMeasure; measureIndex < endMeasure; ++measureIndex) {
       if (!scoreMode && !selectionMode) {
         // If not whole score or selections, change until the tempo doesn't match previous measure's tempo (next tempo change)
         const compMeasure = this.score.staves[0].measures[measureIndex];
-        if (SmoTempoText.eq(originalTempo, compMeasure.tempo) || displayed === false) {
+        if (SmoTempo.eq(originalTempo, compMeasure.tempo) || displayed === false) {
           const sel = SmoSelection.measureSelection(this.score, 0, measureIndex);
           const altSel = SmoSelection.measureSelection(this.storeScore, 0, measureIndex);
           if (sel && sel.measure.tempo.display && !displayed) {
@@ -706,17 +706,17 @@ export class SuiScoreViewOperations extends SuiScoreView {
    * default tempo, or the previously-set tempo.
    * @param scoreMode whether to reset entire score
    */
-  async removeTempo(measure: SmoMeasure, tempo: SmoTempoText, scoreMode: boolean, selectionMode: boolean): Promise<void> {
+  async removeTempo(measure: SmoMeasure, tempo: SmoTempo, scoreMode: boolean, selectionMode: boolean): Promise<void> {
     const startSelection = this.tracker.selections[0];
     if (startSelection.selector.measure > 0) {
       const measureIx = startSelection.selector.measure - 1;
       const target = startSelection.staff.measures[measureIx];
       const tempo = target.getTempo();
-      const newTempo = new SmoTempoText(tempo);
+      const newTempo = new SmoTempo(tempo);
       newTempo.display = false;
       this.updateTempoScore(measure, newTempo, scoreMode, selectionMode);
     } else {
-      this.updateTempoScore(measure, new SmoTempoText(SmoTempoText.defaults), scoreMode, selectionMode);
+      this.updateTempoScore(measure, new SmoTempo(SmoTempo.defaults), scoreMode, selectionMode);
     }
     await this.renderer.updatePromise();
   }

package/src/render/sui/textEdit.ts

@@ -850,7 +850,9 @@ export class SuiChordEditor extends SuiTextEditor {
     if (this.svgText !== null && this.svgText.blocks.length > this.textPos && this.textPos >= 0) {
       this.textType = this.svgText.blocks[this.textPos].textType;
     }
-    evdata.preventDefault(); // prevent browser scroll
+    if (typeof(evdata.preventDefault) === 'function') {
+      evdata.preventDefault(); // prevent browser scroll
+    }
 
     return edited;
   }

package/src/render/vex/vxMeasure.ts

@@ -543,15 +543,21 @@ export class VxMeasure implements VxMeasureIf {
     this.stave = createStave(smoVexStaveParams);
     if (this.smoMeasure.svg.forceTimeSignature) {
       const ts = this.smoMeasure.timeSignature;
-      let tsString = ts.timeSignature;
+      
       if (this.smoMeasure.timeSignature.useSymbol && ts.actualBeats === 4 && ts.beatDuration === 4) {
-        tsString = 'C';
+        this.stave.addTimeSignature('C');
       } else if (this.smoMeasure.timeSignature.useSymbol && ts.actualBeats === 2 && ts.beatDuration === 4) {
-        tsString = 'C|';
-      } else if (this.smoMeasure.timeSignature.displayString.length) {
-        tsString = this.smoMeasure.timeSignature.displayString;
+        this.stave.addTimeSignature('C|');
+      } else  {
+        let tsString = this.smoMeasure.timeSignature.displayString.length ? this.smoMeasure.timeSignature.displayString : ts.timeSignature;
+        const tsStrings = tsString.split('+');  
+        for (let i = 0; i < tsStrings.length; i++) {
+          const tsString = tsStrings[i].trim();
+          if (tsString.length) {
+            this.stave.addTimeSignature(tsStrings[i].trim());
+          }
+        }
       }
-      this.stave.addTimeSignature(tsString);
     }
     // Connect it to the rendering context and draw!
     this.stave.setContext(this.context.getContext());