├── .DS_Store
├── .gitignore
├── README.md
├── _config.yml
├── app.js
├── bin
    └── www
├── common
    └── util.js
├── package-lock.json
├── package.json
├── public
    ├── .DS_Store
    └── music
    │   ├── Deep Side - Booty Music.mp3
    │   ├── Kate Havnevik - Think Again.mp3
    │   ├── Katie Herzig - Forevermore.mp3
    │   ├── The Fratellis - Dogtown.mp3
    │   ├── 俞胜恩 - 오유야유.mp3
    │   └── 蔡健雅 - 红色高跟鞋.mp3
├── routes
    ├── config.js
    ├── index.js
    └── users.js
└── views
    ├── balls
        ├── .DS_Store
        └── index.ejs
    ├── blink
        └── index.ejs
    ├── error.ejs
    ├── index.ejs
    ├── lineBall
        └── index.ejs
    ├── loading
        └── index.ejs
    ├── music.ejs
    ├── night
        └── index.ejs
    ├── qbaby
        └── index.ejs
    └── windmill
        └── index.js


/.DS_Store:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/zy941002/PEANUT/0a268a946f6543ccdee930ad2d3fb8b186b2078a/.DS_Store


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
 1 | node_modules
 2 | typings
 3 | 
 4 | npm-debug.log*
 5 | yarn-debug.log*
 6 | yarn-error.log*
 7 | 
 8 | 
 9 | # idea ignore
10 | .idea/
11 | *.ipr
12 | *.iml
13 | *.iws
14 | 
15 | # temp ignore
16 | *.log
17 | *.cache
18 | *.diff
19 | *.patch
20 | *.tmp
21 | 
22 |  .DS_Store


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | ```js
 2 | npm i
 3 | ```
 4 | 
 5 | ```js
 6 | npm i supervisor -g
 7 | ```
 8 | 
 9 | ```js
10 | supervisor app
11 | ```


--------------------------------------------------------------------------------
/_config.yml:
--------------------------------------------------------------------------------
1 | theme: jekyll-theme-cayman


--------------------------------------------------------------------------------
/app.js:
--------------------------------------------------------------------------------
 1 | var express = require('express');
 2 | var path = require('path');
 3 | var favicon = require('serve-favicon');
 4 | var logger = require('morgan');
 5 | var cookieParser = require('cookie-parser');
 6 | var bodyParser = require('body-parser');
 7 | var http =require('http')
 8 | var routes = require('./routes/index');
 9 | 
10 | var app = express();
11 | 
12 | app.set('port', process.env.PORT || 3333);
13 | app.set('views', path.join(__dirname, 'views'));
14 | app.set('view engine', 'ejs');
15 | app.use(logger('dev'));
16 | app.use(bodyParser.json());
17 | app.use(bodyParser.urlencoded({ extended: true }));
18 | app.use(cookieParser());
19 | app.use(express.static(path.join(__dirname, 'public')));
20 | routes(app);
21 | http.createServer(app).listen(app.get('port'), function(){
22 |   console.log("Express server listening on port " + app.get('port'));
23 | })
24 | 
25 | module.exports = app;


--------------------------------------------------------------------------------
/bin/www:
--------------------------------------------------------------------------------
 1 | #!/usr/bin/env node
 2 | 
 3 | /**
 4 |  * Module dependencies.
 5 |  */
 6 | 
 7 | var app = require('../app');
 8 | var debug = require('debug')('TeamIntro:server');
 9 | var http = require('http');
10 | 
11 | /**
12 |  * Get port from environment and store in Express.
13 |  */
14 | 
15 | var port = normalizePort(process.env.PORT || '3000');
16 | app.set('port', port);
17 | 
18 | /**
19 |  * Create HTTP server.
20 |  */
21 | 
22 | var server = http.createServer(app);
23 | 
24 | /**
25 |  * Listen on provided port, on all network interfaces.
26 |  */
27 | 
28 | server.listen(port);
29 | server.on('error', onError);
30 | server.on('listening', onListening);
31 | 
32 | /**
33 |  * Normalize a port into a number, string, or false.
34 |  */
35 | 
36 | function normalizePort(val) {
37 |   var port = parseInt(val, 10);
38 | 
39 |   if (isNaN(port)) {
40 |     // named pipe
41 |     return val;
42 |   }
43 | 
44 |   if (port >= 0) {
45 |     // port number
46 |     return port;
47 |   }
48 | 
49 |   return false;
50 | }
51 | 
52 | /**
53 |  * Event listener for HTTP server "error" event.
54 |  */
55 | 
56 | function onError(error) {
57 |   if (error.syscall !== 'listen') {
58 |     throw error;
59 |   }
60 | 
61 |   var bind = typeof port === 'string'
62 |     ? 'Pipe ' + port
63 |     : 'Port ' + port;
64 | 
65 |   // handle specific listen errors with friendly messages
66 |   switch (error.code) {
67 |     case 'EACCES':
68 |       console.error(bind + ' requires elevated privileges');
69 |       process.exit(1);
70 |       break;
71 |     case 'EADDRINUSE':
72 |       console.error(bind + ' is already in use');
73 |       process.exit(1);
74 |       break;
75 |     default:
76 |       throw error;
77 |   }
78 | }
79 | 
80 | /**
81 |  * Event listener for HTTP server "listening" event.
82 |  */
83 | 
84 | function onListening() {
85 |   var addr = server.address();
86 |   var bind = typeof addr === 'string'
87 |     ? 'pipe ' + addr
88 |     : 'port ' + addr.port;
89 |   debug('Listening on ' + bind);
90 | }
91 | 


--------------------------------------------------------------------------------
/common/util.js:
--------------------------------------------------------------------------------
 1 | export default {
 2 | 	getUrl:function{
 3 | 		return new Promise((resolve,reject) => {
 4 | 			var xhr = new XMLHttpRequest();
 5 | 			xhr.responseType = `arraybuffer`;
 6 | 			xhr.onload = function() {
 7 | 				if (xhr.status == 200){
 8 | 					resolve(xhr)
 9 | 				} else {
10 | 					reject(new Error(req.statusText))
11 | 				}
12 | 			}
13 | 			xhr.onError = function() {
14 | 				reject(new Error(req.statusTexta))
15 | 			}
16 | 			xhr.send();
17 | 		})
18 | 	}
19 | }


