Skip to content

Instantly share code, notes, and snippets.

View jairusjoer's full-sized avatar
✌️
Hello there!

Jairus Joer jairusjoer

✌️
Hello there!
5 followers · 18 following
View GitHub Profile
@jairusjoer
jairusjoer / settings.json
Last active February 5, 2024 10:23
My personal configuration for Visual Studio Code
{
"[javascriptreact]": {
"editor.defaultFormatter": "vscode.typescript-language-features"
},
"[typescriptreact]": {
"editor.defaultFormatter": "vscode.typescript-language-features"
},
"editor.bracketPairColorization.enabled": false,
"editor.cursorBlinking": "phase",
"editor.cursorSmoothCaretAnimation": "on",
@jairusjoer
jairusjoer / reset.css
Last active January 31, 2024 13:27
An opinionated yet extensible CSS reset for various project scopes
:root {
font-size: max(calc(16vmin * 100 / 1440), 16px);
}
*:where(:not(iframe, canvas, img, svg, video):not(svg *)) {
all: unset;
display: revert;
outline: revert;
}
@jairusjoer
jairusjoer / sticker.ts
Created May 19, 2023 14:04
A super simple script to create placeable random stickers with image elements
const sticker = (set: string[], canvas: HTMLElement | null) => {
let z = 0;
if (canvas) {
canvas.onclick = (event: MouseEvent) => {
let randomImage = set[Math.floor(Math.random() * set.length)];
let randomRotation = Math.random() * (45 - -45) + -45
const element = document.createElement('img');
@jairusjoer
jairusjoer / drag.ts
Created May 19, 2023 14:03
A super simple script to create draggable HTML elements
export const drag = (elements: NodeListOf<HTMLElement>) => {
let z = 0;
if (elements) {
for (const element of elements) {
let [adjustedX, adjustedY, currentX, currentY] = [0, 0, 0, 0];
let moved = false;
const dragMouseUp = (event: MouseEvent) => {
document.onmousemove = null;
@jairusjoer
jairusjoer / post-and-reply.md
Last active March 27, 2023 15:54
Post data to a PHP endpoint and dynamically display a response with Alpine.js

Post and reply

Post data to a PHP endpoint and dynamically display a response with Alpine.js

HTML

<html x-data="utility">

  <!-- ... -->
@jairusjoer
jairusjoer / rasterGlobe.ts
Last active March 27, 2023 15:50
Create an array of globe coordinates based on a limited amounts of points.
const rasterGlobe = (limit = 1000, x1 = -180, y1 = -180) => {
type Coordinates = { x: number; y: number };
let base = Math.pow(limit, 1 / 2);
let root = Math.floor(base);
let data: Array<Coordinates> = [];
const rasterLine = (x2: number) => {
for (let i = 0; i < root; i++) {
let y = y1 + ((y1 * -2) / (root - 1)) * i;
@jairusjoer
jairusjoer / post.php
Last active March 27, 2023 15:32
Accept POST data in JSON format
<?php
$response = (object) [];
$json = json_decode(file_get_contents('php://input'));
//...
if (!$json) {
$response->state = [
'code' => 400,
@jairusjoer
jairusjoer / .zshrc
Created March 4, 2023 11:06
My personal configuration for zsh
# https://github.com/nvm-sh/nvm
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
# https://github.com/zsh-users/zsh-autosuggestions
source ~/.zsh/zsh-autosuggestions/zsh-autosuggestions.zsh
# https://starship.rs/
eval "$(starship init zsh)"
@jairusjoer
jairusjoer / starship.toml
Last active March 4, 2023 11:00
My personal configuration for starship.rs
format = """
$directory\
[](fg:#4f46e5 bg:#4338ca)\
$git_branch\
$git_status\
[](fg:#4338ca bg:#3730a3)\
$nodejs\
$rust\
$golang\
$php\
@jairusjoer
jairusjoer / three.js
Last active February 19, 2023 22:24
A simple wrapper for three.js to integrate 3D objects into a website
import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls.js";
import {
AnimationMixer,
Clock,
Color,
DirectionalLight,
HemisphereLight,
PerspectiveCamera,