------------------------------------------------------------
commit 14a0d150a37653af92dd417c204e37453bc83cd8
Author: ffff:98.97.141.22 <ffff:98.97.141.22@hub.scroll.pub>
Date: Fri Oct 25 05:24:10 2024 +0000
Updated index.scroll
diff --git a/index.scroll b/index.scroll
index e3b7703..5d39132 100644
--- a/index.scroll
+++ b/index.scroll
@@ -15,11 +15,11 @@ script
To use
Click Clone 👆`
-three.min.js
-stars.js
-
<div id="controls">
<span>Speed:</span>
<input type="range" id="speedSlider" min="0" max="100" value="0" />
<span id="speedValue">0</span>
</div>
+
+three.min.js
+stars.js
------------------------------------------------------------
commit d0f0fbc03afd1c0c8de2f0128e5cbc82b2e2ad4a
Author: ffff:98.97.141.22 <ffff:98.97.141.22@hub.scroll.pub>
Date: Fri Oct 25 05:22:05 2024 +0000
Updated index.scroll
diff --git a/index.scroll b/index.scroll
index 9a916f9..e3b7703 100644
--- a/index.scroll
+++ b/index.scroll
@@ -1,5 +1,7 @@
buildHtml
+stars.css
+
center
<form method="post" action="/clone.htm">
<input type="hidden" name="folderName" value="spacecast" >
@@ -14,7 +16,6 @@ script
Click Clone 👆`
three.min.js
-stars.css
stars.js
<div id="controls">
------------------------------------------------------------
commit f9b0fc87ff402ba7db0c09597e268be8d3d348a8
Author: ffff:98.97.141.22 <ffff:98.97.141.22@hub.scroll.pub>
Date: Fri Oct 25 05:21:31 2024 +0000
Updated stars.css
diff --git a/stars.css b/stars.css
index e69de29..b21830e 100644
--- a/stars.css
+++ b/stars.css
@@ -0,0 +1,40 @@
+ body {
+ margin: 0;
+ background: black;
+ }
+ #controls {
+ position: absolute;
+ top: 10px;
+ left: 10px;
+ background: rgba(255, 255, 255, 0.2);
+ padding: 10px;
+ border-radius: 5px;
+ color: white;
+ }
+ input, button {
+ margin: 5px;
+ padding: 5px;
+ background: rgba(255, 255, 255, 0.1);
+ border: 1px solid rgba(255, 255, 255, 0.3);
+ color: white;
+ border-radius: 3px;
+ }
+ button:hover {
+ background: rgba(255, 255, 255, 0.2);
+ }
+ .slider-container {
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ margin-top: 10px;
+ padding-top: 10px;
+ border-top: 1px solid rgba(255, 255, 255, 0.3);
+ }
+ #speedSlider {
+ flex-grow: 1;
+ accent-color: #ffffff;
+ }
+ #speedValue {
+ min-width: 3em;
+ text-align: right;
+ }
\ No newline at end of file
------------------------------------------------------------
commit 623d93a9c3b9a1ecdca2a5026a30023180f75ed6
Author: root <root@hub.scroll.pub>
Date: Fri Oct 25 05:20:51 2024 +0000
Deleted stars.html
diff --git a/stars.html b/stars.html
deleted file mode 100644
index 14028c8..0000000
--- a/stars.html
+++ /dev/null
@@ -1,51 +0,0 @@
-<style>
- body {
- margin: 0;
- background: black;
- }
- #controls {
- position: absolute;
- top: 10px;
- left: 10px;
- background: rgba(255, 255, 255, 0.2);
- padding: 10px;
- border-radius: 5px;
- color: white;
- }
- input, button {
- margin: 5px;
- padding: 5px;
- background: rgba(255, 255, 255, 0.1);
- border: 1px solid rgba(255, 255, 255, 0.3);
- color: white;
- border-radius: 3px;
- }
- button:hover {
- background: rgba(255, 255, 255, 0.2);
- }
- .slider-container {
- display: flex;
- align-items: center;
- gap: 10px;
- margin-top: 10px;
- padding-top: 10px;
- border-top: 1px solid rgba(255, 255, 255, 0.3);
- }
- #speedSlider {
- flex-grow: 1;
- accent-color: #ffffff;
- }
- #speedValue {
- min-width: 3em;
- text-align: right;
- }
- </style>
-
- <div id="controls">
-
- <span>Speed:</span>
- <input type="range" id="speedSlider" min="0" max="100" value="0" />
- <span id="speedValue">0</span>
-
- </div>
-
------------------------------------------------------------
commit d64d081fe923efdc02247754aa6ffb9d11125bf0
Author: ffff:98.97.141.22 <ffff:98.97.141.22@hub.scroll.pub>
Date: Fri Oct 25 05:20:33 2024 +0000
Updated index.scroll
diff --git a/index.scroll b/index.scroll
index 8d7c5d3..9a916f9 100644
--- a/index.scroll
+++ b/index.scroll
@@ -16,3 +16,9 @@ script
three.min.js
stars.css
stars.js
+
+<div id="controls">
+ <span>Speed:</span>
+ <input type="range" id="speedSlider" min="0" max="100" value="0" />
+ <span id="speedValue">0</span>
+</div>
------------------------------------------------------------
commit a9e04349333ece47ee3a18bf2148a122dc4baf17
Author: ffff:98.97.141.22 <ffff:98.97.141.22@hub.scroll.pub>
Date: Fri Oct 25 05:20:12 2024 +0000
Updated index.scroll
diff --git a/index.scroll b/index.scroll
index 4dd29e2..8d7c5d3 100644
--- a/index.scroll
+++ b/index.scroll
@@ -14,4 +14,5 @@ script
Click Clone 👆`
three.min.js
-stars.html
+stars.css
+stars.js
------------------------------------------------------------
commit 69f53f7aadf16055e8d2cb10f13cee4dc44211a8
Author: ffff:98.97.141.22 <ffff:98.97.141.22@hub.scroll.pub>
Date: Fri Oct 25 05:19:59 2024 +0000
Updated stars.css
diff --git a/stars.css b/stars.css
new file mode 100644
index 0000000..e69de29
------------------------------------------------------------
commit 7083ba66c68605e44a5c02a67df287870aca5417
Author: ffff:98.97.141.22 <ffff:98.97.141.22@hub.scroll.pub>
Date: Fri Oct 25 05:19:51 2024 +0000
Updated stars.js
diff --git a/stars.js b/stars.js
index e69de29..7a2583f 100644
--- a/stars.js
+++ b/stars.js
@@ -0,0 +1,174 @@
+let scene, camera, renderer;
+ let stars = [];
+ let textMeshes = [];
+ let zPosition = -5; // Starting Z position for new text
+ let speed = 0.04; // Current speed (starts paused)
+
+ function init() {
+ scene = new THREE.Scene();
+ scene.background = new THREE.Color(0x000000);
+
+ camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
+ camera.position.z = 5;
+
+ renderer = new THREE.WebGLRenderer({ antialias: true });
+ renderer.setSize(window.innerWidth, window.innerHeight);
+ document.body.appendChild(renderer.domElement);
+
+ // Add lights
+ const ambientLight = new THREE.AmbientLight(0xffffff, 0.5);
+ scene.add(ambientLight);
+
+ const pointLight = new THREE.PointLight(0xffffff, 1);
+ pointLight.position.set(5, 5, 5);
+ scene.add(pointLight);
+
+ // Create stars
+ createStars();
+
+
+window.lines.split("\n").map(line => createText(line))
+
+ // Add event listeners
+ document.addEventListener('wheel', onMouseWheel);
+ document.addEventListener('mousemove', onMouseMove);
+ document.addEventListener('mousedown', onMouseDown);
+ document.addEventListener('mouseup', onMouseUp);
+
+ // Set up speed slider
+ const speedSlider = document.getElementById('speedSlider');
+ const speedValue = document.getElementById('speedValue');
+ speedSlider.addEventListener('input', function(e) {
+ speed = e.target.value / 500; // Convert to a reasonable speed value
+ speedValue.textContent = e.target.value;
+ });
+ }
+
+ function createStars() {
+ const starsGeometry = new THREE.BufferGeometry();
+ const starPositions = [];
+
+ for(let i = 0; i < 5000; i++) {
+ const x = (Math.random() - 0.5) * 2000;
+ const y = (Math.random() - 0.5) * 2000;
+ const z = (Math.random() - 0.5) * 2000;
+ starPositions.push(x, y, z);
+ }
+
+ starsGeometry.setAttribute('position',
+ new THREE.Float32BufferAttribute(starPositions, 3));
+
+ const starsMaterial = new THREE.PointsMaterial({
+ color: 0xFFFFFF,
+ size: 2,
+ sizeAttenuation: true
+ });
+
+ const starField = new THREE.Points(starsGeometry, starsMaterial);
+ scene.add(starField);
+ stars.push(starField);
+ }
+
+ function createText(text) {
+ // Create canvas for text
+ const canvas = document.createElement('canvas');
+ const context = canvas.getContext('2d');
+ canvas.width = 512;
+ canvas.height = 128;
+
+ // Set text properties
+ context.fillStyle = 'rgba(0, 0, 0, 0)'; // Transparent background
+ context.fillRect(0, 0, canvas.width, canvas.height);
+ context.fillStyle = '#ffffff'; // White text
+ context.font = '60px Arial';
+ context.textAlign = 'center';
+ context.textBaseline = 'middle';
+ context.fillText(text, canvas.width / 2, canvas.height / 2);
+
+ // Create texture from canvas
+ const texture = new THREE.CanvasTexture(canvas);
+
+ // Create plane geometry for the text
+ const geometry = new THREE.PlaneGeometry(4, 1);
+ const material = new THREE.MeshBasicMaterial({
+ map: texture,
+ transparent: true,
+ side: THREE.DoubleSide
+ });
+
+ const textMesh = new THREE.Mesh(geometry, material);
+ textMesh.position.z = zPosition; // Place text at current Z position
+ zPosition -= 5; // Move next text further back
+
+ scene.add(textMesh);
+ textMeshes.push(textMesh);
+ }
+
+ function updateText() {
+ const newText = document.getElementById('textInput').value;
+ createText(newText);
+ }
+
+ // Mouse control variables
+ let isMouseDown = false;
+ let mouseX = 0;
+ let mouseY = 0;
+
+ function onMouseDown(event) {
+ isMouseDown = true;
+ mouseX = event.clientX;
+ mouseY = event.clientY;
+ }
+
+ function onMouseUp() {
+ isMouseDown = false;
+ }
+
+ function onMouseMove(event) {
+ if (isMouseDown) {
+ const deltaX = event.clientX - mouseX;
+ const deltaY = event.clientY - mouseY;
+
+ camera.position.x += deltaX * 0.01;
+ camera.position.y -= deltaY * 0.01;
+
+ mouseX = event.clientX;
+ mouseY = event.clientY;
+ }
+ }
+
+ function onMouseWheel(event) {
+ camera.position.z += event.deltaY * 0.01;
+
+ // Animate stars when zooming
+ stars.forEach(starField => {
+ starField.rotation.z += event.deltaY * 0.0001;
+ });
+ }
+
+ function animate() {
+ requestAnimationFrame(animate);
+
+ // Automatic movement based on speed
+ if (speed > 0) {
+ camera.position.z -= speed;
+
+ // Rotate stars based on movement speed
+ stars.forEach(starField => {
+ starField.rotation.z += speed * 0.01;
+ });
+ }
+
+ renderer.render(scene, camera);
+ }
+
+ window.addEventListener('resize', onWindowResize, false);
+
+ function onWindowResize() {
+ camera.aspect = window.innerWidth / window.innerHeight;
+ camera.updateProjectionMatrix();
+ renderer.setSize(window.innerWidth, window.innerHeight);
+ }
+
+ init();
+ animate();
\ No newline at end of file
------------------------------------------------------------
commit 0cc11e6d1a9a042d3df21ed335513f3bea2a4940
Author: ffff:98.97.141.22 <ffff:98.97.141.22@hub.scroll.pub>
Date: Fri Oct 25 05:19:49 2024 +0000
Updated stars.html
diff --git a/stars.html b/stars.html
index 6778ebe..14028c8 100644
--- a/stars.html
+++ b/stars.html
@@ -48,179 +48,4 @@
<span id="speedValue">0</span>
</div>
- <script>
- let scene, camera, renderer;
- let stars = [];
- let textMeshes = [];
- let zPosition = -5; // Starting Z position for new text
- let speed = 0.04; // Current speed (starts paused)
-
- function init() {
- scene = new THREE.Scene();
- scene.background = new THREE.Color(0x000000);
-
- camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
- camera.position.z = 5;
-
- renderer = new THREE.WebGLRenderer({ antialias: true });
- renderer.setSize(window.innerWidth, window.innerHeight);
- document.body.appendChild(renderer.domElement);
-
- // Add lights
- const ambientLight = new THREE.AmbientLight(0xffffff, 0.5);
- scene.add(ambientLight);
-
- const pointLight = new THREE.PointLight(0xffffff, 1);
- pointLight.position.set(5, 5, 5);
- scene.add(pointLight);
-
- // Create stars
- createStars();
-
-window.lines.split("\n").map(line => createText(line))
-
- // Add event listeners
- document.addEventListener('wheel', onMouseWheel);
- document.addEventListener('mousemove', onMouseMove);
- document.addEventListener('mousedown', onMouseDown);
- document.addEventListener('mouseup', onMouseUp);
-
- // Set up speed slider
- const speedSlider = document.getElementById('speedSlider');
- const speedValue = document.getElementById('speedValue');
- speedSlider.addEventListener('input', function(e) {
- speed = e.target.value / 500; // Convert to a reasonable speed value
- speedValue.textContent = e.target.value;
- });
- }
-
- function createStars() {
- const starsGeometry = new THREE.BufferGeometry();
- const starPositions = [];
-
- for(let i = 0; i < 5000; i++) {
- const x = (Math.random() - 0.5) * 2000;
- const y = (Math.random() - 0.5) * 2000;
- const z = (Math.random() - 0.5) * 2000;
- starPositions.push(x, y, z);
- }
-
- starsGeometry.setAttribute('position',
- new THREE.Float32BufferAttribute(starPositions, 3));
-
- const starsMaterial = new THREE.PointsMaterial({
- color: 0xFFFFFF,
- size: 2,
- sizeAttenuation: true
- });
-
- const starField = new THREE.Points(starsGeometry, starsMaterial);
- scene.add(starField);
- stars.push(starField);
- }
-
- function createText(text) {
- // Create canvas for text
- const canvas = document.createElement('canvas');
- const context = canvas.getContext('2d');
- canvas.width = 512;
- canvas.height = 128;
-
- // Set text properties
- context.fillStyle = 'rgba(0, 0, 0, 0)'; // Transparent background
- context.fillRect(0, 0, canvas.width, canvas.height);
- context.fillStyle = '#ffffff'; // White text
- context.font = '60px Arial';
- context.textAlign = 'center';
- context.textBaseline = 'middle';
- context.fillText(text, canvas.width / 2, canvas.height / 2);
-
- // Create texture from canvas
- const texture = new THREE.CanvasTexture(canvas);
-
- // Create plane geometry for the text
- const geometry = new THREE.PlaneGeometry(4, 1);
- const material = new THREE.MeshBasicMaterial({
- map: texture,
- transparent: true,
- side: THREE.DoubleSide
- });
-
- const textMesh = new THREE.Mesh(geometry, material);
- textMesh.position.z = zPosition; // Place text at current Z position
- zPosition -= 5; // Move next text further back
-
- scene.add(textMesh);
- textMeshes.push(textMesh);
- }
-
- function updateText() {
- const newText = document.getElementById('textInput').value;
- createText(newText);
- }
-
- // Mouse control variables
- let isMouseDown = false;
- let mouseX = 0;
- let mouseY = 0;
-
- function onMouseDown(event) {
- isMouseDown = true;
- mouseX = event.clientX;
- mouseY = event.clientY;
- }
-
- function onMouseUp() {
- isMouseDown = false;
- }
-
- function onMouseMove(event) {
- if (isMouseDown) {
- const deltaX = event.clientX - mouseX;
- const deltaY = event.clientY - mouseY;
-
- camera.position.x += deltaX * 0.01;
- camera.position.y -= deltaY * 0.01;
-
- mouseX = event.clientX;
- mouseY = event.clientY;
- }
- }
-
- function onMouseWheel(event) {
- camera.position.z += event.deltaY * 0.01;
-
- // Animate stars when zooming
- stars.forEach(starField => {
- starField.rotation.z += event.deltaY * 0.0001;
- });
- }
-
- function animate() {
- requestAnimationFrame(animate);
-
- // Automatic movement based on speed
- if (speed > 0) {
- camera.position.z -= speed;
-
- // Rotate stars based on movement speed
- stars.forEach(starField => {
- starField.rotation.z += speed * 0.01;
- });
- }
-
- renderer.render(scene, camera);
- }
-
- window.addEventListener('resize', onWindowResize, false);
-
- function onWindowResize() {
- camera.aspect = window.innerWidth / window.innerHeight;
- camera.updateProjectionMatrix();
- renderer.setSize(window.innerWidth, window.innerHeight);
- }
-
- init();
- animate();
- </script>
------------------------------------------------------------
commit d1c9f2457b15fa2bf4dde2845ac72bb79f7818fc
Author: ffff:98.97.141.22 <ffff:98.97.141.22@hub.scroll.pub>
Date: Fri Oct 25 05:19:40 2024 +0000
Updated stars.js
diff --git a/stars.js b/stars.js
new file mode 100644
index 0000000..e69de29