Skip to content

Commit 3df524f

Browse files
scowaltscowalt
committed
Initial import
0 parents  commit 3df524f

File tree

106 files changed

+4928
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

106 files changed

+4928
-0
lines changed

‎chroma/index.html

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
Coming soon! Until we get to this, check out Chroma featured in our other project, <a href="/sigmusic/cosmos/">Human Cosmo</a>

‎chroma/stream.html

+112
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,112 @@
1+
<html lang="en">
2+
<head>
3+
<script src="http://lab2.acm.uiuc.edu:8009/socket.io/socket.io.js"></script>
4+
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
5+
<script>
6+
var socket = io.connect('http://lab2.acm.uiuc.edu:8009');
7+
socket.on('stream', function (data) {
8+
var colordata = $.parseJSON(data.data);
9+
$.each(colordata.colors, function(index,color) {
10+
$("#light-"+index).css("background-color","rgb("+Math.round(color[0]/4)+","+Math.round(color[1]/4)+","+Math.round(color[2]/4)+")");
11+
});
12+
var color = colordata.colors[0];
13+
$("#title h1").css("text-shadow","rgba("+Math.round(color[0]/4)+","+Math.round(color[1]/4)+","+Math.round(color[2]/4)+", 0.5) 0 0 0.5em");
14+
$("#streamname").html(colordata.title);
15+
$("#framenumber").html(colordata.framenum);
16+
});
17+
$(function() {
18+
for (var i=0; i<24; i++) {
19+
var y = Math.floor(i%4) / 4.0 * 100;
20+
var x = Math.floor(i/4) / 6.0 * 100;
21+
$("#lightscontainer").append("<div id='light-"+i+"' class='lights' style='left:"+x+"%; top:"+y+"%'></div>");
22+
}
23+
});
24+
</script>
25+
<link href='http://fonts.googleapis.com/css?family=Russo+One' rel='stylesheet' type='text/css'>
26+
<style type="text/css">
27+
.lights {
28+
position: absolute;
29+
width: 16.866667%;
30+
height: 25%;
31+
}
32+
#container {
33+
margin-left: auto;
34+
margin-right: auto;
35+
width:600px;
36+
background-color:#000;
37+
margin-top: 50px;
38+
margin-bottom: 50px;
39+
}
40+
#lightscontainer {
41+
position: relative;
42+
width: 100%;
43+
height: 400px;
44+
}
45+
body {
46+
background-color:#000;
47+
color: #999;
48+
font-family: 'Russo One', sans-serif;
49+
letter-spacing: 1px;
50+
font-weight: 300;
51+
}
52+
h1 {
53+
letter-spacing: 3px;
54+
font-size: 76px;
55+
text-align: center;
56+
margin-left: auto;
57+
margin-right: auto;
58+
width: 100%;
59+
overflow: hide;
60+
font-weight: 300;
61+
margin:0;
62+
padding:0;
63+
margin-bottom:10px;
64+
text-shadow: rgba(255,255,255,1.5) 0 0 0.5em;
65+
}
66+
.streamname {
67+
font-size: 30px;
68+
float: left;
69+
height:30px;
70+
}
71+
.framenumber {
72+
font-size: 20px;
73+
float: right;
74+
padding-top:9px;
75+
height:30px;
76+
vertical-align: bottom;
77+
}
78+
#metadata {
79+
height:30px;
80+
}
81+
#lightscontainer {
82+
clear: both;
83+
}
84+
85+
86+
@media screen and (min-width: 1200px) {
87+
#container {
88+
width: 900px;
89+
}
90+
91+
#lightscontainer {
92+
width: 900px;
93+
height: 600px;
94+
}
95+
</style>
96+
</head>
97+
<body>
98+
<div id="container">
99+
<div id="title">
100+
<h1>Chroma Lights</h1>
101+
</div>
102+
<div id="metadata">
103+
<div class='streamname' id="streamname"></div> <div class='framenumber' id='framenumber'></div>
104+
</div>
105+
106+
<div id="lightscontainer">
107+
108+
</div>
109+
110+
</div>
111+
112+
</body>

