JSFiddle - React, Tailwind, and code Playground

by darkyen

HTML

<div>
JUST DROP AN Mp3 FILE HERE!!!
</div>

CSS

div{
    width:100%;
    position:absolute;
    height:100%;
    background:yellow;
    font-size:32px;
    color:#000;
}
div:hover{
    background:red;
    
}

JavaScript

/* Written by Abhishek Hingnikar - Darkyen */
/* Fetches Mp3 ID3V2 Tags of a song */

ID3v2 = {
    parseStream: function(stream, onComplete){

    var PICTURE_TYPES = {
        "0": "Other",
        "1": "32x32 pixels 'file icon' (PNG only)",
        "2": "Other file icon",
        "3": "Cover (front)",
        "4": "Cover (back)",
        "5": "Leaflet page",
        "6": "Media (e.g. lable side of CD)",
        "7": "Lead artist/lead performer/soloist",
        "8": "Artist/performer",
        "9": "Conductor",
        "A": "Band/Orchestra",
        "B": "Composer",
        "C": "Lyricist/text writer",
        "D": "Recording Location",
        "E": "During recording",
        "F": "During performance",
        "10": "Movie/video screen capture",
        "11": "A bright coloured fish", //<--- WTF?
        "12": "Illustration",
        "13": "Band/artist logotype",
        "14": "Publisher/Studio logotype",
    }

    //from: http://bitbucket.org/moumar/ruby-mp3info/src/tip/lib/mp3info/id3v2.rb
    //TODO: replace with something longer
    var TAGS = {
    "AENC": "Audio encryption",
    "APIC": "Attached picture",
    "COMM": "Comments",
    "COMR": "Commercial frame",
    "ENCR": "Encryption method registration",
    "EQUA": "Equalization",
    "ETCO": "Event timing codes",
    "GEOB": "General encapsulated object",
    "GRID": "Group identification registration",
    "IPLS": "Involved people list",
    "LINK": "Linked information",
    "MCDI": "Music CD identifier",
    "MLLT": "MPEG location lookup table",
    "OWNE": "Ownership frame",
    "PRIV": "Private frame",
    "PCNT": "Play counter",
    "POPM": "Popularimeter",
    "POSS": "Position synchronisation frame",
    "RBUF": "Recommended buffer size",
    "RVAD": "Relative volume adjustment",
    "RVRB": "Reverb",
    "SYLT": "Synchronized lyric/text",
    "SYTC": "Synchronized tempo codes",
    "TALB": "Album",
    "TBPM": "BPM",
    "TCOM": "Composer",
    "TCON": "Genre",
    "TCOP": "Copyright...