Skip to content

Instantly share code, notes, and snippets.

xem

Block or report user

Report or block xem

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@xem
xem / projection.md
Last active Jun 19, 2019
wip projection article
View projection.md

3D projection on a 2D canvas (wip blog post)


A very short article about a very specific topic: draw 3D points on a 2D canvas!
It's not very complex, but it puzzled me for years, until C4ntelope made this handy introduction based on his own intuition and computations, and Román Cortés helped me complete these explanations and simplify the maths and the code.
(This article is based on that Twitter thread).


@xem
xem / js1k 2019 ideas.md
Last active Nov 15, 2018
js1k 2019 ideas
View js1k 2019 ideas.md
  • 3D Peach Castle (CSS3D vs. raycasting feat RomanCortes)
  • 3D solar system (feat Yonatan)
  • Two3D clone (feat BalintCsala)
  • 2D physics engine (feat BalintCsala)
  • Mandelbox (feat BalintCsala)
  • An app that generates QR codes containing 1kb demos
  • A 2D WFC tracer
  • random dweet generator
  • SMB 1-1
  • 3D plotter
View css.md
  • Don't modify strings (content: "...", font-family: '...')
  • Remove all CSS comments (ex: /* ... */ )
  • Remove all unnecessary spaces, tabs and line breaks (ex: around + > ~ ; : , ( ) { } /)
    • Keep spaces before : in selectors (ex: * :before != *:before)
    • Keep spaces around + and - in calc(...) (but not in nth-child and nth-of-type)
  • Remove all unnecessary ; (ex: a{color:red;})
  • Remove all unnecessary * in CSS selectors (ex: *:before => :before)
  • Remove leading and trailing zeros (ex: 0.1%, 1.0%, 0.0px)
  • Remove units after zero (ex: 0px 0rem 0% 0turn 0vmax 0dpi)
@xem
xem / v1.html
Created Nov 19, 2016
1kb ES6 Quines Ideas
View v1.html
<pre id=p><script id="s" style="display:block">setInterval(z=`
/* =<,m#F^ A W###q. */ ;
/* #K q##H######Am */ ;
/* dP cpq#q##########b, */ ;
/* p##@###YG=[#######y */ ;
/* d#qg '*PWo##q#######D */ ;
/* aem1k.com Q###KWR#### W[ */ ;
/* .Q#########Md#.###OP A@ , */ ;
/* , (W#####Xx######.P^ T % */ ;
/* #y '^TqW####P###BP */ ;
@xem
xem / miniEditor.html
Last active Sep 18, 2016
mini native live code editor
View miniEditor.html
<body contenteditable oninput=eval(S.textContent)>
<h1>Hi! (edit me)</h1>
<script style="display:block;border:1px solid;;white-space:pre-wrap" id=S>
// JS (edit me)
console.log("test");
</script>
<style style="display:block;border:1px solid;white-space:pre-wrap">
/* CSS (edit me) */
* { background: #def }
</style>
@xem
xem / readme.md
Last active Aug 21, 2019
Maths & trigonometry cheat sheet for 2D & 3D games
View readme.md

Conventions

  • A = [xA, yA] is a point on the 2D plane. Same for B, C, ...
  • lengths are in any unit (ex: pixels)
  • code snippets are in JavaScript

Degrees to radians

angleRad = angleDeg * Math.PI / 180;

@xem
xem / index.html
Last active Apr 22, 2016
webgl experiment
View index.html
<canvas id=a>
<script>
g=a.getContext("webgl");
/*
// Coral reef
// -----------
@xem
xem / moz.xml
Created Dec 23, 2015
moz-binding
View moz.xml
<?xml version="1.0"?>
<bindings xmlns="http://www.mozilla.org/xbl" xmlns:html="http://www.w3.org/1999/xhtml">
<binding id="mycode">
<implementation>
<constructor>
alert("XBL script executed.");
</constructor>
</implementation>
</binding>
@xem
xem / readme.md
Last active Aug 29, 2015
A bookmarklet to fill any input with your e-mail
View readme.md

...or any text you often need to write in form fields.

Works with inputs, textareas and contenteditable elements.

Doesn't work on HTTPS on Firefox 23+.

javascript:(function(d){d=document.activeElement;if(d.tagName=="INPUT"||d.tagName=="TEXTAREA"||d.contentEditable=="true"){d.value=d.innerHTML="my_email@my_email_provider.com"}})()
You can’t perform that action at this time.