1.0.1 • Published 3 years ago

@_000407/transpose.js v1.0.1

Weekly downloads
2
License
MIT
Repository
github
Last release
3 years ago

transpose.js - Chord Transposition made simple

This is a simple utility for transposing the chords in a given composition. Once the CSS selector for the element that contains the chord, and the target transposition index is provided, the library can transpose the chord defined within the said element, to the given transposition index. Transposition index i is in the range [-12 <= i <= +12].

Getting Started

Using npm

import { Transpose } from '@_00407/transpose.js';

const t = new Transpose();
t.transpose(+1);

Plain JS

<script type="text/javascript" src="https://kanchana.senadheera.net/transpose.js/dist/transpose.min.js"></script> <!-- Transposer instance will be initialized in the window object -->

<button class="transpose transpose-down" onclick="Transposer.transpose(-1)">-1</button>
<button class="transpose transpose-reset" onclick="Transposer.transpose(0)">R</button>
<button class="transpose transpose-up" onclick="Transposer.transpose(+1)">+1</button>

Prerequisites

N/A

Installing

Using npm

npm install @_000407/singlish.js

Plain JS

<script type="text/javascript" src="https://kanchana.senadheera.net/transpose.js/dist/transpose.min.js"></script>

Configuration

You may customize the behavior of transposed output rendering, selection of containers of chords etc as follows.

  1. During instantiation - accepts an object contains configuration
  2. Calling init method of an instance - accepts an object contains configuration
PropertyDescriptionTypeReq/OptDefault
selectorCSS selector of the elements that contain the chords.stringOptionalspan.chord
renderFunction that renders the transposed chord output.functionOptionalsee Rendering

Rendering

By default, the rendering is done using the following function.

function(offset) {
  for(let c of document.querySelectorAll(this.selector)) {
    c.innerHTML = this.transposeChord(c.innerHTML, offset);
  }
}

Example

// During construction
const t = new Transposer({
    selector: "span.chord",
    render: function(offset) {
        console.log("Overridden version");
        for(let c of document.querySelectorAll(this.selector)) {
            c.innerHTML = this.transposeChord(c.innerHTML, offset);
        }
    }
});

// Using init method
t.init({
    selector: "span.chord",
    render: function(offset) {
        console.log("Overridden version");
        for(let c of document.querySelectorAll(this.selector)) {
            c.innerHTML = this.transposeChord(c.innerHTML, offset);
        }
    }
});

Running the tests

N/A

Break down into end to end tests

N/A

Deployment

N/A

Built With

N/A

Contributing

N/A

Versioning

We use SemVer for versioning. For the versions available, see the tags on this repository.

Authors

  • Kanchana Senadheera - Initial work - 000407

See also the list of contributors who participated in this project.

License

This project is licensed under the MIT License - see the LICENSE.md file for details

Acknowledgments

N/A