add lyrics toggles

This commit is contained in:
vapormusic 2021-12-25 15:40:22 +07:00
parent 211453512b
commit 6540825985
3 changed files with 315 additions and 23 deletions

View file

@ -29,7 +29,9 @@ const configSchema = {
}, },
"lyrics": { "lyrics": {
"enable_mxm": false, "enable_mxm": false,
"mxm_language": "en" "mxm_karaoke" : false,
"mxm_language": "en",
"enable_yt": false,
}, },
"lastfm": { "lastfm": {
"enabled": false, "enabled": false,

View file

@ -1465,7 +1465,10 @@ const app = new Vue({
console.log("mt",musicType) console.log("mt",musicType)
if (musicType === "musicVideo") { if (musicType === "musicVideo") {
this.loadYTLyrics();} else { this.loadYTLyrics();} else {
this.loadMXM();} if(app.cfg.lyrics.enable_mxm){
this.loadMXM();
} else {this.loadAMLyrics();}
}
}, },
loadAMLyrics() { loadAMLyrics() {
const songID = (this.mk.nowPlayingItem != null) ? this.mk.nowPlayingItem["_songId"] ?? -1 : -1; const songID = (this.mk.nowPlayingItem != null) ? this.mk.nowPlayingItem["_songId"] ?? -1 : -1;
@ -1500,8 +1503,8 @@ const app = new Vue({
if (result.length > 0) { if (result.length > 0) {
var rawtime = this.toMS(result[0].duration_raw) var rawtime = this.toMS(result[0].duration_raw)
var ytid = result[0]['id']['videoId']; var ytid = result[0]['id']['videoId'];
if (Math.abs(parseInt(rawtime) - time) > 5) { if (app.cfg.lyrics.enable_yt) {
loadYT(ytid, "en") loadYT(ytid, app.cfg.lyrics.mxm_language ?? "en")
} else { app.loadMXM() } } else { app.loadMXM() }
} else { app.loadMXM() } } else { app.loadMXM() }
@ -1558,7 +1561,7 @@ const app = new Vue({
const time = encodeURIComponent((this.mk.nowPlayingItem != null) ? (Math.round((this.mk.nowPlayingItem.attributes["durationInMillis"] ?? -1000) / 1000) ?? -1) : -1); const time = encodeURIComponent((this.mk.nowPlayingItem != null) ? (Math.round((this.mk.nowPlayingItem.attributes["durationInMillis"] ?? -1000) / 1000) ?? -1) : -1);
var lrcfile = ""; var lrcfile = "";
var richsync = []; var richsync = [];
const lang = "en" // translation language const lang = app.cfg.lyrics.mxm_language // translation language
function revisedRandId() { function revisedRandId() {
return Math.random().toString(36).replace(/[^a-z]+/g, '').substr(2, 10); return Math.random().toString(36).replace(/[^a-z]+/g, '').substr(2, 10);
} }
@ -1609,8 +1612,9 @@ const app = new Vue({
function getMXMSubs(track, artist, token, lang, time) { function getMXMSubs(track, artist, token, lang, time) {
var usertoken = encodeURIComponent(token); var usertoken = encodeURIComponent(token);
var richsyncQuery = (app.cfg.lyrics.mxm_karaoke) ? "&optional_calls=track.richsync" : ""
var timecustom = (!time || (time && time < 0)) ? '' : `&f_subtitle_length=${time}&q_duration=${time}&f_subtitle_length_max_deviation=40`; var timecustom = (!time || (time && time < 0)) ? '' : `&f_subtitle_length=${time}&q_duration=${time}&f_subtitle_length_max_deviation=40`;
var url = "https://apic-desktop.musixmatch.com/ws/1.1/macro.subtitles.get?format=json&namespace=lyrics_richsynched&optional_calls=track.richsync&subtitle_format=lrc&q_artist=" + artist + "&q_track=" + track + "&usertoken=" + usertoken + timecustom + "&app_id=web-desktop-app-v1.0&t=" + revisedRandId(); var url = "https://apic-desktop.musixmatch.com/ws/1.1/macro.subtitles.get?format=json&namespace=lyrics_richsynched"+ richsyncQuery +"&subtitle_format=lrc&q_artist=" + artist + "&q_track=" + track + "&usertoken=" + usertoken + timecustom + "&app_id=web-desktop-app-v1.0&t=" + revisedRandId();
var req = new XMLHttpRequest(); var req = new XMLHttpRequest();
req.overrideMimeType("application/json"); req.overrideMimeType("application/json");
req.open('GET', url, true); req.open('GET', url, true);
@ -1680,7 +1684,7 @@ const app = new Vue({
}); });
app.lyrics = preLrc; app.lyrics = preLrc;
} }
if (lrcfile != null && lrcfile != '') { if (lrcfile != null && lrcfile != '' && lang != "disabled") {
// load translation // load translation
getMXMTrans(id, lang, token); getMXMTrans(id, lang, token);
} else { } else {

View file

@ -79,6 +79,308 @@
</select> </select>
</div> </div>
</div> </div>
<div class="md-option-header">
<span>Lyrics</span>
</div>
<div class="md-option-line">
<div class="md-option-segment">
Enable Musixmatch Lyrics
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.lyrics.enable_mxm" switch/>
</div>
</div>
<div class="md-option-line" v-if="app.cfg.lyrics.enable_mxm">
<div class="md-option-segment">
Enable Karaoke Mode (Musixmatch only)
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.lyrics.mxm_karaoke" switch/>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
Musixmatch Translation Preferred Language
</div>
<div class="md-option-segment md-option-segment_auto">
<select class="md-select" v-model="app.cfg.lyrics.mxm_language">
<option value='disabled'>Disabled</option>
<option value='ab'>Abkhazian</option>
<option value='aa'>Afar</option>
<option value='af'>Afrikaans</option>
<option value='ak'>Akan</option>
<option value='sq'>Albanian</option>
<option value='am'>Amharic</option>
<option value='ar'>Arabic</option>
<option value='an'>Aragonese</option>
<option value='hy'>Armenian</option>
<option value='as'>Assamese</option>
<option value='a5'>Assamese-romaji</option>
<option value='a3'>Asturian</option>
<option value='av'>Avaric</option>
<option value='ae'>Avestan</option>
<option value='ay'>Aymara</option>
<option value='az'>Azerbaijani</option>
<option value='bm'>Bambara</option>
<option value='ba'>Bashkir</option>
<option value='eu'>Basque</option>
<option value='b1'>Bavarian</option>
<option value='be'>Belarusian</option>
<option value='bn'>Bengali</option>
<option value='b5'>Bengali-romaji</option>
<option value='bh'>Bihari languages</option>
<option value='b3'>Bishnupriya</option>
<option value='bi'>Bislama</option>
<option value='bs'>Bosnian</option>
<option value='br'>Breton</option>
<option value='bg'>Bulgarian</option>
<option value='my'>Burmese</option>
<option value='ca'>Catalan</option>
<option value='c2'>Cebuano</option>
<option value='b2'>Central bikol</option>
<option value='c3'>Central kurdish</option>
<option value='ch'>Chamorro</option>
<option value='c1'>Chavacano</option>
<option value='ce'>Chechen</option>
<option value='ny'>Chichewa</option>
<option value='zh'>Chinese (simplified)</option>
<option value='z1'>Chinese (traditional)</option>
<option value='rz'>Chinese-romaji</option>
<option value='cu'>Church slavic</option>
<option value='cv'>Chuvash</option>
<option value='kw'>Cornish</option>
<option value='co'>Corsican</option>
<option value='cr'>Cree</option>
<option value='c4'>Creoles and pidgins</option>
<option value='c5'>Creoles and pidgins, english based</option>
<option value='c6'>Creoles and pidgins, french-based</option>
<option value='c7'>Creoles and pidgins, portuguese-based</option>
<option value='hr'>Croatian</option>
<option value='cs'>Czech</option>
<option value='da'>Danish</option>
<option value='d1'>Dimli (individual language)</option>
<option value='dv'>Divehi</option>
<option value='d3'>Dotyali</option>
<option value='nl'>Dutch</option>
<option value='dz'>Dzongkha</option>
<option value='m2'>Eastern mari</option>
<option value='a2'>Egyptian arabic</option>
<option value='e1'>Emilian-romagnol</option>
<option value='en'>English</option>
<option value='m6'>Erzya</option>
<option value='eo'>Esperanto</option>
<option value='et'>Estonian</option>
<option value='ee'>Ewe</option>
<option value='fo'>Faroese</option>
<option value='h1'>Fiji hindi</option>
<option value='fj'>Fijian</option>
<option value='f1'>Filipino</option>
<option value='fi'>Finnish</option>
<option value='fr'>French</option>
<option value='f2'>Frisian, northern</option>
<option value='fy'>Frisian, western</option>
<option value='ff'>Fulah</option>
<option value='gl'>Galician</option>
<option value='lg'>Ganda</option>
<option value='ka'>Georgian</option>
<option value='de'>German</option>
<option value='n2'>German, low</option>
<option value='g1'>Goan konkani</option>
<option value='el'>Greek</option>
<option value='e2'>Greek-romaji</option>
<option value='kl'>Greenlandic</option>
<option value='gn'>Guarani</option>
<option value='gu'>Gujarati</option>
<option value='g2'>Gujarati-romaji</option>
<option value='ht'>Haitian creole</option>
<option value='ha'>Hausa</option>
<option value='he'>Hebrew</option>
<option value='hz'>Herero</option>
<option value='hi'>Hindi</option>
<option value='h3'>Hindi-romaji</option>
<option value='ho'>Hiri motu</option>
<option value='hu'>Hungarian</option>
<option value='is'>Icelandic</option>
<option value='io'>Ido</option>
<option value='ig'>Igbo</option>
<option value='i1'>Iloko</option>
<option value='id'>Indonesian</option>
<option value='ia'>Interlingua</option>
<option value='ie'>Interlingue</option>
<option value='iu'>Inuktitut</option>
<option value='ik'>Inupiaq</option>
<option value='ga'>Irish</option>
<option value='it'>Italian</option>
<option value='ja'>Japanese</option>
<option value='rj'>Japanese-romaji</option>
<option value='jv'>Javanese</option>
<option value='x1'>Kalmyk</option>
<option value='kn'>Kannada</option>
<option value='k2'>Kannada-romaji</option>
<option value='kr'>Kanuri</option>
<option value='k1'>Karachay-balkar</option>
<option value='ks'>Kashmiri</option>
<option value='kk'>Kazakh</option>
<option value='km'>Khmer, central</option>
<option value='ki'>Kikuyu</option>
<option value='rw'>Kinyarwanda</option>
<option value='ky'>Kirghiz</option>
<option value='kv'>Komi</option>
<option value='kg'>Kongo</option>
<option value='ko'>Korean</option>
<option value='rk'>Korean-romaji</option>
<option value='kj'>Kuanyama</option>
<option value='ku'>Kurdish</option>
<option value='lo'>Lao</option>
<option value='la'>Latin</option>
<option value='lv'>Latvian</option>
<option value='l1'>Lezghian</option>
<option value='li'>Limburgish</option>
<option value='ln'>Lingala</option>
<option value='lt'>Lithuanian</option>
<option value='j1'>Lojban</option>
<option value='l2'>Lombard</option>
<option value='lu'>Luba-katanga</option>
<option value='lb'>Luxembourgish</option>
<option value='mk'>Macedonian</option>
<option value='m1'>Maithili</option>
<option value='mg'>Malagasy</option>
<option value='ms'>Malay</option>
<option value='ml'>Malayalam</option>
<option value='m8'>Malayalam-romaji</option>
<option value='mt'>Maltese</option>
<option value='gv'>Manx</option>
<option value='mi'>Maori</option>
<option value='mr'>Marathi</option>
<option value='m9'>Marathi-romaji</option>
<option value='mh'>Marshallese</option>
<option value='m7'>Mazanderani</option>
<option value='m3'>Minangkabau</option>
<option value='x2'>Mingrelian</option>
<option value='m5'>Mirandese</option>
<option value='mo'>Moldavian</option>
<option value='mn'>Mongolian</option>
<option value='n4'>Nahuatl</option>
<option value='na'>Nauru</option>
<option value='nv'>Navajo</option>
<option value='nd'>Ndebele, north</option>
<option value='nr'>Ndebele, south</option>
<option value='ng'>Ndonga</option>
<option value='n1'>Neapolitan</option>
<option value='n3'>Nepal bhasa</option>
<option value='ne'>Nepali</option>
<option value='n5'>Nepali-romaji</option>
<option value='l3'>Northern luri</option>
<option value='no'>Norwegian</option>
<option value='nb'>Norwegian bokmål</option>
<option value='nn'>Norwegian nynorsk</option>
<option value='oc'>Occitan</option>
<option value='oj'>Ojibwa</option>
<option value='or'>Oriya</option>
<option value='o1'>Oriya-romaji</option>
<option value='om'>Oromo</option>
<option value='os'>Ossetian</option>
<option value='pi'>Pali</option>
<option value='p1'>Pampanga</option>
<option value='pa'>Panjabi</option>
<option value='p5'>Panjabi-romaji</option>
<option value='fa'>Persian</option>
<option value='p2'>Pfaelzisch</option>
<option value='p3'>Piemontese</option>
<option value='pl'>Polish</option>
<option value='pt'>Portuguese</option>
<option value='ps'>Pushto</option>
<option value='qu'>Quechua</option>
<option value='ro'>Romanian</option>
<option value='rm'>Romansh</option>
<option value='rn'>Rundi</option>
<option value='b4'>Russia buriat</option>
<option value='ru'>Russian</option>
<option value='r2'>Russian-romaji</option>
<option value='r1'>Rusyn</option>
<option value='se'>Sami, northern</option>
<option value='sm'>Samoan</option>
<option value='sg'>Sango</option>
<option value='sa'>Sanskrit</option>
<option value='s4'>Sanskrit-romaji</option>
<option value='sc'>Sardinian</option>
<option value='s3'>Scots</option>
<option value='gd'>Scottish gaelic</option>
<option value='sr'>Serbian</option>
<option value='sh'>Serbo-croatian</option>
<option value='sn'>Shona</option>
<option value='ii'>Sichuan yi</option>
<option value='s2'>Sicilian</option>
<option value='sd'>Sindhi</option>
<option value='si'>Sinhala</option>
<option value='sk'>Slovak</option>
<option value='sl'>Slovenian</option>
<option value='so'>Somali</option>
<option value='d2'>Sorbian, lower</option>
<option value='h2'>Sorbian, upper</option>
<option value='st'>Sotho, southern</option>
<option value='a4'>South azerbaijani</option>
<option value='es'>Spanish</option>
<option value='su'>Sundanese</option>
<option value='sw'>Swahili</option>
<option value='ss'>Swati</option>
<option value='sv'>Swedish</option>
<option value='tl'>Tagalog</option>
<option value='ty'>Tahitian</option>
<option value='tg'>Tajik</option>
<option value='ta'>Tamil</option>
<option value='t2'>Tamil-romaji</option>
<option value='tt'>Tatar</option>
<option value='te'>Telugu</option>
<option value='t3'>Telugu-romaji</option>
<option value='th'>Thai</option>
<option value='t4'>Thai-romaji</option>
<option value='bo'>Tibetan</option>
<option value='ti'>Tigrinya</option>
<option value='to'>Tonga (tonga islands)</option>
<option value='a1'>Tosk albanian</option>
<option value='ts'>Tsonga</option>
<option value='tn'>Tswana</option>
<option value='tr'>Turkish</option>
<option value='tk'>Turkmen</option>
<option value='t1'>Tuvinian</option>
<option value='tw'>Twi</option>
<option value='ug'>Uighur</option>
<option value='uk'>Ukrainian</option>
<option value='ur'>Urdu</option>
<option value='u1'>Urdu-romaji</option>
<option value='uz'>Uzbek</option>
<option value='ve'>Venda</option>
<option value='v1'>Venetian</option>
<option value='v2'>Veps</option>
<option value='vi'>Vietnamese</option>
<option value='v3'>Vlaams</option>
<option value='vo'>Volapük</option>
<option value='wa'>Walloon</option>
<option value='w1'>Waray</option>
<option value='cy'>Welsh</option>
<option value='m4'>Western mari</option>
<option value='p4'>Western panjabi</option>
<option value='wo'>Wolof</option>
<option value='w2'>Wu chinese</option>
<option value='xh'>Xhosa</option>
<option value='s1'>Yakut</option>
<option value='yi'>Yiddish</option>
<option value='yo'>Yoruba</option>
<option value='y1'>Yue chinese</option>
<option value='za'>Zhuang</option>
<option value='zu'>Zulu</option>
</select>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
Enable Youtube Lyrics for Music Videos
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.lyrics.enable_yt" switch/>
</div>
</div>
<div class="md-option-header"> <div class="md-option-header">
<span>Unfinished / Non Functional</span> <span>Unfinished / Non Functional</span>
</div> </div>
@ -166,22 +468,6 @@
</select> </select>
</div> </div>
</div> </div>
<div class="md-option-line">
<div class="md-option-segment">
Enable Musixmatch Lyrics
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" switch/>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
Musixmatch Preferred Language
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" switch/>
</div>
</div>
<div class="md-option-line"> <div class="md-option-line">
<div class="md-option-segment"> <div class="md-option-segment">
Close Button Behavior Close Button Behavior