User:Vitrinekast/Snatch these snippets: Difference between revisions

From XPUB & Lens-Based wiki
No edit summary
No edit summary
Line 2: Line 2:


== Remix Mixcloud ==
== Remix Mixcloud ==
Re-Mixcloud
(copy paste it into the console of your browser when visiting mixcloud.com)
(copy paste it into the console of your browser when visiting mixcloud.com)
<code>
var remixCloud = function () {
var remixCloud = function () {
   var audio = document.querySelector("audio");
   var audio = document.querySelector("audio");
Line 39: Line 39:


remixCloud();
remixCloud();
 
</code>
== Adding audio elements to index files ==
== Adding audio elements to index files ==
<syntaxhighlight lang="javascript">
<syntaxhighlight lang="javascript">

Revision as of 14:07, 24 October 2023

Copy-paste this into your console! (Right click -> inspect elements > console)

Remix Mixcloud

(copy paste it into the console of your browser when visiting mixcloud.com) var remixCloud = function () {

 var audio = document.querySelector("audio");
 var svgs = document.querySelectorAll("svg");
 var h1s = document.querySelectorAll("h1, h2, h3,button,img");
 var as = document.querySelectorAll("a");
 var timeout;
 document.addEventListener("mousemove", function (e) {
   if (!timeout) {
     timeout = window.setTimeout(function () {
       timeout = false;
       var r = 3 * (e.clientY / window.innerWidth) + 0.25;
       audio.playbackRate = r;

audio.currentTime = audio.duration * (e.clientX / window.innerWidth);

       svgs.forEach((el) => {
         el.style.transform = `scale(${(r, r)})`;
       });
       as.forEach((el) => {
         el.style.transform = `rotate(${r * 20}deg)`;
       });
       document.body.style.transform = `rotate(${r * -4}deg)`;
       h1s.forEach((el) => {
         el.style.transform = `rotate(${r * 10}deg)`;
       });
       
     }, 100);
   }
 });

};

remixCloud();

Adding audio elements to index files

// select all links
document.querySelectorAll("a").forEach((link) => {
    // if it includes your audio format (regex)
    if(link.href.match(/\.(?:wav|mp3)$/i)) {
        // create an audio element and set its source to yourlink
        var audioEl = document.createElement("audio");
        audioEl.src = link.href;
        audioEl.controls = true;
        audioEl.style.display = "block";
        link.insertAdjacentElement("afterend", audioEl)
    };

    // or an image
    if(link.href.match(/\.(?:jpg|png)$/i)) {
        var imgEl = document.createElement("img");
        imgEl.src = link;
        imgEl.style.display = "block";
        link.insertAdjacentElement("afterend", imgEl)
    }
});