‎chromastream.html

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
<html lang="en">
2+
<head>
3+
<script src="http://lab2.acm.uiuc.edu:8009/socket.io/socket.io.js"></script>
4+
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
5+
<script>
6+
var socket = io.connect('http://lab2.acm.uiuc.edu:8009');
7+
socket.on('stream', function (data) {
8+
var colordata = $.parseJSON(data.data);
9+
$.each(colordata.colors, function(index,color) {
10+
$("#light-"+index).css("background-color","rgb("+Math.round(color[0]/4)+","+Math.round(color[1]/4)+","+Math.round(color[2]/4)+")");
11+
});
12+
});
13+
$(function() {
14+
for (var i=0; i<24; i++) {
15+
$("#container").append("<div id='light-"+i+"' class='lights'></div>");
16+
}
17+
});
18+
</script>
19+
<style type="text/css">
20+
.lights {
21+
float: left;
22+
width: 100px;
23+
height: 100px;
24+
}
25+
#container {
26+
margin-left: auto;
27+
margin-right: auto;
28+
width:400px;
29+
background-color:#000;
30+
margin-top: 50px;
31+
}
32+
body {
33+
background-color:#000;
34+
}
35+
</style>
36+
</head>
37+
<body>
38+
<div id="container">
39+
40+
</div>
41+
42+
</body>

‎cosmos/.DS_Store

6 KB
Binary file not shown.

‎cosmos/.index.html.swn

16 KB
Binary file not shown.

‎cosmos/.index.html.swo

16 KB
Binary file not shown.

‎cosmos/.index.html.swp

16 KB
Binary file not shown.

‎cosmos/css/lightbox.css

