Skip to content

Instantly share code, notes, and snippets.

@bcExpt1123
bcExpt1123 / twophase.js
Created May 15, 2026 00:46
TwoPhase Rubik's Cube Solver - JavaScript Implementation - The optimal solution in 20 steps
// TwoPhase Rubik's Cube Solver - JavaScript Implementation
// Basic corner permutations (0-based indexing)
const cU = {
perm: [3, 0, 1, 2, 4, 5, 6, 7],
orient: [0, 0, 0, 0, 0, 0, 0, 0]
};
const cR = {
perm: [4, 1, 2, 0, 7, 5, 6, 3],
@bcExpt1123
bcExpt1123 / glyphPixels.html
Created October 12, 2025 16:26
Render multi-line text onto an HTML canvas, convert it to an image, and extract pixel data using pure JavaScript.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Multi-line Canvas — No Bottom Padding</title>
<style>
body {
font-family: sans-serif;
display: flex;
flex-direction: column;
@bcExpt1123
bcExpt1123 / tearable_cloth.html
Created June 19, 2025 00:02
Interactive Cloth Simulation with Physics: A real-time cloth simulation using HTML5 Canvas and JavaScript. Interact with the fabric by clicking or dragging your mouse to manipulate or tear it based on physics-based constraints.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
* {
margin: 0;
overflow: hidden;
-webkit-user-select: none;
@bcExpt1123
bcExpt1123 / gravity_points.html
Created June 18, 2025 23:45
Interactive particle animation with gravity points. Click to add gravity wells, drag to move, and double-click to collapse them. Particles are attracted and leave smooth trails, with customizable particle count and gravity interactions via GUI.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Gravity Points with Particle Trails</title>
<style>
body {
font-family: Helvetica sans-serif;
padding: 0;
margin: 0;
@bcExpt1123
bcExpt1123 / transition.html
Last active June 18, 2025 23:40
This HTML code creates an interactive canvas animation featuring particles that radiate from the center. Clicking the canvas resets the particles, which follow dynamic paths with randomized velocities. The Particle class manages their movement, updating every 20 milliseconds for an engaging visual experience.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Interactive Particle Animation on Canvas</title>
<style>
body { background-color: #FFFFFF; font: 30px sans-serif; margin:0px; overflow: hidden;}
</style>
</head>
<body>
@bcExpt1123
bcExpt1123 / face_swapper.py
Created June 6, 2025 02:35
A Python script that swaps faces between two images using OpenCV. It detects faces with Haar cascades, optionally refines alignment with a DNN-based facial landmark detector, applies affine transformation, and blends the source face into the destination image.
import cv2
import numpy as np
def swap_faces(source_image, destination_image):
source_img = cv2.imread(source_image)
destination_img = cv2.imread(destination_image)
face_cascade = cv2.CascadeClassifier(cv2.data.haarcascades + "haarcascade_frontalface_default.xml")
source_gray = cv2.cvtColor(source_img, cv2.COLOR_BGR2GRAY)
destination_gray = cv2.cvtColor(destination_img, cv2.COLOR_BGR2GRAY)
source_faces = face_cascade.detectMultiScale(source_gray, scaleFactor=1.1, minNeighbors=5, minSize=(30, 30))
@bcExpt1123
bcExpt1123 / bézier-curve.html
Created May 28, 2025 22:52
🎨 Interactive Bézier Curve Demo using HTML5 Canvas. Drag control points (P0–P3) to dynamically visualize Quadratic and Cubic Bézier curves in real-time. Great for learning and experimenting with curve geometry.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Draggable Bézier Curves</title>
<style>
body {
margin: 0;
font-family: sans-serif;
}
@bcExpt1123
bcExpt1123 / silk_monster.html
Created March 10, 2025 21:40
Plastic Silk Monster using Three.JS
<style>
body { cursor: none; }
</style>
<script>
const vertexShader=`
precision highp float;
uniform float time;
uniform vec2 mouse;
uniform vec2 mouseVelocity;
uniform vec2 mousePredicted;
@bcExpt1123
bcExpt1123 / auto_update_readme_when_commit.md
Last active February 28, 2025 12:54
A GitHub Actions workflow to automate updating the README file with new content generated by a Python script using OpenAI's API, committing, and pushing the changes.

To automate the update of the README file using a GitHub workflow, you can create a workflow file in your repository. Here is an example of a GitHub Actions workflow that updates the README file and commits the changes:

  1. Create a new workflow file: .github/workflows/update-readme.yml

  2. Add the following content to the workflow file:

name: Update README

on:
<style>
body{
margin: 0;
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
flex-wrap: wrap;
gap: 2em;