1import { useState } from 'react';
2import LiteYouTubeEmbed from 'react-lite-youtube-embed';
3import 'react-lite-youtube-embed/dist/LiteYouTubeEmbed.css';
4
5export function shuffleArray(array) {
6  array = [...array];
7  for (let i = array.length - 1; i > 0; i--) {
8    const j = Math.floor(Math.random() * (i + 1));
9    [array[i], array[j]] = [array[j], array[i]];
10  }
11  return array;
12}
13let _shuffled;
14
15export function Showcase() {
16  const [videos, setVideos] = useState(_shuffled);
17  return (
18    <>
19      <div className="flex space-x-2">
20        <button className="bg-lineHighlight p-2 rounded-md" onClick={() => setVideos(shuffleArray(_videos))}>
21          <span>shuffle videos</span>
22        </button>
23        <button className="bg-lineHighlight p-2 rounded-md" onClick={() => setVideos(_videos)}>
24          <span>newest first</span>
25        </button>
26      </div>
27      {videos.map((video, i) => (
28        <div key={i}>
29          <h2>{video.title}</h2>
30          <LiteYouTubeEmbed {...video} />
31          {video.description && <p>{video.description}</p>}
32        </div>
33      ))}
34    </>
35  );
36}
37
38let _videos = [
39  { title: 'DJ_Dave - Array [Lil Data Edit]', id: 'KUujFuTcuKc' },
40  { title: 'DJ_Dave - Bitrot [v10101a Edit]', id: 'z_cJMdBp67Q' },
41  { title: 'you will not steve reich your way out of it', id: 'xpILnXcWyuo' },
42  { title: 'dough dream #1 - strudel jam 12/03/23', id: 'p0J7XrT9JEs' },
43  { title: 'eddyflux & superdirtspatz at the dough cathedral', id: 'GrkwKMQ7_Ys' },
44  // solstice 2023
45  { title: 'Jade Rose @ solstice stream 2023', id: 'wg0vW5Ac7L0' },
46  {
47    title: 'eddyflux @ solstice stream 2023',
48    id: 'DX8E99kC7q0',
49    description:
50      'A from-scratch session, starting with sample loops, later transitioning to more electronic territory.',
51  },
52  {
53    title: 'CCC @ solstice stream 2023',
54    id: '3uLTIDQa_Lc',
55    params: 'start=24',
56  },
57  { title: 'letSeaTstrudeL @ solstice stream 2023', id: 'fTiX6dVtdWQ' },
58  { title: 'totalgee (Glen F) @ solstice stream 2023', id: 'IvI6uaE3nLU' },
59  //
60  /* { // not sure if this is copyrighted ...
61    title: 'Creative Coding @ Chalmers University of Technology, video by svt.se',
62    id: '4zgHeNpG4wU',
63  }, */
64  { title: 'Switch Angel - Morrow', id: 'qiatPuJpxLs' },
65  {
66    title: 'Jade Rose - Into your spell',
67    id: 'lxQgBeLQBgk',
68    description:
69      'Jade Rose performing with various synths via MIDI, superdirt via OSC and the native strudel superdough engine + vocal parts!',
70  },
71  // algo afro futures
72  {
73    title: 'Emma Osman @ (Algo|Afro) Futures 2023',
74    id: 'zUoZvkZ3J7Q',
75    params: 'start=1278',
76  },
77  {
78    title: 'Zach B-B @ (Algo|Afro) Futures 2023',
79    id: 'zUoZvkZ3J7Q',
80    params: 'start=2547',
81  },
82  {
83    title: 'Jamal Lloyd Davis @ (Algo|Afro) Futures 2023',
84    id: 'zUoZvkZ3J7Q',
85    params: 'start=3883',
86  },
87  {
88    title: 'Jim Osman @ (Algo|Afro) Futures 2023',
89    id: 'zUoZvkZ3J7Q',
90    params: 'start=5155',
91  },
92  {
93    title: 'φ @ (Algo|Afro) Futures 2023',
94    id: 'zUoZvkZ3J7Q',
95    params: 'start=7809',
96  },
97  {
98    title: 'Tomilola Olumide @ (Algo|Afro) Futures 2023',
99    id: 'zUoZvkZ3J7Q',
100    params: 'start=9224',
101  },
102  {
103    title: 'Tyga Blue @ (Algo|Afro) Futures 2023',
104    id: 'zUoZvkZ3J7Q',
105    params: 'start=10909',
106  },
107  //
108  {
109    title: 'boggo - Live Coding Metal Djents',
110    id: 'n0rhn9-PRwE',
111    description: 'A rare sight: live coded Metal Djents, where strudel is sending MIDI to bespoke synth!',
112  },
113  {
114    title: 'froos @ Solstice Night Stream December 2022',
115    id: 'P1DDsOvcyco',
116    params: 'start=19',
117  },
118  { title: 'froos @ WAC 2022 Day', id: 'KWIotFWVOi4' },
119  {
120    title: 'yaxu & olivia - Algorithmic Pattern Live Stream',
121    id: 'Jvs7Q4cdLy4',
122    description:
123      'A first foray into combining (an early version) strudel and hydra, using flok for collaborative coding.',
124  },
125  { title: 'froos @ Algorave 10th Birthday stream', id: 'IcMSocdKwvw' },
126  { title: 'todepasta 1.5', id: 'gCwaVu1Mijg' },
127  { title: 'Djenerative Music by Bogdan Vera @ TOPLAP solstice Dec 2024', id: 'LtMX4Lr1nzY' },
128  { title: 'La musique by BuboBubo @ TOPLAP solstice Dec 2024', id: 'Oz00Y_f80wU' },
129  { title: 'Livecode and vocal breaks by Switch Angel @ TOPLAP solstice Dec 2024', id: '2kzjOIsL6CM' },
130  { title: 'Eddyflux algorave set @ rudolf5', id: 'MXz8131Ut0A' },
131];
132
133_shuffled = shuffleArray(_videos);