Skip to content

Instantly share code, notes, and snippets.

View electerious's full-sized avatar

Tobias Reich electerious

View GitHub Profile
@ryanflorence
ryanflorence / static_server.js
Last active June 10, 2024 02:37
Node.JS static file web server. Put it in your path to fire up servers in any directory, takes an optional port argument.
var http = require("http"),
url = require("url"),
path = require("path"),
fs = require("fs")
port = process.argv[2] || 8888;
http.createServer(function(request, response) {
var uri = url.parse(request.url).pathname
, filename = path.join(process.cwd(), uri);
@matthewcrist
matthewcrist / index.html
Created September 11, 2012 19:18
Responsive vertical/horizontal image centering with CSS only
<img width="500" height="335" title="" alt="" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAfQAAAFPCAIAAAA0uatrAAA4ZElEQVR42u2d919TW9aH5++aO6YSEnrvqAgCAiIiWLCigiJ2EVBAAbGLV7BgRzqKihQBUXpNIYE0Zub96V05x8twlRIgQHLyzef53GGQkpwcnr322muv/Y/JySkAAAAc4x+4BAAAALkDAACA3AEAAEDuAAAAIHcAAACQOwAAQO4AAAAgdwAAAJA7AAAAyB0AAADkDgAAkDuuAgAAQO4AAAAgdwAAAJA7AAAAyB0AAADkDgAAkDsAAADIHQAAAOQOAAAAcgcAAAC5AwAA5I6rAAAAkDsAAADIHQAAAOQOAAAAcgcAAAC5AwAA5A4AAAByBwAAALkDAACA3AEAAEDuAAAAuQMAAIDcAQAAQO4AAAAgdwAAAJA7AAAAyB0AACB3AAAAkDsAAADIHQAAAOQOAAAAcgcAAMgdAAAA5A4AAAByBwAAALkDAACA3AEAAEDuAAAAuQMAAIDcAQAAQO4AAAAgdwAAAJA7AABA7gAAACB3AAAAkDsAAADIHQAAAOQOAAAAcgcAAMgdAAAA5A4AAAByBwAAALkDAACA3AEAAHIHAAAAuQMAAIDcAQAAQO4AAAAgdwAAAJA7AABA7gAAACB3AAAAkDsAAADIHQAAAOQOAACQOwAAAMgdAAAA5A4AAAByBwAAALkDAACA3AEAAHIHAAAAuQMAAIDcAQAAQO4AAAAgdwAAgNwBAABA7gAAACB3AAAAkDsAAADIHQAAAOQOAACQOwAAAMgdAAAA5A4AAAByBwAAALkDAADkDgAAAHIHAAAAuQMAAIDcAQAAQO4AAAAgdwAAgNwBAABA7gAAACB3AAAAkDsAAADIHQCwUqamtOaDywW5AwBsgIkJ9fi4fFwuVypVC6NSTajVGu2U1mAw6vVGiB5yBwAsJ5rWanU6nUF
@malarkey
malarkey / Contract Killer 3.md
Last active July 5, 2024 08:43
The latest version of my ‘killer contract’ for web designers and developers

When times get tough and people get nasty, you’ll need more than a killer smile. You’ll need a killer contract.

Used by 1000s of designers and developers Clarify what’s expected on both sides Helps build great relationships between you and your clients Plain and simple, no legal jargon Customisable to suit your business Used on countless web projects since 2008

…………………………

/** @jsx React.DOM */
var MyRootComponent = React.createClass({
getInitialState: function() {
return {perMinute: '-', perDay: '-'};
},
componentDidMount: function() {
var socket = io.connect(this.props.url);
socket.on('business.clickout', this.setState.bind(this));
},
render: function() {
@tobru
tobru / lychee_tag.rb
Last active April 7, 2021 04:48
A Liquid tag for Jekyll sites that allows embedding Lychee albums. See https://tobrunet.ch/articles/jekyll-meets-lychee-a-liquid-tag-plugin/
# Connects Jekyll with Lychee (http://lychee.electerious.com/)
#
# # Features
#
# * Generate album overview and link to image
# * Caching of JSON data
#
# # Usage
#
# {% lychee_album <album_id> %}
@bendc
bendc / functional-utils.js
Last active September 15, 2023 12:12
A set of pure ES2015 functions aimed to make functional JavaScript more idiomatic.
// array utils
// =================================================================================================
const combine = (...arrays) => [].concat(...arrays);
const compact = arr => arr.filter(Boolean);
const contains = (() => Array.prototype.includes
? (arr, value) => arr.includes(value)
: (arr, value) => arr.some(el => el === value)
@bendc
bendc / nodelist-iteration.js
Created January 13, 2015 14:39
ES6: Iterating over a NodeList
var elements = document.querySelectorAll("div"),
callback = (el) => { console.log(el); };
// Spread operator
[...elements].forEach(callback);
// Array.from()
Array.from(elements).forEach(callback);
// for...of statement
@paulirish
paulirish / what-forces-layout.md
Last active July 5, 2024 08:26
What forces layout/reflow. The comprehensive list.

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
@ayamflow
ayamflow / gist:b602ab436ac9f05660d9c15190f4fd7b
Created May 9, 2016 19:10
Safari border-radius + overflow: hidden + CSS transform fix
// Add on element with overflow
-webkit-mask-image: -webkit-radial-gradient(white, black);
var str = 'class ಠ_ಠ extends Array {constructor(j = "a", ...c) {const q = (({u: e}) => {return { [`s${c}`]: Symbol(j) };})({});super(j, q, ...c);}}' +
'new Promise((f) => {const a = function* (){return "\u{20BB7}".match(/./u)[0].length === 2 || true;};for (let vre of a()) {' +
'const [uw, as, he, re] = [new Set(), new WeakSet(), new Map(), new WeakMap()];break;}f(new Proxy({}, {get: (han, h) => h in han ? han[h] ' +
': "42".repeat(0o10)}));}).then(bi => new ಠ_ಠ(bi.rd));';
try {
eval(str);
} catch(e) {
alert('Your browser does not support ES6!')
}