--------------------------------------------------------------------------------
/package-lock.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "name": "TeamIntro",
  3 |   "version": "0.0.0",
  4 |   "lockfileVersion": 1,
  5 |   "requires": true,
  6 |   "dependencies": {
  7 |     "accepts": {
  8 |       "version": "1.3.7",
  9 |       "resolved": "http://npm.in.zhihu.com/accepts/-/accepts-1.3.7.tgz",
 10 |       "integrity": "sha1-UxvHJlF6OytB+FACHGzBXqq1B80=",
 11 |       "requires": {
 12 |         "mime-types": "~2.1.24",
 13 |         "negotiator": "0.6.2"
 14 |       }
 15 |     },
 16 |     "ansi-styles": {
 17 |       "version": "3.2.1",
 18 |       "resolved": "http://npm.in.zhihu.com/ansi-styles/-/ansi-styles-3.2.1.tgz",
 19 |       "integrity": "sha1-QfuyAkPlCxK+DwS43tvwdSDOhB0=",
 20 |       "requires": {
 21 |         "color-convert": "^1.9.0"
 22 |       }
 23 |     },
 24 |     "array-flatten": {
 25 |       "version": "1.1.1",
 26 |       "resolved": "http://npm.in.zhihu.com/array-flatten/-/array-flatten-1.1.1.tgz",
 27 |       "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
 28 |     },
 29 |     "async": {
 30 |       "version": "0.9.2",
 31 |       "resolved": "http://npm.in.zhihu.com/async/-/async-0.9.2.tgz",
 32 |       "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
 33 |     },
 34 |     "balanced-match": {
 35 |       "version": "1.0.0",
 36 |       "resolved": "http://npm.in.zhihu.com/balanced-match/-/balanced-match-1.0.0.tgz",
 37 |       "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c="
 38 |     },
 39 |     "basic-auth": {
 40 |       "version": "2.0.1",
 41 |       "resolved": "http://npm.in.zhihu.com/basic-auth/-/basic-auth-2.0.1.tgz",
 42 |       "integrity": "sha1-uZgnm/R844NEtPPPkW1Gebv1Hjo=",
 43 |       "requires": {
 44 |         "safe-buffer": "5.1.2"
 45 |       }
 46 |     },
 47 |     "body-parser": {
 48 |       "version": "1.19.0",
 49 |       "resolved": "http://npm.in.zhihu.com/body-parser/-/body-parser-1.19.0.tgz",
 50 |       "integrity": "sha1-lrJwnlfJxOCab9Zqj9l5hE9p8Io=",
 51 |       "requires": {
 52 |         "bytes": "3.1.0",
 53 |         "content-type": "~1.0.4",
 54 |         "debug": "2.6.9",
 55 |         "depd": "~1.1.2",
 56 |         "http-errors": "1.7.2",
 57 |         "iconv-lite": "0.4.24",
 58 |         "on-finished": "~2.3.0",
 59 |         "qs": "6.7.0",
 60 |         "raw-body": "2.4.0",
 61 |         "type-is": "~1.6.17"
 62 |       },
 63 |       "dependencies": {
 64 |         "debug": {
 65 |           "version": "2.6.9",
 66 |           "resolved": "http://npm.in.zhihu.com/debug/-/debug-2.6.9.tgz",
 67 |           "integrity": "sha1-XRKFFd8TT/Mn6QpMk/Tgd6U2NB8=",
 68 |           "requires": {
 69 |             "ms": "2.0.0"
 70 |           }
 71 |         }
 72 |       }
 73 |     },
 74 |     "brace-expansion": {
 75 |       "version": "1.1.11",
 76 |       "resolved": "http://npm.in.zhihu.com/brace-expansion/-/brace-expansion-1.1.11.tgz",
 77 |       "integrity": "sha1-PH/L9SnYcibz0vUrlm/1Jx60Qd0=",
 78 |       "requires": {
 79 |         "balanced-match": "^1.0.0",
 80 |         "concat-map": "0.0.1"
 81 |       }
 82 |     },
 83 |     "bytes": {
 84 |       "version": "3.1.0",
 85 |       "resolved": "http://npm.in.zhihu.com/bytes/-/bytes-3.1.0.tgz",
 86 |       "integrity": "sha1-9s95M6Ng4FiPqf3oVlHNx/gF0fY="
 87 |     },
 88 |     "chalk": {
 89 |       "version": "2.4.2",
 90 |       "resolved": "http://npm.in.zhihu.com/chalk/-/chalk-2.4.2.tgz",
 91 |       "integrity": "sha1-zUJUFnelQzPPVBpJEIwUMrRMlCQ=",
 92 |       "requires": {
 93 |         "ansi-styles": "^3.2.1",
 94 |         "escape-string-regexp": "^1.0.5",
 95 |         "supports-color": "^5.3.0"
 96 |       }
 97 |     },
 98 |     "color-convert": {
 99 |       "version": "1.9.3",
100 |       "resolved": "http://npm.in.zhihu.com/color-convert/-/color-convert-1.9.3.tgz",
101 |       "integrity": "sha1-u3GFBpDh8TZWfeYp0tVHHe2kweg=",
102 |       "requires": {
103 |         "color-name": "1.1.3"
104 |       }
105 |     },
106 |     "color-name": {
107 |       "version": "1.1.3",
108 |       "resolved": "http://npm.in.zhihu.com/color-name/-/color-name-1.1.3.tgz",
109 |       "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
110 |     },
111 |     "concat-map": {
112 |       "version": "0.0.1",
113 |       "resolved": "http://npm.in.zhihu.com/concat-map/-/concat-map-0.0.1.tgz",
114 |       "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
115 |     },
116 |     "content-disposition": {
117 |       "version": "0.5.3",
118 |       "resolved": "http://npm.in.zhihu.com/content-disposition/-/content-disposition-0.5.3.tgz",
119 |       "integrity": "sha1-4TDK9+cnkIfFYWwgB9BIVpiYT70=",
120 |       "requires": {
121 |         "safe-buffer": "5.1.2"
122 |       }
123 |     },
124 |     "content-type": {
125 |       "version": "1.0.4",
126 |       "resolved": "http://npm.in.zhihu.com/content-type/-/content-type-1.0.4.tgz",
127 |       "integrity": "sha1-4TjMdeBAxyexlm/l5fjJruJW/js="
128 |     },
129 |     "cookie": {
130 |       "version": "0.4.0",
131 |       "resolved": "http://npm.in.zhihu.com/cookie/-/cookie-0.4.0.tgz",
132 |       "integrity": "sha1-vrQ35wIrO21JAZ0IhmUwPr6cFLo="
133 |     },
134 |     "cookie-parser": {
135 |       "version": "1.4.5",
136 |       "resolved": "http://npm.in.zhihu.com/cookie-parser/-/cookie-parser-1.4.5.tgz",
137 |       "integrity": "sha1-PlctS3wMgPnGHa9gTkM2gxtdHUk=",
138 |       "requires": {
139 |         "cookie": "0.4.0",
140 |         "cookie-signature": "1.0.6"
141 |       }
142 |     },
143 |     "cookie-signature": {
144 |       "version": "1.0.6",
145 |       "resolved": "http://npm.in.zhihu.com/cookie-signature/-/cookie-signature-1.0.6.tgz",
146 |       "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
147 |     },
148 |     "debug": {
149 |       "version": "4.1.1",
150 |       "resolved": "http://npm.in.zhihu.com/debug/-/debug-4.1.1.tgz",
151 |       "integrity": "sha1-O3ImAlUQnGtYnO4FDx1RYTlmR5E=",
152 |       "requires": {
153 |         "ms": "^2.1.1"
154 |       },
155 |       "dependencies": {
156 |         "ms": {
157 |           "version": "2.1.2",
158 |           "resolved": "http://npm.in.zhihu.com/ms/-/ms-2.1.2.tgz",
159 |           "integrity": "sha1-0J0fNXtEP0kzgqjrPM0YOHKuYAk="
160 |         }
161 |       }
162 |     },
163 |     "depd": {
164 |       "version": "1.1.2",
165 |       "resolved": "http://npm.in.zhihu.com/depd/-/depd-1.1.2.tgz",
166 |       "integrity": "sha1-m81S4UwJd2PnSbJ0xDRu0uVgtak="
167 |     },
168 |     "destroy": {
169 |       "version": "1.0.4",
170 |       "resolved": "http://npm.in.zhihu.com/destroy/-/destroy-1.0.4.tgz",
171 |       "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA="
172 |     },
173 |     "ee-first": {
174 |       "version": "1.1.1",
175 |       "resolved": "http://npm.in.zhihu.com/ee-first/-/ee-first-1.1.1.tgz",
176 |       "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
177 |     },
178 |     "ejs": {
179 |       "version": "3.1.3",
180 |       "resolved": "http://npm.in.zhihu.com/ejs/-/ejs-3.1.3.tgz",
181 |       "integrity": "sha1-UU2WeoiUCE0Y09R70WmhwFYPCT0=",
182 |       "requires": {
183 |         "jake": "^10.6.1"
184 |       }
185 |     },
186 |     "encodeurl": {
187 |       "version": "1.0.2",
188 |       "resolved": "http://npm.in.zhihu.com/encodeurl/-/encodeurl-1.0.2.tgz",
189 |       "integrity": "sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k="
190 |     },
191 |     "escape-html": {
192 |       "version": "1.0.3",
193 |       "resolved": "http://npm.in.zhihu.com/escape-html/-/escape-html-1.0.3.tgz",
194 |       "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
195 |     },
196 |     "escape-string-regexp": {
197 |       "version": "1.0.5",
198 |       "resolved": "http://npm.in.zhihu.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
199 |       "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
200 |     },
201 |     "etag": {
202 |       "version": "1.8.1",
203 |       "resolved": "http://npm.in.zhihu.com/etag/-/etag-1.8.1.tgz",
204 |       "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc="
205 |     },
206 |     "express": {
207 |       "version": "4.17.1",
208 |       "resolved": "http://npm.in.zhihu.com/express/-/express-4.17.1.tgz",
209 |       "integrity": "sha1-RJH8OGBc9R+GKdOcK10Cb5ikwTQ=",
210 |       "requires": {
211 |         "accepts": "~1.3.7",
212 |         "array-flatten": "1.1.1",
213 |         "body-parser": "1.19.0",
214 |         "content-disposition": "0.5.3",
215 |         "content-type": "~1.0.4",
216 |         "cookie": "0.4.0",
217 |         "cookie-signature": "1.0.6",
218 |         "debug": "2.6.9",
219 |         "depd": "~1.1.2",
220 |         "encodeurl": "~1.0.2",
221 |         "escape-html": "~1.0.3",
222 |         "etag": "~1.8.1",
223 |         "finalhandler": "~1.1.2",
224 |         "fresh": "0.5.2",
225 |         "merge-descriptors": "1.0.1",
226 |         "methods": "~1.1.2",
227 |         "on-finished": "~2.3.0",
228 |         "parseurl": "~1.3.3",
229 |         "path-to-regexp": "0.1.7",
230 |         "proxy-addr": "~2.0.5",
231 |         "qs": "6.7.0",
232 |         "range-parser": "~1.2.1",
233 |         "safe-buffer": "5.1.2",
234 |         "send": "0.17.1",
235 |         "serve-static": "1.14.1",
236 |         "setprototypeof": "1.1.1",
237 |         "statuses": "~1.5.0",
238 |         "type-is": "~1.6.18",
239 |         "utils-merge": "1.0.1",
240 |         "vary": "~1.1.2"
241 |       },
242 |       "dependencies": {
243 |         "body-parser": {
244 |           "version": "1.19.0",
245 |           "resolved": "http://npm.in.zhihu.com/body-parser/-/body-parser-1.19.0.tgz",
246 |           "integrity": "sha1-lrJwnlfJxOCab9Zqj9l5hE9p8Io=",
247 |           "requires": {
248 |             "bytes": "3.1.0",
249 |             "content-type": "~1.0.4",
250 |             "debug": "2.6.9",
251 |             "depd": "~1.1.2",
252 |             "http-errors": "1.7.2",
253 |             "iconv-lite": "0.4.24",
254 |             "on-finished": "~2.3.0",
255 |             "qs": "6.7.0",
256 |             "raw-body": "2.4.0",
257 |             "type-is": "~1.6.17"
258 |           }
259 |         },
260 |         "debug": {
261 |           "version": "2.6.9",
262 |           "resolved": "http://npm.in.zhihu.com/debug/-/debug-2.6.9.tgz",
263 |           "integrity": "sha1-XRKFFd8TT/Mn6QpMk/Tgd6U2NB8=",
264 |           "requires": {
265 |             "ms": "2.0.0"
266 |           }
267 |         }
268 |       }
269 |     },
270 |     "filelist": {
271 |       "version": "1.0.1",
272 |       "resolved": "http://npm.in.zhihu.com/filelist/-/filelist-1.0.1.tgz",
273 |       "integrity": "sha1-8Q0aOuhsFpSAjo8gkG9D1MkTLbs=",
274 |       "requires": {
275 |         "minimatch": "^3.0.4"
276 |       }
277 |     },
278 |     "finalhandler": {
279 |       "version": "1.1.2",
280 |       "resolved": "http://npm.in.zhihu.com/finalhandler/-/finalhandler-1.1.2.tgz",
281 |       "integrity": "sha1-t+fQAP/RGTjQ/bBTUG9uur6fWH0=",
282 |       "requires": {
283 |         "debug": "2.6.9",
284 |         "encodeurl": "~1.0.2",
285 |         "escape-html": "~1.0.3",
286 |         "on-finished": "~2.3.0",
287 |         "parseurl": "~1.3.3",
288 |         "statuses": "~1.5.0",
289 |         "unpipe": "~1.0.0"
290 |       },
291 |       "dependencies": {
292 |         "debug": {
293 |           "version": "2.6.9",
294 |           "resolved": "http://npm.in.zhihu.com/debug/-/debug-2.6.9.tgz",
295 |           "integrity": "sha1-XRKFFd8TT/Mn6QpMk/Tgd6U2NB8=",
296 |           "requires": {
297 |             "ms": "2.0.0"
298 |           }
299 |         }
300 |       }
301 |     },
302 |     "forwarded": {
303 |       "version": "0.1.2",
304 |       "resolved": "http://npm.in.zhihu.com/forwarded/-/forwarded-0.1.2.tgz",
305 |       "integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ="
306 |     },
307 |     "fresh": {
308 |       "version": "0.5.2",
309 |       "resolved": "http://npm.in.zhihu.com/fresh/-/fresh-0.5.2.tgz",
310 |       "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac="
311 |     },
312 |     "has-flag": {
313 |       "version": "3.0.0",
314 |       "resolved": "http://npm.in.zhihu.com/has-flag/-/has-flag-3.0.0.tgz",
315 |       "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0="
316 |     },
317 |     "http-errors": {
318 |       "version": "1.7.2",
319 |       "resolved": "http://npm.in.zhihu.com/http-errors/-/http-errors-1.7.2.tgz",
320 |       "integrity": "sha1-T1ApzxMjnzEDblsuVSkrz7zIXI8=",
321 |       "requires": {
322 |         "depd": "~1.1.2",
323 |         "inherits": "2.0.3",
324 |         "setprototypeof": "1.1.1",
325 |         "statuses": ">= 1.5.0 < 2",
326 |         "toidentifier": "1.0.0"
327 |       }
328 |     },
329 |     "iconv-lite": {
330 |       "version": "0.4.24",
331 |       "resolved": "http://npm.in.zhihu.com/iconv-lite/-/iconv-lite-0.4.24.tgz",
332 |       "integrity": "sha1-ICK0sl+93CHS9SSXSkdKr+czkIs=",
333 |       "requires": {
334 |         "safer-buffer": ">= 2.1.2 < 3"
335 |       }
336 |     },
337 |     "inherits": {
338 |       "version": "2.0.3",
339 |       "resolved": "http://npm.in.zhihu.com/inherits/-/inherits-2.0.3.tgz",
340 |       "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
341 |     },
342 |     "ipaddr.js": {
343 |       "version": "1.9.1",
344 |       "resolved": "http://npm.in.zhihu.com/ipaddr.js/-/ipaddr.js-1.9.1.tgz",
345 |       "integrity": "sha1-v/OFQ+64mEglB5/zoqjmy9RngbM="
346 |     },
347 |     "jake": {
348 |       "version": "10.8.2",
349 |       "resolved": "http://npm.in.zhihu.com/jake/-/jake-10.8.2.tgz",
350 |       "integrity": "sha1-68nehVgWCmbYLQ6txqLlj7xQCns=",
351 |       "requires": {
352 |         "async": "0.9.x",
353 |         "chalk": "^2.4.2",
354 |         "filelist": "^1.0.1",
355 |         "minimatch": "^3.0.4"
356 |       }
357 |     },
358 |     "media-typer": {
359 |       "version": "0.3.0",
360 |       "resolved": "http://npm.in.zhihu.com/media-typer/-/media-typer-0.3.0.tgz",
361 |       "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g="
362 |     },
363 |     "merge-descriptors": {
364 |       "version": "1.0.1",
365 |       "resolved": "http://npm.in.zhihu.com/merge-descriptors/-/merge-descriptors-1.0.1.tgz",
366 |       "integrity": "sha1-sAqqVW3YtEVoFQ7J0blT8/kMu2E="
367 |     },
368 |     "methods": {
369 |       "version": "1.1.2",
370 |       "resolved": "http://npm.in.zhihu.com/methods/-/methods-1.1.2.tgz",
371 |       "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
372 |     },
373 |     "mime": {
374 |       "version": "1.6.0",
375 |       "resolved": "http://npm.in.zhihu.com/mime/-/mime-1.6.0.tgz",
376 |       "integrity": "sha1-Ms2eXGRVO9WNGaVor0Uqz/BJgbE="
377 |     },
378 |     "mime-db": {
379 |       "version": "1.44.0",
380 |       "resolved": "http://npm.in.zhihu.com/mime-db/-/mime-db-1.44.0.tgz",
381 |       "integrity": "sha1-+hHF6wrKEzS0Izy01S8QxaYnL5I="
382 |     },
383 |     "mime-types": {
384 |       "version": "2.1.27",
385 |       "resolved": "http://npm.in.zhihu.com/mime-types/-/mime-types-2.1.27.tgz",
386 |       "integrity": "sha1-R5SfmOJ56lMRn1ci4PNOUpvsAJ8=",
387 |       "requires": {
388 |         "mime-db": "1.44.0"
389 |       }
390 |     },
391 |     "minimatch": {
392 |       "version": "3.0.4",
393 |       "resolved": "http://npm.in.zhihu.com/minimatch/-/minimatch-3.0.4.tgz",
394 |       "integrity": "sha1-UWbihkV/AzBgZL5Ul+jbsMPTIIM=",
395 |       "requires": {
396 |         "brace-expansion": "^1.1.7"
397 |       }
398 |     },
399 |     "morgan": {
400 |       "version": "1.10.0",
401 |       "resolved": "http://npm.in.zhihu.com/morgan/-/morgan-1.10.0.tgz",
402 |       "integrity": "sha1-CRd4q8H8R801CYJGU9rh+qtrF9c=",
403 |       "requires": {
404 |         "basic-auth": "~2.0.1",
405 |         "debug": "2.6.9",
406 |         "depd": "~2.0.0",
407 |         "on-finished": "~2.3.0",
408 |         "on-headers": "~1.0.2"
409 |       },
410 |       "dependencies": {
411 |         "debug": {
412 |           "version": "2.6.9",
413 |           "resolved": "http://npm.in.zhihu.com/debug/-/debug-2.6.9.tgz",
414 |           "integrity": "sha1-XRKFFd8TT/Mn6QpMk/Tgd6U2NB8=",
415 |           "requires": {
416 |             "ms": "2.0.0"
417 |           }
418 |         },
419 |         "depd": {
420 |           "version": "2.0.0",
421 |           "resolved": "http://npm.in.zhihu.com/depd/-/depd-2.0.0.tgz",
422 |           "integrity": "sha1-tpYWPMdXVg0JzyLMj60Vcbeedt8="
423 |         }
424 |       }
425 |     },
426 |     "ms": {
427 |       "version": "2.0.0",
428 |       "resolved": "http://npm.in.zhihu.com/ms/-/ms-2.0.0.tgz",
429 |       "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
430 |     },
431 |     "negotiator": {
432 |       "version": "0.6.2",
433 |       "resolved": "http://npm.in.zhihu.com/negotiator/-/negotiator-0.6.2.tgz",
434 |       "integrity": "sha1-/qz3zPUlp3rpY0Q2pkiD/+yjRvs="
435 |     },
436 |     "on-finished": {
437 |       "version": "2.3.0",
438 |       "resolved": "http://npm.in.zhihu.com/on-finished/-/on-finished-2.3.0.tgz",
439 |       "integrity": "sha1-IPEzZIGwg811M3mSoWlxqi2QaUc=",
440 |       "requires": {
441 |         "ee-first": "1.1.1"
442 |       }
443 |     },
444 |     "on-headers": {
445 |       "version": "1.0.2",
446 |       "resolved": "http://npm.in.zhihu.com/on-headers/-/on-headers-1.0.2.tgz",
447 |       "integrity": "sha1-dysK5qqlJcOZ5Imt+tkMQD6zwo8="
448 |     },
449 |     "parseurl": {
450 |       "version": "1.3.3",
451 |       "resolved": "http://npm.in.zhihu.com/parseurl/-/parseurl-1.3.3.tgz",
452 |       "integrity": "sha1-naGee+6NEt/wUT7Vt2lXeTvC6NQ="
453 |     },
454 |     "path-to-regexp": {
455 |       "version": "0.1.7",
456 |       "resolved": "http://npm.in.zhihu.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
457 |       "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
458 |     },
459 |     "proxy-addr": {
460 |       "version": "2.0.6",
461 |       "resolved": "http://npm.in.zhihu.com/proxy-addr/-/proxy-addr-2.0.6.tgz",
462 |       "integrity": "sha1-/cIzZQVEfT8vLGOO0nLK9hS7sr8=",
463 |       "requires": {
464 |         "forwarded": "~0.1.2",
465 |         "ipaddr.js": "1.9.1"
466 |       }
467 |     },
468 |     "qs": {
469 |       "version": "6.7.0",
470 |       "resolved": "http://npm.in.zhihu.com/qs/-/qs-6.7.0.tgz",
471 |       "integrity": "sha1-QdwaAV49WB8WIXdr4xr7KHapsbw="
472 |     },
473 |     "range-parser": {
474 |       "version": "1.2.1",
475 |       "resolved": "http://npm.in.zhihu.com/range-parser/-/range-parser-1.2.1.tgz",
476 |       "integrity": "sha1-PPNwI9GZ4cJNGlW4SADC8+ZGgDE="
477 |     },
478 |     "raw-body": {
479 |       "version": "2.4.0",
480 |       "resolved": "http://npm.in.zhihu.com/raw-body/-/raw-body-2.4.0.tgz",
481 |       "integrity": "sha1-oc5vucm8NWylLoklarWQWeE9AzI=",
482 |       "requires": {
483 |         "bytes": "3.1.0",
484 |         "http-errors": "1.7.2",
485 |         "iconv-lite": "0.4.24",
486 |         "unpipe": "1.0.0"
487 |       }
488 |     },
489 |     "safe-buffer": {
490 |       "version": "5.1.2",
491 |       "resolved": "http://npm.in.zhihu.com/safe-buffer/-/safe-buffer-5.1.2.tgz",
492 |       "integrity": "sha1-mR7GnSluAxN0fVm9/St0XDX4go0="
493 |     },
494 |     "safer-buffer": {
495 |       "version": "2.1.2",
496 |       "resolved": "http://npm.in.zhihu.com/safer-buffer/-/safer-buffer-2.1.2.tgz",
497 |       "integrity": "sha1-RPoWGwGHuVSd2Eu5GAL5vYOFzWo="
498 |     },
499 |     "send": {
500 |       "version": "0.17.1",
501 |       "resolved": "http://npm.in.zhihu.com/send/-/send-0.17.1.tgz",
502 |       "integrity": "sha1-wdiwWfeQD3Rm3Uk4vcROEd2zdsg=",
503 |       "requires": {
504 |         "debug": "2.6.9",
505 |         "depd": "~1.1.2",
506 |         "destroy": "~1.0.4",
507 |         "encodeurl": "~1.0.2",
508 |         "escape-html": "~1.0.3",
509 |         "etag": "~1.8.1",
510 |         "fresh": "0.5.2",
511 |         "http-errors": "~1.7.2",
512 |         "mime": "1.6.0",
513 |         "ms": "2.1.1",
514 |         "on-finished": "~2.3.0",
515 |         "range-parser": "~1.2.1",
516 |         "statuses": "~1.5.0"
517 |       },
518 |       "dependencies": {
519 |         "debug": {
520 |           "version": "2.6.9",
521 |           "resolved": "http://npm.in.zhihu.com/debug/-/debug-2.6.9.tgz",
522 |           "integrity": "sha1-XRKFFd8TT/Mn6QpMk/Tgd6U2NB8=",
523 |           "requires": {
524 |             "ms": "2.0.0"
525 |           },
526 |           "dependencies": {
527 |             "ms": {
528 |               "version": "2.0.0",
529 |               "resolved": "http://npm.in.zhihu.com/ms/-/ms-2.0.0.tgz",
530 |               "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
531 |             }
532 |           }
533 |         },
534 |         "ms": {
535 |           "version": "2.1.1",
536 |           "resolved": "http://npm.in.zhihu.com/ms/-/ms-2.1.1.tgz",
537 |           "integrity": "sha1-MKWGTrPrsKZvLr5tcnrwagnYbgo="
538 |         }
539 |       }
540 |     },
541 |     "serve-favicon": {
542 |       "version": "2.5.0",
543 |       "resolved": "http://npm.in.zhihu.com/serve-favicon/-/serve-favicon-2.5.0.tgz",
544 |       "integrity": "sha1-k10kDN/g9YBTB/3+ln2IlCosvPA=",
545 |       "requires": {
546 |         "etag": "~1.8.1",
547 |         "fresh": "0.5.2",
548 |         "ms": "2.1.1",
549 |         "parseurl": "~1.3.2",
550 |         "safe-buffer": "5.1.1"
551 |       },
552 |       "dependencies": {
553 |         "ms": {
554 |           "version": "2.1.1",
555 |           "resolved": "http://npm.in.zhihu.com/ms/-/ms-2.1.1.tgz",
556 |           "integrity": "sha1-MKWGTrPrsKZvLr5tcnrwagnYbgo="
557 |         },
558 |         "safe-buffer": {
559 |           "version": "5.1.1",
560 |           "resolved": "http://npm.in.zhihu.com/safe-buffer/-/safe-buffer-5.1.1.tgz",
561 |           "integrity": "sha1-iTMSr2myEj3vcfV4iQAWce6yyFM="
562 |         }
563 |       }
564 |     },
565 |     "serve-static": {
566 |       "version": "1.14.1",
567 |       "resolved": "http://npm.in.zhihu.com/serve-static/-/serve-static-1.14.1.tgz",
568 |       "integrity": "sha1-Zm5jbcTwEPfvKZcKiKZ0MgiYsvk=",
569 |       "requires": {
570 |         "encodeurl": "~1.0.2",
571 |         "escape-html": "~1.0.3",
572 |         "parseurl": "~1.3.3",
573 |         "send": "0.17.1"
574 |       }
575 |     },
576 |     "setprototypeof": {
577 |       "version": "1.1.1",
578 |       "resolved": "http://npm.in.zhihu.com/setprototypeof/-/setprototypeof-1.1.1.tgz",
579 |       "integrity": "sha1-fpWsskqpL1iF4KvvW6ExMw1K5oM="
580 |     },
581 |     "statuses": {
582 |       "version": "1.5.0",
583 |       "resolved": "http://npm.in.zhihu.com/statuses/-/statuses-1.5.0.tgz",
584 |       "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow="
585 |     },
586 |     "supports-color": {
587 |       "version": "5.5.0",
588 |       "resolved": "http://npm.in.zhihu.com/supports-color/-/supports-color-5.5.0.tgz",
589 |       "integrity": "sha1-4uaaRKyHcveKHsCzW2id9lMO/I8=",
590 |       "requires": {
591 |         "has-flag": "^3.0.0"
592 |       }
593 |     },
594 |     "toidentifier": {
595 |       "version": "1.0.0",
596 |       "resolved": "http://npm.in.zhihu.com/toidentifier/-/toidentifier-1.0.0.tgz",
597 |       "integrity": "sha1-fhvjRw8ed5SLxD2Uo8j013UrpVM="
598 |     },
599 |     "type-is": {
600 |       "version": "1.6.18",
601 |       "resolved": "http://npm.in.zhihu.com/type-is/-/type-is-1.6.18.tgz",
602 |       "integrity": "sha1-TlUs0F3wlGfcvE73Od6J8s83wTE=",
603 |       "requires": {
604 |         "media-typer": "0.3.0",
605 |         "mime-types": "~2.1.24"
606 |       }
607 |     },
608 |     "unpipe": {
609 |       "version": "1.0.0",
610 |       "resolved": "http://npm.in.zhihu.com/unpipe/-/unpipe-1.0.0.tgz",
611 |       "integrity": "sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw="
612 |     },
613 |     "utils-merge": {
614 |       "version": "1.0.1",
615 |       "resolved": "http://npm.in.zhihu.com/utils-merge/-/utils-merge-1.0.1.tgz",
616 |       "integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM="
617 |     },
618 |     "vary": {
619 |       "version": "1.1.2",
620 |       "resolved": "http://npm.in.zhihu.com/vary/-/vary-1.1.2.tgz",
621 |       "integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw="
622 |     }
623 |   }
624 | }
625 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "TeamIntro",
 3 |   "version": "0.0.0",
 4 |   "private": true,
 5 |   "scripts": {
 6 |     "start": "node ./bin/www"
 7 |   },
 8 |   "dependencies": {
 9 |     "body-parser": "^1.19.0",
10 |     "cookie-parser": "^1.4.5",
11 |     "debug": "^4.1.1",
12 |     "ejs": "^3.1.3",
13 |     "express": "^4.17.1",
14 |     "morgan": "^1.10.0",
15 |     "serve-favicon": "^2.5.0"
16 |   }
17 | }
18 | 


