| demos\blackmajic\canvas\js\starfield.js |
1 document=widget
2 document.documentElement=widget
3 document.location={}
4 document.location.href=""
5 var top=_top
6 function $i(id) {
7 return form.getElementById(id);
8 }
9 function $r(parent,child) {
10 (document.getElementById(parent)).removeChild(document.getElementById(child));
11 }
12 function $t(name) {
13 return document.getElementsByTagName(name);
14 }
15 function $c(code) {
16 return String.fromCharCode(code);
17 }
18 function $h(value) {
19 return ('0'+Math.max(0,Math.min(255,Math.round(value))).toString(16)).slice(-2);
20 }
21 function _i(id,value) {
22 $t('div')[id].innerHTML+=value;
23 }
24 function _h(value) {
25 return !hires?value:Math.round(value/2);
26 }
27
28 function get_screen_size()
29 {
30 var w=document.documentElement.clientWidth;
31 var h=document.documentElement.clientHeight;
32 return Array(w,h);
33 }
34
35 var url=document.location.href;
36
37 var flag=true;
38 var test=true;
39 var n=parseInt((url.indexOf('n=')!=-1)?url.substring(url.indexOf('n=')+2,((url.substring(url.indexOf('n=')+2,url.length)).indexOf('&')!=-1)?url.indexOf('n=')+2+(url.substring(url.indexOf('n=')+2,url.length)).indexOf('&'):url.length):512);
40 var w=0;
41 var h=0;
42 var x=0;
43 var y=0;
44 var z=0;
45 var star_color_ratio=0;
46 var star_x_save,star_y_save;
47 var star_ratio=256;
48 var star_speed=4;
49 var star_speed_save=0;
50 var star=new Array(n);
51 var color;
52 var opacity=0.1;
53
54 var cursor_x=0;
55 var cursor_y=0;
56 var mouse_x=0;
57 var mouse_y=0;
58
59 var canvas_x=0;
60 var canvas_y=0;
61 var canvas_w=0;
62 var canvas_h=0;
63 var context;
64
65 var key;
66 var ctrl;
67
68 var timeout;
69 var fps=0;
70 var paused=false
71 function init()
72 {
73 var a=0;
74 for(var i=0;i<n;i++)
75 {
76 star[i]=new Array(5);
77 star[i][0]=Math.random()*w*2-x*2;
78 star[i][1]=Math.random()*h*2-y*2;
79 star[i][2]=Math.round(Math.random()*z);
80 star[i][3]=0;
81 star[i][4]=0;
82 }
83 var starfield=$i('starfield');
84
85
86
87 context=starfield.getContext('2d');
88
89 context.fillStyle='rgb(0,0,0)';
90 context.strokeStyle='rgb(255,255,255)';
91
92
93
94
95
96
97 }
98 function startStarfield() {
99 starfield.focus()
100 if(paused) {
101 paused=false
102 anim()
103 }
104 else {
105 start()
106 }
107 }
108 function stopStarfield() {
109 paused=true;
110 clearTimeout(timeout);
111 }
112 function anim()
113 {
114 if(paused==true) {
115 return;
116 }
117 mouse_x=cursor_x-x;
118 mouse_y=cursor_y-y;
119 context.fillRect(0,0,w,h);
120 for(var i=0;i<n;i++)
121 {
122 test=true;
123 star_x_save=star[i][3];
124 star_y_save=star[i][4];
125 star[i][0]+=mouse_x>>4;
126 if(star[i][0]>x<<1) {
127 star[i][0]-=w<<1;
128 test=false;
129 }
130 if(star[i][0]<-x<<1) {
131 star[i][0]+=w<<1;
132 test=false;
133 }
134 star[i][1]+=mouse_y>>4;
135 if(star[i][1]>y<<1) {
136 star[i][1]-=h<<1;
137 test=false;
138 }
139 if(star[i][1]<-y<<1) {
140 star[i][1]+=h<<1;
141 test=false;
142 }
143 star[i][2]-=star_speed;
144 if(star[i][2]>z) {
145 star[i][2]-=z;
146 test=false;
147 }
148 if(star[i][2]<0) {
149 star[i][2]+=z;
150 test=false;
151 }
152 star[i][3]=x+(star[i][0]/star[i][2])*star_ratio;
153 star[i][4]=y+(star[i][1]/star[i][2])*star_ratio;
154 if(star_x_save>0&&star_x_save<w&&star_y_save>0&&star_y_save<h&&test)
155 {
156 context.lineWidth=(1-star_color_ratio*star[i][2])*2;
157 context.beginPath();
158 context.moveTo(star_x_save,star_y_save);
159 context.lineTo(star[i][3],star[i][4]);
160 context.stroke();
161 context.closePath();
162 }
163 }
164 timeout=setTimeout(anim,fps);
165 }
166
167 function move(evt)
168 {
169 evt=evt||event;
170 cursor_x=evt.pageX-canvas_x;
171 cursor_y=evt.pageY-canvas_y;
172 }
173
174 function key_manager(evt)
175 {
176 evt=evt||event;
177 key=evt.which||evt.keyCode;
178
179 switch(key)
180 {
181 case 27:
182 flag=flag?false:true;
183 if(flag)
184 {
185 timeout=setTimeout(anim,fps);
186 }
187 else
188 {
189 clearTimeout(timeout);
190 }
191 break;
192 case 32:
193 star_speed_save=(star_speed!=0)?star_speed:star_speed_save;
194 star_speed=(star_speed!=0)?0:star_speed_save;
195 break;
196 case 13:
197 context.fillStyle='rgba(0,0,0,'+opacity+')';
198 break;
199 }
200 top.status='key='+((key<100)?'0':'')+((key<10)?'0':'')+key;
201 }
202
203 function release()
204 {
205 switch(key)
206 {
207 case 13:
208 context.fillStyle='rgb(0,0,0)';
209 break;
210 }
211 }
212
213 function mouse_wheel(evt)
214 {
215 evt=evt||event;
216 var delta=0;
217 if(evt.wheelDelta)
218 {
219 delta=evt.wheelDelta/120;
220 }
221 else if(evt.detail)
222 {
223 delta=-evt.detail/3;
224 }
225 star_speed+=(delta>=0)?-0.2:0.2;
226 if(evt.preventDefault) evt.preventDefault();
227 }
228
229 function start()
230 {
231 resize();
232 anim();
233 }
234
235 function resize()
236 {
237 w=parseInt((url.indexOf('w=')!=-1)?url.substring(url.indexOf('w=')+2,((url.substring(url.indexOf('w=')+2,url.length)).indexOf('&')!=-1)?url.indexOf('w=')+2+(url.substring(url.indexOf('w=')+2,url.length)).indexOf('&'):url.length):get_screen_size()[0]);
238 h=parseInt((url.indexOf('h=')!=-1)?url.substring(url.indexOf('h=')+2,((url.substring(url.indexOf('h=')+2,url.length)).indexOf('&')!=-1)?url.indexOf('h=')+2+(url.substring(url.indexOf('h=')+2,url.length)).indexOf('&'):url.length):get_screen_size()[1]);
239 x=Math.round(w/2);
240 y=Math.round(h/2);
241 z=(w+h)/2;
242 star_color_ratio=1/z;
243 cursor_x=x;
244 cursor_y=y;
245 init();
246 }
247
248 document.onmousemove=move;
249 document.onkeypress=key_manager;
250 document.onkeyup=release;
251 document.onmousewheel=mouse_wheel;
252
253
254
255