Skip to content

Instantly share code, notes, and snippets.

View simple10's full-sized avatar
💭
Working like a madman on Level Up & Muxxi

Joe Johnston simple10

💭
Working like a madman on Level Up & Muxxi
View GitHub Profile
@simple10
simple10 / backbone.meta.js.coffee
Created December 25, 2012 00:30
Backbone meta data plugin
#
# Add meta data support to Model and Collection
# Allows server to include additional meta data that gets automatically parsed and stashed in [model|collection].meta
#
# Usage:
# Include this file after backbone.js
# Set data_key on Model or Collection
#
# If data_key is not set, original parse method will be invoked.
#
@simple10
simple10 / app.coffee
Last active December 14, 2015 00:59 — forked from harlantwood/circle-packing.coffee
Github D3 Visualizer
root = exports ? this
class root.App
constructor: (repo) ->
@github = new App.Github
@d3 = new App.D3
@github.loadRepo(repo, (data) =>
data = @github.parseForD3(data)
@d3.renderCirclePack(data)
@simple10
simple10 / perceptualdiff.md
Last active December 19, 2015 23:19
PerceptualDiff command line tool for diff'ing images.

Fun with visual diff'ing!

http://pdiff.sourceforge.net/

# OSX
$ brew install perceptualdiff

$ perceptualdiff screen1.png screen2.png -verbose -output diff.ppm -colorfactor 0.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Single-Column Responsive Email Template</title>
<style>
@media only screen and (min-device-width: 541px) {
.content {
@simple10
simple10 / FloatLayout.coffee
Created June 3, 2014 02:38
Famo.us masonry style layout in coffeescript – handles reflowing elements when window or container size changes
ReflowLayout = require 'layouts/ReflowLayout'
# Float items in a responsive layout
class FloatLayout extends ReflowLayout
@DEFAULT_OPTIONS:
resizeDelay: 200
transition:
duration: 200
getSize: ->
@simple10
simple10 / shell_runner.sh
Last active August 29, 2015 14:08
Shell runner for capturing output and exit code.
#!/bin/sh
# Capture node output and status code for passing commands back to shell.
# This snippet is useful for running a node script that outputs a command
# to run after it exits in situations where node is conflicting with
# tty or environment settings.
main() {
local tempout; tempout=`mktemp -t tmp.out` || exit 1
local statusfile; statusfile=`mktemp -t tmp.status` || exit 1
@simple10
simple10 / MailchimpEmbedForm-with-auto-populating-fields.html
Created May 19, 2022 22:16
Mailchimp Embed Form with Auto Populating Field Values from Query String
<!-- Begin Mailchimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
<style type="text/css">
#mc_embed_signup {
background: #fff;
clear: left;
font: 14px Helvetica, Arial, sans-serif;
width: 600px;
}
@simple10
simple10 / mailchimp-embed-form-listener.js
Created June 3, 2022 18:16
Script to listen for embedded mailchimp form submit and fire Facebook tracking on success.
// This is janky due to using setTimeout, but it works.
//
// Supports multiple mailchimp forms embedded on the page.
// Only works if ajax is used which typically requires captch being turned off in mailchimp.
// After a mailchimp form is submitted, the script waits 1 second and looks for a success message
// for the particular form that was submitted. It will retry 10 times before giving up.
//
// Does not support IE11 due to use of forEach unless a polyfill is present.
//
window.addEventListener('DOMContentLoaded', function(event) {
@simple10
simple10 / arrow.svg.html
Created February 20, 2023 20:16
SVG Animated Down Arrow
<div class="arrow-ico animated">
<div class="circle circle-top"></div>
<div class="circle circle-main"></div>
<div class="circle circle-bottom"></div>
<svg class="svg" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 612 612" style="enable-background:new 0 0 612 612;" xml:space="preserve" >
<defs>
<clipPath id="cut-off-arrow">
<circle cx="306" cy="306" r="287"/>