--------------------------------------------------------------------------------
/public/.DS_Store:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/zy941002/PEANUT/0a268a946f6543ccdee930ad2d3fb8b186b2078a/public/.DS_Store


--------------------------------------------------------------------------------
/public/music/Deep Side - Booty Music.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/zy941002/PEANUT/0a268a946f6543ccdee930ad2d3fb8b186b2078a/public/music/Deep Side - Booty Music.mp3


--------------------------------------------------------------------------------
/public/music/Kate Havnevik - Think Again.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/zy941002/PEANUT/0a268a946f6543ccdee930ad2d3fb8b186b2078a/public/music/Kate Havnevik - Think Again.mp3


--------------------------------------------------------------------------------
/public/music/Katie Herzig - Forevermore.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/zy941002/PEANUT/0a268a946f6543ccdee930ad2d3fb8b186b2078a/public/music/Katie Herzig - Forevermore.mp3


--------------------------------------------------------------------------------
/public/music/The Fratellis - Dogtown.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/zy941002/PEANUT/0a268a946f6543ccdee930ad2d3fb8b186b2078a/public/music/The Fratellis - Dogtown.mp3


--------------------------------------------------------------------------------
/public/music/俞胜恩 - 오유야유.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/zy941002/PEANUT/0a268a946f6543ccdee930ad2d3fb8b186b2078a/public/music/俞胜恩 - 오유야유.mp3


