Started implementing Link Analyzer's tab

public/index.html

@@ -257,7 +257,24 @@ <h1>Favorites</h1>
 					</div>
 
 					<div id="analyzer_tab" class="main_tabcontent">
-						<h1>Link Analyzer</h1>
+            <h1>Link Analyzer</h1>
+            <h1>{{ title }}</h1>
+						<h2>{{ subtitle }}</h2>
+            <table>
+              <tr v-if="data.isrc"><td>ISRC</td><td>{{ data.isrc }}</td></tr>
+              <tr v-if="data.upc"><td>UPC</td><td>{{ data.upc }}</td></tr>
+              <tr v-if="data.duration"><td>Duration</td><td>{{ convertDuration(data.duration) }}</td></tr>
+              <tr v-if="data.disk_number"><td>Disk Number</td><td>{{ data.disk_number }}</td></tr>
+              <tr v-if="data.track_position"><td>Track Number</td><td>{{ data.track_position }}</td></tr>
+              <tr v-if="data.release_date"><td>Release Date</td><td>{{ data.release_date }}</td></tr>
+              <tr v-if="data.bpm"><td>BPM</td><td>{{ data.bpm }}</td></tr>
+              <tr v-if="data.label"><td>Label</td><td>{{ data.label }}</td></tr>
+              <tr v-if="data.record_type"><td>Record Type</td><td>{{ data.record_type }}</td></tr>
+              <tr v-if="data.genres && data.genres.data.length"><td>Genres</td><td>{{ data.genres.data.map(x => x.name).join("; ") }}</td></tr>
+            </table>
+            <div v-if="countries.length">
+              <p v-for="country in countries">{{ country[0] }} - {{ country[1] }}</p>
+            </div>
 					</div>
 
 					<div id="settings_tab" class="main_tabcontent fixed_footer">

public/js/modules/main-search.js

@@ -3,6 +3,7 @@ import { artistView, albumView, playlistView } from './tabs.js'
 import Downloads from './downloads.js'
 import QualityModal from './quality-modal.js'
 import { playPausePreview, previewMouseEnter, previewMouseLeave } from './track-preview.js'
+import Utils from './utils.js'
 
 const MainSearch = new Vue({
 	data: {
@@ -87,20 +88,8 @@ const MainSearch = new Vue({
 			e.preventDefault()
 			QualityModal.open(e.currentTarget.dataset.link)
 		},
-		numberWithDots(x) {
-			return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, '.')
-		},
-		convertDuration(duration) {
-			//convert from seconds only to mm:ss format
-			let mm, ss
-			mm = Math.floor(duration / 60)
-			ss = duration - mm * 60
-			//add leading zero if ss < 0
-			if (ss < 10) {
-				ss = '0' + ss
-			}
-			return mm + ':' + ss
-		},
+    numberWithDots: Utils.numberWithDots,
+		convertDuration: Utils.convertDuration,
 		search(type) {
 			socket.emit('search', {
 				term: this.results.query,

public/js/modules/search.js

@@ -3,6 +3,7 @@ import Utils from './utils.js'
 import QualityModal from './quality-modal.js'
 import Downloads from './downloads.js'
 import { socket } from './socket.js'
+import { analyzeLink } from './tabs.js'
 
 export default class Search {
 	static linkListeners() {
@@ -31,7 +32,11 @@ export default class Search {
 				if (e.ctrlKey) {
 					QualityModal.open(term)
 				} else {
-					Downloads.sendAddToQueue(term)
+          if (window.main_selected  == 'analyzer_tab'){
+            analyzeLink(term)
+          }else{
+            Downloads.sendAddToQueue(term)
+          }
 				}
 			} else {
 				if (term != MainSearch.query || main_selected == 'search_tab') {

public/js/modules/tabs.js

@@ -1,5 +1,6 @@
 import ArtistTab from './artist-tab.js'
 import TracklistTab from './tracklist-tab.js'
+import LinkAnalyzerTab from './link-analyzer-tab.js'
 import { socket } from './socket.js'
 import SettingsTab from './settings-tab.js'
 import MainSearch from './main-search.js'
@@ -34,6 +35,12 @@ export function playlistView(ev) {
 	showTab('playlist', id)
 }
 
+export function analyzeLink(link) {
+  console.log("Analyzing: "+link)
+  LinkAnalyzerTab.reset()
+  socket.emit('analyzeLink', link)
+}
+
 export class Tabs {
 	static linkListeners() {
 		document.getElementById('search_tab').addEventListener('click', handleTabClick)

public/js/modules/utils.js

@@ -27,6 +27,10 @@ function convertDurationSeparated(duration) {
 	return [hh, mm, ss]
 }
 
+function numberWithDots(x) {
+  return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, '.')
+}
+
 // On scroll event, returns currentTarget = null
 // Probably on other events too
 function debounce(func, wait, immediate) {
@@ -49,5 +53,6 @@ export default {
 	isValidURL,
 	convertDuration,
 	convertDurationSeparated,
+  numberWithDots,
 	debounce
 }