☰

Beatport Tracklist

Adds a button to quickly copy a tracklist of a release or chart.

  1. // ==UserScript==
  2. // @name         Beatport Tracklist
  3. // @namespace    https://www.dieterholvoet.com/
  4. // @version      1.0
  5. // @description  Adds a button to quickly copy a tracklist of a release or chart.
  6. // @author       Dieter Holvoet
  7. // @match        https://www.beatport.com/*
  8. // @grant        none
  9. // ==/UserScript==
  10.  
  11. (function () {
  12.     'use strict';
  13.  
  14.     function htmlToElement(html) {
  15.         var template = document.createElement('template');
  16.         html = html.trim(); // Never return a text node of whitespace as the result
  17.         template.innerHTML = html;
  18.         return template.content.firstChild;
  19.     }
  20.  
  21.     function copyToClipboard(text) {
  22.         var aux = document.createElement('textarea');
  23.         aux.innerHTML = text;
  24.         document.body.appendChild(aux);
  25.         aux.select();
  26.         document.execCommand('copy');
  27.         document.body.removeChild(aux);
  28.     }
  29.  
  30.     function buildTrackString(element) {
  31.         let title = `${element.querySelector('.buk-track-artists').innerText} - ${element.querySelector('.buk-track-primary-title').innerText}`;
  32.  
  33.         if (element.querySelector('.buk-track-remixed').length) {
  34.             title += ` (${element.querySelector('.buk-track-remixed').innerText})`
  35.         }
  36.  
  37.         return title;
  38.     }
  39.  
  40.     function onMutation() {
  41.         const container = document.querySelector('.interior-release-chart-content-list');
  42.         const existingButton = document.getElementById('copy-tracklist');
  43.  
  44.         if (existingButton || !container) {
  45.             return;
  46.         }
  47.  
  48.         const button = htmlToElement('<button class="button button--option" id="copy-tracklist" style="">Copy tracklist</button>');
  49.  
  50.         button.addEventListener('click', function () {
  51.             const tracklist = Array.from(document.querySelectorAll('.track'))
  52.                 .map(buildTrackString)
  53.                 .join('\n');
  54.  
  55.             copyToClipboard(tracklist);
  56.  
  57.             const oldText = 'Copy tracklist';
  58.             const newText = 'Copied!';
  59.  
  60.             button.innerHTML = newText;
  61.             button.classList.remove('button--option');
  62.  
  63.             window.setTimeout(function () {
  64.                 button.innerHTML = oldText;
  65.                 button.classList.add('button--option');
  66.             }, 1000);
  67.         });
  68.  
  69.         container.appendChild(button);
  70.     };
  71.  
  72.     const observer = new MutationObserver(onMutation);
  73.  
  74.     observer.observe(
  75.         document.querySelector('#pjax-target'),
  76.          { childList: true, subtree: true },
  77.     );
  78.  
  79.     onMutation();
  80. })();