--------------------------------------------------------------------------------
/public/music/蔡健雅 - 红色高跟鞋.mp3:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/zy941002/PEANUT/0a268a946f6543ccdee930ad2d3fb8b186b2078a/public/music/蔡健雅 - 红色高跟鞋.mp3


--------------------------------------------------------------------------------
/routes/config.js:
--------------------------------------------------------------------------------
 1 | const fs  = require(`fs`);
 2 | const path = require(`path`)
 3 | 
 4 | const paths = [
 5 |   '/',
 6 |   '/balls',
 7 |   '/blink',
 8 |   '/lineball',
 9 |   '/loading',
10 |   '/music',
11 |   '/night',
12 |   '/qbaby'
13 | ];
14 | 
15 | module.exports = paths;
16 | 


--------------------------------------------------------------------------------
/routes/index.js:
--------------------------------------------------------------------------------
 1 | const express = require('express');
 2 | const path = require(`path`);
 3 | const fs  = require(`fs`);
 4 | const paths = require('./config');
 5 | const music = path.join(__dirname, '../public/music');
 6 | 
 7 | /* GET home page. */
 8 | module.exports = function(app) {
 9 |   paths.map(route => {
10 |     app.get(`${route}`, (req, res, next) => {
11 |       let data;
12 |       switch (route) {
13 |         case '/':
14 |           data = paths;
15 |           break;
16 |         default:
17 |           break;
18 |       }
19 |       res.render(path.join(__dirname, `../views${route}`), { data });
20 |       next();
21 |     });
22 |   });
23 | 
24 |   app.get(`/music`, (req, res, next) => {
25 |     fs.readdir(music, (err, music) => {
26 |       if (err) {
27 |         console.log(err);
28 |         return;
29 |       }
30 |       res.render(`music`, { music });
31 |     });
32 |   });
33 | };


--------------------------------------------------------------------------------
/routes/users.js:
--------------------------------------------------------------------------------
 1 | var express = require('express');
 2 | var router = express.Router();
 3 | 
 4 | /* GET users listing. */
 5 | router.get('/', function(req, res, next) {
 6 |   res.send('respond with a resource');
 7 | });
 8 | 
 9 | module.exports = router;
10 | 


--------------------------------------------------------------------------------
/views/balls/.DS_Store:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/zy941002/PEANUT/0a268a946f6543ccdee930ad2d3fb8b186b2078a/views/balls/.DS_Store


--------------------------------------------------------------------------------
/views/balls/index.ejs:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 | <head>
 4 | 	<meta charset="UTF-8">
 5 | 	<title>Balls</title>
 6 | 	<style type="text/css">
 7 | 		* {
 8 |       margin:0;
 9 |       padding:0;
10 |     }
11 |     body{
12 |       background: black;
13 |     }
14 | 	</style>
15 | </head>
16 | <body>
17 | 	<canvas id="can">升级你的浏览器</canvas>
18 | </body>
19 | <script type="text/javascript">
20 |   window.onload= function() {
21 |     WIN_WIDTH = document.documentElement.clientWidth;
22 |     WIN_HEIGHT = document.documentElement.clientHeight;
23 |       Canvas = document.getElementById("can");
24 |     CTX = Canvas.getContext("2d");
25 |     BALLS=[];
26 | 
27 |     Canvas.init = function(){
28 |       this.width = WIN_WIDTH;
29 |       this.height = WIN_HEIGHT;
30 |     }
31 | 
32 |     Canvas.drawball = function(x,y,r){
33 |       CTX.fillStyle="white";
34 |       CTX.beginPath();
35 |       CTX.arc(x,y,r,0,2*Math.PI,true);
36 |       CTX.closePath();
37 |       CTX.fill();
38 |     }
39 | 
40 |     function getBalls(num){
41 |       for (var i = 0; i < num; i++) {
42 |         var ball ={
43 |           pos: {
44 |             x: Math.random()*WIN_WIDTH,
45 |             y: Math.random()*WIN_HEIGHT,
46 |           },
47 |           r: Math.random() * 10,
48 |           vx: Math.random() * 1,  //水平速度
49 |           vy: Math.random() * 3,  //垂直速度
50 |           a: Math.random() * 5
51 |         }
52 |         BALLS.push(ball);
53 |       }
54 |     }
55 | 
56 |     function drawBalls(){
57 |       CTX.clearRect(0,0,WIN_WIDTH,WIN_HEIGHT);
58 |       BALLS.forEach(function(ball){
59 |         Canvas.drawball(ball.pos.x,ball.pos.y,ball.r,0,2*Math,true)
60 |       })
61 |     }
62 | 
63 |     function upDate(){
64 |       BALLS.forEach(function(ball){
65 |         ball.pos.x += ball.vx;
66 |         ball.pos.y += ball.vy;
67 |         if (ball.pos.y + ball.r > WIN_HEIGHT || ball.pos.y < ball.r){
68 |           ball.vy -= ball.vy;
69 |         }
70 |         else if (ball.pos.x + ball.r > WIN_WIDTH|| ball.pos.x < ball.r) {
71 |           ball.vx -= ball.vx;
72 |         }
73 |       });
74 |     }
75 | 
76 |     function main() {
77 |       getBalls(100);
78 |       Canvas.init();
79 |       setInterval(function(){
80 |         drawBalls();
81 |         upDate();
82 |       }, 16.7)
83 |     }
84 | 
85 |     main();
86 |   }
87 | </script>
88 | </html>


