AIR/m3u-radio-music-playlists
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

animate the visualizer's colors

Browse Source
This commit is contained in:
U-DESKTOP-3VIS1T9\junguler 2022-10-25 00:05:00 +03:30
parent 5f685bb0f5
commit e41be01623
2 changed files with 15 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
stuff/style.css
View File

@ -37,3 +37,14 @@ text-align: center;
border-radius: 0px; border-radius: 0px;
border: none; border: none;
} }
@keyframes animate {
0% {
filter: hue-rotate(0deg);}
100% {
filter: hue-rotate(360deg);}
}
canvas {
animation: animate linear 30s infinite ;
}

7
stuff/visualizer.js
View File

@ -41,9 +41,10 @@ var start = function() {
capYPositionArray = []; ////store the vertical position of hte caps for the preivous frame capYPositionArray = []; ////store the vertical position of hte caps for the preivous frame
ctx = canvas.getContext('2d'), ctx = canvas.getContext('2d'),
gradient = ctx.createLinearGradient(0, 0, 600, 0); gradient = ctx.createLinearGradient(0, 0, 600, 0);
gradient.addColorStop(1, '#0ff'); gradient.addColorStop(1, '#ff0');
gradient.addColorStop(0.5, '#f0f'); gradient.addColorStop(0.66, '#0ff');
gradient.addColorStop(0, '#ff0'); gradient.addColorStop(0.33, '#ff0');
gradient.addColorStop(0, '#0ff');
// loop // loop
function renderFrame() { function renderFrame() {
var array = new Uint8Array(analyser.frequencyBinCount); var array = new Uint8Array(analyser.frequencyBinCount);