add three.js test scene

This commit is contained in:
CJSatnarine
2026-03-23 09:06:35 -04:00
parent d23ab2de05
commit 63cb5300fe
7 changed files with 85 additions and 16 deletions

1
.gitignore vendored
View File

@@ -1 +1,2 @@
.git
public

View File

@@ -1,16 +0,0 @@
<html>
<head>
<title>The Study</title>
</head>
<body>
<h1>STILL UNDER CONSTRUCTION!!!</h1>
<p>please come back at a later time.</p>
<a href="https://3dworldring.cjsatnarine.space/cjsatnarine_study/previous">&lt;</a>
<a href="https://3dworldring.cjsatnarine.space">3Dworldring</a>
<a href="https://3dworldring.cjsatnarine.space/cjsatnarine_study/next">&gt;</a>
</body>
</html>

8
sass/style.scss Normal file
View File

@@ -0,0 +1,8 @@
html,
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}

25
static/scripts/main.js Normal file
View File

@@ -0,0 +1,25 @@
import * as THREE from 'three';
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
const renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
renderer.setAnimationLoop( animate );
document.body.appendChild( renderer.domElement );
const geometry = new THREE.BoxGeometry( 1, 1, 1 );
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const cube = new THREE.Mesh( geometry, material );
scene.add( cube );
camera.position.z = 5;
function animate( time ) {
cube.rotation.x = time / 2000;
cube.rotation.y = time / 1000;
renderer.render( scene, camera );
}

28
templates/base.html Normal file
View File

@@ -0,0 +1,28 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>The Study</title>
<link rel="stylesheet" href="/style.css">
<script type="importmap">
{
"imports": {
"three": "https://cdn.jsdelivr.net/npm/three@0.183.2/build/three.module.js",
"three/addons/": "https://cdn.jsdelivr.net/npm/three@0.183.2/examples/jsm/"
}
}
</script>
</head>
<body>
<section class="section">
<div class="container">
{% block content %}
{% endblock content %}
</div>
</section>
</body>
</html>

7
templates/index.html Normal file
View File

@@ -0,0 +1,7 @@
{% extends "base.html" %}
{% block content %}
<script type="module" src="/scripts/main.js"></script>
{% endblock content %}

16
zola.toml Normal file
View File

@@ -0,0 +1,16 @@
# The URL the site will be built for
base_url = "https://study.cjsatnarine.space"
# Whether to automatically compile all Sass files in the sass directory
compile_sass = true
# Whether to build a search index to be used later on by a JavaScript library
build_search_index = false
[markdown]
[markdown.highlighting]
theme = "catppuccin-mocha"
[extra]
# Put all your custom variables here