A Pen by Brian Redfern on CodePen.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<h1>WaveSurfer.js - equalizer with volume slider</h1> | |
<h4> | |
<a target="_blank" href="https://github.com/entonbiba/examples/blob/master/wavesurfer/equalizer-with-volume-slider">Example reference on github.com</a> | |
</h4> | |
<div id="waveform"></div> | |
<div class="container" style="text-align: center"> | |
<button onclick="wavesurfer.playPause()"> |
Forked from Sean Stopnik's Pen CSS Range Slider. thx
A Pen by Brian Redfern on CodePen.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<body layout="column stretch-stretch"> | |
<svg class='defs-only'> | |
<defs> | |
<g id="JB"> | |
<path id="jb-profil" | |
stroke="#000" fill="#fff" stroke-miterlimit="10" d="M258.9,94.3c1,0.8,1.199,2.6,0.699,6.4 | |
c-0.699,5.6-0.3,6.2,4.801,7.3c2.5,0.5,3.1,1.1,3.1,3c0,2.6,2,3.1,5.8,1.5c1.7-0.7,1.8-0.3,1.601,4.1c-0.301,6.2,0.6,8.8,3.399,10.2 | |
c2.601,1.3,10.2,2.9,17.2,3.7c9,1.1,13.2,2.6,16.6,6.1l3.2,3.3l-2.6,1c-1.5,0.6-2.7,1.5-2.7,2c0,2.1,6.5,8.3,11,10.6 | |
c5.2,2.6,6.3,3.7,7.8,8c0.5,1.6,2.2,6.1,3.601,10c7,18.8,6.199,35.9-1.9,44.5c-1.3,1.4-2.5,3.9-2.8,5.6c-0.7,4.4-2,6.6-6.9,10.9 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
While not every language uses the "reduce" keyword you find the concept of reduction in different languages that implement functional code features so in c# its called using the Aggregate keyword but the concept is similar. | |
So what is a reduction and how does it help us flatten multidimensional lists in general? | |
You basically get to call a function on every item in an array however you get some special tools to keep track of this array so you have an accumulator that is like a bag where all the values drop in after each array is iterated, you have a current value placeholder an index which tells you which item you're on in the array and you have the ability to set an initial value to send to the first callback call. | |
Here's an example of how reduce is used with a complex array to flatten it into a simple array: | |
function flattenDeep(arr1) { | |
return arr1.reduce((acc, val) => Array.isArray(val) ? acc.concat(flattenDeep(val)) : acc.concat(val), []); | |
} |
OlderNewer