Skip to content

Instantly share code, notes, and snippets.

View KrofDrakula's full-sized avatar

Klemen Slavič KrofDrakula

View GitHub Profile
@KrofDrakula
KrofDrakula / stateful.js
Created May 18, 2018 19:42
A stateful HOC for pure components
import { h, Component } from 'preact';
const withState = Wrapped => class extends Component {
constructor(props) {
super(props);
this.state = props;
}
componentWillReceiveProps(nextProps) {
this.setState(nextProps);
@KrofDrakula
KrofDrakula / auto_classnames.jsx
Created February 6, 2017 15:57
Customizing node props
import { options } from 'preact';
import cx from 'classnames';
let old = options.vnode;
options.vnode = vnode => {
let isElement = typeof vnode.nodeName==='string',
props = vnode.attributes || {},
key = props.class ? 'class' : 'className';
if (isElement && props[key] && typeof props[key]==='object') {
props[key] = cx(props[key]);
@KrofDrakula
KrofDrakula / vec2d.js
Created July 23, 2016 08:26
A mutable 2D vector class, made for real-time graphics in JS
class Vec2d {
constructor(x, y) { this.reset(x, y); }
get mag() { return Math.sqrt(this.dot(this)); }
clone() { return new Vec2d(this.x, this.y); }
reset(x, y) { this.x = x; this.y = y; return this; }
neg() { return this.scale(-1); }
norm() {
let m = this.mag;
if (m > 0) return this.scale(1 / m);
return this;
@KrofDrakula
KrofDrakula / tmpl.js
Created June 5, 2015 16:59
Small templating function
// Use `<% ... %>` to execute blocks of JavaScript, `<%= ... %>` to write
// out the result of the embedded expression.
function tmpl(str, params) {
if (!str) return '';
function generateOutput(str) {
return " p.push('" + str.replace(/'/g, "\\'").split(/\r?\n/g).join("\\n');\n p.push('") + "');\n";
}
var fn;

Keybase proof

I hereby claim:

  • I am krofdrakula on github.
  • I am krofdrakula (https://keybase.io/krofdrakula) on keybase.
  • I have a public key whose fingerprint is A5B2 D08D 4333 E167 DB37 A7C0 6444 7954 106D 1D39

To claim this, I am signing this object:

@KrofDrakula
KrofDrakula / curves.js
Created December 28, 2014 19:41
CSS Animation Bézier curve generator
(function(global) {
function extend(obj) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var name in source) if (source.hasOwnProperty(name))
obj[name] = source[name];
}
return obj;
}
@KrofDrakula
KrofDrakula / dither.js
Created November 22, 2014 00:16
Drag image example
(function(global) {
function Dither(container, width, height) {
this.container = container;
this.width = width;
this.height = height;
this.canvas = null;
this.image = null;
this.draw = this.draw.bind(this);
@KrofDrakula
KrofDrakula / objectpool.js
Last active August 29, 2015 14:09
Object pooling implementation
function ObjectPool(Type) {
this.Type = Type;
this.available = [];
this.active = [];
}
ObjectPool.prototype.create = function() {
var args = [].slice.apply(arguments), self = this, inst, ret;
if (this.available.length == 0) {
var Temp = function() {};
@KrofDrakula
KrofDrakula / template.js
Last active October 3, 2015 06:01
An easily understandable templating function
// A very light-weight templating function
// Use <% ... %> to embed code, <%= ... %> to output expressions.
//
// Caveat: because the parser makes no attempts at interpreting
// any `<%` and `%>` inside code blocks, so if you need
// metatemplating, you need to escape those sequences
// just like '<scr'+'ipt>' in script tags.
//
// See examples of usage below.
function template(str, params) {