Vertex
- create:
left-click
on edit panel - delete:
right-click
on edit panel
Dump
- vertices for
clip-path:polygon(..)
<html > | |
<head> | |
<meta charset="UTF-8"> | |
<title>Responsive HTML5 Audio Spectrum EQ Player</title> | |
<script type="text/javascript"> | |
var audio = new Audio(); | |
audio.src = "https://s3.us-east-2.amazonaws.com/leetcodes/assets/My_House_-_Flo_Rida_Jack_Dyer_Bootleg.mp3"; | |
audio.crossOrigin = "anonymous"; | |
audio.controls = false; |
<canvas id="canvas"></canvas> | |
<div id="hud"> | |
<div id="msg"></div> | |
<div id="algos"></div> | |
</div> | |
<div id="help"> | |
<div> | |
<h1>THE SPIRAL</h1> | |
<h4>Music Player / Visualizer v1.0.0</h4> | |
<h3>HELP SCREEN</h3> |
<div class="login-box"> | |
<h2>Login</h2> | |
<form id="frm" name="frm" action="/login" method="post"> | |
<div class="user-box"> | |
<input type="text" name="username" required> | |
<label>Username</label> | |
</div> | |
<div class="user-box"> | |
<input type="password" name="password" required> | |
<label>Password</label> |
- src = "https://images.unsplash.com/photo-1599407365109-d62ea7d81a42?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=630&q=80" | |
- text = " css clip-path " | |
div | |
img#bg(src=src) | |
img#fg(src=src) | |
- for (const ch of text) | |
span=ch | |
base(target="_blank") | |
ul#credits |
<img id="elImg" src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEASABIAAD/4gIcSUNDX1BST0ZJTEUAAQEAAAIMbGNtcwIQAABtbnRyUkdCIFhZWiAH3AABABkAAwApADlhY3NwQVBQTAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA9tYAAQAAAADTLWxjbXMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAApkZXNjAAAA/AAAAF5jcHJ0AAABXAAAAAt3dHB0AAABaAAAABRia3B0AAABfAAAABRyWFlaAAABkAAAABRnWFlaAAABpAAAABRiWFlaAAABuAAAABRyVFJDAAABzAAAAEBnVFJDAAABzAAAAEBiVFJDAAABzAAAAEBkZXNjAAAAAAAAAANjMgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB0ZXh0AAAAAElYAABYWVogAAAAAAAA9tYAAQAAAADTLVhZWiAAAAAAAAADFgAAAzMAAAKkWFlaIAAAAAAAAG+iAAA49QAAA5BYWVogAAAAAAAAYpkAALeFAAAY2lhZWiAAAAAAAAAkoAAAD4QAALbPY3VydgAAAAAAAAAaAAAAywHJA2MFkghrC/YQPxVRGzQh8SmQMhg7kkYFUXdd7WtwegWJsZp8rGm/fdPD6TD////bAIQAAgMDAwQDBAUFBAYGBgYGCAgHBwgIDQkKCQoJDRMMDgwMDgwTERQRDxEUER4YFRUYHiMdHB0jKiUlKjUyNUVFXAECAwMDBAMEBQUEBgYGBgYICAcHCAgNCQoJCgkNEwwODAwODBMRFBEPERQRHhgVFRgeIx0cHSMqJSUqNTI1RUVc/8AAEQgBdwEsAwEiAAIRAQMRAf/EAaIAAAEFAQEBAQEBAAAAAAAA |
Fragment shader, just math - no framework. JS window is webgl bootstrap and texture loading/attaching to canvas. HTML window is the fragment and vertex shaders. Basically I'm making a 3D scene that is projected on the canvas by using distance fields (mathematical formulas that represent an object.)
gpg --gen-key --batch <<EOF | |
Key-Type: RSA | |
Key-Length: 4096 | |
Subkey-Type: RSA | |
Subkey-Length: 4096 | |
Name-Real: <ton_nom> | |
Name-Email: <ton_mail> | |
Expire-Date: 0 | |
Passphrase: <ta_passphrase> | |
%pubring foo${1}.pub |
[Unit] | |
Description=Leafnode NNTP Socket | |
[Socket] | |
ListenStream=127.0.0.1:119 | |
Accept=true | |
[Install] | |
WantedBy=sockets.target |
var net = require('net'); | |
var END = '\r\n'; | |
var groups = ['nodejs.test']; | |
var articles = { | |
'<1@127.0.0.1>' : {body : 'An article.'}, | |
'<2@127.0.0.1>' : {body : 'Another article.'}, | |
}; |