Giter Site home page Giter Site logo

hongjes1 / ugchordstoflats Goto Github PK

View Code? Open in Web Editor NEW
0.0 1.0 2.0 24 KB

Console code: get UG chord charts with sharps to display as flats

License: MIT License

JavaScript 100.00%
chord-charts chord-diagram convert conversion music ultimate-guitar

ugchordstoflats's Introduction

Table of Contents

  1. About UGChordstoFlats
    1. The EVO interface (NOTE: deprecated)
    2. UG React, the new interface
  2. How to use
  3. Why care? A very brief Western music history/theory primer
    1. The UG Problem
  4. Known bugs and shortcomings
    1. New version
    2. EVO
    3. Both

About UGChordstoFlats

As annotated within code, changes basic chord chart sharp chords to flats. Most useful in the context of transposition. For (guitar or ukulele) chord charts on the site Ultimate Guitar.

toFlats only works on the EVO user interface, accessible via this direct link. The chord definitions and functionality has been updated and will be checked; the EVO engine was unavailable for contributors for a period of time.

The EVO interface

Note: The EVO interface has now been deprecated in favor of UG React. The EVO engine runs in a mostly-white background, includes an embedded YouTube interface, and can run in multiple languages (in an early beta). It also includes useful information about contributions and sorts contribution by both artist, name, and ultimately, type:

  • In a list of artist's contributions, all contributions with names N into one link: picture alt
  • Clicking on a song title reveals a list of contributions, sorted by submission type: picture alt

UG React, the new interface

toFlatsnew works on the now-updated site, which is currently in beta for contributors only and dubbed UG React. An excerpt of this chord chart without the changes applied can be found below:

picture alt

Back to top

How to use

  1. Open a tab's page. The page should end with "chords_###" or "ukulele_###" (for ukulele chord charts), where the number indicates the submission ID; otherwise, the transposition and chord recognition interfaces do not apply.
  2. Open the console. See here if confused on how to achieve this on different browsers.
  3. Copy/paste the code into the console. Output should look like the below:

picture alt

Back to top

Why care? A very brief Western music history/theory primer

In the Western Classical musical system, there are seven letter names associated with seven pitch classes: A, B, C, D, E, F, and G. Each pitch class includes notes with the same letter name and sound, but just an integer exponential of 2 away. Example: in the A = 440 Hz standard, the A pitch class includes 440 Hz (written as A4 in scientific notation), 220 Hz (A3), 55 Hz (A1), and many others as long as they are an exponential of 2 away, particularly in the modern tempered tuning system. With the exception of B-C and E-F, each note has another note between them. In terms of musical distance (referred to as intervals), E and F are a half-step apart. C and D, on the other hand, are a whole step apart. (In other systems, semitones and (whole) tones, respectively, are used interchangably.) This comprises a 12-tone repeating system.

By the middle ages, a hexachord (six-note) system had been established through the Church, which was the main musical body throughout Europe. These hexachords were centered around the pitches G, C, and F, and used the singing syllables "ut re mi fa sol la", which would change later to more modern solfeggio. As in the note letter names, the distance beetween mi and fa is a half-step. Guido d'Arezzo, a monk and music teacher, devised a method to remember the hexachords, commonly called the Guidonian hand:

picture alt Color key. Green: G (hard) hexachord. Brown: C (natural) hexachord. Blue: F (soft) hexachord.

The Greek letter ฮ“ (Gamma) stood for the lowest note according to the hand. Quirks can be found when looking at notation for "B". Look at the top of the pinky finger:

The square b that represented the solfeggio syllable mi in the G hexachord, a whole step away from the preceding A (re), would eventually morph into the natural and sharp symbols in Western notation, the latter which raises the original pitch 1/2-step. Similarly, the soft b that represented the solfeggio syllable fa in the F hexachord, a half-step away from the preceding A (mi), would eventually morph into the flat symbol, which lowers the original pitch 1/2-step.

The basis of 12 notes had already been made with the practice of mutation, where singers would start hexachords on nontraditional notes. The development of major and minor tonalities much later, along with staff notation and temperament, would further cement the use of all 12 notes in music, as well as define practices for note nomenclature within the major and minor systems.

A major scale based around N is created thus:

N(+0) N+2 N+4 N+5 N+7 N+9 N+11 (N+12, octave, same note but higher)

where M = N+# is a note in N's scale # half-steps upward from N.

Each major scale invokes each note letter exactly once. So for any scale S, the letters A, B, C, D, E, F, and G must appear exactly once within the scale (barring the octave). So, for a major scale starting on B, starting with the letters in order can help:

B C D E F G A (B)

Then, apply the intervals as required.

B to C is 1/2-step apart, so the C needs to be raised to C#.

-> B C# D E F G A (B)

C# to D is 1/2-step apart, so to make 2 half-steps of space between them, the D needs to be raised to D#.

-> B C# D# E F G A (B)

Continue the process, and the following will arise:

B C# D# E F# G# A# (B)

Minor scales also follow the note letter conditions, but the formula is as follows instead:

N(+0) N+2 N+3 N+5 N+7 N+8 N+10 (N+12, octave, same note but higher)

A (natural) minor scale based around the note D would be as follows:

D E F G A Bb C (D)

Note in particular that:

  • sharps or flats can appear in different contexts, and
  • the contexts are usually separate; i.e. sharps usually don't appear in keys with flats, and vice versa.

The UG Problem

While users are allowed to insert sharps and/or flats into their submissions, the transposition feature defaults to sharps only, whether accurate or not. To compensate for situations where flats are appropriate for the situation, this short script was written to address this.

Back to top

Known bugs and shortcomings

New version

  • The javascript event onMouseOver will reset the chord names to their original value in the new tab interface. This has something to do with external code.
  • Clicking a previously opened chord diagram with the changed name will revert the chord's name to the original value within the chord diagram.

EVO

  • The chord diagrams will not display on the EVO version; however, the chord names will not change either.
  • EVO is now deprecated.

Both

  • The code's set of chord names is severely limited and is not at all exhaustive. Example: E, Emaj, EM, and Emajor all will display E major chords (notes E-G#-B), but only chord of the first format are supported.
  • This is a simple text replacement algorithm. As such, replacing "B" with "Cb" will result in chords that are shifted one character to the right. This is similar to what happens with the transposition function as it currently functions on the site. (Dm-Bb-Gm takes fewer characters than Fm-Db-Bbm etc.) This is related to unchanged span sizes.

Back to top

ugchordstoflats's People

Contributors

hongjes1 avatar

Watchers

 avatar

Forkers

naaraanjaa

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.