Jaume Sanchez spite

## gist:055a20748ef8a86bc23933d5550b2087
#if GL_FRAGMENT_PRECISION_HIGH == 1
  precision highp int;
  precision highp float;
#endif
uniform sampler2D uSampler;
uniform float time;
uniform float baseRotation1;
uniform float rotationSpeed1;
uniform float baseRotation2;
uniform float rotationSpeed2;

## WebGL NFT
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>WebGL NFT</title>
    <meta
      name="viewport"
      content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"
    />
    <meta property="og:image" content="thumbnail.png" />

## superellipsoid
// https://en.wikipedia.org/wiki/Superellipsoid

function c(w, m) {
  const cv = Math.cos(w);
  return Math.sign(cv) * Math.abs(cv) ** m;
}

function s(w, m) {
  const sv = Math.sin(w);
  return Math.sign(sv) * Math.abs(sv) ** m;

## plotly-ccapture.html
<html>
<head>
	<title>Page Title</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
	<script src="CCapture.all.min.js">

	</script>
</head>
<body>
	<div id="elementToShare" class="elementToShare">

## gist:051604efd1d971ab4b6ef1bc1ae2636e
function getTileFromLatLon(zoom, lat, lon) {
  const width = Math.pow(2, zoom);
  const height = Math.pow(2, zoom);
  const latRad = (lat * Math.PI) / 180;
  const x = ~~((width * (lon + 180)) / 360);
  const y = ~~(((1 - Math.asinh(Math.tan(latRad)) / Math.PI) / 2.0) * height);
  return {zoom, x, y};
}

## superellipse
// superellipse / Lamé curve
// https://en.wikipedia.org/wiki/Superellipse

const a = 0.4; // semi-diameter
const b = 0.4; // semi-diameter
const n = 1.5; // curve (<1, 1-2, >2)
const c = Math.cos(gamma); // gamma 0-2π
const s = Math.sin(gamma); // gamma 0-2π
const x = Math.pow(Math.abs(c), 2 / n) * a * Math.sign(c);
const y = Math.pow(Math.abs(s), 2 / n) * b * Math.sign(s);

## gist:b717794dc383bac91d856ad8d723e861
// Keep the tab busy with audio.

const audioCtx = new AudioContext();

const gainNode = audioCtx.createGain();
gainNode.gain.value = 0.1;
gainNode.connect(audioCtx.destination);

const oscillatorNode = audioCtx.createOscillator();
oscillatorNode.type = "square";

## index.svg

      
              1 file
            
          
              2 forks
            
          
              0 comments
            
          
              3 stars
            
          
                spite
                / index.svg
            
            
              Last active
              March 20, 2021 13:51
            
              
                WebGL in SVG via foreignObject
              
          
      Sorry, something went wrong. Reload?
      Sorry, we cannot display this file.
      Sorry, this file is invalid so it cannot be displayed.
      
          Viewer requires iframe.
      
    
## video from png ccapture
ffmpeg -r 60 -i %07d.png -c:v libx264 -vf fps=60 -crf 4 -preset slow -pix_fmt yuv420p out.mp4

## canals and bridges
KSKkMhIE7eo2t4up3NYvbKdbqbcdrsnbv7uJ5tNvR6tWvh81i_m23G-G73q-m-3wgumSvpecdrsnbv7uJ5tNfk_a9GzXL6r5-9EnrF0NleT946WZP3e3dTzbb_I916V73oh810_243Y-W9P-vnvcNcuF0TpbTdjrbldwtb3dNJvt5j0XrXNbjGz30_24P2vV-90kbv8x5F0t7umkXbwHpvWvGz30_24P2v5-dLrbg-Fpu919ojbm8e5hwNluV2N3i2dXDxolY0k8ab_I916NkvFdNtvN_N2rV-18-eSytOuZz7lrF0tzu2dXTzrt5j0Xr3Q_m23Y-a1f18-PSdfx8PLcjiXH3M52LRDnbKdbqbld7ubSebwHp3a9Gz3G-asfVr_n-3TButxjiXH3e5aBdTp3U3K7mk328R6NkvF9b8bs-q-m-3t0-S4v3vHCcbhHF3M5GO3C6p0bqbldwtbJeTz3m3_9Gz3i_W9P-vPm-nPu2QPxfpffE42C3e5GOPleTdrsbAeLynk3s92vPkfRfj9X9P-vPgEtdeE9C-_4wfO3mA3M5avcNluy1t7uB4tEv16Nbv97Nkvp9b8bs-q-uEytPuWNXbo7yF325u5ttwtJxtFuRyrjnJXbqb-eD5n2vyvy_N--oU3jqt5t7cbCcbhHFvOemcN3e39_9GzPtfjfr_n-3Hru_A11s-_xstqde7O3aCcbhbUcrjrZz1epa4UtgqmSXrsnb3k82mXj0b-eD5n2P2f_ffe-G_-R_-MsNmdV78WqduVTgaBVjrrV2tEvJ5128a-eD5X0vyf_fXS-m9-49vprthdM7q25tV7crJxtFuRytOuZzNcuF0tpuqy11A8WiXTzbbGNSv971Q_p9b8bs-q-5-9MWnu2G2ysrar5t1OnW_2E4txjiXH3e5GOvguNVtNvGp3_9qF9T7bj-Y-V-N-vPz8NUdy6012xOmdVb7caxbLfbCcbhbUcrjamc7lb4cLobKdbqbcdtzimbXt7iGgXLyrJ5128R6Nb
	#if GL_FRAGMENT_PRECISION_HIGH == 1
	precision highp int;
	precision highp float;
	#endif
	uniform sampler2D uSampler;
	uniform float time;
	uniform float baseRotation1;
	uniform float rotationSpeed1;
	uniform float baseRotation2;
	uniform float rotationSpeed2;
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8" />
	<title>WebGL NFT</title>
	<meta
	name="viewport"
	content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"
	/>
	<meta property="og:image" content="thumbnail.png" />
	// https://en.wikipedia.org/wiki/Superellipsoid

	function c(w, m) {
	const cv = Math.cos(w);
	return Math.sign(cv) * Math.abs(cv) ** m;
	}

	function s(w, m) {
	const sv = Math.sin(w);
	return Math.sign(sv) * Math.abs(sv) ** m;
	<html>
	<head>
	<title>Page Title</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
	<script src="CCapture.all.min.js">

	</script>
	</head>
	<body>
	<div id="elementToShare" class="elementToShare">
	function getTileFromLatLon(zoom, lat, lon) {
	const width = Math.pow(2, zoom);
	const height = Math.pow(2, zoom);
	const latRad = (lat * Math.PI) / 180;
	const x = ~~((width * (lon + 180)) / 360);
	const y = ~~(((1 - Math.asinh(Math.tan(latRad)) / Math.PI) / 2.0) * height);
	return {zoom, x, y};
	}
	// superellipse / Lamé curve
	// https://en.wikipedia.org/wiki/Superellipse

	const a = 0.4; // semi-diameter
	const b = 0.4; // semi-diameter
	const n = 1.5; // curve (<1, 1-2, >2)
	const c = Math.cos(gamma); // gamma 0-2π
	const s = Math.sin(gamma); // gamma 0-2π
	const x = Math.pow(Math.abs(c), 2 / n) * a * Math.sign(c);
	const y = Math.pow(Math.abs(s), 2 / n) * b * Math.sign(s);
	// Keep the tab busy with audio.

	const audioCtx = new AudioContext();

	const gainNode = audioCtx.createGain();
	gainNode.gain.value = 0.1;
	gainNode.connect(audioCtx.destination);

	const oscillatorNode = audioCtx.createOscillator();
	oscillatorNode.type = "square";