disable last_fm api, add generating last.fm links by radio.js, some changes in css

2020-04-05 01:16:12 +03:00
parent 71e751e48c
commit 9782e18724
4 changed files with 196 additions and 41 deletions
--- a/css/style.css
+++ b/css/style.css
@@ -21,6 +21,7 @@ body {
  height: 350px;
  background-color: rgba(0, 0, 0, 0.7);
  border-radius: 10px;
+  padding: 0 5px;
  color: #fff;
 }

@@ -30,7 +31,7 @@ body {
 }

 .tagA {
-  width: 400px;
+  width: 100%;
 	height: 20px;
 	border-radius: 5px 5px 0 0;
 	border: #f54e4e;
@@ -50,7 +51,7 @@ body {
 }

 .tagB {
-  width: 400px;
+  width: 100%;
 	height: 20px;
 	border-radius: 0;
 	border: #f54e4e;
@@ -64,7 +65,7 @@ body {
 }

 .tagC {
-  width: 400px;
+  width: 100%;
 	height: 20px;
 	border-radius: 0;
 	border: #f54e4e;
@@ -84,8 +85,8 @@ body {
 }

 .tagD {
-  width: 400px;
-	height: 20px;
+  width: 100%;
+	//height: 20px;
 	border-radius: 0 0 5px 5px;
 	border: #f54e4e;
 	background-color: #fff;
@@ -158,3 +159,49 @@ h1 {
 DIV {
  text-align: center
 }
+
+@-webkit-keyframes scroll {
+    0% {
+        -webkit-transform: translate(0, 0);
+        transform: translate(0, 0);
+    }
+    100% {
+        -webkit-transform: translate(-100%, 0);
+        transform: translate(-100%, 0)
+    }
+}
+
+@-moz-keyframes scroll {
+    0% {
+        -moz-transform: translate(0, 0);
+        transform: translate(0, 0);
+    }
+    100% {
+        -moz-transform: translate(-100%, 0);
+        transform: translate(-100%, 0)
+    }
+}
+
+@keyframes scroll {
+    0% {
+        transform: translate(0, 0);
+    }
+    100% {
+        transform: translate(-100%, 0)
+    }
+}
+
+.marquee {
+  display: block;
+  width: 100%;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+.marquee span {
+  display: inline-block;
+  padding-left: 100%;
+  -webkit-animation: scroll 15s infinite linear;
+  -moz-animation: scroll 15s infinite linear;
+  animation: scroll 15s infinite linear;
+}
--- a/index.html
+++ b/index.html
@@ -11,8 +11,10 @@
 		integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
 		crossorigin="anonymous">
 	</script>
+<!--
 	<script src="js/lastfm.api.md5.js" type="text/javascript"></script>
 	<script src="js/lastfm.api.js" type="text/javascript"></script>
+-->
 </head>

 <body>
@@ -30,13 +32,19 @@
 					Artist
 				</button>
 			</form>
-			<div id="artistName" class="tagB">ArtistName</div>
+			<div id="artistName" class="tagB">
+				ArtistName
+			</div>
 			<form name="songURL" action="" target="_blank">
 				<button class="tagC">
 					Song
 				</button>
 			</form>
-			<div id="songName" class="tagD">SongName</div>
+			<div id="songName" class="tagD marquee">
+				<span>
+					SongName
+				</span>
+			</div>
 		</div>

 		<br>
--- a/js/radio.js
+++ b/js/radio.js
@@ -1,8 +1,3 @@
-var lastfm = new LastFM({
-  apiKey    : '59ab8307ec00a5ec90574ac91885798e',
-  apiSecret : 'e09bec215fdc3100ff998167e5b401f8',
-});
-
 var MPDartist, MPDsong, MPDfile, MPDCurr;
 MPDartist = MPDsong = MPDfile = MPDCurr = 'empty';

@@ -27,22 +22,20 @@ function show()
    .then(function(temp){
      // Получение информации из файла
      var array = temp.toString().split("\n");
-      // вывод в консоль информации о файле
-      /*
-      for(i in array) {
-        console.log(array[i]);} */

      // .replace - удаление пробелов в начале и конце строки
      MPDartist = array[0];
-      MPDsong = array[1];
-      MPDfile = array[2].replace(/^vk_kun\//,'').replace(/\.mp3/,'');
+      MPDsong   = array[1];
+      MPDfile   = array[2].replace(/^vk_kun\//,'').replace(/\.mp3/,'');

      if (MPDartist == '' && MPDCurr != MPDfile) {
        MPDartist = MPDfile.replace(/\s-.*/,'').replace(/^\s*/,'').replace(/\s*$/,'');
        MPDsong = MPDfile.replace(/^.*\s-/,'').replace(/^\s*/,'').replace(/\s*$/,'');
-        getLastFM_info(MPDartist, MPDsong);
+        getArtistURL(MPDartist);
+        getSongURL(MPDartist, MPDsong);
      } else if (MPDCurr != MPDfile) {
-          getLastFM_info(MPDartist, MPDsong);
+          getArtistURL(MPDartist);
+          getSongURL(MPDartist, MPDsong);
        }
      MPDCurr = MPDfile;
    });
@@ -55,26 +48,21 @@ $(document).ready(
  }
 );

-function getLastFM_info(FMartist, FMsong)
+// Процедура для получения ссылки на артиста в last.fm
+function getArtistURL(MPDartist)
 {
-  lastfm.artist.getInfo({artist: FMartist}, {success: function(data){
-    console.log(data.artist.url);
-    // формируем ссылку на артиста в LastFM
-    document.querySelector('form[name="artistURL"]').setAttribute('action', data.artist.url);
-    // выводим название артиста
-    $("#artistName").text(FMartist);
-    }, error: function(code, message){
-    console.log('Error #'+code+': '+message);}
-  });
-
-  lastfm.track.getInfo({track: FMsong, artist: FMartist}, {success: function(data){
-    console.log(data.track.url);
-    // формируем ссылку на артиста в LastFM
-    document.querySelector('form[name="songURL"]').setAttribute('action', data.track.url);
-    // выводим название трека
-    $("#songName").text(FMsong);
-    }, error: function(code, message){
-    console.log('Error #'+code+': '+message);}
-  });
-
+  $("#artistName").text(MPDartist);
+  MPDartist = encodeURI("https://www.last.fm/music/"+MPDartist.replace(/\s+/g,'+'));
+  document.querySelector('form[name="artistURL"]').setAttribute('action', MPDartist);
+  console.log(MPDartist)
+}
+
+// Процедура для получения ссылки на песню в last.fm
+function getSongURL(MPDartist, MPDsong)
+{
+  $("#songName span").text(MPDsong);
+  MPDartist = MPDartist.replace(/\s+/g,'+');
+  MPDsong = encodeURI("https://www.last.fm/music/"+MPDartist+"/_/"+MPDsong.replace(/\s+/g,'+'));
+  document.querySelector('form[name="songURL"]').setAttribute('action', MPDsong);
+  console.log(MPDsong)
 }
--- a/js/radio_last_fm.js
+++ b/js/radio_last_fm.js
@@ -0,0 +1,112 @@
+var lastfm = new LastFM({
+  apiKey    : '59ab8307ec00a5ec90574ac91885798e',
+  apiSecret : 'e09bec215fdc3100ff998167e5b401f8',
+});
+
+var MPDartist, MPDsong, MPDfile, MPDCurr;
+MPDartist = MPDsong = MPDfile = MPDCurr = 'empty';
+
+function show()
+{
+
+  let xmlHttpRequest = function() {
+    return new Promise(function(resolve, reject) {
+      var xhr = new XMLHttpRequest();
+      xhr.open('GET', '../trackname');
+      var temp = 'empty';
+      xhr.onload = function (e) {
+        if (xhr.readyState == 4 && xhr.status == 200) {
+            resolve(xhr.responseText);
+        }
+      };
+      xhr.send();
+    });
+  };
+
+  xmlHttpRequest()
+    .then(function(temp){
+      // Получение информации из файла
+      var array = temp.toString().split("\n");
+      // вывод в консоль информации о файле
+      /*
+      for(i in array) {
+        console.log(array[i]);} */
+
+      // .replace - удаление пробелов в начале и конце строки
+      MPDartist = array[0];
+      MPDsong   = array[1];
+      MPDfile   = array[2].replace(/^vk_kun\//,'').replace(/\.mp3/,'');
+/*
+      urlArtist = getArtistURL(MPDartist);
+      console.log(urlArtist);
+      urlSong = getSongURL(MPDartist, MPDsong);
+      console.log(urlSong);
+*/
+      if (MPDartist == '' && MPDCurr != MPDfile) {
+        MPDartist = MPDfile.replace(/\s-.*/,'').replace(/^\s*/,'').replace(/\s*$/,'');
+        MPDsong = MPDfile.replace(/^.*\s-/,'').replace(/^\s*/,'').replace(/\s*$/,'');
+        getArtistURL(MPDartist);
+        getSongURL(MPDartist, MPDsong);
+        //getLastFM_info(MPDartist, MPDsong);
+      } else if (MPDCurr != MPDfile) {
+          getArtistURL(MPDartist);
+          getSongURL(MPDartist, MPDsong);
+          //getLastFM_info(MPDartist, MPDsong);
+        }
+      MPDCurr = MPDfile;
+    });
+}
+
+$(document).ready(
+  () => {
+    show();
+    setInterval(show, 5000);
+  }
+);
+
+/*
+function getLastFM_info(FMartist, FMsong)
+{
+  lastfm.artist.getInfo({artist: FMartist}, {success: function(data){
+    //console.log(data.artist.url);
+    // формируем ссылку на артиста в LastFM
+    document.querySelector('form[name="artistURL"]').setAttribute('action', data.artist.url);
+    // выводим название артиста
+    $("#artistName").text(FMartist);
+    }, error: function(code, message){
+    console.log('Error #'+code+': '+message);}
+  });
+
+  lastfm.track.getInfo({track: FMsong, artist: FMartist}, {success: function(data){
+    //console.log(data.track.url);
+    // формируем ссылку на артиста в LastFM
+    document.querySelector('form[name="songURL"]').setAttribute('action', data.track.url);
+    // выводим название трека
+    $("#songName").text(FMsong);
+    }, error: function(code, message){
+    console.log('Error #'+code+': '+message);}
+  });
+
+}
+*/
+
+// Процедура для получения ссылки на артиста в last.fm
+function getArtistURL(MPDartist)
+{
+  $("#artistName").text(MPDartist);
+  MPDartist = encodeURI("https://www.last.fm/music/"+MPDartist.replace(/\s+/g,'+'));
+  document.querySelector('form[name="artistURL"]').setAttribute('action', MPDartist);
+  console.log(MPDartist)
+  //return encodeURI(MPDartist);
+}
+
+// Процедура для получения ссылки на песню в last.fm
+function getSongURL(MPDartist, MPDsong)
+{
+  $("#songName").text(MPDsong);
+  MPDartist = MPDartist.replace(/\s+/g,'+');
+  MPDsong = encodeURI("https://www.last.fm/music/"+MPDartist+"/_/"+MPDsong.replace(/\s+/g,'+'));
+  document.querySelector('form[name="songURL"]').setAttribute('action', MPDsong);
+  console.log(MPDsong)
+  //return encodeURI(MPDsong);
+}