--------------------------------------------------------------------------------
/views/blink/index.ejs:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html lang="en">
  3 | <head>
  4 | 	<meta charset="UTF-8">
  5 | 	<link rel="stylesheet" href="../blink/style.css">
  6 | 	<title>Blink eyes</title>
  7 | 	<style>*{
  8 | 	margin: 0;
  9 | 	padding: 0;
 10 | 	background: black;
 11 | }
 12 | #EYE{
 13 | 	position: relative;
 14 | 	width: 400px;
 15 | 	height: 400px;
 16 | 	margin: 0 auto;
 17 | 	background: none;
 18 | 	transform-style: preserve-3d;
 19 | 	-moz-transform-style: preserve-3d;
 20 | 	-webkit-transform-style: preserve-3d;
 21 | 	-ms-transform-style: preserve-3d;
 22 | 	-o-transform-style: preserve-3d;
 23 | }
 24 | #Outer{
 25 | 	position: absolute;
 26 | 	width: 400px;
 27 | 	height: 400px;
 28 | 	border-radius: 50% 50%;
 29 | 	margin: 0 auto;
 30 | 	border:10px solid white;
 31 | 	background: none;
 32 | 	-webkit-box-shadow:0 0 100px rgba(81 ,203,238,1) inset ,0 0 200px rgba(81 ,203,238,1);
 33 | 	-moz-box-shadow:0 0 100px rgba(81 ,203,238,1) inset ,0 0 200px rgba(81 ,203,238,1);
 34 | 	-o-box-shadow:0 0 100px rgba(81 ,203,238,1) inset ,0 0 200px rgba(81 ,203,238,1);
 35 | 	-ms-box-shadow:0 0 100px rgba(81 ,203,238,1) inset ,0 0 200px rgba(81 ,203,238,1);
 36 | 	box-shadow:0 0 100px rgba(81 ,203,238,1) inset ,0 0 200px rgba(81 ,203,238,1);
 37 | 	animation: blink 2s  infinite ease-out;
 38 | 	-moz-animation: blink 2s  infinite ease-out;
 39 | 	-webkit-animation: blink 2s  infinite ease-out;
 40 | 	-ms-animation: blink 2s  infinite ease-out;
 41 | 	-o-animation: blink 2s  infinite ease-out;
 42 | }
 43 | #Inner{
 44 | 	position: absolute;
 45 | 	width: 150px;
 46 | 	height: 150px;
 47 | 	border-radius: 50% 50%;
 48 | 	margin: 135px;
 49 | 	background: white;
 50 | 	-webkit-box-shadow:0 0 10px rgba(81 ,203,238,1) inset ,0 0 200px rgba(81 ,203,238,1);
 51 | 	-moz-box-shadow:0 0 10px rgba(81 ,203,238,1) inset ,0 0 200px rgba(81 ,203,238,1);
 52 | 	-o-box-shadow:0 0 10px rgba(81 ,203,238,1) inset ,0 0 200px rgba(81 ,203,238,1);
 53 | 	-ms-box-shadow:0 0 10px rgba(81 ,203,238,1) inset ,0 0 200px rgba(81 ,203,238,1);
 54 | 	box-shadow:0 0 10px rgba(81 ,203,238,1) inset ,0 0 200px rgba(81 ,203,238,1);
 55 | 	animation: pupil 2s  infinite ease-out;
 56 | 	-moz-animation: pupil 2s  infinite ease-out;
 57 | 	-webkit-animation: pupil 2s  infinite ease-out;
 58 | 	-ms-animation: pupil 2s  infinite ease-out;
 59 | 	-o-animation: pupil 2s  infinite ease-out;
 60 | }
 61 | @keyframes blink {
 62 | 	0% {
 63 | 		transform:rotateX(90deg);
 64 | 	}
 65 | 	30% {
 66 | 		transform: scale(1.1);
 67 | 	}
 68 | 	35% {
 69 | 		transform: scale(1);
 70 | 	}
 71 | 	60%{
 72 | 		transform:rotateX(90deg);
 73 | 	}
 74 | 	65%{
 75 | 		transform:rotateX(0deg);
 76 | 	}
 77 | 	70%{
 78 | 		transform:rotateX(90deg);
 79 | 	}
 80 | 	90%{
 81 | 		transform:rotateX(0deg);
 82 | 	}
 83 | 	95%{
 84 | 		transform:rotateX(90deg);
 85 | 	}
 86 | 	100%{
 87 | 		transform:rotateX(0deg);
 88 | 	}
 89 | }
 90 | @-moz-keyframes blink {
 91 | 	0% {
 92 | 		transform:rotateX(90deg);
 93 | 	}
 94 | 	30% {
 95 | 		transform: scale(1.1);
 96 | 	}
 97 | 	35% {
 98 | 		transform: scale(1);
 99 | 	}
100 | 	60%{
101 | 		transform:rotateX(90deg);
102 | 	}
103 | 	65%{
104 | 		transform:rotateX(0deg);
105 | 	}
106 | 	70%{
107 | 		transform:rotateX(90deg);
108 | 	}
109 | 	90%{
110 | 		transform:rotateX(0deg);
111 | 	}
112 | 	95%{
113 | 		transform:rotateX(90deg);
114 | 	}
115 | 	100%{
116 | 		transform:rotateX(0deg);
117 | 	}
118 | }
119 | @-webkit-keyframes blink {
120 | 	0% {
121 | 		transform:rotateX(90deg);
122 | 	}
123 | 	30% {
124 | 		transform: scale(1.1);
125 | 	}
126 | 	35% {
127 | 		transform: scale(1);
128 | 	}
129 | 	60%{
130 | 		transform:rotateX(90deg);
131 | 	}
132 | 	65%{
133 | 		transform:rotateX(0deg);
134 | 	}
135 | 	70%{
136 | 		transform:rotateX(90deg);
137 | 	}
138 | 	90%{
139 | 		transform:rotateX(0deg);
140 | 	}
141 | 	95%{
142 | 		transform:rotateX(90deg);
143 | 	}
144 | 	100%{
145 | 		transform:rotateX(0deg);
146 | 	}
147 | }
148 | @-ms-keyframes blink {
149 | 	0% {
150 | 		transform:rotateX(90deg);
151 | 	}
152 | 	30% {
153 | 		transform: scale(1.1);
154 | 	}
155 | 	35% {
156 | 		transform: scale(1);
157 | 	}
158 | 	60%{
159 | 		transform:rotateX(90deg);
160 | 	}
161 | 	65%{
162 | 		transform:rotateX(0deg);
163 | 	}
164 | 	70%{
165 | 		transform:rotateX(90deg);
166 | 	}
167 | 	90%{
168 | 		transform:rotateX(0deg);
169 | 	}
170 | 	95%{
171 | 		transform:rotateX(90deg);
172 | 	}
173 | 	100%{
174 | 		transform:rotateX(0deg);
175 | 	}
176 | }
177 | @keyframes pupil {
178 | 	0% {
179 | 		transform:rotateX(90deg) scale(0);
180 | 	}
181 | 	30% {
182 | 		transform:rotateX(90deg) scale(0);
183 | 	}
184 | 	35% {
185 | 		transform: rotateX(0) scale(1);
186 | 	}
187 | 	60%{
188 | 		transform:rotateX(90deg);
189 | 	}
190 | 	65%{
191 | 		transform:rotateX(0deg);
192 | 	}
193 | 	70%{
194 | 		transform:rotateX(90deg);
195 | 	}
196 | 	90%{
197 | 		transform:rotateX(0deg);
198 | 	}
199 | 	95%{
200 | 		transform:rotateX(90deg);
201 | 	}
202 | 	100%{
203 | 		transform:rotateX(0deg);
204 | 	}
205 | }
206 | @-moz-keyframes pupil {
207 | 	0% {
208 | 		transform:rotateX(90deg) scale(0);
209 | 	}
210 | 	30% {
211 | 		transform:rotateX(90deg) scale(0);
212 | 	}
213 | 	35% {
214 | 		transform: rotateX(0) scale(1);
215 | 	}
216 | 	60%{
217 | 		transform:rotateX(90deg);
218 | 	}
219 | 	65%{
220 | 		transform:rotateX(0deg);
221 | 	}
222 | 	70%{
223 | 		transform:rotateX(90deg);
224 | 	}
225 | 	90%{
226 | 		transform:rotateX(0deg);
227 | 	}
228 | 	95%{
229 | 		transform:rotateX(90deg);
230 | 	}
231 | 	100%{
232 | 		transform:rotateX(0deg);
233 | 	}
234 | }
235 | @-webkit-keyframes pupil {
236 | 	0% {
237 | 		transform:rotateX(90deg) scale(0);
238 | 	}
239 | 	30% {
240 | 		transform:rotateX(90deg) scale(0);
241 | 	}
242 | 	35% {
243 | 		transform: rotateX(0) scale(1);
244 | 	}
245 | 	60%{
246 | 		transform:rotateX(90deg);
247 | 	}
248 | 	65%{
249 | 		transform:rotateX(0deg);
250 | 	}
251 | 	70%{
252 | 		transform:rotateX(90deg);
253 | 	}
254 | 	90%{
255 | 		transform:rotateX(0deg);
256 | 	}
257 | 	95%{
258 | 		transform:rotateX(90deg);
259 | 	}
260 | 	100%{
261 | 		transform:rotateX(0deg);
262 | 	}
263 | }
264 | @-ms-keyframes pupil {
265 | 	0% {
266 | 		transform:rotateX(90deg) scale(0);
267 | 	}
268 | 	34% {
269 | 		transform:rotateX(90deg) scale(0);
270 | 	}
271 | 	35% {
272 | 		transform: rotateX(0) scale(1);
273 | 	}
274 | 	60%{
275 | 		transform:rotateX(90deg);
276 | 	}
277 | 	65%{
278 | 		transform:rotateX(0deg);
279 | 	}
280 | 	70%{
281 | 		transform:rotateX(90deg);
282 | 	}
283 | 	90%{
284 | 		transform:rotateX(0deg);
285 | 	}
286 | 	95%{
287 | 		transform:rotateX(90deg);
288 | 	}
289 | 	100%{
290 | 		transform:rotateX(0deg);
291 | 	}
292 | }
293 | 
294 | 	</style>
295 | </head>
296 | <body>
297 | 	<div id="EYE">
298 | 	    <div id="Outer">
299 | 		</div>
300 | 		<div id="Inner"></div>
301 | 	</div>
302 | </body>
303 | </html>


--------------------------------------------------------------------------------
/views/error.ejs:
--------------------------------------------------------------------------------
1 | <h1><%= message %></h1>
2 | <h2><%= error.status %></h2>
3 | <pre><%= error.stack %></pre>
4 | 


--------------------------------------------------------------------------------
/views/index.ejs:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html>
 3 |   <head>
 4 |     <title>HELLO</title>
 5 |     <link rel='stylesheet' href='/stylesheets/style.css' />
 6 |   </head>
 7 |   <body>
 8 |     <% data.forEach((item)=>{ %>
 9 |       <a href="<%=item%>"><%=item%></a>
10 |     <% }) %>
11 |   </body>
12 | </html>
13 | 


--------------------------------------------------------------------------------
/views/lineBall/index.ejs:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html lang="en">
  3 | <head>
  4 | 	<meta charset="UTF-8">
  5 | 	<title>Index</title>
  6 | 	<style type="text/css">
  7 | 		* {
  8 |       margin: 0;
  9 |       padding: 0;
 10 |     }
 11 |     body {
 12 |       background: black;
 13 |     }
 14 | 	</style>
 15 | </head>
 16 | <body>
 17 | 	<canvas id="can">喂喂喂,升级你的浏览器</canvas>
 18 | </body>
 19 | <script type="text/javascript" >
 20 |   window.onload=function() {
 21 |     WIN_WIDTH = document.documentElement.clientWidth;
 22 |     WIN_HEIGHT = document.documentElement.clientHeight;
 23 |     Canvas = document.getElementById("can");
 24 |     CTX = Canvas.getContext("2d");
 25 |     BALLS = [];
 26 |     Canvas.init=function(){
 27 |       this.width = WIN_WIDTH;
 28 |       this.height = WIN_HEIGHT;
 29 |     }
 30 | 
 31 |     Canvas.drawball = function(x,y,r) {
 32 |       CTX.fillStyle ="white";
 33 |       CTX.beginPath();
 34 |       CTX.arc(x,y,r,0,2 * Math.PI,true);
 35 |       CTX.closePath();
 36 |       CTX.fill();
 37 |     }
 38 | 
 39 |     function getBalls(num) {
 40 |       for (var i = 0; i < num; i++) {
 41 |         var ball ={
 42 |           pos: {
 43 |             x: Math.random() * WIN_WIDTH,
 44 |             y: Math.random() * WIN_HEIGHT,
 45 |           },
 46 |           r: 8,
 47 |           vx: Math.random() * 5,  //水平速度
 48 |           vy: Math.random() * 5,  //垂直速度
 49 |           a: Math.random() * 5,
 50 |         }
 51 |         BALLS.push(ball);
 52 |       }
 53 |     }
 54 | 
 55 |     function drawBalls() {
 56 |       CTX.clearRect(0,0,WIN_WIDTH,WIN_HEIGHT);
 57 |       BALLS.forEach(function(ball){
 58 |         Canvas.drawball(ball.pos.x, ball.pos.y, ball.r, 0,2 * Math, true);
 59 |       });
 60 |     }
 61 | 
 62 |     function upDate() {
 63 |       BALLS.forEach(function(ball) {
 64 |         ball.pos.x += ball.vx;
 65 |         ball.pos.y += ball.vy;
 66 |         if(ball.pos.y + ball.r > WIN_HEIGHT || ball.pos.y < ball.r){
 67 |           ball.vy =- ball.vy;
 68 |         } else if (ball.pos.x+ball.r > WIN_WIDTH || ball.pos.x< ball.r){
 69 |           ball.vx =- ball.vx;
 70 |         }
 71 |       });
 72 |     }
 73 | 
 74 |     function drawLines() {
 75 |       for (var i = 0; i < BALLS.length; i++) {
 76 |         for (var j = 0; j < BALLS.length; j++) {
 77 |           if(BALLS[i] === BALLS[j]){
 78 |             break;
 79 |           }
 80 |           CTX.save();
 81 |           CTX.beginPath();
 82 |           CTX.lineWidth = "1";
 83 |           CTX.strokeStyle = "white"
 84 |           CTX.moveTo(BALLS[i].pos.x,BALLS[i].pos.y);
 85 |           CTX.lineTo(BALLS[j].pos.x,BALLS[j].pos.y);
 86 |           CTX.stroke();
 87 |           CTX.restore();
 88 |         }
 89 |       }
 90 |     }
 91 | 
 92 |     function main(){
 93 |       Canvas.init();
 94 |       getBalls(10);
 95 |       setInterval(function(){
 96 |         drawBalls();
 97 |         drawLines();
 98 |         upDate();
 99 |       }, 16.7);
100 |     }
101 |     main();
102 |   }
103 | </script>
104 | </html>


