Skip to content

Commit

Permalink
gsuiBlocksManager: prefix $
Browse files Browse the repository at this point in the history
  • Loading branch information
@mr21
mr21 committed Feb 14, 2024
1 parent f64bbe1 commit 52cd3b5
Show file tree
Hide file tree
Showing 3 changed files with 76 additions and 76 deletions.
52 changes: 26 additions & 26 deletions gsuiBlocksManager/gsuiBlocksManager.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,29 +68,29 @@ class gsuiBlocksManager {
}

// .........................................................................
getOpts() { return this.#opts; }
setData( data ) { this.#data = data; }
setFontSize( px ) { this.#fontSize = px; }
setPxPerBeat( px ) { this.#pxPerBeat = px; }
getFontSize() { return this.#fontSize; }
getPxPerBeat() { return this.#pxPerBeat; }
getRows() { return this.#nlRows; }
getBlocks() { return this.#blcs; }
getSelectedBlocks() { return this.#blcsSelected; }
$getOpts() { return this.#opts; }
$setData( data ) { this.#data = data; }
$setFontSize( px ) { this.#fontSize = px; }
$setPxPerBeat( px ) { this.#pxPerBeat = px; }
$getFontSize() { return this.#fontSize; }
$getPxPerBeat() { return this.#pxPerBeat; }
$getRows() { return this.#nlRows; }
$getBlocks() { return this.#blcs; }
$getSelectedBlocks() { return this.#blcsSelected; }

// .........................................................................
#getRow0BCR() { return this.#nlRows[ 0 ].getBoundingClientRect(); }
getRowByIndex( ind ) { return this.#nlRows[ ind ]; }
getRowIndexByRow( row ) { return Array.prototype.indexOf.call( this.#nlRows, row ); }
getRowIndexByPageY( pageY ) {
$getRowByIndex( ind ) { return this.#nlRows[ ind ]; }
$getRowIndexByRow( row ) { return Array.prototype.indexOf.call( this.#nlRows, row ); }
$getRowIndexByPageY( pageY ) {
const ind = Math.floor( ( pageY - this.#getRow0BCR().top ) / this.#fontSize );

return Math.max( 0, Math.min( ind, this.#nlRows.length - 1 ) );
}
getWhenByPageX( pageX ) {
$getWhenByPageX( pageX ) {
return Math.max( 0, ( pageX - this.#getRow0BCR().left ) / this.#pxPerBeat );
}
roundBeat( beat ) {
$roundBeat( beat ) {
return Math.max( 0, this.timeline.beatFloor( beat ) );
}

Expand Down Expand Up @@ -179,7 +179,7 @@ class gsuiBlocksManager {
}

// .........................................................................
onmousedown( e ) {
$onmousedown( e ) {
const blc = this.#getBlc( e.currentTarget );

GSUunselectText();
Expand All @@ -193,16 +193,16 @@ class gsuiBlocksManager {
this.#blcsEditing.set( blc.dataset.id, blc );
}
} else if ( e.button === 0 ) {
const mdWhenReal = this.getWhenByPageX( e.pageX );
const mdWhenReal = this.$getWhenByPageX( e.pageX );

this.#mdPageX = e.pageX;
this.#mdPageY = e.pageY;
this.#mdWhen = this.roundBeat( mdWhenReal );
this.#mdWhen = this.$roundBeat( mdWhenReal );
this.#beatSnap = this.#getBeatSnap();
if ( e.shiftKey ) {
this.#mmFn = gsuiBlocksManager.#mousemoveFns.selection1;
this.#status = "selecting-1";
this.#mdRowInd = this.getRowIndexByPageY( e.pageY );
this.#mdRowInd = this.$getRowIndexByPageY( e.pageY );
} else if ( blc ) {
const fnAct = gsuiBlocksManager.#mousedownFns[ e.target.dataset.action ];

Expand All @@ -221,9 +221,9 @@ class gsuiBlocksManager {
static #onmousedownMove( data, blcsEditing, _blc, e ) {
this.#mmFn = gsuiBlocksManager.#mousemoveFns.move;
this.#status = "moving";
this.#mdRowInd = this.getRowIndexByPageY( e.pageY );
this.#mdRowInd = this.$getRowIndexByPageY( e.pageY );
blcsEditing.forEach( ( blc, id ) => {
const valB = this.getRowIndexByRow( blc.parentNode.parentNode );
const valB = this.$getRowIndexByRow( blc.parentNode.parentNode );

this.#valueAMin = Math.min( this.#valueAMin, data[ id ].when );
this.#valueBMin = Math.min( this.#valueBMin, valB );
Expand Down Expand Up @@ -265,9 +265,9 @@ class gsuiBlocksManager {
this.#mmPageX = e.pageX;
this.#mmPageY = e.pageY;
}
const mmWhenReal = this.getWhenByPageX( this.#mmPageX );
const mmWhenReal = this.$getWhenByPageX( this.#mmPageX );

this.#mmWhen = this.roundBeat( mmWhenReal );
this.#mmWhen = this.$roundBeat( mmWhenReal );
this.#mmFn( e );
}
}
Expand Down Expand Up @@ -298,7 +298,7 @@ class gsuiBlocksManager {
const when = Math.max( this.#valueAMin,
Math.round( ( this.#mmWhen - this.#mdWhen ) / this.#beatSnap ) * this.#beatSnap );
const rows = Math.max( this.#valueBMin, Math.min( this.#valueBMax,
this.getRowIndexByPageY( this.#mmPageY ) - this.#mdRowInd ) );
this.$getRowIndexByPageY( this.#mmPageY ) - this.#mdRowInd ) );

if ( when !== this.#valueA ) {
this.#valueA = when;
Expand Down Expand Up @@ -330,13 +330,13 @@ class gsuiBlocksManager {
static #onmousemoveSelection2() {
const rowH = this.#fontSize;
const st = this.#elSelection.style;
const rowIndB = this.getRowIndexByPageY( this.#mmPageY );
const rowIndB = this.$getRowIndexByPageY( this.#mmPageY );
const when = Math.min( this.#mdWhen, this.#mmWhen );
const duration = this.#getBeatSnap() + Math.abs( this.#mdWhen - this.#mmWhen );
const topRow = Math.min( this.#mdRowInd, rowIndB );
const bottomRow = Math.max( this.#mdRowInd, rowIndB );
const rowA = this.getRowByIndex( topRow );
const rowB = this.getRowByIndex( bottomRow );
const rowA = this.$getRowByIndex( topRow );
const rowB = this.$getRowByIndex( bottomRow );
const blcs = Object.entries( this.#data ).reduce( ( map, [ id, blc ] ) => {
if ( !this.#blcsSelected.has( id ) &&
blc.when < when + duration &&
Expand Down
48 changes: 24 additions & 24 deletions gsuiPatternroll/gsuiPatternroll.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@ class gsuiPatternroll extends HTMLElement {
const elTrack = this.#tracklist.addTrack( id );
const row = elTrack.rowElement;

row.classList.toggle( "gsui-row-small", this.#blcManager.getFontSize() <= 44 );
row.classList.toggle( "gsui-row-small", this.#blcManager.$getFontSize() <= 44 );
row.onmousedown = this.#rowMousedown.bind( this );
this.#rowsByTrackId.set( row.dataset.id, row );
this.#win.querySelector( ".gsuiTimewindow-rows" ).append( row );
Expand All @@ -96,42 +96,42 @@ class gsuiPatternroll extends HTMLElement {
elBlc.dataset.pattern = obj.pattern;
elBlc.onmousedown = this.#blcMousedown.bind( this, id );
GSUsetAttribute( elBlc, "data-missing", !dataReady );
this.#blcManager.getBlocks().set( id, elBlc );
this.#blcManager.$getBlocks().set( id, elBlc );
this.onaddBlock( id, obj, elBlc );
}
removeBlock( id ) {
this.#blcManager.getBlocks().get( id ).remove();
this.#blcManager.getBlocks().delete( id );
this.#blcManager.getSelectedBlocks().delete( id );
this.#blcManager.$getBlocks().get( id ).remove();
this.#blcManager.$getBlocks().delete( id );
this.#blcManager.$getSelectedBlocks().delete( id );
}
changeBlockProp( id, prop, val ) {
const blc = this.#blcManager.getBlocks().get( id );
const blc = this.#blcManager.$getBlocks().get( id );

this.#blockDOMChange( blc, prop, val );
if ( prop === "track" ) {
blc.dataset.track = val;
} else if ( prop === "selected" ) {
val
? this.#blcManager.getSelectedBlocks().set( id, blc )
: this.#blcManager.getSelectedBlocks().delete( id );
? this.#blcManager.$getSelectedBlocks().set( id, blc )
: this.#blcManager.$getSelectedBlocks().delete( id );
}
}
updateBlockViewBox( id, obj ) {
this.oneditBlock( id, obj, this.#blcManager.getBlocks().get( id ) );
this.oneditBlock( id, obj, this.#blcManager.$getBlocks().get( id ) );
}

// .........................................................................
setData( data ) {
this.#blcManager.setData( data );
$setData( data ) {
this.#blcManager.$setData( data );
}
setCallbacks( cb ) {
this.onchange = cb.onchange;
this.onaddBlock = cb.onaddBlock;
this.oneditBlock = cb.oneditBlock;
this.#blcManager.getOpts().oneditBlock = cb.oneditBlock;
this.#blcManager.$getOpts().oneditBlock = cb.oneditBlock;
}
getBlocks() {
return this.#blcManager.getBlocks();
$getBlocks() {
return this.#blcManager.$getBlocks();
}
timedivision( timediv ) {
GSUsetAttribute( this.#win, "timedivision", timediv );
Expand Down Expand Up @@ -160,30 +160,30 @@ class gsuiPatternroll extends HTMLElement {
#getRowByTrackId( id ) { return this.#rowsByTrackId.get( id ); }
#incrTrackId( id, incr ) {
const row = this.#getRowByTrackId( id );
const rowInd = this.#blcManager.getRowIndexByRow( row ) + incr;
const rowInd = this.#blcManager.$getRowIndexByRow( row ) + incr;

return this.#blcManager.getRowByIndex( rowInd ).dataset.id;
return this.#blcManager.$getRowByIndex( rowInd ).dataset.id;
}

// .........................................................................
#ongsuiTimewindowPxperbeat( ppb ) {
this.#blcManager.setPxPerBeat( ppb );
this.#blcManager.$setPxPerBeat( ppb );
}
#ongsuiTimewindowLineheight( px ) {
this.#blcManager.setFontSize( px );
Array.from( this.#blcManager.getRows() ).forEach( el => el.classList.toggle( "gsui-row-small", px <= 44 ) );
this.#blcManager.$setFontSize( px );
Array.from( this.#blcManager.$getRows() ).forEach( el => el.classList.toggle( "gsui-row-small", px <= 44 ) );
}

// .........................................................................
#rowMousedown( e ) {
this.#blcManager.onmousedown( e );
if ( e.button === 0 && !e.shiftKey && this.#blcManager.getSelectedBlocks().size ) {
this.#blcManager.$onmousedown( e );
if ( e.button === 0 && !e.shiftKey && this.#blcManager.$getSelectedBlocks().size ) {
this.onchange( "unselection" );
}
}
#blcMousedown( id, e ) {
e.stopPropagation();
this.#blcManager.onmousedown( e );
this.#blcManager.$onmousedown( e );
}
#drop( e ) {
const [ patType, patId ] = GSUgetDataTransfer( e, [
Expand All @@ -196,8 +196,8 @@ class gsuiPatternroll extends HTMLElement {
] );

if ( patId ) {
const when = this.#blcManager.roundBeat( this.#blcManager.getWhenByPageX( e.pageX ) );
const track = this.#blcManager.getRowByIndex( this.#blcManager.getRowIndexByPageY( e.pageY ) ).dataset.id;
const when = this.#blcManager.$roundBeat( this.#blcManager.$getWhenByPageX( e.pageX ) );
const track = this.#blcManager.$getRowByIndex( this.#blcManager.$getRowIndexByPageY( e.pageY ) ).dataset.id;

this.onchange( "add", patType, patId, when, track );
}
Expand Down
52 changes: 26 additions & 26 deletions gsuiPianoroll/gsuiPianoroll.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -108,8 +108,8 @@ class gsuiPianoroll extends HTMLElement {
reset() {
this.#currKeyDuration = 1;
}
setData( data ) {
this.#blcManager.setData( data );
$setData( data ) {
this.#blcManager.$setData( data );
}
setCallbacks( cb ) {
this.onchange = cb.onchange;
Expand Down Expand Up @@ -167,10 +167,10 @@ class gsuiPianoroll extends HTMLElement {
blc._draglineDrop = blc.querySelector( ".gsuiDragline-drop" );
blc.append( dragline.rootElement );
dragline.getDropAreas = this.#getDropAreas.bind( this, id );
this.#blcManager.getBlocks().set( id, blc );
this.#blcManager.$getBlocks().set( id, blc );
obj.selected
? this.#blcManager.getSelectedBlocks().set( id, blc )
: this.#blcManager.getSelectedBlocks().delete( id );
? this.#blcManager.$getSelectedBlocks().set( id, blc )
: this.#blcManager.$getSelectedBlocks().delete( id );
this.#uiSliderGroup.set( id, obj.when, obj.duration, obj[ this.#slidersSelect.value ] );
this.#blockDOMChange( blc, "key", obj.key );
this.#blockDOMChange( blc, "when", obj.when );
Expand All @@ -186,19 +186,19 @@ class gsuiPianoroll extends HTMLElement {
this.#blockDOMChange( blc, "next", obj.next );
}
removeKey( id ) {
const blc = this.#blcManager.getBlocks().get( id );
const blcPrev = this.#blcManager.getBlocks().get( blc.dataset.prev );
const blc = this.#blcManager.$getBlocks().get( id );
const blcPrev = this.#blcManager.$getBlocks().get( blc.dataset.prev );

blc.remove();
if ( blcPrev ) {
blcPrev._dragline.linkTo( null );
}
this.#blcManager.getBlocks().delete( id );
this.#blcManager.getSelectedBlocks().delete( id );
this.#blcManager.$getBlocks().delete( id );
this.#blcManager.$getSelectedBlocks().delete( id );
this.#uiSliderGroup.delete( id );
}
changeKeyProp( id, prop, val ) {
const blc = this.#blcManager.getBlocks().get( id );
const blc = this.#blcManager.$getBlocks().get( id );

this.#blockDOMChange( blc, prop, val );
if ( val === null ) {
Expand All @@ -208,8 +208,8 @@ class gsuiPianoroll extends HTMLElement {
}
if ( prop === "selected" ) {
val
? this.#blcManager.getSelectedBlocks().set( id, blc )
: this.#blcManager.getSelectedBlocks().delete( id );
? this.#blcManager.$getSelectedBlocks().set( id, blc )
: this.#blcManager.$getSelectedBlocks().delete( id );
}
}
#blockDOMChange( el, prop, val ) {
Expand Down Expand Up @@ -243,13 +243,13 @@ class gsuiPianoroll extends HTMLElement {
this.#blockRedrawDragline( el );
} break;
case "prev": {
const blc = this.#blcManager.getBlocks().get( val );
const blc = this.#blcManager.$getBlocks().get( val );

el.classList.toggle( "gsuiPianoroll-block-prevLinked", !!val );
blc && blc._dragline.linkTo( el._draglineDrop );
} break;
case "next": {
const blc = this.#blcManager.getBlocks().get( val );
const blc = this.#blcManager.$getBlocks().get( val );

el.classList.toggle( "gsuiPianoroll-block-nextLinked", !!val );
el._dragline.linkTo( blc && blc._draglineDrop );
Expand All @@ -272,7 +272,7 @@ class gsuiPianoroll extends HTMLElement {
}
}
#blockRedrawDragline( el ) {
const blcPrev = this.#blcManager.getBlocks().get( el.dataset.prev );
const blcPrev = this.#blcManager.$getBlocks().get( el.dataset.prev );

el._dragline.redraw();
blcPrev && blcPrev._dragline.redraw();
Expand All @@ -284,14 +284,14 @@ class gsuiPianoroll extends HTMLElement {

// ........................................................................
#ongsuiTimewindowPxperbeat( ppb ) {
this.#blcManager.setPxPerBeat( ppb );
this.#blcManager.getBlocks().forEach( blc => blc._dragline.redraw() );
this.#blcManager.$setPxPerBeat( ppb );
this.#blcManager.$getBlocks().forEach( blc => blc._dragline.redraw() );
GSUsetAttribute( this.#uiSliderGroup, "pxperbeat", ppb );
}
#ongsuiTimewindowLineheight( px ) {
this.#blcManager.setFontSize( px );
Array.from( this.#blcManager.getRows() ).forEach( el => el.classList.toggle( "gsui-row-small", px <= 44 ) );
this.#blcManager.getBlocks().forEach( blc => blc._dragline.redraw() );
this.#blcManager.$setFontSize( px );
Array.from( this.#blcManager.$getRows() ).forEach( el => el.classList.toggle( "gsui-row-small", px <= 44 ) );
this.#blcManager.$getBlocks().forEach( blc => blc._dragline.redraw() );
}
#ongsuiTimelineChangeCurrentTime( t ) {
GSUsetAttribute( this.#uiSliderGroup, "currenttime", t );
Expand Down Expand Up @@ -366,13 +366,13 @@ class gsuiPianoroll extends HTMLElement {

e.stopPropagation();
if ( !dline.contains( e.target ) ) {
this.#blcManager.onmousedown( e );
this.#blcManager.$onmousedown( e );
}
}
#rowMousedown( key, e ) {
this.#blcManager.onmousedown( e );
this.#blcManager.$onmousedown( e );
if ( e.button === 0 && !e.shiftKey ) {
const when = this.#blcManager.roundBeat( this.#blcManager.getWhenByPageX( e.pageX ) );
const when = this.#blcManager.$roundBeat( this.#blcManager.$getWhenByPageX( e.pageX ) );

this.onchange( "add", key, when, this.#currKeyDuration );
}
Expand All @@ -389,7 +389,7 @@ class gsuiPianoroll extends HTMLElement {
case "gainLFOAmp": grp.options( { min: -6, max: 6, def: 0, step: 1 } ); break;
case "gainLFOSpeed": grp.options( { min: -6, max: 6, def: 0, step: 1 } ); break;
}
this.#blcManager.getBlocks().forEach( ( blc, id ) => {
this.#blcManager.$getBlocks().forEach( ( blc, id ) => {
const val = +blc.dataset[ prop ];
const val2 = prop.startsWith( "gainLFO" )
? gsuiPianoroll.#mulToX( val )
Expand Down Expand Up @@ -424,11 +424,11 @@ class gsuiPianoroll extends HTMLElement {
// Key's functions
// ........................................................................
#getDropAreas( id ) {
const d = this.#blcManager.getBlocks().get( id ).dataset;
const d = this.#blcManager.$getBlocks().get( id ).dataset;
const when = +d.when + +d.duration;
const arr = [];

this.#blcManager.getBlocks().forEach( blc => {
this.#blcManager.$getBlocks().forEach( blc => {
const d = blc.dataset;

if ( +d.when >= when && ( d.prev === undefined || d.prev === id ) ) {
Expand Down

0 comments on commit 52cd3b5

Please sign in to comment.