tried again with computer model with online tutorial. Will try again with thinker model tomorrow.

main.js

@@ -2,7 +2,7 @@
 Author: Daniel Jones
 IDE: VSCodium
 Browsers tested: Firefox 125
-Last change: 05/08/24
+Last change: 07/27/24
 purpose: portfolio website to show to potential freelance customers/web developer positions
 */
 
@@ -13,6 +13,7 @@ import { STLLoader } from 'three/examples/jsm/Addons.js';
 import './style.css';
 import {OrbitControls} from 'three/examples/jsm/controls/OrbitControls';
 import * as THREE from 'three';
+import { GLTFLoader } from 'three/examples/jsm/Addons.js';
 
 
 
@@ -38,34 +39,21 @@ renderer.render(scene, camera);
 
 
 
-//stl code to import stl 3d model
+//code to import OBJfile
-const thinkerMaterial = new THREE.MeshPhysicalMaterial({
-    color: 'FFFFFF',
-    metalness: 0.50,
-    roughness: 0.1,
-    opacity: 1.0,
-    transparent: false,
-    transmission: 0.99,
-    clearcoat: 1.0,
-    clearcoatRoughness: 0.25,
-    
-})
 
-const thinkerLoader = new STLLoader();
+const objCmpLoader = new OBJLoader();
+objCmpLoader.load('./assets/models/Comp_and_Floppy.obj',(objScene)=>{
+    let loadedModel = objScene;
+    console.log("UwU whats this? My comupter model loaded! OwO");
+    objScene.position.z = 50; //for reference tomorrow when I work on this again...objScene is the actual object that you set attributes to. Mess with that.
+    objScene.position.y = 20;
+    objScene.scale.set(10,10,10);
+    objScene.rotateOnAxis = 90;
+    scene.add(loadedModel);
+   
+}
+);
 
-thinkerLoader.load(
-    'assets/models/thinker.stl',
-    function (geometry) {
-        const thinkerMesh = new THREE.Mesh(geometry, thinkerMaterial)
-        scene.add(thinkerMesh)
-    },
-    (xhr) => {
-        console.log((xhr.loaded / xhr.total) * 100 + '% loaded')
-    },
-    (error) => {
-        console.log(error)
-    }
-)
 
 
 const ambientLight = new THREE.AmbientLight(0xffffff);