peter/peter-tanner.github.io
1
0
Fork 0
mirror of https://github.com/peter-tanner/peter-tanner.github.io.git synced 2024-11-30 12:00:18 +08:00
Code Issues Packages Projects Releases Wiki Activity

First bit of website

Browse Source
This commit is contained in:
Peter 2020-09-28 01:45:51 +08:00
commit 38515610ef
10 changed files with 5001 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
README.md Normal file
View File

@ -0,0 +1,2 @@
Website thingy
Write some stuff here later, when I have time

7
index.html Normal file
View File

@ -0,0 +1,7 @@
Need to put some stuff here! Don't have the time right now though, so here are links to some other stuff I've made.<br><br>
Stupid methane / thanos joke:<br>
<a href="https://npc-strider.github.io/methanos">https://npc-strider.github.io/methanos</a><br>
<br>
WACE Stage 3/ATAR past papers archive<br>
<a href="https://atar-wace-archive.github.io/">https://atar-wace-archive.github.io/</a><br>

127
methanos/index.html Normal file
View File

@ -0,0 +1,127 @@
<html>
<head>
<title>METHANOS</title>
<link href='./main.css' rel="stylesheet">
</head>
<body>
<div id="info"><a>METHANOS</a><br/>
<b>x</b> = <span id=x></span><br/>
<b>y</b> = <span id=y></span><br/>
<b>z</b> = <span id=z></span><br/>
<a>r</a> to reset camera.<br/>
<a>t</a> to toggle text.
</div>
<div class="meme" id="meme">
<meme class="top">METHANOS</meme>
<meme class="bottom">METHANOS</meme>
</div>
<!-- Three.js, and orbit controls -->
<script src="./js/threejs/three.min.js" ></script>
<!-- <script src="js/three.js"></script> -->
<script src="./js/threejs/controls/OrbitControls.js" ></script>
<script src="./js/threejs/loaders/GLTFLoader.js" ></script>
<script type="module">
var renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize( window.innerWidth, window.innerHeight );
// renderer.setClearColor(0xff0000, 1);
renderer.gammaOutput = true;
document.body.appendChild( renderer.domElement );
// Scene
var scene = new THREE.Scene();
// Camera
var camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.1, 1000 );
camera.position.set( 1.6, 0.5, 1.8 );
// Orbit Controls
var controls = new THREE.OrbitControls( camera, renderer.domElement );
// Load
var loader = new THREE.GLTFLoader();
loader.load(
// resource URL
'./model/methanos.glb',
//'https://raw.githubusercontent.com/KhronosGroup/glTF-Sample-Models/master/2.0/Fox/glTF/Fox.gltf',
// called when the resource is loaded
function ( gltf ) {
scene.add( gltf.scene );
gltf.animations; // Array<THREE.AnimationClip>
gltf.scene; // THREE.Group
gltf.scenes; // Array<THREE.Group>
gltf.cameras; // Array<THREE.Camera>
gltf.asset; // Object
},
// called while loading is progressing
function ( xhr ) {
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
// called when loading has errors
function ( error ) {
console.log( 'An error happened' );
}
);
var geometry = new THREE.BoxGeometry();
var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
// var cube = new THREE.Mesh( geometry, material );
// scene.add( cube );
var directionalLight = new THREE.DirectionalLight( 0xffffff, 1.0 );
directionalLight.position.set( 4.07625, 5.90386, 1.00545 );
scene.add( directionalLight );
var light = new THREE.AmbientLight( 0x404040, 0.7 ); // soft white light
scene.add( light );
var animate = function () {
requestAnimationFrame( animate );
// cube.rotation.x += 0.01;
// cube.rotation.y += 0.01;
var pos = camera.position
document.getElementById("x").textContent=pos.x;
document.getElementById("y").textContent=pos.y;
document.getElementById("z").textContent=pos.z;
renderer.render( scene, camera );
};
document.addEventListener( 'keydown',
function(event) {
switch(event.keyCode) {
case 82: // r
controls.reset()
break;
case 84:
var div = document.getElementById("meme")
div.style.display = div.style.display == "none" ? "block" : "none";
}
},
false );
window.addEventListener( 'resize',
function(event) {
renderer.setSize( window.innerWidth, window.innerHeight );
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
},
false );
animate();
</script>
</body>
</html>

1067
methanos/js/threejs/controls/OrbitControls.js Normal file
View File

File diff suppressed because it is too large Load Diff

2799
methanos/js/threejs/loaders/GLTFLoader.js Normal file
View File

File diff suppressed because it is too large Load Diff

927
methanos/js/threejs/three.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

72
methanos/main.css Normal file
View File

@ -0,0 +1,72 @@
body {
margin: 0;
background-color: #000;
color: #fff;
font-family: Monospace;
font-size: 13px;
line-height: 24px;
overscroll-behavior: none;
}
canvas { display: block; }
a {
color: #ff0;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
b {
color: lightgreen;
}
#info {
position: absolute;
top: 0px;
width: 100%;
padding: 10px;
box-sizing: border-box;
text-align: left;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
pointer-events: none;
z-index: 1;
}
meme {
position: absolute;
text-align: center;
left: 0;
right: 0;
margin: 15px 0;
padding: 0 5px;
font-family: impact;
font-size: 3em;
text-transform: uppercase;
color: white;
letter-spacing: 1px;
text-shadow:2px 2px 0 #000,
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
0px 2px 0 #000,
2px 0px 0 #000,
0px -2px 0 #000,
-2px 0px 0 #000,
2px 2px 5px #000;
display: inline-block;
}
.bottom {
bottom: 1%;
}
.top {
top: 1%;
}

BIN
methanos/model/methanos.glb Normal file
View File

Binary file not shown.

BIN
methanos/model_source/methanos.blend Normal file
View File

Binary file not shown.

BIN
methanos/model_source/methanos.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 361 KiB