removed logging

website/main.js

@@ -37,22 +37,16 @@ let lastMediaVolume = 1;
 
 // Define attachHoverListeners function
 function attachHoverListeners(postElement) {
-    // The base rotation is what was used for the loading animation.
-    // It's stored in the CSS custom property '--post-rotation'.
     const baseRotation = postElement.style.getPropertyValue('--post-rotation');
 
     postElement.addEventListener('mouseenter', function () {
         postElement.style.zIndex = 100;
-        // Apply specific transition for this hover effect
         postElement.style.transition = "transform 0.22s cubic-bezier(.5,1.5,.5,1), box-shadow 0.22s cubic-bezier(.5,1.5,.5,1)";
-        // Hover transform: new random rotation + scale
         postElement.style.transform = `rotate(${getRandomRotation()}deg) scale(1.1)`;
     });
 
     postElement.addEventListener('mouseleave', function () {
-        // Apply specific transition for unhover
         postElement.style.transition = "transform 0.18s cubic-bezier(.5,0,.5,1), box-shadow 0.18s cubic-bezier(.5,0,.5,1)";
-        // Return to base rotation + scale(1)
         postElement.style.transform = `rotate(${baseRotation || '0deg'}) scale(1)`;
         postElement.style.zIndex = 1;
     });
@@ -61,12 +55,9 @@ function attachHoverListeners(postElement) {
 function createPost(t) {
     const post = document.createElement("div");
     post.className = "post";
-    // Set initial transform. This will be used by addPostToLayout to set --post-rotation.
     post.style.transform = `rotate(${getRandomRotation()}deg)`;
     post.style.backgroundColor = getPostItColorByDate(t.createdAt);
 
-    // Hover listeners are now attached in addPostToLayout after the loading animation.
-
     const link = document.createElement("a");
     link.href = t.url;
     link.target = "_blank";
@@ -217,8 +208,6 @@ function createPost(t) {
     link.href = t.url;
     link.appendChild(post);
     
-    console.log(`[Main] Created post with ${t.embed.length} embeds`);
-    
     return link;
 }
 
@@ -418,29 +407,24 @@ function addPostToLayout(postEl, zIndex) {
     if (!layoutColumns) return;
     
     const col = getShortestColumn(layoutColumns);
-    const postDiv = postEl.firstElementChild; // This is the .post div
+    const postDiv = postEl.firstElementChild; 
     
-    // Store the current rotation (from postDiv.style.transform) for the animation
     const currentTransform = postDiv.style.transform;
     const rotationMatch = currentTransform.match(/rotate\(([-\d.]+deg)\)/);
     const rotation = rotationMatch ? rotationMatch[1] : '0deg';
     
-    postDiv.style.setProperty('--post-rotation', rotation); // Used by slideUpFadeIn animation
+    postDiv.style.setProperty('--post-rotation', rotation); 
     postDiv.style.zIndex = zIndex;
     
-    // Add loading animation class
     postDiv.classList.add('loading');
     
     col.appendChild(postEl);
     
-    // Remove animation class after animation completes AND THEN attach hover listeners
     setTimeout(() => {
         postDiv.classList.remove('loading');
-        // Now that the loading animation is done, attach hover listeners
         attachHoverListeners(postDiv);
-    }, 600); // Duration of slideUpFadeIn animation (0.6s)
+    }, 600); 
     
-    // Add tape only for this specific post
     setTimeout(() => {
         const imgs = postEl.querySelectorAll('img.image-placeholder');
         if (imgs.length > 0 && window.addTapeToPost) {
@@ -499,7 +483,6 @@ async function processPostQueue() {
 
 function layoutPosts(postElements) {
     if (document.fullscreenElement && document.fullscreenElement.tagName === "VIDEO") {
-        console.log('[Main] Skipping layoutPosts: video is fullscreen');
         return;
     }
     const numCols = getNumColumns();
@@ -510,7 +493,6 @@ function layoutPosts(postElements) {
         col.appendChild(postEl);
     });
     
-    console.log('[Main] Posts laid out, adding tape for all images');
     setTimeout(() => {
         if (window.addTapeToImages) {
             window.addTapeToImages();
@@ -563,8 +545,6 @@ async function fetchPosts() {
             };
         });
 
-        console.log(`[Main] Fetched ${posts.length} posts, ${posts.filter(p => p.embed.some(e => e.type === "image")).length} have images, ${posts.filter(p => p.embed.some(e => e.type === "video")).length} have videos`);
-
         // Initialize layout columns
         const numCols = getNumColumns();
         layoutColumns = createColumns(numCols);
@@ -588,7 +568,6 @@ async function fetchPosts() {
 
 window.addEventListener("resize", () => {
     if (document.fullscreenElement && document.fullscreenElement.tagName === "VIDEO") {
-        console.log('[Main] Skipping resize layout: video is fullscreen');
         return;
     }
     if (postElementsCache && layoutColumns) {

website/tape.js

@@ -1,34 +1,24 @@
 function addTapeToImages() {
     const images = document.querySelectorAll('.image-placeholder');
-    console.log(`[Tape] Found ${images.length} images to add tape to`);
     
     if (images.length === 0) {
-        console.warn('[Tape] No .image-placeholder elements found');
         return;
     }
     
     images.forEach((image, index) => {
-        console.log(`[Tape] Processing image ${index + 1}/${images.length}`);
-        
-        // Check if image already has tape
         const existingTape = image.querySelectorAll('.tape');
         if (existingTape.length > 0) {
-            console.log(`[Tape] Image ${index + 1} already has tape, skipping`);
             return;
         }
         
-        // Ensure the image parent has relative positioning
         const imageParent = image.parentElement;
         if (imageParent && window.getComputedStyle(imageParent).position === 'static') {
             imageParent.style.position = 'relative';
-            console.log(`[Tape] Set image parent to relative positioning`);
         }
         
-        // Create two tape pieces
         const tape1 = createTapeElement(index, 1);
         const tape2 = createTapeElement(index, 2);
         
-        // Position based on pattern
         const usePattern1 = index % 2 === 0;
         if (usePattern1) {
             positionTape(tape1, 'top-left');
@@ -38,11 +28,8 @@ function addTapeToImages() {
             positionTape(tape2, 'bottom-left');
         }
         
-        // Add to the image's parent container
         imageParent.appendChild(tape1);
         imageParent.appendChild(tape2);
-        
-        console.log(`[Tape] Added tape to image ${index + 1} parent`);
     });
 }
 
@@ -50,9 +37,8 @@ function createTapeElement(imageIndex, tapeNumber) {
     const tape = document.createElement('div');
     tape.className = 'tape';
     
-    // Even chunkier tape: wider and much taller
+    const width = 60 + Math.random() * 20; 
-    const width = 60 + Math.random() * 20; // 60-80px
+    const height = 40 + Math.random() * 16; 
-    const height = 40 + Math.random() * 16; // 40-56px
     
     tape.style.cssText = `
         position: absolute;
@@ -70,15 +56,14 @@ function createTapeElement(imageIndex, tapeNumber) {
         background-size: 4px 4px;
     `;
     
-    console.log(`[Tape] Created tape element ${tapeNumber} for image ${imageIndex + 1}`);
     return tape;
 }
 
 function positionTape(tape, corner) {
-    const randomOffset = () => Math.random() * 8 - 4; // -4 to 4px
+    const randomOffset = () => Math.random() * 8 - 4; 
-    const randomRotation = (Math.random() * 20 - 10); // -10 to 10 degrees
+    const randomRotation = (Math.random() * 20 - 10); 
-    const OUT_X = 25; // px, how far out from the left/right
+    const OUT_X = 25; 
-    const OUT_Y = 18; // px, how far out from the top/bottom
+    const OUT_Y = 18; 
 
     switch (corner) {
         case 'top-left':
@@ -102,57 +87,35 @@ function positionTape(tape, corner) {
             tape.style.transform = `rotate(${-45 + randomRotation}deg)`;
             break;
     }
-    
-    console.log(`[Tape] Positioned tape at ${corner}:`, {
-        top: tape.style.top,
-        bottom: tape.style.bottom,
-        left: tape.style.left,
-        right: tape.style.right,
-        transform: tape.style.transform
-    });
 }
 
 function refreshTape() {
-    console.log('[Tape] Refreshing tape - removing existing tape');
-    
-    // Remove existing tape
     const existingTape = document.querySelectorAll('.tape');
-    console.log(`[Tape] Found ${existingTape.length} existing tape elements to remove`);
-    
     existingTape.forEach(tape => tape.remove());
-    
-    console.log('[Tape] Re-adding tape to images');
     addTapeToImages();
 }
 
-// Add tape to a specific post element
 function addTapeToPost(postElement) {
     const images = postElement.querySelectorAll('.image-placeholder');
-    console.log(`[Tape] Found ${images.length} images in post to add tape to`);
     
     if (images.length === 0) {
         return;
     }
     
     images.forEach((image, index) => {
-        // Check if image already has tape
         const existingTape = image.parentElement.querySelectorAll('.tape');
         if (existingTape.length > 0) {
-            console.log(`[Tape] Image ${index + 1} already has tape, skipping`);
             return;
         }
         
-        // Ensure the image parent has relative positioning
         const imageParent = image.parentElement;
         if (imageParent && window.getComputedStyle(imageParent).position === 'static') {
             imageParent.style.position = 'relative';
         }
         
-        // Create two tape pieces
         const tape1 = createTapeElement(index, 1);
         const tape2 = createTapeElement(index, 2);
         
-        // Position based on pattern
         const usePattern1 = index % 2 === 0;
         if (usePattern1) {
             positionTape(tape1, 'top-left');
@@ -162,18 +125,12 @@ function addTapeToPost(postElement) {
             positionTape(tape2, 'bottom-left');
         }
         
-        // Add to the image's parent container
         imageParent.appendChild(tape1);
         imageParent.appendChild(tape2);
-        
-        console.log(`[Tape] Added tape to image ${index + 1} in specific post`);
     });
 }
 
-// Simple test function
 function testSimpleTape() {
-    console.log('[Tape Test] Creating simple test...');
-    
     const firstImage = document.querySelector('.image-placeholder');
     if (!firstImage) {
         console.error('[Tape Test] No images found');
@@ -203,11 +160,9 @@ function testSimpleTape() {
     testTape.textContent = 'TEST';
     
     parent.appendChild(testTape);
-    console.log('[Tape Test] Added test tape to first image parent');
     
     setTimeout(() => {
         testTape.remove();
-        console.log('[Tape Test] Removed test tape');
     }, 3000);
 }
 
@@ -216,5 +171,3 @@ window.addTapeToImages = addTapeToImages;
 window.addTapeToPost = addTapeToPost;
 window.refreshTape = refreshTape;
 window.testSimpleTape = testSimpleTape;
-
-console.log('[Tape] Simple tape system loaded. Use window.testSimpleTape() to test.');