Skip to content

Commit eb022cd

Browse files
cherylqiancherylqian
committed
rewrite canvas
1 parent 8b98aff commit eb022cd

File tree

731 files changed

+271112
-113
lines changed

Some content is hidden

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

731 files changed

+271112
-113
lines changed

‎package.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,12 @@
1111
"react": "^16.5.2",
1212
"react-dom": "^16.5.2",
1313
"react-feather": "^1.1.3",
14+
"react-reveal": "^1.2.2",
1415
"react-router-dom": "^4.3.1",
1516
"react-scripts": "2.0.3",
1617
"react-slick": "^0.23.1",
17-
"slick-carousel": "^1.8.1"
18+
"slick-carousel": "^1.8.1",
19+
"three": "^0.97.0"
1820
},
1921
"scripts": {
2022
"predeploy": "npm run build",

‎public/index.html

Lines changed: 27 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,17 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="utf-8">
5-
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
6-
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
7-
<meta name="theme-color" content="#000000">
8-
<!--
3+
4+
<head>
5+
<meta charset="utf-8">
6+
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
7+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
8+
<meta name="theme-color" content="#000000">
9+
<!--
910
manifest.json provides metadata used when your web app is added to the
1011
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
1112
-->
12-
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
13-
<!--
13+
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
14+
<!--
1415
Notice the use of %PUBLIC_URL% in the tags above.
1516
It will be replaced with the URL of the `public` folder during the build.
1617
Only files inside the `public` folder can be referenced from the HTML.
@@ -19,14 +20,15 @@
1920
work correctly both with client-side routing and a non-root public URL.
2021
Learn how to configure a non-root public URL by running `npm run build`.
2122
-->
22-
<title>University of Illinois ACM SIGGRAPH</title>
23-
</head>
24-
<body>
25-
<noscript>
26-
This website requires JavaScript :(
27-
</noscript>
28-
<div id="root"></div>
29-
<!--
23+
<title>University of Illinois ACM SIGGRAPH</title>
24+
</head>
25+
26+
<body>
27+
<noscript>
28+
This website requires JavaScript :(
29+
</noscript>
30+
<div id="root"></div>
31+
<!--
3032
This HTML file is a template.
3133
If you open it directly in the browser, you will see an empty page.
3234
@@ -36,5 +38,12 @@
3638
To begin the development, run `npm start` or `yarn start`.
3739
To create a production bundle, use `npm run build` or `yarn build`.
3840
-->
39-
</body>
40-
</html>
41+
<script src="three/build/three.js"></script>
42+
43+
<script src="three/examples/js/controls/OrbitControls.js"></script>
44+
<script src="three/examples/js/libs/stats.min.js"></script>
45+
<script src="three/examples/js/ImprovedNoise.js"></script>
46+
<script src="three/examples/js/WebGL.js"></script>
47+
</body>
48+
49+
</html>

‎public/three/LICENSE

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License
2+
3+
Copyright © 2010-2018 three.js authors
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in
13+
all copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21+
THE SOFTWARE.

‎public/three/README.md

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,87 @@
1+
three.js
2+
========
3+
4+
[![Latest NPM release][npm-badge]][npm-badge-url]
5+
[![License][license-badge]][license-badge-url]
6+
[![Dependencies][dependencies-badge]][dependencies-badge-url]
7+
[![Dev Dependencies][devDependencies-badge]][devDependencies-badge-url]
8+
[![Build Status](https://travis-ci.org/mrdoob/three.js.svg?branch=dev)](https://travis-ci.org/mrdoob/three.js)
9+
[![Language Grade: JavaScript](https://img.shields.io/lgtm/grade/javascript/g/mrdoob/three.js.svg?label=code%20quality)](https://lgtm.com/projects/g/mrdoob/three.js/)
10+
11+
#### JavaScript 3D library ####
12+
13+
The aim of the project is to create an easy to use, lightweight, 3D library. The library provides Canvas 2D, SVG, CSS3D and WebGL renderers.
14+
15+
[Examples](http://threejs.org/examples/) &mdash;
16+
[Documentation](http://threejs.org/docs/) &mdash;
17+
[Wiki](https://github.com/mrdoob/three.js/wiki) &mdash;
18+
[Migrating](https://github.com/mrdoob/three.js/wiki/Migration-Guide) &mdash;
19+
[Questions](http://stackoverflow.com/questions/tagged/three.js) &mdash;
20+
[Forum](https://discourse.threejs.org/) &mdash;
21+
[Gitter](https://gitter.im/mrdoob/three.js) &mdash;
22+
[Slack](https://threejs-slack.herokuapp.com/)
23+
24+
### Usage ###
25+
26+
Download the [minified library](http://threejs.org/build/three.min.js) and include it in your HTML, or install and import it as a [module](http://threejs.org/docs/#manual/introduction/Import-via-modules),
27+
Alternatively see [how to build the library yourself](https://github.com/mrdoob/three.js/wiki/Build-instructions).
28+
29+
```html
30+
<script src="js/three.min.js"></script>
31+
```
32+
33+
This code creates a scene, a camera, and a geometric cube, and it adds the cube to the scene. It then creates a `WebGL` renderer for the scene and camera, and it adds that viewport to the document.body element. Finally, it animates the cube within the scene for the camera.
34+
35+
```javascript
36+
var camera, scene, renderer;
37+
var geometry, material, mesh;
38+
39+
init();
40+
animate();
41+
42+
function init() {
43+
44+
camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.01, 10 );
45+
camera.position.z = 1;
46+
47+
scene = new THREE.Scene();
48+
49+
geometry = new THREE.BoxGeometry( 0.2, 0.2, 0.2 );
50+
material = new THREE.MeshNormalMaterial();
51+
52+
mesh = new THREE.Mesh( geometry, material );
53+
scene.add( mesh );
54+
55+
renderer = new THREE.WebGLRenderer( { antialias: true } );
56+
renderer.setSize( window.innerWidth, window.innerHeight );
57+
document.body.appendChild( renderer.domElement );
58+
59+
}
60+
61+
function animate() {
62+
63+
requestAnimationFrame( animate );
64+
65+
mesh.rotation.x += 0.01;
66+
mesh.rotation.y += 0.02;
67+
68+
renderer.render( scene, camera );
69+
70+
}
71+
```
72+
73+
If everything went well you should see [this](https://jsfiddle.net/f2Lommf5/).
74+
75+
### Change log ###
76+
77+
[releases](https://github.com/mrdoob/three.js/releases)
78+
79+
80+
[npm-badge]: https://img.shields.io/npm/v/three.svg
81+
[npm-badge-url]: https://www.npmjs.com/package/three
82+
[license-badge]: https://img.shields.io/npm/l/three.svg
83+
[license-badge-url]: ./LICENSE
84+
[dependencies-badge]: https://img.shields.io/david/mrdoob/three.js.svg
85+
[dependencies-badge-url]: https://david-dm.org/mrdoob/three.js
86+
[devDependencies-badge]: https://img.shields.io/david/dev/mrdoob/three.js.svg
87+
[devDependencies-badge-url]: https://david-dm.org/mrdoob/three.js#info=devDependencies

0 commit comments

Comments
 (0)