Collect tracks.js

/*****************************
* Collect tracks v.2
* Collecting tracks for the purpose of exporting them into archive
*/

console.clear()
HTMLElement.prototype.$ = HTMLElement.prototype.querySelector
HTMLElement.prototype.$$= HTMLElement.prototype.querySelectorAll
NodeList.prototype.map  = Array.prototype.map;
String.prototype.contains = function(str){ return new RegExp(str).test(this) }


/*
* Makes clipboard (temporary buffer) managment easier
* Usage: new Clipspace().copy('foo') // copies 'foo' string to the clipboard
**/
var Clipspace = class {
      static version = '1.0.0';
      constructor (container) {
        this.container = container || document.body;
        this.id    = 'clipboard-area';
        this.el    =  this.container.querySelector('#'+this.id);
        if (!this.el) {
           this.el =  document.createElement('textarea');
           this.container.appendChild(this.el);
        }

        this.el.style.position  = 'absolute'
        this.el.style.top       = '-9999px';
        this.el.contentEditable = true;
        this.el.id              = this.id;

      }
      copy(text) {
        this.el.value = text
        this.el.select();
        var result = document.execCommand('copy');
        this.el.blur();
        return result
      }
}



var streamTracksClasses = '.trackList__item .trackItem__content';
var likesClasses = '.badgeList__item .playableTile__description';
var collectTracks = function ({ json } = { json: false }){
//       json = true; //output json data

  let body    = document.body;
  var numbers = 1; // the number that specifies start number of the numeration list
  var tracks = [].concat(
    body.$$(streamTracksClasses).map(function(e,i,counter,text,href){ 
    counter = numbers ? (i+numbers)+('    '.slice(0,5-((i+numbers)+'').length)): '';
    href    = e.$$('a')[1].href.split('?')[0];
    name    = e.$$('a')[1].textContent;
    author  = e.$$('a')[0].textContent;
    text    = (name+' - '+author).replace(/"*/g,'').replace(/\s+/g,' ').replace(/^\s*|\s*$/g,'');

    name    = name.replace(/"*/g,'').replace(/\s+/g,' ').replace(/^\s*|\s*$/g,'');
    author  = author.replace(/"*/g,'').replace(/\s+/g,' ').replace(/^\s*|\s*$/g,'');
    return {name: name, author: author, href: href}

    return counter+text+' | '+href
  })
  ,body.$$(likesClasses).map(function(e,i,counter,text,href){ 
    counter = numbers ? (i+numbers)+('    '.slice(0,5-((i+numbers)+'').length)): '';
    href    = e.$$('a')[0].href.split('?')[0];
    name    = e.$$('a')[0].textContent;
    author  = e.$$('a')[1].textContent;
    text    = (name+' - '+author).replace(/"*/g,'').replace(/\s+/g,' ').replace(/^\s*|\s*$/g,'');

    name    = name.replace(/"*/g,'').replace(/\s+/g,' ').replace(/^\s*|\s*$/g,'');
    author  = author.replace(/"*/g,'').replace(/\s+/g,' ').replace(/^\s*|\s*$/g,'');
    return {name: name, author: author, href: href}

    return counter+text+' | '+href
  })
  // YOUTUBE USER Playlist 
  ,body.$$('.pl-video-title a.pl-video-title-link').map(function(e){
   let o = e.innerText.split(/[-:]/)
       return {name: o[0], author: o[1], href: e.href}
  }),
  // YOUTUBE Playlist
  [].slice.call(document.body.$$('ol#playlist-autoscroll-list li'))
  .map(function(track){
      var trackinfo = {};
          trackinfo.href= track.children[1].href;
      var tracktitle = track.$('div h4').textContent.trim().split(' - ')
          trackinfo.author = tracktitle[0];
          trackinfo.name   = tracktitle[1];
      return trackinfo
  }),
  );

  var text = json
  ? JSON.stringify(tracks)
  : tracks.map(function(o,i){
     counter = numbers 
      ? (i+numbers)+('    '.slice(0,5-((i+numbers)+'').length))
      : '';
     return counter+o.author+' - '+o.name+' | '+o.href
  })
  .join('\r\n')+'\r\n'+[tracks.length]+'::Timestamp: '+((new Date).toISOString());
  return text
}
// BUTTON
var Button = function (actionOnClick,name) {
let   style = document.createElement('style')
      style.innerHTML = `
.button-clipboard {
  opacity             : 1;
  cursor              : pointer;
  transform           : perspective(800px) scale(1);
  /* background      : #2D4059; */
  /* box-shadow          : 0 0 .16rem rgba(0, 0, 0, 0.60); */
  border-radius       : 3px;
  border-color        : hsl(20, 90%, 80%);
  text-transform      : uppercase;
  color               : #333;
  /* font-size           : 14px;min-width: 6rem;font-weight: bold;text-align: center;  */
  -webkit-user-select : none;
  z-index             : 9999;
  transform-origin    : center; 
  transition: 
    background-color .5s ease
   ,box-shadow       .5s ease
   ,transform        .5s ease
   ,opacity          .5s ease;
}

.button-clipboard:hover {
  opacity    : 1; transform: scale(1.1);
  background : #EA5455;
  box-shadow : 0 0 1.28rem rgba(0, 0, 0, 0.20);
}

.button-clipboard:active {
  transform       : scale(1);
  background      : #2D4059;
}
`         
  var button = document.createElement('button');
      button.appendChild(style)
      button.appendChild(document.createTextNode(name ||'COPY THAT'));
      button.className = 'button-clipboard'
      button.callback = actionOnClick;
      button.text     = 'click to get the text ...';
    return button
}
Button.version = '1.0.0';



function initCollectTracks (cb) {
if (!cb) throw 'Clipboard: callback returning text is required!';
  var clipspace = new Clipspace()
      window._previous_button && window._previous_button.remove();
  let button = new Button(() => cb(),'COPY TRACKLIST');
      button.addEventListener('click',function (e) {
            console.clear()
        var text   = this.callback(e);

        var result = clipspace.copy(text);
            
            if(result){
              console.log('INSERTION SUCCESS!', '\n', text); 
            } else {
              console.log('INSERTION FAILURE!')
            }



      }.bind(button))
      window._previous_button = button;

  let isYouTube = document.head.$('title').textContent.contains('YouTube')
      button.className = isYouTube 
      ? 'yt-uix-button yt-uix-button-size-default yt-uix-button-default'
      : 'button-clipboard sc-button sc-button-more sc-button-medium sc-button-responsive'
  
  let actionpanel = document.body.$('.listenEngagement__actions .sc-button-group') // SoundCloud
      || document.body.$('.playlist-actions') 
      || document.body.$('.collectionSection__top') // 
      || document.body.$('#watch7-user-header') // YouTube
      actionpanel.appendChild(button);
      
      button.click()
      return button
};

// text = JSON.stringify(tracks);
initCollectTracks(collectTracks).text

/*
// Experimental way to obain tracks: 
(async function(){
ids = '607191039,591914019,598833477,580020018,310894466,218978539,596759448,319313530,606338808,600489744,606738606,574086618,603871446,605550504,583140363,605598723,570535992,609723138,609615957,609615930,607097775';
url = new URL('https://api-v2.soundcloud.com/tracks?client_id=OF0BvegIVmL2cWGUQyMG0v2avXiw3kLo&%5Bobject%20Object%5D=&app_version=1557485597&app_locale=en');
url.searchParams.set('ids', ids);
var r = await fetch(url)
var tracks = JSON.parse(await r.text());
console.log(tracks.map(t => t.title))
})()

*/