-
Notifications
You must be signed in to change notification settings - Fork 3
/
index.html
142 lines (115 loc) · 5.29 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
<!DOCTYPE html>
<html lang="en">
<head>
<title>NODE.SONGBOX</title>
<link rel="stylesheet" href="css/glazed.css">
</head>
<body>
<script id="lyrics" type="whambamthankma'am">
<% lyrics.each(function(lyric) { %>
<a-lyric data-index="<%= Number(lyric.index) %>">
<%= lyric.text %>
</a-lyric>
<% }); %>
</script>
<section id="main-content">
<header>
<h1>NODE.SONGBOX <small>The online karaoke party, no cover!</small></h1>
<div id="vote-button">
<h5>Vote for our app!</h5>
<iframe src="http://nodeknockout.com/iframe/glazed-nodenuts" frameborder=0 scrolling=no allowtransparency=true width=115 height=25></iframe>
</div>
</header>
<section id="about-app">
Best karaoke party experience <strong>with HEADPHONES</strong> in Chrome and Firefox Aurora. Allow the browser to use your microphone to sing and send this page to your friends to invite them to the party! <a target="_blank" href="http://twitter.com/home?status=Join our karaoke party at the NODE.SONGBOX! http://glazed-nodenuts.2013.nodeknockout.com" class="tweet">Click here to tweet an invite!</a>
</section>
<section id="karaoke-machine">
<div class="tv-screen">
<div class="tv-contents song">
<some-lyrics></some-lyrics>
</div>
</div>
<progress value="0" max="100"></progress>
<div id="tv-buttons">
<ul class="tv-knobs">
<li class="button-muteall">
<a href="#muteall" class="tv-control" id="mute-global" onclick="connection.streams.mute()"></a>
<a class="tv-label">mute all</a>
</li>
<li class="button-muteself">
<a href="#muteself" class="tv-control" id="mute-self"></a>
<a class="tv-label">mute self</a>
</li>
<li class="button-skip">
<a href="#skip" class="tv-control vote-skip"></a>
<a class="tv-label">skip song<br />(<span class="vote-skip-count"> </span> needed)</a>
</li>
<li class="volume-range">
<label for="vol">song volume</label>
<input id="vol" type="range" min="0" max="500" step="5" value="50" />
</li>
</ul>
</div>
<div id="tv-users">
<div class="tv-title"></div>
<div class="tv-claps">
<h4>Noise-o-Meter</h4>
<p>Sing, or clap if the room is doing a good job!</p>
<span class="clap-count">0</span> noise points!</div>
</div>
<section id="webrtc-container" class="clearfix">
<!-- local/remote audios container -->
<h4>The Room <small>Click user to mute/unmute</small></h4>
<div id="audios-container"></div>
</section>
</div>
</section>
<footer>
© <span class="us">Glazed Nodenuts</span>
<a href="http://twitter.com/vladikoff">@vladikoff</a>
<a href="http://twitter.com/tbranyen">@tbranyen</a>
<a href="http://twitter.com/shamakry">@shamakry</a>
<a href="http://twitter.com/jennschiffer">@jennschiffer</a>
</footer>
</section>
<script src="/socket.io/socket.io.js"></script>
{% if (env !== 'production') { %}
<!-- Ensure shim comes first. -->
<script src="/js/shim.js"></script>
<script src="/vendor/jquery.js"></script>
<script src="/vendor/lodash.js"></script>
<!-- scripts used for broadcasting -->
<script src="/vendor/rtc.js"> </script>
<!-- Engine 2 -->
<script src="/vendor/midilib2/MIDI/AudioDetect.js" type="text/javascript"></script>
<script src="/vendor/midilib2/MIDI/LoadPlugin.js" type="text/javascript"></script>
<script src="/vendor/midilib2/MIDI/Plugin.js" type="text/javascript"></script>
<script src="/vendor/midilib2/MIDI/Player.js" type="text/javascript"></script>
<script src="/vendor/midilib2/Widgets/Loader.js" type="text/javascript"></script>
<script src="/vendor/midilib2/Window/Event.js" type="text/javascript"></script>
<script src="/vendor/midilib2/Window/DOMLoader.XMLHttp.js" type="text/javascript"></script>
<script src="/vendor/midilib2/Window/DOMLoader.script.js" type="text/javascript"></script>
<!-- jasmid package -->
<script src="/vendor/midilib2/inc/jasmid/stream.js"></script>
<script src="/vendor/midilib2/inc/jasmid/midifile.js"></script>
<script src="/vendor/midilib2/inc/jasmid/replayer.js"></script>
<!-- extras -->
<script src="/vendor/midilib2/inc/Base64.js" type="text/javascript"></script>
<script src="/vendor/midilib2/inc/base64binary.js" type="text/javascript"></script>
<script src="/js/clap.js"> </script>
<script src="/vendor/connection.js"> </script>
<script src="/js/init.js"> </script>
<script src="/js/skip.js"> </script>
{% } else { %}
<script src="/glazed.js"></script>
{% } %}
<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-45605817-1', 'nodeknockout.com');
ga('send', 'pageview');
</script>
</body>
</html>