matijs’s gists

matijs / transistionDetection.js

Last active December 18, 2015 02:18

Detect support for css transitions

	var hasTransitions = (function() {
	var propNames = ["transition", "MozTransition", "webkitTransition", "OTransition", "msTransition"];
	var i = 0;
	var length = propNames.length;
	for (; i < length; i++) {
	if (typeof document.documentElement.style[propNames[i]] === "string") return true;
	}
	return false;
	}());

matijs / generatedcontent.js

Last active December 17, 2015 14:19

Generated content feature detection

	(function() {
	var div = document.createElement("div");
	var style = document.createElement("style");
	div.id = "d";
	style.innerHTML = "#d{position:absolute;left:-999px}#d:before{content:'x';}";
	document.documentElement.appendChild(div);
	document.documentElement.appendChild(style);
	if (div.clientWidth > 0)
	document.documentElement.className += " generated-content";
	document.documentElement.removeChild(div);

matijs / inline-svg-fallback.html

Last active December 16, 2015 02:39

Check for inline svg and provide a background image fallback

	<!doctype html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<title>Inline SVG fallback</title>
	<script>
	var div = document.createElement("div");
	div.innerHTML = "<svg/>";
	document.documentElement.className = (!!div.firstChild && div.firstChild.namespaceURI == "http://www.w3.org/2000/svg" ? "inline-svg" : "no-inline-svg");
	document.createElement("svg");

matijs / scale-enable.js

Created February 20, 2013 12:58

Bookmarklet to enable scaling on pages that have disabled it.

	javascript:void(function() {
	document.querySelector("meta[name=viewport]").setAttribute("content", "width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=1");
	})();

matijs / .htaccess

Last active December 12, 2015 02:29

Poor man's php front controller example

	# mind the lowercase "on"
	RewriteEngine on
	# match all non existing file on the filesystem
	RewriteCond %{REQUEST_FILENAME} !-f
	# reroute everything that matches through index.php with `url` as the querystring
	RewriteRule (.*) index.php?url=$1

matijs / GoogleMapsLocateMe.js

Last active December 11, 2015 00:08

Bookmarklet to use the browser's geolocation

	javascript:void(navigator.geolocation.getCurrentPosition(function(p){
	var f=document.forms[0],
	c=p.coords;
	f.q.value=c.latitude+','+c.longitude;
	f.submit()
	})())

matijs / reloadcss ie bookmarklet

Last active December 10, 2015 20:28

Bookmarklet to reload CSS without reloading the page… in old-fashioned browsers.

javascript:void (function(){var c=document.getElementsByTagName("link");for(var d=0,a=c.length;d<a;d++){if(c[d].rel.toLowerCase().indexOf("stylesheet")>=0&&c[d].href){var b=c[d].href.replace(/(&|\??)reload=\d+/,"");c[d].href=b+(b.indexOf("?")>=0?"&":"?")+"reload="+(new Date().valueOf())}}})();

matijs / reloadcss bookmarklet

Last active December 10, 2015 20:28

Bookmarklet to reload CSS without reloading the page… in modern browsers.

javascript:void (function(){[].forEach.call(document.querySelectorAll("link[rel=stylesheet][href]"),function(b){var a=b.href.replace(/(&|\??)reload=\d+/,"");b.href=a+(a.indexOf("?")>=0?"&":"?")+"reload="+(new Date().valueOf())})})();

matijs / commands.sh

Last active December 10, 2015 18:29

Useful command line stuff

	# use `basename [suffix]` to do clever multiple renaming
	for file in *.html.pdf; do \
	mv "$file" "`basename $file .html.pdf`.pdf";
	done

	# remove "from" metadata from files on OS X
	xattr -d "com.apple.metadata:kMDItemWhereFroms" file

	# remove "quarantine" metadata from files on OS X
	xattr -d "com.apple.quarantine" file

matijs / index.html

Created December 10, 2012 11:09

star rating

	<!doctype html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<title>Star rating</title>
	<style>
	html { background: slategrey; color: ivory; font-family: Helvetica, Arial, sans-serf; font-size: 16px; }
	body { margin: 2em; }
	.result { background: ivory; border-radius: 1em; border: 2px solid darkslategrey; color: darkslategrey; font-size: 1em; overflow: hidden; text-shadow: 0 1px 1px rgba(0,0,0,0.4); width: 6em; }

matijs matijs