Skip to content

Instantly share code, notes, and snippets.

@bennpearson
bennpearson / index.html
Last active January 27, 2018 18:56
Wave 4 - css
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>Waves</title>
<style>
html, body {
height: 100%;
@bennpearson
bennpearson / index.html
Created January 27, 2018 18:52
Wave 3 - Particles
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>Particle Waves</title>
<link rel="stylesheet" href="css/style.css">
@bennpearson
bennpearson / index.html
Created January 27, 2018 18:51
Wave 2 - Circle
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<svg id="svg1" width="960" height="500">
</svg>
<svg id="svg2" width="960" height="500">
@bennpearson
bennpearson / index.html
Last active January 27, 2018 18:53
Wave 1 - Hypnagogic
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>Wave 1 - Hypnogogic</title>
<style>
@bennpearson
bennpearson / index.html
Last active January 31, 2016 22:37
FOAF - Actors
<!doctype html>
<meta charset="utf-8">
<script src="http://www.d3plus.org/js/d3.js"></script>
<script src="http://www.d3plus.org/js/d3plus.js"></script>
<div id="viz"></div>
<script>
var sample_data = [
@bennpearson
bennpearson / index.html
Last active January 31, 2016 18:38
Resources
<!doctype html>
<meta charset="utf-8">
<!-- load D3js -->
<script src="http://www.d3plus.org/js/d3.js"></script>
<!-- load D3plus after D3js -->
<script src="http://www.d3plus.org/js/d3plus.js"></script>
<!-- create container element for visualization -->
@bennpearson
bennpearson / README.js
Last active January 31, 2016 17:56
SVG face
(function(t){t.fn.rwdImageMaps=function(){var r=this,a=parseFloat(t.fn.jquery);var e=function(){r.each(function(){if(typeof t(this).attr("usemap")=="undefined")return;var r=this,e=t(r);t("<img />").load(function(){var i,n,s="width",f="height";if(a<1.6)i=r.getAttribute(s),n=r.getAttribute(f);else i=e.attr(s),n=e.attr(f);if(!i||!n){var h=new Image;h.src=e.attr("src");if(!i)i=h.width;if(!n)n=h.height}var u=e.width()/100,c=e.height()/100,o=e.attr("usemap").replace("#",""),d="coords";t('map[name="'+o+'"]').find("area").each(function(){var r=t(this);if(!r.data(d))r.data(d,r.attr(d));var a=r.data(d).split(","),e=new Array(a.length);for(var s=0;s<e.length;++s){if(s%2===0)e[s]=parseInt(a[s]/i*100*u);else e[s]=parseInt(a[s]/n*100*c)}r.attr(d,e.toString())})}).attr("src",e.attr("src"))})};t(window).resize(e).trigger("resize");return this}})(jQuery);
(function(){var t=jQuery;t(document).ready(function(){t("img[usemap]").rwdImageMaps();t(".test3").mouseover(function(){t(".f1").addClass("hover")});t(".test3").mouseout(fun
@bennpearson
bennpearson / index.html
Last active January 31, 2016 00:09
SVG animation
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSS3 Animation</title>
@bennpearson
bennpearson / README.js
Last active January 30, 2016 23:53
Archive
// threejs.org/license
'use strict';var THREE={REVISION:"71"};"object"===typeof module&&(module.exports=THREE);void 0===Math.sign&&(Math.sign=function(a){return 0>a?-1:0<a?1:+a});THREE.log=function(){console.log.apply(console,arguments)};THREE.warn=function(){console.warn.apply(console,arguments)};THREE.error=function(){console.error.apply(console,arguments)};THREE.MOUSE={LEFT:0,MIDDLE:1,RIGHT:2};THREE.CullFaceNone=0;THREE.CullFaceBack=1;THREE.CullFaceFront=2;THREE.CullFaceFrontBack=3;THREE.FrontFaceDirectionCW=0;
THREE.FrontFaceDirectionCCW=1;THREE.BasicShadowMap=0;THREE.PCFShadowMap=1;THREE.PCFSoftShadowMap=2;THREE.FrontSide=0;THREE.BackSide=1;THREE.DoubleSide=2;THREE.NoShading=0;THREE.FlatShading=1;THREE.SmoothShading=2;THREE.NoColors=0;THREE.FaceColors=1;THREE.VertexColors=2;THREE.NoBlending=0;THREE.NormalBlending=1;THREE.AdditiveBlending=2;THREE.SubtractiveBlending=3;THREE.MultiplyBlending=4;THREE.CustomBlending=5;THREE.AddEquation=100;THREE.SubtractEquation=101;THREE.ReverseSubtractEquation=102;
THREE.M
@bennpearson
bennpearson / README.md
Last active January 31, 2016 23:24
FOAF - Characters

Foaf example