-
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
710 lines (661 loc) · 42.6 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
<!DOCTYPE html>
<html>
<head>
<title>ListenUp: A Free Listening Therapy & Brainwave Entrainment App</title>
<meta name="description"
content="A cutting-edge neurostimulation and auditory integration program, serving as a free alternative to The Tomatis Method, and other premium sound stimulation & auditory integration therapies.">
<meta name="keywords"
content="listening therapy, sound therapy, neurostimulation, neurosensory, sound stimulation, auditory training, auditory integration, The Tomatis Method, Auditory Integration Training, AIP, The Listening Program, TLP, Safe & Sound Protocl (SSP), binaural beats, brainwave entrainment, music therapy">
<meta name="author" content="Your Name">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="manifest" href="/manifest.json">
<meta name="theme-color" content="#000000">
<link rel="canonical" href="https://listenup.brainy-bots.com">
<link rel="icon" href="./favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<link rel="stylesheet" href="./main.css">
</head>
<body>
<!-- Navbar -->
<nav class="sticky-top navbar navbar-expand-lg navbar-dark bg-primary">
<a class="navbar-brand transucent" href="#"><img class="inline-icon-2 rounded" src="./icons/icon-128x128.png"
alt="Icon"><em>ListenUp</em><sup>tm</sup></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav mr-auto">
<!-- <li class="nav-item active">
<a class="nav-link" href="#container">Home <span class="sr-only">(current)</span></a>
</li> -->
<li class="nav-item">
<a class="nav-link" id="whatIsListenUp" href="#" data-toggle="modal" data-target="#infoModal">What
is <em>ListenUp</em><sup>tm</sup>? </a>
</li>
<li class="nav-item">
<a class="nav-link" href="#" data-toggle="modal" data-target="#theScienceModal">The Science</a>
</li>
<li class="nav-item active">
<a class="nav-link" target="_blank" href="https://brainy-bots.com">BrainyBots Apps <span class="sr-only">(current)</span></a>
</li>
</ul>
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="faded" href="#" ><img
class="drop-shadow" src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png"
alt="Buy Me A Coffee" style="height: 50px !important;"
onClick="document.getElementById('bmc-wbtn').click()"></a>
</li>
</ul>
</div>
</nav>
<div class="container white-bg mt-5 margin-bottom" id="container">
<h1 class="text-center"><em>ListenUp</em><sup>tm</sup></h1>
<div class="row justify-content-center">
<div class="col-12 col-md-6">
<p><em>ListenUp</em><sup>tm</sup> is a free, dynamic sound stimulation and listening therapy program. Just
select your preferred music
file from the sample library or your device - we recommend complex, low to mid tempo music such as
classical or jazz, but it's your choice! <em><b>Use good quality headphones</b> (noise cancelling or
bone conduction
preferred)</em> for the
most
potent effects.
<a href="#" data-toggle="modal" data-target="#infoModal">Learn more</a>.
</p>
</div>
</div>
<div class="row justify-content-center no-gutters">
<div class="col-6 col-md-3 d-flex">
<!-- Pick from Device -->
<div class="input-group mb-3 flex-grow-1 mr-2">
<div class="custom-file">
<input type="file" class="custom-file-input" id="audioInput" accept="audio/*">
<label class="custom-file-label" for="audioInput">Choose a file</label>
</div>
</div>
</div>
<div class="col-6 col-md-3 d-flex">
<!-- Pick from Library -->
<button id="trackPickerBtn" class="btn btn-primary mb-3 flex-grow-1 ml-2" style="flex-basis: 0;">Free
Library 🎧</button>
</div>
</div>
<div class="row justify-content-center mt-2">
<div class="col-12 col-md-6 d-flex justify-content-between align-items-center">
<div id="trackLabel">J.S. Bach - Cello Suite No. 1: Prelude</div>
<div class="alert alert-info mb-0 py-1 px-2" role="alert" id="playbackSpeedDisplay"
style="font-size: 0.8rem;">
Playback Rate: 1.00x
</div>
</div>
</div>
<div class="row justify-content-center mt-4">
<div class="col-12 col-md-6">
<div class="d-flex align-items-center">
<!-- Audio Player -->
<audio id="audioPlayer" class="w-100" crossOrigin="anonymous" controls disabled>
<source src="./music/bach-cello-suite-1-prelude.mp3">
</audio>
<!-- Shuffle Button -->
<button id="shuffleBtn" class="btn btn-success ms-2 margin-left">Shuffle</button>
</div>
</div>
</div>
<!-- Settings -->
<div class="row justify-content-center mt-4">
<div class="col-12 col-md-6">
<div id="settingsAccordion">
<div class="card">
<!-- Card Header -->
<div class="card-header d-flex" id="dynamicSettingsHeader">
<h5 class="mb-0">
<button class="plain" type="button" data-toggle="collapse"
data-target="#dynamicSettingsContent" aria-expanded="true"
aria-controls="dynamicSettingsContent">
<i class="fas fa-cog"></i> Advanced Settings
</button>
</h5>
<button type="button" class="btn btn-secondary small ml-auto" data-toggle="tooltip"
data-placement="top"
title="Use these settings to customise your dynamic sound stimulation experience. If you're unsure about anything, just stick with the defaults.">
?
</button>
</div>
<!-- Card Content -->
<div id="dynamicSettingsContent" class="collapse" aria-labelledby="dynamicSettingsHeader"
data-parent="#settingsAccordion">
<div class="card-body">
<!-- Volume Control -->
<label class="mt-3" for="volumeControl">Master Volume (Max):</label>
<button type="button" class="btn btn-secondary small" data-toggle="tooltip"
data-placement="top"
title="The maximum volume. When dynamic volume gating is enabled, the volume will be dynamically altered while you listen, but never go above the maximum level you set here.">
?
</button>
<input type="range" class="custom-range" id="volumeControl" min="0" max="1" step="0.01"
value="0.9">
<!-- Dynamic Switches -->
<div class="form-check mt-3">
<input class="form-check-input" type="checkbox" id="dynamicFilter" checked>
<label class="form-check-label" for="dynamicFilter">Dynamic Filtering</label>
<button type="button" class="btn btn-secondary small" data-toggle="tooltip"
data-placement="top"
title="Dynamically filters the audio signal to emphasis higher frequencies, such as those in the human vocal range, in varied and stimulating ways, persistently surprising your brain. The filter will modulate between the min and max values below. If you're unsure, stick with the defaults.">
?
</button>
</div>
<!-- Filter Frequency Range -->
<div class="filter-frequency-section sub-option rounded">
<h6 class="">Filter frequency range (Hz): </h6>
<div class="row">
<div class="col-md-6 col-6">
<label for="filterFrequencyMin">Min (Hz):</label>
<input type="number" class="form-control" id="filterFrequencyMin" min="100"
max="2000" step="1" value="180">
</div>
<div class="col-md-6 col-6">
<label for="filterFrequencyMax">Max (Hz): </label>
<input type="number" class="form-control" id="filterFrequencyMax" min="20"
max="10000" step="1" value="6480">
</div>
</div>
</div>
<div class="form-check mt-3">
<input class="form-check-input" type="checkbox" id="dynamicGating" checked>
<label class="form-check-label" for="dynamicGating">Dynamic Volume Gating</label>
<button type="button" class="btn btn-secondary small" data-toggle="tooltip"
data-placement="top"
title="Dynamically changes the volume of the music in ways that continuously grab the attention of your brain, and stimulate the auditory system. You can control how frequently this happens with the min and max parameters below (in seconds). Stick with the defaults if you're unsure.">
?
</button>
</div>
<!-- Gating Frequency Range -->
<div class="gating-frequency-section sub-option rounded">
<h6 class="margin-top">Vol. Gating Frequency Range (s): </h6>
<div class="row mt-3">
<div class="col-md-6 col-6">
<label for="gatingFrequencyMin">Min:</label>
<input type="number" class="form-control" id="gatingFrequencyMin" min="0.5"
max="10" step="0.1" value="0.8">
</div>
<div class="col-md-6 col-6">
<label for="gatingFrequencyMax">Max:</label>
<input type="number" class="form-control" id="gatingFrequencyMax" min="0.5"
max="10" step="0.1" value="7.2">
</div>
</div>
</div>
<div class="form-check mt-3">
<input class="form-check-input" type="checkbox" id="dynamicBinauralBeat" checked>
<label class="form-check-label" for="dynamicBinauralBeat"> Binaural Beat
Overtones</label>
<button type="button" class="btn btn-secondary small" data-toggle="tooltip"
data-placement="top"
title="Layers binaural beats on top of the music, which promotes calm, regulated brain states. Headphones are required to experience this effect.">
?
</button>
</div>
<div class="form-check mt-3">
<input class="form-check-input" type="checkbox" id="dynamicPlaybackRate">
<label class="form-check-label" for="dynamicPlaybackRate">
Dynamic Playback
Rate</label>
<button type="button" class="btn btn-secondary small" data-toggle="tooltip"
data-placement="top"
title="Modulates playback rate for an added dimension of auditory stimulation & dynamic complexity.">
?
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Info Modal -->
<div class="modal fade" id="infoModal" tabindex="-1" role="dialog" aria-labelledby="infoModalLabel"
aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h2 class="modal-title" id="infoModalLabel">What is <em>ListenUp</em><sup>tm</sup>?</h2>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" style="overflow-y: auto;">
<p><em>ListenUp</em><sup>tm</sup> is a free, dynamic sound stimulation & listening therapy program, designed
to promote integration and refinement of the auditory processing system when used in short,
regular sessions. While it was built specifically with the needs of those with neurological &
sensory processing challenges in mind, anyone with ears can benefit from using it. Studies have
demonstrated that dynamic sound stimulation programs like The Tomatis Method, The Listening
Program and similar can
have significant long-term benefits in emotional regulation, listening and comprehension,
language acquisition, cognitive function etc.
</p>
<div class="mt-2">
<div class="centered">
<h5>I'm determined to keep <em>ListenUp</em><sup>tm</sup> free. </h5>
<p>Can you support its maintenance?</p>
<!-- Patreon -->
<a title="Support Me on Patreon" class="btn btn-floating m-1 modal-button"
href="https://www.patreon.com/BrainyBots" target="_blank" role="button">
<i class="fab fa-patreon"></i>
</a>
<!-- Buy Me a Coffee -->
<a title="Buy Me a Coffee" class="btn btn-floating m-1 modal-button"
href="https://www.buymeacoffee.com/richardsneyd" target="_blank" role="button">
<i class="fas fa-coffee"></i>
</a>
</div>
</div>
<h4>The Problem it Solves</h4>
<p>Premium listening therapy programs like Tomatis Method, Auditory Integration Therapy (AIT), Safe
& Sound Protocl (SSP) come with
hefty price tags, making them inaccessible to most. I built <em>ListenUp</em><sup>tm</sup> to
democratise access to quality auditory training and listening therapy tools, especially for
individuals with Autism (ASD), Sensory Processing Disorder, ADHD, Auditory Processing Disorder
etc. Incorporating key principles from neuroscience, auditory perception, and educational
psychology, ListenUp™ is a freely available, scientifically grounded, customisable and
versatile sound stimulation therapy & auditory training solution. </p>
<h4>How it Works</h4>
<p>
ListenUp™ enhances your auditory system by playing music you enjoy but with a twist—dynamic
changes to challenge your brain. This specialised, dynamic modulation stimulates
interhemispheric
communication, and continuously
'surprises' and activates specific circuits in the brain. Frequencies in the higher end of the
human
vocal range are emphasised, thus training the brain to focus on important sounds, while
filtering out distractions. Strengthening this ability is essential to emotional, social and
cognitive development. To boot, the app employs binaural beats to generate alpha & beta waves in
your brain, promoting brainwave synchronisation between the two hemispheres in a state of calm
mindfulness and self-regulation.
</p>
<h4>The Benefits</h4>
<p>
Research has shown that sustained use of programs such as this can have
positive & substantial long-term impacts on areas such as:</p>
<ul>
<li>Auditory attention and focus</li>
<li>Auditory discrimination and processing</li>
<li>Emotional regulation</li>
<li>Attention</li>
<li>Cognitive function</li>
<li>Social skills</li>
<li>Language acquisition</li>
</ul>
<p>In short, listening becomes more fluid and effortless, with innumerable knock-on effects in other
functional domains. While these effects can be beneficial for anybody, they make it especially
useful for those with neurological & neurosensory disorders such
as ASD, ADHD, Learning Disability, Sensory Processing Disorder & Auditory Processing Disorder.
</p>
<h3>Usage</h3>
<ol>
<li><em><b>Use headphones</b></em>! Without them, you will not receive the full impact.
<em>Noise cancelling or bone conduction headphones are recommended</em> if available, but
any good quality
headphones will work well.
</li>
<li>Upload an audio file, select one from the library, or just start with the default track
provided.
</li>
<li>Optionally customize your experience using the advanced settings. If you're unsure, just
stick to the defaults.</li>
<li>Start your auditory training by pressing play.</li>
<li>Shuffle is enabled by default, and will randomly select the next track from the sample
library provided.</li>
<li>Aim for a 15-20 minutes session per day, about 5 days per week.</li>
<li>If your using ListenUp with a young child who has regulatory or behavioral challenges, ease them in, and be responsive to their individual needs. It's usually quite a pleasent experience, but if they're overwhelmed by the stimulation, take a break and come back to it later.</li>
</ol>
</div>
<div class="modal-footer">
<!-- Social Media Icons -->
<div class="mt-2 centered">
<!-- Facebook -->
<a class="btn btn-outline btn-floating m-1"
href="https://www.facebook.com/sharer/sharer.php?u=https://listenup.brainy-bots.com"
target="_blank" role="button">
<i class="fab fa-facebook-f"></i>
</a>
<!-- Twitter -->
<a class="btn btn-outline btn-floating m-1"
href="https://twitter.com/intent/tweet?url=https://listenup.brainy-bots.com"
target="_blank" role="button">
<i class="fab fa-twitter"></i>
</a>
<!-- LinkedIn -->
<a class="btn btn-outline btn-floating m-1"
href="https://www.linkedin.com/shareArticle?url=https://listenup.brainy-bots.com"
target="_blank" role="button">
<i class="fab fa-linkedin-in"></i>
</a>
<!-- Instagram -->
<a class="btn btn-outline btn-floating m-1" href="https://www.instagram.com/brainybotsapps/" target="_blank"
role="button">
<i class="fab fa-instagram"></i>
</a>
<!-- Youtube -->
<a class="btn btn-outline btn-floating m-1" href="https://www.youtube.com/@BrainyBotsApps" target="_blank"
role="button">
<i class="fab fa-youtube"></i>
</a>
</div>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- The Science Modal -->
<div class="modal fade" id="theScienceModal" tabindex="-1" aria-labelledby="theScienceModalLabel"
aria-hidden="true">
<div class="modal-dialog modal-dialog-scrollable modal-lg">
<div class="modal-content">
<div class="modal-header">
<h2 class="modal-title" id="theScienceModalLabel">The Science Behind ListenUp™</h2>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" style="overflow-y: auto;">
<p>ListenUp™ is based on principles of auditory neuroscience that focus on selective auditory
attention and interhemispheric communication within the brain. By dynamically manipulating sound
frequencies, particularly those within the human vocal range, it has the potential to enhance
function in areas such as behaviour, emotional regulation, cognition, language acquisition,
social skills, motor and sensory integration through the activation of specific neuronal
pathways via the auditory system. (Zatorre, Robert J., and Isabelle Peretz, eds. "The Cognitive
Neuroscience of
Music." Oxford University Press, 2003).</p>
<h3>Auditory Filters and Frequency Emphasis</h3>
<p>Our technology employs specialized filtering algorithms to emphasize certain frequencies while
dampening others. This draws from the "cocktail party effect" in auditory scene analysis
(Bregman, Albert S. "Auditory scene analysis: The perceptual organization of sound." MIT press,
1994), helping the brain pay attention to important sounds and filter out background noise.</p>
<h3>Interhemispheric Communication</h3>
<p>The tool uses the dynamic modulation of sound to engage both hemispheres of the brain, promoting
interhemispheric communication. This is grounded in research suggesting the involvement of both
hemispheres in complex auditory tasks (Rogalsky, Corianne, et al. "Functional anatomy of
language and music perception: Temporal and structural factors investigated using functional
magnetic resonance imaging." The Journal of Neuroscience 31.10 (2011): 3843-3852).</p>
<h3>Randomized Gating and Neuronal Engagement</h3>
<p>By incorporating elements of unpredictability via randomized gating, ListenUp™ stimulates a
broader range of auditory neurons. This is consistent with the principle of neural plasticity
and the impact of novelty on learning (Buonomano, Dean V., and Michael M. Merzenich. "Cortical
plasticity: From synapses to maps." Annual review of neuroscience 21.1 (1998): 149-186).</p>
<h3>Dynamic Binaural Beat Layering</h3>
<p>ListenUp™ also incorporates a dynamic binaural beat system that allows for real-time
manipulation of sound frequencies delivered separately to each ear. This technology is rooted in
the binaural beat phenomenon, wherein two slightly different frequencies are played in each ear,
and the brain perceives a third tone that is the mathematical difference between the two. This
has been studied for its potential effects on cognitive functions, stress levels, and even
neural synchronization (Oster, Gerald. "Auditory beats in the brain." Scientific American 229
(1973): 94-102).</p>
<p>The binaural beat system in ListenUp™ is dynamic, synchronising mathematically with the other
filters, meaning the beat frequencies adapt in real-time, thereby providing a richer and more
complex auditory journey. This feature helps to engage different brainwave states, optimize
focused attention, and enhance cognitive functions. </p>
<h3>Customization and Individual Differences</h3>
<p>Auditory training programs have traditionally been based around a narrow set of classical music
tracks, largely due the residual belief in the 'mozart effect'. However, modern research shows
that, while classical music can be very beneficial, there is also great value in utilising music
that is to the individuals taste, whatever the genre. By self-selecting the music tracks used,
you get automatic boosts in attention/engagement, essentially for free. Not tying strictly to
classical music also allows for far greater variation in the intervention, resulting in greater
novelty, which in turn drives plastic changes in the brain. ListenUp™ offers more agency to the
user via customizable settings, and the ability to choose your preferred music from your device.
This
personalized approach aligns with the individual differences component of the DIR developmental
model, and is in harmony with current scientific understanding of auditory perception and
cognitive engagement (Winkler, István, et al. "Human auditory cortex tracks task-irrelevant
sound sources." Journal of Neurophysiology 120.3 (2018): 1269-1280).</p>
<div class="mt-2">
<div class="centered">
<h5>I'm determined to keep <em>ListenUp</em><sup>tm</sup> free. </h5>
<p>Can you support its maintenance?</p>
<!-- Patreon -->
<a title="Support Me on Patreon" class="btn btn-floating m-1 modal-button"
href="https://www.patreon.com/BrainyBots" target="_blank" role="button">
<i class="fab fa-patreon"></i>
</a>
<!-- Buy Me a Coffee -->
<a title="Buy Me a Coffee" class="btn btn-floating m-1 modal-button"
href="https://www.buymeacoffee.com/richardsneyd" target="_blank" role="button">
<i class="fas fa-coffee"></i>
</a>
</div>
</div>
</div>
<div class="modal-footer">
<!-- Social Media Icons -->
<div class="mt-2 centered">
<!-- Facebook -->
<a class="btn btn-outline btn-floating m-1"
href="https://www.facebook.com/sharer/sharer.php?u=https://listenup.brainy-bots.com"
target="_blank" role="button">
<i class="fab fa-facebook-f"></i>
</a>
<!-- Twitter -->
<a class="btn btn-outline btn-floating m-1"
href="https://twitter.com/intent/tweet?url=https://listenup.brainy-bots.com"
target="_blank" role="button">
<i class="fab fa-twitter"></i>
</a>
<!-- LinkedIn -->
<a class="btn btn-outline btn-floating m-1"
href="https://www.linkedin.com/shareArticle?url=https://listenup.brainy-bots.com"
target="_blank" role="button">
<i class="fab fa-linkedin-in"></i>
</a>
<!-- Instagram -->
<a class="btn btn-outline btn-floating m-1" href="https://www.instagram.com/brainybotsapps/" target="_blank"
role="button">
<i class="fab fa-instagram"></i>
</a>
<!-- Youtube -->
<a class="btn btn-outline btn-floating m-1" href="https://www.youtube.com/@BrainyBotsApps" target="_blank"
role="button">
<i class="fab fa-youtube"></i>
</a>
</div>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- Feedback Modal -->
<div class="modal fade" id="feedbackModal" tabindex="-1" aria-labelledby="feedbackModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="feedbackModalLabel">Feedback Form</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p>We'd love to hear what you have to say! You can use the form, or contact me directly via <a
href="mailto:[email protected]">[email protected]</a></p>
<form action="mailto:[email protected]" method="post" enctype="text/plain">
<div class="form-group">
<label for="sender" class="col-form-label">Your Email:</label>
<input type="email" class="form-control" id="sender" name="sender">
</div>
<div class="form-group">
<label for="subject" class="col-form-label">Subject:</label>
<input type="text" class="form-control" id="subject" name="subject">
</div>
<div class="form-group">
<label for="body" class="col-form-label">Your Feedback:</label>
<textarea class="form-control" id="body" name="body"></textarea>
</div>
<!-- Social Media Icons -->
<div class="col-md-4 mt-2">
<!-- Facebook -->
<a class="btn btn-outline btn-floating m-1"
href="https://www.facebook.com/sharer/sharer.php?u=https://listenup.brainy-bots.com"
target="_blank" role="button">
<i class="fab fa-facebook-f"></i>
</a>
<!-- Twitter -->
<a class="btn btn-outline btn-floating m-1"
href="https://twitter.com/intent/tweet?url=https://listenup.brainy-bots.com"
target="_blank" role="button">
<i class="fab fa-twitter"></i>
</a>
<!-- LinkedIn -->
<a class="btn btn-outline btn-floating m-1"
href="https://www.linkedin.com/shareArticle?url=https://listenup.brainy-bots.com"
target="_blank" role="button">
<i class="fab fa-linkedin-in"></i>
</a>
<!-- Instagram -->
<a class="btn btn-outline btn-floating m-1" href="https://www.instagram.com/brainybotsapps/" target="_blank"
role="button">
<i class="fab fa-instagram"></i>
</a>
<!-- Youtube -->
<a class="btn btn-outline btn-floating m-1" href="https://www.youtube.com/@BrainyBotsApps" target="_blank"
role="button">
<i class="fab fa-youtube"></i>
</a>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal"
id="feedback-close">Close</button>
<button type="submit" class="btn btn-primary">Submit</button>
</div>
</form>
</div>
</div>
</div>
<!-- Sample Library Modal -->
<div id="sampleTrackModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Sample Music Library 🎧</h5>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<ul id="sampleTrackList"></ul>
</div>
</div>
</div>
</div>
<!-- Footer -->
<footer class="bg-dark text-center text-white">
<!-- Container -->
<div class="container p-4">
<div class="row">
<!-- Call to Action -->
<div class="col-md-5 mt-2">
<h5>Copyright © BrainyBots 2023:</h5>
<a target= "_blank" href='https://brainy-bots.com'><img class="drop-shadow slightly-faded" src="icons/brainybots.png"></a>
</div>
<!-- Support Buttons -->
<div class="col-md-3 mt-2">
<h5>Let's keep <em>ListenUp</em><sup>tm</sup> free. </h5>
<p>Can you support its maintenance?</p>
<!-- Patreon -->
<a title="Support Me on Patreon" class="btn btn-outline-light btn-floating m-1"
href="https://www.patreon.com/BrainyBots" target="_blank" role="button">
<i class="fab fa-patreon"></i>
</a>
<!-- Buy Me a Coffee -->
<a title="Buy Me a Coffee" class="btn btn-outline-light btn-floating m-1"
href="https://www.buymeacoffee.com/richardsneyd" target="_blank" role="button">
<i class="fas fa-coffee"></i>
</a>
</div>
<!-- Social Media Icons -->
<div class="col-md-4 mt-2">
<h5>Please Share <em>ListenUp</em><sup>tm</sup>:</h5>
<!-- Facebook -->
<a class="btn btn-outline-light btn-floating m-1"
href="https://www.facebook.com/sharer/sharer.php?u=https://listenup.brainy-bots.com"
target="_blank" role="button">
<i class="fab fa-facebook-f"></i>
</a>
<!-- Twitter -->
<a class="btn btn-outline-light btn-floating m-1"
href="https://twitter.com/intent/tweet?url=https://listenup.brainy-bots.com"
target="_blank" role="button">
<i class="fab fa-twitter"></i>
</a>
<!-- LinkedIn -->
<a class="btn btn-outline-light btn-floating m-1"
href="https://www.linkedin.com/shareArticle?url=https://listenup.brainy-bots.com"
target="_blank" role="button">
<i class="fab fa-linkedin-in"></i>
</a>
<!-- Instagram -->
<a class="btn btn-outline-light btn-floating m-1" href="https://www.instagram.com/brainybotsapps/" target="_blank"
role="button">
<i class="fab fa-instagram"></i>
</a>
<!-- Youtube -->
<a class="btn btn-outline-light btn-floating m-1" href="https://www.youtube.com/@BrainyBotsApps" target="_blank"
role="button">
<i class="fab fa-youtube"></i>
</a>
<!-- Feedback Button -->
<div class="mt-3">
<button type="button" class="btn btn-outline-light" id="feedbackButton" data-toggle="modal"
data-target="#feedbackModal">
Have Feedback?
</button>
</div>
</div>
</div>
</div>
</footer>
<script src="app.js"></script>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<script>
$(document).ready(function () {
document.querySelector('#feedbackButton').addEventListener('click', function () {
var closeButton = document.getElementById('feedback-close').click();
var email = document.getElementById('sender').value;
var subject = document.getElementById('subject').value;
var feedback = document.getElementById('body').value;
var mailtoLink = "mailto:[email protected]?subject=" + encodeURIComponent(subject) + "&body=" + encodeURIComponent(feedback + "\n\n- Sent from: " + email);
window.location.href = mailtoLink;
});
$('[data-toggle="tooltip"]').tooltip();
$('#dynamicFilter').change(function () {
if ($(this).prop('checked')) {
$('.filter-frequency-section').removeClass('d-none');
} else {
$('.filter-frequency-section').addClass('d-none');
}
});
$('#dynamicGating').change(function () {
if ($(this).prop('checked')) {
$('.gating-frequency-section').removeClass('d-none');
} else {
$('.gating-frequency-section').addClass('d-none');
}
});
});
</script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-YE05E5MW7Y"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'G-YE05E5MW7Y');
</script>
<script data-name="BMC-Widget" data-cfasync="false" src="https://cdnjs.buymeacoffee.com/1.0.0/widget.prod.min.js" data-id="richardsneyd" data-description="Support me on Buy me a coffee!" data-color="#FF813F" data-position="Right" data-x_margin="18" data-y_margin="18"></script>
<a href="#" id="welcomeModalLaunch" class="nav-link" href="#" data-toggle="modal" data-target="#infoModal"
style="display:none">bla</a>
</body>
</html>