--------------------------------------------------------------------------------
/views/loading/index.ejs:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html lang="en">
  3 | <head>
  4 | 	<meta charset="UTF-8">
  5 | 	<title>Loading</title>
  6 | 	<style type="text/css">
  7 | 		* {
  8 |       margin: 0;
  9 |       padding:0;
 10 |     }
 11 |     body {
 12 |       background: #033E66;
 13 |     }
 14 | 	</style>
 15 | </head>
 16 | <body>
 17 | 	<canvas id="can">喂喂喂,升级你的浏览器</canvas>
 18 | </body>
 19 | <script type="text/javascript">
 20 |   window.onload=function() {
 21 |     WIN_WIDTH = document.documentElement.clientWidth;
 22 |     WIN_HEIGHT = document.documentElement.clientHeight;
 23 |     Canvas = document.getElementById("can");
 24 |     CTX = Canvas.getContext("2d");
 25 | 
 26 |     Canvas.init=function(){
 27 |       this.width = WIN_WIDTH;
 28 |       this.height = WIN_HEIGHT;
 29 |     }
 30 | 
 31 |     Canvas.init();
 32 |     config = {
 33 |       length: 900,
 34 |       x: (WIN_WIDTH - 900) / 2,
 35 |       ballX: (WIN_WIDTH - 900) /2 ,
 36 |       y: 100,
 37 |       vx: 4,
 38 |       reach: false
 39 |     }
 40 | 
 41 |     Canvas.drawLine = function(config) {
 42 |       CTX.save();
 43 |       CTX.beginPath();
 44 |       CTX.lineWidth="1";
 45 |       CTX.strokeStyle="hsl(206, 82%, 67%)";
 46 |       CTX.moveTo(config.x, config.y);
 47 |       CTX.lineTo(config.x + config.length, config.y);
 48 |       CTX.stroke();
 49 |       CTX.font="40px sans-serif";
 50 |       CTX.strokeText("Loading....",10,50);
 51 |       CTX.restore();
 52 |     }
 53 | 
 54 |     Canvas.drawBall = function(config,r) {
 55 |       CTX.save();
 56 |       CTX.shadowBlur=8;
 57 |       CTX.fillStyle="rgb(61,243,255)"
 58 |       CTX.shadowColor="white";
 59 |       CTX.beginPath();
 60 |       CTX.arc(config.ballX, config.y,r, 0,2 * Math.PI, true);
 61 |       CTX.closePath();
 62 |       CTX.fill();
 63 |       CTX.restore();
 64 |     }
 65 | 
 66 |     function translateX(config) {
 67 |       if(config.ballX < config.length+config.x) {
 68 |         config.ballX += config.vx;
 69 |       } else {
 70 |         config.reach = true
 71 |       }
 72 |     }
 73 | 
 74 |     // 度数转换成弧度
 75 |     function dToR(degree) {
 76 |       return degree * (Math.PI / 180);
 77 |     }
 78 | 
 79 |     Canvas.drawCircle = function(config){
 80 |       CTX.save();
 81 |       CTX.shadowBlur = config.blur;
 82 |       CTX.lineWidth = config.bold;
 83 |       CTX.shadowColor = "white";
 84 |       CTX.lineCap = "round";
 85 | 
 86 |       if (config.rotated) {
 87 |         CTX.strokeStyle=config.strokeStyle.rotate
 88 |         CTX.translate(config.x,config.y);
 89 |         CTX.beginPath();
 90 |         CTX.clearRect(
 91 |           -config.r - config.bold - config.blur,
 92 |           -config.r- config.bold - config.blur,
 93 |           2 * (config.r + config.bold + config.blur) + 20,
 94 |           2 * (config.r + config.bold + config.blur) + 20
 95 |         );
 96 |         CTX.arc(0, 0, config.r, 0, dToR(config.degree), false);
 97 |         CTX.rotate(dToR(config.degree));
 98 |       } else {
 99 |         CTX.beginPath();
100 |         CTX.strokeStyle=config.strokeStyle.fix
101 |         CTX.arc(config.x,config.y,config.r,0,dToR(config.degree),true);
102 |       }
103 | 
104 |       if (config.closePath){
105 |         CTX.closePath();
106 |       }
107 |       CTX.stroke();
108 |       CTX.restore();
109 |     }
110 | 
111 |     outConfig={
112 |       bold: 5,
113 |       x: (WIN_WIDTH - 600) / 2,
114 |       y: 300,
115 |       blur: 8,
116 |       r: 120,
117 |       degree: 360,
118 |       closePath: true,
119 |       strokeStyle: {
120 |         rotate: gradient1,
121 |         fix: "rgba(61,243,255,0.4)"
122 |       }
123 |     }
124 | 
125 |     var gradient1 = CTX.createLinearGradient(-120, 300, 120, 300);
126 |       gradient1.addColorStop(0, "rgba(61,243,255,.1)");
127 |       gradient1.addColorStop(1, 'rgb(61,243,255)');
128 |     var gradient2 = CTX.createLinearGradient((WIN_WIDTH - 600) / 2 - 120, 300, (WIN_WIDTH - 600) / 2 + 240, 300);
129 |       gradient2.addColorStop(0, "rgba(61,243,255,.1)");
130 |       gradient2.addColorStop(1, 'rgb(61,243,255)');
131 |     rotateConfig = {
132 |       bold: 12,
133 |       x: (WIN_WIDTH - 600) / 2,
134 |       y: 300,
135 |       blur: 5,
136 |       r: 120,
137 |       degree: 0,
138 |       closePath: false,
139 |       strokeStyle: {
140 |         rotate: gradient1,
141 |         fix: gradient1
142 |       },
143 |       rotated: true,
144 |       ration: 4
145 |     }
146 | 
147 |     function rotate(){
148 |       rotateConfig.degree += rotateConfig.ration;
149 |     }
150 | 
151 |     Canvas.drawLine(config);
152 |     setInterval(function() {
153 |       if (!config.reach) {
154 |         Canvas.drawBall(config, 4);
155 |         translateX(config);
156 |       }
157 |       Canvas.drawCircle(rotateConfig);
158 |       rotate();
159 |     }, 16.7);
160 |   }
161 | </script>
162 | </html>


--------------------------------------------------------------------------------
/views/music.ejs:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html lang="en">
  3 | <head>
  4 | 	<meta charset="UTF-8">
  5 | 	<title></title>
  6 | </head>
  7 | <body>
  8 | 	<p>
  9 | 		Volme:<input id = "controll" type="range" value="60" min="0" max = "100">
 10 | 	</p>
 11 | 	<div id="stage">
 12 | 
 13 | 	</div>
 14 | 
 15 | 	<menu class="menu" id='menu'>
 16 | 		<div class="container">
 17 | 			<% music.forEach((item)=>{ %>
 18 | 				<li title = "<%=item%>" class="music"><%=item%></li>
 19 | 			<% }) %>
 20 | 		</div>
 21 | 	</menu>
 22 | </body>
 23 | <style type="text/css">
 24 | 	*{
 25 | 		margin: 0;
 26 | 		background: black;
 27 | 		padding: 0;
 28 | 	}
 29 | 	#stage {
 30 | 		height: 600px;
 31 | 		width: 100%;
 32 | 	}
 33 | 	.music{
 34 | 		z-index: 1000;
 35 | 		height: 50px;
 36 | 		float: left;
 37 | 		width: 30%;
 38 | 		display: inline-block;
 39 | 		color:white;
 40 | 		margin: 10px 0;
 41 | 	}
 42 | 	li{
 43 | 		list-style: none;
 44 | 	}
 45 | </style>
 46 | <script type="text/javascript">
 47 | let AC =  new (window.AudioContext||window.webkitAudioContext)()
 48 | var gainNode = AC[AC.createGain?"createGain":"createGainNiode"]()
 49 | var  analyser= AC.createAnalyser()
 50 | var size=128;
 51 | analyser.connect(gainNode)
 52 | analyser.fftSize = size*2
 53 | gainNode.connect(AC.destination);
 54 | 
 55 | var stage = $(`#stage`)[0]
 56 | var canvas = document.createElement(`canvas`);
 57 | var ctx = canvas.getContext(`2d`)
 58 | stage.appendChild(canvas)
 59 | function $(dom){
 60 | 	return document.querySelectorAll(dom);
 61 | }
 62 | function resize (){
 63 | 	height = stage.clientHeight;
 64 | 	width = stage.clientWidth;
 65 | 	canvas.height = height;
 66 | 	canvas.width  = width;
 67 | 	var line = ctx.createLinearGradient(0,0,0,height)
 68 | 	line.addColorStop(0, "hsl(206, 82%, 67%)");
 69 | 	line.addColorStop(1, 'rgb(61,243,255)');
 70 | 	ctx.fillStyle =line;
 71 | }
 72 | 
 73 | resize()
 74 | window.onresize = resize;
 75 | 
 76 | window.onload = function() {
 77 | 	let music = $(`.music`);
 78 | 	let cmd = document.getElementById(`controll`);
 79 | 	cmd.onchange=function(){
 80 | 		cmdVol(this.value/this.max)
 81 | 	}
 82 | 
 83 | 	music.forEach((item,index)=>{
 84 | 		item.onclick  = function() {
 85 | 			load(this.title);
 86 | 			analyse(this.title);
 87 | 		}
 88 | 	});
 89 | 
 90 | var source=null;
 91 | var count = 0;
 92 | var xhr = new XMLHttpRequest();
 93 | function load(url){	
 94 | 	var n =++count;
 95 | 	source && source[source.stop?"stop":"noteOff"]()
 96 | 	xhr.abort()
 97 | 	xhr.responseType = `arraybuffer`;
 98 | 	xhr.open("GET",url, true);
 99 | 	xhr.onload = function() {
100 | 		if(n!=count) return;
101 | 		AC.decodeAudioData(xhr.response,(buffer)=>{
102 |   		let bufferSource = AC.createBufferSource()
103 |   		bufferSource.buffer = buffer
104 |   		bufferSource.connect(analyser)
105 |   		bufferSource[bufferSource.start?"start":"noteNo"](0); 
106 |   		source = bufferSource;
107 |   		},(err)=>{
108 |   			console.log(err)
109 |   			})
110 | 		}
111 | 		xhr.send();
112 | 	}
113 | }
114 | 
115 | 
116 | function draw(arr,title){
117 | 	ctx.clearRect(0,0,width,height);
118 | 	var w = width/size;
119 | 	for (var i = 0; i < size; i++) {
120 | 		var h = arr[i]/256 * height;
121 | 		ctx.fillRect(w*i,(height-h)/3,w*0.7,h/3);
122 | 		ctx.font = "48px serif";
123 | 		ctx.shadowColor=`rgba(255,255,255,0.1)`
124 | 		ctx.shadowBlur=0.01*h;
125 | 		ctx.fillText(title.replace('.mp3',""), width/2, height/2-24);
126 | 		ctx.fillRect(w*i,height/2,w*0.7,h/3);
127 | 	}
128 | }
129 | function cmdVol(percentage){
130 | 	gainNode.gain.value = percentage * percentage
131 | }
132 | function analyse(title){
133 | 	var arr = new Uint8Array(analyser.frequencyBinCount)
134 | 	requestAnimationFrame = window.requestAnimationFrame
135 | 	draw(arr,title)
136 | 	function v(){
137 | 		analyser.getByteFrequencyData(arr)
138 | 		draw(arr,title)
139 | 		requestAnimationFrame(v)
140 | 	}
141 | 	requestAnimationFrame(v)
142 | }
143 | </script>
144 | </html>