+190
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,190 @@
1+
/* line 6, ../sass/lightbox.sass */
2+
#lightboxOverlay {
3+
position: absolute;
4+
top: 0;
5+
left: 0;
6+
z-index: 9999;
7+
background-color: black;
8+
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
9+
opacity: 0.85;
10+
display: none;
11+
width: 100% !important;
12+
height: 100% !important;
13+
}
14+
15+
/* line 15, ../sass/lightbox.sass */
16+
#lightbox {
17+
position: absolute;
18+
left: 0;
19+
width: 100%;
20+
z-index: 10000;
21+
text-align: center;
22+
line-height: 0;
23+
font-family: "lucida grande", tahoma, verdana, arial, sans-serif;
24+
font-weight: normal;
25+
}
26+
/* line 24, ../sass/lightbox.sass */
27+
#lightbox img {
28+
width: auto;
29+
max-width: 100%;
30+
height: auto;
31+
}
32+
/* line 27, ../sass/lightbox.sass */
33+
#lightbox a img {
34+
border: none;
35+
}
36+
37+
/* line 30, ../sass/lightbox.sass */
38+
.lb-outerContainer {
39+
position: relative;
40+
background-color: rgba(255,255,255,0.2);
41+
*zoom: 1;
42+
width: 250px;
43+
height: 250px;
44+
margin: 0 auto;
45+
-webkit-border-radius: 4px;
46+
-moz-border-radius: 4px;
47+
-ms-border-radius: 4px;
48+
-o-border-radius: 4px;
49+
border-radius: 4px;
50+
max-width:100%;
51+
min-width: 100px;
52+
height: auto !important;
53+
min-height: 100px;
54+
max-height:100%;
55+
}
56+
/* line 38, ../../../../.rvm/gems/ruby-1.9.2-p290/gems/compass-0.12.1/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
57+
.lb-outerContainer:after {
58+
content: "";
59+
display: table;
60+
clear: both;
61+
}
62+
63+
/* line 39, ../sass/lightbox.sass */
64+
.lb-container {
65+
padding: 10px;
66+
}
67+
68+
/* line 42, ../sass/lightbox.sass */
69+
.lb-loader {
70+
position: absolute;
71+
top: 40%;
72+
left: 0%;
73+
height: 25%;
74+
width: 100%;
75+
text-align: center;
76+
line-height: 0;
77+
}
78+
79+
/* line 51, ../sass/lightbox.sass */
80+
.lb-nav {
81+
position: absolute;
82+
top: 0;
83+
left: 0;
84+
height: 100%;
85+
width: 100%;
86+
z-index: 10;
87+
}
88+
89+
/* line 59, ../sass/lightbox.sass */
90+
.lb-container > .nav {
91+
left: 0;
92+
}
93+
94+
/* line 62, ../sass/lightbox.sass */
95+
.lb-nav a {
96+
outline: none;
97+
}
98+
99+
/* line 65, ../sass/lightbox.sass */
100+
.lb-prev, .lb-next {
101+
width: 49%;
102+
height: 100%;
103+
background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
104+
/* Trick IE into showing hover */
105+
display: block;
106+
}
107+
108+
/* line 72, ../sass/lightbox.sass */
109+
.lb-prev {
110+
left: 0;
111+
float: left;
112+
}
113+
114+
/* line 76, ../sass/lightbox.sass */
115+
.lb-next {
116+
right: 0;
117+
float: right;
118+
}
119+
120+
/* line 81, ../sass/lightbox.sass */
121+
.lb-prev:hover {
122+
background: url(../images/prev.png) left 48% no-repeat;
123+
}
124+
125+
/* line 85, ../sass/lightbox.sass */
126+
.lb-next:hover {
127+
background: url(../images/next.png) right 48% no-repeat;
128+
}
129+
130+
/* line 88, ../sass/lightbox.sass */
131+
.lb-dataContainer {
132+
margin: 0 auto;
133+
padding-top: 5px;
134+
*zoom: 1;
135+
width: 100% ;
136+
max-width: 100%;
137+
-moz-border-radius-bottomleft: 4px;
138+
-webkit-border-bottom-left-radius: 4px;
139+
-ms-border-bottom-left-radius: 4px;
140+
-o-border-bottom-left-radius: 4px;
141+
border-bottom-left-radius: 4px;
142+
-moz-border-radius-bottomright: 4px;
143+
-webkit-border-bottom-right-radius: 4px;
144+
-ms-border-bottom-right-radius: 4px;
145+
-o-border-bottom-right-radius: 4px;
146+
border-bottom-right-radius: 4px;
147+
}
148+
/* line 38, ../../../../.rvm/gems/ruby-1.9.2-p290/gems/compass-0.12.1/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
149+
.lb-dataContainer:after {
150+
content: "";
151+
display: table;
152+
clear: both;
153+
}
154+
155+
/* line 95, ../sass/lightbox.sass */
156+
.lb-data {
157+
padding: 0 10px;
158+
color: #bbbbbb;
159+
}
160+
/* line 98, ../sass/lightbox.sass */
161+
.lb-data .lb-details {
162+
width: 85%;
163+
float: left;
164+
text-align: left;
165+
line-height: 1.1em;
166+
}
167+
/* line 103, ../sass/lightbox.sass */
168+
.lb-data .lb-caption {
169+
font-size: 13px;
170+
font-weight: bold;
171+
line-height: 1em;
172+
}
173+
/* line 107, ../sass/lightbox.sass */
174+
.lb-data .lb-number {
175+
display: block;
176+
clear: left;
177+
padding-bottom: 1em;
178+
font-size: 11px;
179+
}
180+
/* line 112, ../sass/lightbox.sass */
181+
.lb-data .lb-close {
182+
width: 35px;
183+
float: right;
184+
padding-bottom: 0.7em;
185+
outline: none;
186+
}
187+
/* line 117, ../sass/lightbox.sass */
188+
.lb-data .lb-close:hover {
189+
cursor: pointer;
190+
}

0 commit comments

Comments
 (0)