Any JavaScript parser for .lrc?

Question

I was using the code from Kejun's Blog .

I want to parse a .lrc (which is basically a lyrics file) so as to get the time variable as well as the string(read lyrics) . I tried out this code and could not seem to get the output .

   <html>
<head> 
<script src="jquery-1.7.1.js"></script>
<script> 
$(document).ready(function () {
    $.ajax({
        type: "GET",
        url: "a.txt",
        dataType: "text",
        success: function (data) {
            parseLyric(data);
        }
    });
});

var _current_lyric = new Array();

function convertLRCLyric(inf) {
    inf += "n";
    var lyric = inf.match(/([(d{2}:d{2}(.d{1,2}){0,1})]){1,}W*n|([(d{2}:d{2}:d{2}(.d{1,2}){0,1})]){1,}W*n/ig);
    var l_s = '',
        l_tt, l_ww, l_i, l_ii;
    if (!lyric || !lyric.length) {
        return;
    }

    for (l_i = 0; l_i < lyric.length; l_i++) {
        l_tt = lyric[l_i].match(/([d{2}:d{2}(.d{1,2}){0,1}])|([d{2}:d{2}:d{2}(.d{1,2}){0,1}])/ig);
        l_ww = lyric[l_i].replace(/[S+]/ig, '').replace(/n{1,}/ig, '');
        for (l_ii = 0; l_ii < l_tt.length; l_ii++) {
            l_tt[l_ii] = l_tt[l_ii].replace(/[/,'').replace(/]/, '');
            if (l_tt[l_ii].search(/d{2}:d{2}:d{2}.d{2}/g) >= 0) {
                _current_lyric[l_tt[l_ii].substring(0, l_tt[l_ii].length - 1)] = l_ww;
            } else if (l_tt[l_ii].search(/d{2}:d{2}:d{2}.d{1}/g) >= 0) {
                _current_lyric[l_tt[l_ii]] = l_ww;
            } else if (l_tt[l_ii].search(/d{2}:d{2}:d{2}/g) >= 0) {
                _current_lyric[l_tt[l_ii] + ".0"] = l_ww;
            } else if (l_tt[l_ii].search(/d{2}:d{2}.d{2}/g) >= 0) {
                _current_lyric["00:" + l_tt[l_ii].substring(0, l_tt[l_ii].length - 1)] = l_ww;
            } else if (l_tt[l_ii].search(/d{2}:d{2}.d{1}/g) >= 0) {
                _current_lyric["00:" + l_tt[l_ii]] = l_ww;
            } else if (l_tt[l_ii].search(/d{2}:d{2}/g) >= 0) {
                _current_lyric["00:" + l_tt[l_ii] + ".0"] = l_ww;
            }
        }
    }
}

function parseLyric(allText) {
    _current_lyric = [];
    convertLRCLyric(allText);
    var ly = "";
    for (var time in _current_lyric) {
        ly += time + "--" + _current_lyric[time] + "n";
    }
    alert(ly);
}
</script>
</head>
<body>

</body>
</html>

But i keep getting a blank alert . Any help would be great . Thanks in advance .