--------------------------------------------------------------------------------
/views/night/index.ejs:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html lang="en">
  3 | <head>
  4 | 	<meta charset="UTF-8">
  5 | 	<title>LOGIN</title>
  6 | 	<style type="text/css">
  7 | 		*{margin: 0;padding: 0;}
  8 | 		body{position: relative}
  9 | 		#pic{position: relative;margin: 0 auto;}
 10 | 		#bg{z-index: -1;
 11 | 			background:-webkit-gradient(linear, 0 0, 0 bottom, from(#052138), to(#3B749E));}
 12 | 		#wind{position: absolute;top:0;left: 0;z-index: 1};
 13 | 		option{width: 100px;}
 14 | 	</style>
 15 | </head>
 16 | <body>
 17 | <div id="pic">
 18 | 	<canvas id = "bg"></canvas>
 19 | 	<canvas id = "wind"></canvas>
 20 | </div>
 21 | </body>
 22 | <script type="text/javascript">
 23 | 	window.onload = function() {
 24 | 		WIN_WIDTH = document.documentElement.clientWidth;
 25 | 		WIN_HEIGHT = document.documentElement.clientHeight;
 26 | 		BG = document.getElementById("bg");
 27 | 		BG.width = WIN_WIDTH
 28 | 		BG.height = WIN_HEIGHT
 29 | 		BG.stars=[];
 30 | 		CTX1 = BG.getContext('2d');
 31 | 		BG.getStars = function(num){
 32 | 			for (var i = 0; i < num; i++) {
 33 | 				var star = {
 34 | 					R:Math.random()*10,
 35 | 					r:Math.random()*5,
 36 | 					x:Math.random()*WIN_WIDTH,
 37 | 					y:Math.random()*200,
 38 | 					rot:Math.random()*360
 39 | 				}
 40 | 			BG.stars.push(star)	
 41 | 			}
 42 | 		}
 43 | 		BG.getStars(100)
 44 | 		BG.stars.forEach(function(star){
 45 | 			drawStar(CTX1,star.R,star.r,star.x,star.y,star.rot);
 46 | 		})
 47 | 
 48 | 		function dToR(degree){
 49 | 		  return degree * (Math.PI / 180);
 50 | 		}
 51 | 		function drawStar(ctx,R,r,x,y,rot){
 52 | 			ctx.save();
 53 | 			ctx.beginPath();
 54 | 			ctx.fillStyle = "#DBF0F0";
 55 | 			ctx.shadowColor="white";
 56 | 			ctx.lineWidth = 3;
 57 | 			for(var i = 0 ; i < 5 ; i++){
 58 | 				ctx.lineTo(Math.cos( dToR(18 + i * 72) ) * R + x,
 59 | 						   -Math.sin( dToR(18 + i * 72) ) * R + y);
 60 | 				ctx.lineTo(Math.cos( dToR(54 + i * 72) ) * r + x,
 61 | 						   -Math.sin( dToR(54 + i * 72) ) * r + y)
 62 | 
 63 | 			}
 64 | 			ctx.closePath();
 65 | 			ctx.fill();
 66 | 			ctx.restore();
 67 | 		}
 68 | 		function drawMoon(ctx,x,y,r){
 69 | 			ctx.save()
 70 | 			ctx.beginPath();
 71 | 			ctx.shadowColor = "white";
 72 | 			ctx.shadowBlur = 30;
 73 | 			ctx.arc(x, y, r, 1.3 * Math.PI, 0 ,true);
 74 | 			var endx = x - Math.cos(Math.PI*0.3)*r;
 75 | 			var endy = y - Math.sin(Math.PI*0.3)*r
 76 | 			ctx.bezierCurveTo(280, 180, 100, 150, endx, endy)
 77 | 			ctx.fillStyle = "#E0FFFF";
 78 | 			ctx.fill();
 79 | 			ctx.restore();
 80 | 		}
 81 | 		drawMoon(CTX1,200,100,80);
 82 | 
 83 | 		canvas2 = document.getElementById('wind')
 84 | 		CTX2 = canvas2.getContext('2d')
 85 | 		canvas2.width = WIN_WIDTH
 86 | 		canvas2.height = WIN_HEIGHT
 87 | 		function drawTower(ctx,tower){
 88 | 			// 右墙
 89 | 			ctx.save();
 90 | 			ctx.moveTo(WIN_WIDTH-tower.right+30,WIN_HEIGHT);
 91 | 			ctx.beginPath();
 92 | 			ctx.lineTo(WIN_WIDTH-tower.right-tower.width,WIN_HEIGHT);
 93 | 			ctx.lineTo(WIN_WIDTH-tower.right-tower.width,WIN_HEIGHT-tower.height)
 94 | 			ctx.lineTo(WIN_WIDTH-tower.right-(tower.width/2),WIN_HEIGHT-tower.height);
 95 | 			ctx.lineTo(WIN_WIDTH-tower.right+10,WIN_HEIGHT);
 96 | 			ctx.fillStyle="rgb(174,174,174)";
 97 | 			ctx.closePath();
 98 | 			ctx.fill();
 99 | 			ctx.restore();
100 | 			// 中间
101 | 			ctx.save();
102 | 			ctx.moveTo(WIN_WIDTH-tower.right-tower.width,WIN_HEIGHT);
103 | 			ctx.beginPath();
104 | 			ctx.lineTo(WIN_WIDTH-tower.right-tower.width,WIN_HEIGHT);
105 | 			ctx.lineTo(WIN_WIDTH-tower.right-tower.width,WIN_HEIGHT-tower.height)
106 | 			ctx.lineTo(WIN_WIDTH-tower.right-2*(tower.width),WIN_HEIGHT-tower.height);
107 | 			ctx.lineTo(WIN_WIDTH-tower.right-2*(tower.width),WIN_HEIGHT);
108 | 			ctx.lineTo(WIN_WIDTH-tower.right,WIN_HEIGHT);
109 | 			ctx.fillStyle="rgb(217,217,217)"
110 | 			ctx.closePath();
111 | 			ctx.fill();
112 | 			ctx.restore();
113 | 			//右侧
114 | 			ctx.save();
115 | 			ctx.moveTo(WIN_WIDTH-tower.right-2*tower.width,WIN_HEIGHT);
116 | 			ctx.beginPath();
117 | 			ctx.lineTo(WIN_WIDTH-tower.right-2*tower.width,WIN_HEIGHT);
118 | 			ctx.lineTo(WIN_WIDTH-tower.right-2*tower.width,WIN_HEIGHT-tower.height)
119 | 			ctx.lineTo(WIN_WIDTH-tower.right-2.5*(tower.width),WIN_HEIGHT-tower.height);
120 | 			ctx.lineTo(WIN_WIDTH-tower.right-3*(tower.width)-10,WIN_HEIGHT);
121 | 			ctx.lineTo(WIN_WIDTH-tower.right-2*tower.width,WIN_HEIGHT);
122 | 			ctx.fillStyle="rgb(242,237,232)"
123 | 			ctx.closePath();
124 | 			ctx.fill();
125 | 			ctx.restore();
126 | 
127 | 			// 屋檐
128 | 			ctx.save();
129 | 			ctx.moveTo(WIN_WIDTH-tower.right,WIN_HEIGHT-tower.height);
130 | 			ctx.beginPath();
131 | 			ctx.lineTo(WIN_WIDTH-tower.right,WIN_HEIGHT-tower.height)
132 | 			ctx.lineTo(WIN_WIDTH-tower.right,WIN_HEIGHT-tower.height-tower.eaveH );
133 | 			ctx.lineTo(WIN_WIDTH-tower.right-3*(tower.width),WIN_HEIGHT-tower.height-tower.eaveH);
134 | 			ctx.lineTo(WIN_WIDTH-tower.right-3*(tower.width),WIN_HEIGHT-tower.height);
135 | 			ctx.lineTo(WIN_WIDTH-tower.right,WIN_HEIGHT-tower.height)
136 | 			ctx.fillStyle="#EFEFEF"
137 | 			ctx.closePath();
138 | 			ctx.fill();
139 | 			ctx.restore();
140 | 
141 | 			// 红帽
142 | 			ctx.save()
143 | 			ctx.moveTo(WIN_WIDTH-tower.right-(tower.width/2),WIN_HEIGHT-tower.height-tower.eaveH);
144 | 			ctx.beginPath();
145 | 			ctx.arc(WIN_WIDTH-tower.right-1.5*tower.width,
146 | 					WIN_HEIGHT-tower.height-tower.eaveH,
147 | 					tower.width,0,Math.PI,true);
148 | 			var gradient1 = ctx.createLinearGradient(WIN_WIDTH-tower.right-(tower.width/2),
149 | 													 WIN_HEIGHT-tower.height,
150 | 													 WIN_WIDTH-tower.right-2*tower.width,
151 | 													 WIN_HEIGHT-tower.height);
152 | 			gradient1.addColorStop(0, "black");
153 | 			gradient1.addColorStop(1, 'red');
154 | 			ctx.fillStyle=gradient1;
155 | 			ctx.closePath();
156 | 			ctx.fill();
157 | 
158 | 			// button
159 | 			ctx.save()
160 | 			ctx.moveTo(WIN_WIDTH-tower.right-(tower.width/2),WIN_HEIGHT-tower.height-tower.eaveH/2);
161 | 			ctx.beginPath();
162 | 			ctx.arc(WIN_WIDTH-tower.right-1.5*tower.width,
163 | 					WIN_HEIGHT-tower.height-2*tower.eaveH,
164 | 					tower.width/8,0,2*Math.PI,true);
165 | 			ctx.fillStyle="#EFEFEF"
166 | 			ctx.closePath();
167 | 			ctx.fill();
168 | 		}
169 | 		tower={
170 | 			right:200,
171 | 			width:72,
172 | 			height:300,
173 | 			eaveH:30 //屋檐
174 | 
175 | 		}
176 | 		drawTower(CTX1,tower);
177 | 		function drawWings(ctx) {
178 | 			ctx.clearRect(0,0,WIN_WIDTH,WIN_HEIGHT)
179 | 			ctx.save();
180 | 			ctx.translate(WIN_WIDTH - tower.right-1.5 * tower.width,WIN_HEIGHT - tower.height - 2 * tower.eaveH);
181 | 	        ctx.rotate(rotation);
182 | 	        ctx.translate(-350,-200);
183 | 			ctx.beginPath();
184 | 			ctx.moveTo(350, 200);
185 | 			ctx.lineTo(300, -30);
186 | 			ctx.lineTo(400, -30);
187 | 
188 | 			ctx.lineTo(350, 200);
189 | 			ctx.lineTo(300, 430);
190 | 			ctx.lineTo(400, 430);
191 | 
192 | 			ctx.lineTo(350, 200);
193 | 			ctx.lineTo(110, 250);
194 | 			ctx.lineTo(110, 150);
195 | 
196 | 			ctx.lineTo(350, 200);
197 | 			ctx.lineTo(590, 260);
198 | 			ctx.lineTo(590, 150);
199 | 			ctx.closePath();
200 | 			ctx.lineWidth = 5;
201 | 			ctx.shadowColor="white";
202 | 			ctx.shadowBlur = 90;
203 | 			ctx.strokeStyle = 'rgb(238,199,130)';
204 | 			ctx.stroke();
205 | 
206 | 			ctx.restore();
207 | 		}
208 | 		rotation=0;
209 | 		intervalGame = setInterval(function(){
210 | 		 drawWings(CTX2);rotation+=0.1;
211 | 		}, 100);
212 | 	}
213 | </script>
214 | </html>


--------------------------------------------------------------------------------
/views/qbaby/index.ejs:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html lang="en">
  3 | <head>
  4 | 	<meta charset="UTF-8">
  5 | 	<title>萌BABY</title>
  6 | </head>
  7 | <body>
  8 | 	<div id="cuteBaby">
  9 | 		<div class="ear left-ear"></div>
 10 | 		<div class="ear right-ear"></div>
 11 | 		<div class="body">
 12 | 			<div class="eye blink">
 13 | 				<div class="inner">
 14 | 					<div class="pupil">
 15 | 						<div class="tear"></div>
 16 | 					</div>
 17 | 				</div>
 18 | 			</div>
 19 | 			<div class="eye blink">
 20 | 				<div class="inner">
 21 | 					<div class="pupil">
 22 | 						<div class="tear"></div>
 23 | 					</div>
 24 | 				</div>
 25 | 			</div>
 26 | 		</div>
 27 | 		<div class="hand left-hand"></div>
 28 | 		<div class="hand right-hand"></div>
 29 | 		<div class="foot left-foot"></div>
 30 | 		<div class="foot right-foot"></div>
 31 | 	</div>
 32 | </body>
 33 | <script type="text/javascript" src="./JQ.js"></script>
 34 | <script type="text/javascript">
 35 | // 可耻的全局变量
 36 | var gloabal = {
 37 | 	WIN_WIDTH : $(document).width(),
 38 | 	WIN_HEIGHT: $(document).height()
 39 | }
 40 | var Qbaby={
 41 | 	//眼睛
 42 | 	$left : $(".eye").eq(0),
 43 | 	$right:$(".eye").eq(1),
 44 | 	// 瞳仁
 45 | 	$lPupil:$(".pupil").eq(0),
 46 | 	$rPupil:$("pupil").eq(1)
 47 | }
 48 | 
 49 | function follow(x,y) {
 50 | 
 51 | }
 52 | $(document).mousemove(function(e) {
 53 | 	follow(e.pageX,e.pageY)
 54 | });
 55 | 
 56 | 
 57 | </script>
 58 | <style type="text/css">
 59 | #cuteBaby {
 60 | 	position: relative;
 61 | 	width: 500px;
 62 | 	height: 100%;
 63 | 	margin: 0 auto;
 64 | }
 65 | 
 66 | .ear {
 67 | 	position: relative;
 68 | 	width: 140px;
 69 | 	height: 100px;
 70 | 	background: rgb(231,185,213);
 71 | 	border-radius: 70px 70px 0 0/100px 100px 0 0;
 72 | 	z-index: -1;
 73 | }
 74 | 
 75 | #cuteBaby .left-ear {
 76 | 	transform: rotate(-30deg) skew(10deg);
 77 | 	position: absolute;
 78 | 	top: -20px;
 79 | 	left: 65px;
 80 | }
 81 | 
 82 | #cuteBaby .left-ear:before {
 83 | 	position: absolute;
 84 | 	display: block;
 85 | 	width: 80px;
 86 | 	height: 60px;
 87 | 	left: 20px;
 88 | 	top:20px;
 89 | 	content: "";
 90 | 	border-radius: 40px 40px 0 0/60px 60px 0 0;
 91 | 	background: rgb(55,30,26);
 92 | }
 93 | 
 94 | #cuteBaby .right-ear:before {
 95 | 	position: absolute;
 96 | 	display: block;
 97 | 	width: 80px;
 98 | 	height: 60px;
 99 | 	content: "";
