-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathindex.html
203 lines (168 loc) · 9.01 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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Least Best Beast</title>
<meta name="viewport" content="user-scalable=0, initial-scale=1.0">
<link rel="apple-touch-icon" sizes="57x57" href="/assets/favicon/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/assets/favicon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/assets/favicon/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/assets/favicon/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/assets/favicon/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/assets/favicon/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/assets/favicon/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/assets/favicon/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/assets/favicon/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="/assets/favicon/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/assets/favicon/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon/favicon-16x16.png">
<link rel="manifest" href="/assets/favicon/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/assets/favicon/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<meta property="og:title" content="Least Best Beast is your new favorite band">
<meta property="og:description" content="Least Best Beast is somewhere on the way to rock, but you take a wrong left.">
<meta property="og:image" content="http://www.leastbestbeast.com/assets/favicon/fav.jpg">
<meta property="og:url" content="http://www.leastbestbeast.com/index.html">
<meta name="twitter:card" content="summary_large_image">
<link href="/assets/icons/foundation-icons.css" media="screen" rel="stylesheet"/>
<link href="/assets/css/style.css" media="screen" rel="stylesheet"/>
<style>
section>h1 { border-bottom: 1px solid #fff; margin: 60px 0 15px; }
</style>
</head>
<body>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-274914-4', 'auto');
ga('send', 'pageview');
</script>
<div class="container">
<div id="branding" class="branding">Least Best Beast</div>
<div class="content">
<div class="icons">
<a href="http://www.github.com/sometotal/leastbestbeast.com"><i class="fi-social-github"></i></a>
<a href="http://www.facebook.com/leastbestbeast"><i class="fi-social-facebook"></i></a>
<a href="http://www.twitter.com/leastbestbeast"><i class="fi-social-twitter"></i></a>
</div>
<section data-context="shows" id="shows">
<h1>Events</h1>
<p>Either we do not have any current shows or someone forgot to update this section.</p>
<div id="dynamic-events-container">
<p>More events coming soon!</p>
<!-- <ul> -->
<!-- <li>Friday, February 10, 2017 9:00PM</li> -->
<!-- <li>Bacchus Club in New Paltz, NY</li> -->
<!-- <li>w/ <a href="http://diascreams.tumblr.com/">Dia</a></li> -->
<!-- </ul> -->
</div>
</section>
<section data-context="newsletter">
<h1>News blasts for you!</h1>
<!-- Begin MailChimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/slim-081711.css" rel="stylesheet" type="text/css">
<style type="text/css">
#mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
/* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
</style>
<div id="mc_embed_signup">
<form action="//joesepi.us11.list-manage.com/subscribe/post?u=9c458f98857fbca42ad5437d0&id=608b5d773a" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div id="mc_embed_signup_scroll">
<input type="email" value="" name="EMAIL" class="email" id="mce-EMAIL" placeholder="email address" required>
<!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_9c458f98857fbca42ad5437d0_608b5d773a" tabindex="-1" value=""></div>
<div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</div>
</form>
</div>
<!--End mc_embed_signup-->
</section>
<section data-context="music">
<h1>Music</h1>
<iframe style="border: 0; width: 400px; height: 836px;" src="https://bandcamp.com/EmbeddedPlayer/album=673704921/size=large/bgcol=ffffff/linkcol=333333/transparent=true/" seamless><a href="https://leastbestbeast.bandcamp.com/album/unleast-the-beast">Unleast The Beast by Least Best Beast</a></iframe>
</section>
<section data-context="video">
<h1>Video</h1>
<p>A video of a recent show where the bass makes the camera appear underwater.</p>
<iframe width="400" height="225" src="https://www.youtube.com/embed/QTJA0iAZ8fM" frameborder="0" allowfullscreen></iframe>
</section>
<section data-context="about">
<h1>About</h1>
<p>Least Best Beast is three punks making music and noise in the basement of a tattoo shop. While the sound that comes blasting out of that basement may feel familiar, Least Best Beast takes that feeling to new places with an original and fresh take on post-punk rock music.</p>
<p>All three of them have been playing in bands since a young age. Patrick (bass) and Joe (guitar/vocals) were jamming together for a few months, but were having trouble finding a drummer. Most were lost to spontaneous combustion.</p>
<p>Serendipitously, Stella (drums), had recently set up shop at Pat’s “Speakeasy Tattoo Studio” in Peekskill, NY. When Stella overheard Pat bitching about their search for a drummer, she didn’t miss a beat... and it was quickly apparent at the trio’s first session that it was a perfect fit and the Beast was born.</p>
<p>The first Beast record was recorded at world famous Studio G in Brooklyn. The second was recorded at Speakeasy Tattoo. Both helmed by the indefatigable Matt Labozza who masterfully channels the essence of Least Best Beast to digital tape.</p>
<p>Unleast The Beast (album #2) is being released on October 9 at the exciting 1 2 Heart U event. Be sure to come hear them play the album in full live in the street.</p>
</section>
<section class="contact">
<h1>Contact</h1>
<p>Hey, reach out to us. We are very approachable. Either come up to us at the next show or introduce yourself on the street or send us mail: <a href="mailto:[email protected]">[email protected]</a>. Cheers!</p>
</section>
<section data-context="acclaim">
<h1>Acclaim</h1>
<p>"Easily one of the most sizzling bands of the Hudson Valley."
<br> - The Drummer's Neighbor</p>
</section>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="/assets/js/jquery.min.js"><\/script>')</script>
<script src="/assets/js/handlebars-v4.0.10.js"></script>
<style>
#dynamic-events-container ul { margin-bottom: 50px; }
</style>
<script id="entry-template" type="text/x-handlebars-template">
{{#each events}}
<ul>
<li><strong>{{date}}</strong></li>
<li>{{locName}}</li>
<li>{{locCity}}, {{locState}}</li>
<li>with:
<ul>
{{#each bands}}
<li>{{.}}</li>
{{/each}}
</ul>
</li>
</ul>
{{/each}}
</script>
<script>
$("#branding").click(function() {
$('html, body').animate({
scrollTop: $("#shows").offset().top
}, 2000);
});
var source = $("#entry-template").html();
var showTemplate = Handlebars.compile(source);
function buildEventsHTML(eventsRes) {
let events = [];
const now = new Date();
const nowUTC = now.getTime();
eventsRes.forEach(function(event, i) {
let date = new Date(event.timeStart);
const dateUTC = date.getTime();
if (nowUTC < dateUTC) {
event.date = date;
events.push(event);
}
});
$('#dynamic-events-container').html(showTemplate({ events }));
}
$.ajax({
type: 'GET',
url: 'https://band-aid.mybluemix.net/api/events',
crossDomain: true
}).done(function(events) {
if (events && events.length) {
buildEventsHTML(events);
}
});
</script>
</body>
</html>