Although this is hardly the reason for your problems, you should [never use a for-in-loop on arrays](http://stackoverflow.com/questions/500504/javascript-for-in-with-arrays) — Bergi, Jul 16 '12 at 18:23
AFAIK, `replace(/[/,'')` is wrong: the `[` denoted the start of a character class. But instead of trying to fix it, I would just read the [specs](http://en.wikipedia.org/wiki/LRC_(file_format)) and write a proper little parser. What you found on the net is an utter mess, IMO. — Bart Kiers, Jul 16 '12 at 18:29
You should post your answer as an answer (below), not as an edit to your question. — Trott, Jul 27 '12 at 05:52

score 2 · Accepted Answer · answered Jul 27 '12 at 14:57

Answer :

Ok so i built my own parser ,Here is the code

var contents = " " ;
function readMultipleFiles(evt) {
    //Retrieve all the files from the FileList object
    var files = evt.target.files;

    if (files) {
        for (var i = 0, f; f = files[i]; i++) {
            var r = new FileReader();
            r.onload = (function (f) {
                return function (e) {
                    contents = e.target.result;
                   processData(contents);
                };
            })(f);
            r.readAsText(f);
        }
    } else {
        alert("Failed to load files");
    }
}
document.getElementById('fileinput').addEventListener('change', readMultipleFiles, false);



var allTextLines = " ";
var lyrics = [];
var tim = [] ;
var line = " ";


// parsing the Lyrics 
function processData(allText) { // This will only divide with respect to new lines 
    allTextLines = allText.split(/\r\n|\n/);

     next();
   } 
 function next()
 {
for (i=0;i<allTextLines.length;i++)
{
if (allTextLines[i].search(/^(\[)(\d*)(:)(.*)(\])(.*)/i)>=0 )// any line without the prescribed format wont enter this loop 
{
    line = allTextLines[i].match(/^(\[)(\d*)(:)(.*)(\])(.*)/i);
        tim[i] = (parseInt(line[2])*60)+ parseInt(line[4]); // will give seconds 
        lyrics[i]= line[6] ;//will give lyrics 

 }
 }  

  }

Have you finally developed anything where the parser is used? Could you please post the link with demo? — LA_, Jan 08 '15 at 20:14
Yes I have used the parser to make an html player! But it was for a commercial project though. — Capt, Jan 15 '15 at 11:08
Thanks a lot! I only used the processData() and next() functions in combination with loadStrings() function of P5.js loading a LRC file. — Joep, Jul 20 '19 at 00:17

score 0 · Answer 2 · answered Jul 15 '16 at 04:01

Code php : with format

public function get_lrc_song($song) {
    $lyrics_file = $song ['lyrics_file'];
    $json = curlClass::getInstance ( true )->fetchURL ( $lyrics_file );
    $content = explode ( "\n", $json );
    $regix = "$\][^>]+$";
    $result = "";
    foreach ( $content as $item ) {
        $isHas = preg_match ( $regix, $item, $data );
        $dt = str_replace ( "]", "", $data[0] );
        if ($dt != ""){
            $result .= $dt . "\n";
        }
    }
    echo $result;
}

score 0 · Answer 3 · answered Aug 07 '22 at 16:31

I've made an plugin related to this which you can find here There is an tutorial on how to use this and also i think this is most probably the simplest one I've seen while researching about this topic. there is another lrc-parser for this purpose, I've tried it but, it lack some features like playing on command and other necessary features. So i made them all the code looks like this:

//view the tutorial of this usage on https://multimentality.000webhostapp.com/others
var lyricPlayer = {
"set_divval":function(){var all_lyrics = "";var mose;if(lyricPlayer.Mode=="Long"){mose="block"}else if(lyricPlayer.Mode=="Line"){mose="none"}else{alert("mode property: undefined value. lyricPlayer.Mode has two values 'Long' and 'Line'");mose="block"}for(let y=lyricPlayer.countt;y<lyricPlayer.lyrics.length;y++){all_lyrics+=`<span id='lyricsItem_${lyricPlayer.tim[y]}' class='lyricsItem_class' style='display:${mose};'>${lyricPlayer.lyrics[y]}</span>`;lyricPlayer.tmp_count=lyricPlayer.countt;lyricPlayer.main_dict[lyricPlayer.tim[y]]=lyricPlayer.tmp_count;lyricPlayer.tmp_count++;}document.getElementById('lyrics_playerMain').innerHTML=all_lyrics;},
"processData":function(allText){lyricPlayer.allTextLines = allText.split(/\r\n|\n/);lyricPlayer.next();},
"next":function()
 {for (i=0;i<lyricPlayer.allTextLines.length;i++){if (lyricPlayer.allTextLines[i].search(/^(\[)(\d*)(:)(.*)(\])(.*)/i)>=0 ){lyricPlayer.line = lyricPlayer.allTextLines[i].match(/^(\[)(\d*)(:)(.*)(\])(.*)/i);lyricPlayer.tim[i] = (parseInt(lyricPlayer.line[2])*60)+ parseInt(lyricPlayer.line[4]);lyricPlayer.lyrics[i]= lyricPlayer.line[6] ;}else{lyricPlayer.countt++;}}lyricPlayer.set_divval();},
 "set_scview":function(id){if(lyricPlayer.Mode=="Long"){var classes = document.getElementsByClassName("lyricsItem_class");for(let u=0;u<classes.length;u++){classes[u].style.color=lyricPlayer.Tcolor;}document.getElementById(`lyricsItem_${id}`).style.color=lyricPlayer.Scolor;var element = document.getElementById(`lyricsItem_${id}`);element.scrollIntoView({behavior: 'smooth',block: 'start'});}if(lyricPlayer.Mode=="Line"){var classes = document.getElementsByClassName("lyricsItem_class");
  for(let u=0;u<classes.length;u++){
    classes[u].style.display="none";
    classes[u].style.color=lyricPlayer.Tcolor;}document.getElementById(`lyricsItem_${id}`).style.color=lyricPlayer.Scolor;document.getElementById(`lyricsItem_${id}`).style.display="block";}},
"change_lrc":function(elem){var time = parseInt(elem.currentTime);if(lyricPlayer.main_dict[time]!=undefined){lyricPlayer.set_scview(time)}},
"allTextLines":"",
"lyrics":[],
"tim":[],
"main_dict":{},
"h_lyrics":"",
"countt":0,
"Scolor":"white",
"line":"",
"tmp_count":0,
"Mode":"Long",
"Tcolor":document.getElementById("lyrics_playerMain").style.color,
"setLyrics":function(val){lyricPlayer.h_lyrics=val;lyricPlayer.main_dict={};lyricPlayer.countt=0;lyricPlayer.tim=[];lyricPlayer.lyrics=[];lyricPlayer.allTextLines="";lyricPlayer.processData(lyricPlayer.h_lyrics);lyricPlayer.tmp_count=lyricPlayer.countt;}
}

this works totally fine and perfect

Any JavaScript parser for .lrc?

3 Answers3