100 | 	border-radius: 40px 40px 0 0/60px 60px 0 0;
101 | 	background: rgb(55,30,26);
102 | 	top:20px;
103 | 	right: 20px;
104 | }
105 | 
106 | #cuteBaby .right-ear {
107 | 	transform: rotate(30deg) skew(-10deg);
108 | 	position: absolute;
109 | 	right: 65px;
110 | 	top: -20px;
111 | }
112 | 
113 | .body {
114 | 	width: 300px;
115 | 	height: 300px;
116 | 	border-radius: 50%;
117 | 	margin: 100px auto 0;
118 | 	background: rgb(231,185,213);
119 | 	z-index: 100;
120 | 	display: flex;
121 | 	justify-content: space-around;
122 | }
123 | 
124 | .eye {
125 | 	width: 100px;
126 | 	height: 100px;
127 | 	background: white;
128 | 	margin: 70px 0;
129 | 	border-radius: 50%;
130 | 	display: flex;
131 | 	align-items: center;
132 | 	justify-content: center;
133 | 	animation: blink 5s infinite;
134 | }
135 | 
136 | .inner {
137 | 	display: block;
138 | 	width: 75px;
139 | 	height: 75px;
140 | 	content: "";
141 | 	border-radius: 50%;
142 | 	background: rgb(120,175,169);
143 | 	display: flex;
144 | 	justify-content: center;
145 | }
146 | 
147 | .pupil {
148 | 	width: 60px;
149 | 	height: 50px;
150 | 	background:rgb(79,128,124);
151 | 	border-radius: 30px 30px 25px 25px;
152 | 	display: block;
153 | }
154 | 
155 | .tear {
156 | 	width: 20px;
157 | 	height: 20px;
158 | 	background: white;
159 | 	border-radius: 50%;
160 | }
161 | 
162 | .hand {
163 | 	display: block;
164 | 	width: 100px;
165 | 	height: 50px;
166 | 	background: rgb(231,185,213);
167 | }
168 | 
169 | .left-hand {
170 | 	position: absolute;
171 | 	top:150px;
172 | 	left: 40px;
173 | 	border-radius: 100px 0px 0px 100px/25px 0px 0 25px;
174 | 	transform: rotate(15deg) skew(10deg);
175 | }
176 | 
177 | .right-hand {
178 | 	position: absolute;
179 | 	top: 150px;
180 | 	right: 40px;
181 | 	border-radius: 0px 100px 100px 0px/0px 25px 25px 0px;
182 | 	transform: rotate(-15deg) skew(-10deg);
183 | }
184 | 
185 | .foot {
186 | 	position: absolute;
187 | 	width: 50px;
188 | 	height: 80px;
189 | 	background: rgb(231,185,213);
190 | 	border-radius: 25px/40px;
191 | }
192 | 
193 | .left-foot {
194 | 	top:250px;
195 | 	left: 140px;
196 | 	transform: rotate(30deg) skew(-15deg);
197 | }
198 | 
199 | .right-foot {
200 | 	top:250px;
201 | 	right: 140px;
202 | 	transform: rotate(-30deg) skew(15deg);
203 | }
204 | 
205 | @keyframes blink {
206 | 	0% {
207 | 		transform: rotate(12deg);
208 | 	}
209 | 	1% {
210 | 		transform: rotateX(102deg) rotateY(12deg);
211 | 	}
212 | 	2% {
213 | 		transform: rotate(12deg);
214 | 	}
215 | }
216 | </style>
217 | </html>


--------------------------------------------------------------------------------
/views/windmill/index.js:
--------------------------------------------------------------------------------
 1 | WINDOW_WIDTH = 1290;
 2 | WINDOW_HEIGHT = 760;
 3 | var Canvas= {};
 4 | Canvas.ctx = document.getElementById('myCanvas').getContext("2d");
 5 | 
 6 | Canvas.size = function  (WINDOW_HEIGHT,WINDOW_HEIGHT) {
 7 |   this.width = WINDOW_HEIGHT;
 8 |   this.height = WINDOW_HEIGHT;
 9 | }
10 | 
11 | Canvas.Point = function(x,y) {
12 | 	var width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
13 | 	var height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
14 | 	this.x=width;
15 | 	this.y=height;
16 | }
17 | 
18 | Canvas.windMill = function() {
19 | 	var me = Canvas;
20 | 	var BackgroundWidth = WINDOW_WIDTH/2;
21 | 	var BackgroundHeight = WINDOW_HEIGHT/2;
22 | 	var PILLARHEIGHT = 150;
23 | 	cntxt = me.ctx;
24 | 	center = new me.Point(WINDOW_WIDTH/2,WINDOW_HEIGHT/2);
25 | 	// 绘制背景
26 | 	function drawBackground(){
27 | 		cntxt.save();
28 | 		cntxt.fillStyle = "rgba(198,237,237,1)";
29 | 		cntxt.fillRect(center.x / 2 - BackgroundWidth / 2,center.y / 2 - BackgroundWidth / 2,
30 | 			BackgroundWidth,BackgroundHeight);
31 | 		cntxt.fill();
32 | 		cntxt.restore();
33 | 	}
34 | 
35 | 	// 绘制柱子
36 | 	function Pillar(){
37 | 		cntxt.save();
38 | 		cntxt.fillStyle="white";
39 | 		cntxt.translate(center.x / 2-25,center.y / 2 - 25);
40 | 		cntxt.moveTo(0,0);
41 | 		cntxt.lineTo(20,0);
42 | 		cntxt.lineTo(10,- PILLARHEIGHT)
43 | 		cntxt.fill();
44 | 		cntxt.restore();
45 | 	}
46 | 
47 | 	// 叶子
48 | 	var tangle = 0;
49 | 	var speed = 1;
50 | 	var R = 20;
51 | 	var X = center.x / 2 -2 * R + 20 + 5;
52 | 	var Y =center.y / 2 - PILLARHEIGHT - R;
53 | 	// var Y=100;
54 | 	function leaf(tangle){
55 | 		cntxt.save();
56 | 		cntxt.beginPath();
57 | 		cntxt.arc(X -(2 * R * Math.cos(tangle)),Y - 2 * R * Math.sin(tangle), 2 * R, tangle, Math.PI + tangle, true)
58 | 		cntxt.fillStyle = "white";
59 | 		cntxt.closePath();
60 | 		cntxt.fill();
61 | 	}
62 | 
63 | 	this.rotate=function(){
64 | 		cntxt.clearRect(0, 0, WINDOW_WIDTH, WINDOW_HEIGHT);
65 | 		drawBackground();
66 | 		Pillar();
67 | 	  tangle = tangle + (speed * 1 / 32) * Math.PI;
68 | 		leaf(tangle);
69 | 		leaf(tangle + Math.PI);
70 | 		leaf(tangle + 3 / 2 * Math.PI);
71 | 		leaf(tangle + 1 / 2 * Math.PI);
72 | 	}
73 | }
74 | 
75 | var main =function(){
76 | 	var windmill = new Canvas.windMill();
77 | 	setInterval(windmill.rotate, 20);
78 | }
79 | 
80 | window.onload = function() {
81 | 	main();
82 | }


--------------------------------------------------------------------------------