Skip to content

Instantly share code, notes, and snippets.

View natew's full-sized avatar

Nate Wienert natew

1.1k followers · 70 following
View GitHub Profile
@natew
natew / gist:8946837
Last active August 29, 2015 13:56
getInitialStateAsync props: { __owner__:
{ props:
{ ref: 'router',
onClick: [Object],
path: '/',
__owner__: [Object],
children: [Object] },
_lifeCycleState: 'MOUNTED',
_pendingProps: null,
_pendingCallbacks: null,
@natew
natew / gist:9901235
Created March 31, 2014 20:16
<DT><H3 ADD_DATE="1341364135" LAST_MODIFIED="1394468264">Inspire</H3>
<DL><p>
<DT><H3 ADD_DATE="1369167988" LAST_MODIFIED="1396296873">Blog Inspiration</H3>
<DL><p>
<DT><A HREF="http://blog.studiofellow.com/2013/01/08/stuck-on-your-startups-design/" ADD_DATE="1357854553" ICON="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAADMklEQVQ4jXWTP0ijdwCGn9/3JQ3+iamJBGN60YuGBGlNoggOBRchhw7tICiuB13FK5QgFQIWcWnB9aCThRIX2620Ip44OFiTeqCJSWOiwtWPGM+QaL5++fLr0uFa2nd74X3e7RH8K6urq0Gr1fqZlHJSCBEBkFKmhRCvDMN4ubKykn13L94ta2trL1RV/TIQCJxEIpEuVVWfApimeZFOp6u5XG7ENM2vlpeXv/nHQSKReM9ms/3Y1dXln52dVfL5/FA2m0XTNAzDoLe3l3A4jN/vzyWTSVmtVgu6rn+SSCT+VAFisdjXLpfrw/n5ed/29rbn9PSUWq2GlBJFUXh4eKBQKGCapmthYaH97OxMNwxjcGdn52exvr7+kRDi1eLi4s3e3l6o2Wxyfn7O0NAQiqIAUK/XKRaLLC0tYbVa0XX9amNjo9M0zY8VKeXzUCiUUhQlFIvFCAaDWCwWAKanp5mZmUEIgcVi4c0fbwDQG40nfzPPFSHEs2g06tjd3QXAZrMhpaRQKFAoFABoa2tDVVV+PToG4PLyimg06pBSPlOklE/7+vqeFotFKpUKHo+Hjo4O
@natew
natew / SassMeister-input.scss
Created April 14, 2014 16:50
Generated by SassMeister.com.
// ----
// Sass (v3.3.4)
// Compass (v1.0.0.alpha.18)
// ----
$ZapposFrontendGlobalAssets: (
"spGlobal.png": "spGlobal.23oi2234.png",
"spGlobalBlue.png": "spGlobalBlue.23oi2234.png",
"stripeBG.png": 'stripeBG.23oi2234.png',
"stripeBGTan.png": 'stripeBGTan.23oi2234.png'
@natew
natew / gist:ff0e1d101fe4c330ec4a
Created October 1, 2014 19:18
instant hacker popups
javascript:jQuery('body').css({overflow:'hidden'});var urls = ["http://38.media.tumblr.com/tumblr_lwz84jsixv1r5qrimo1_500.gif", "http://38.media.tumblr.com/tumblr_m4r4mipGqq1qeumowo1_500.gif", "http://jdandrea.myweb.usf.edu/calabi-spin.gif", "http://media.giphy.com/media/dfq3YU04eBMt2/giphy.gif", "https://31.media.tumblr.com/8cfb9987f141d63d7e6ed31757cef30c/tumblr_n8hfelQaKB1tg7xcdo1_500.gif"];var i = 0;urls.forEach(function(url) { i += 1; console.log(i); (function(ix) { setTimeout(function() { jQuery('<img src='+url+'>').css({ position: 'absolute', zIndex: ix, top: Math.random()*400, right: Math.random()*300, width: '25%', height: 'auto', opacity: 0.8 }).appendTo('body') }, ix * 1000) })(i);});
@natew
natew / gist:d8f7f03cd4b3acdb3c82
Last active August 29, 2015 14:07
immutable-js object tree
var data = Immutable.fromJS({
items: [{
name: "one",
kids: [{
name: "one-one",
kids: [] //...
}]
}]
});
@natew
natew / Component.jsx
Last active August 29, 2015 14:08
var Component = React.createClass({
render() {
return (
<Layout>
<View title="Deeply Nested">
<div className="content">Example of a deeply nested thing</div>
<View title="Deeply">
<div className="content">This is the first nested drawer</div>
@natew
natew / 0
Last active August 29, 2015 14:10
React - UI Structural question
Building a UI interface that is composed of Views.
One common interface is a split view. Similar to Mail on iPad, it contains a
side view and a main view.
1.html is my current solution, but thinking of doing 3.html.
Problem with current solution is how would Main manipulate props on Side
(necessary for parallax effect when dragging out of Main).
@natew
natew / 1.html
Created December 5, 2014 19:58
<ViewList initialStep={numRoutes - 2} noFakeTitleBar>
<View>
<DottedViewList touchStartBoundsX={{ from: 20, to: window.innerWidth - 20 }}>
<View title="Hot Articles">
<List dontWrapChildren styles={{ self: { borderTop: 'none' } }}>
{articles.count() ?
articles.map((article, i) =>
<ArticleItem cursor={article} key={i} />
).toArray()
.concat(
@natew
natew / *.js
Created December 6, 2014 04:03
module.exports = Component('Icon', {
mixins: [TweenState.Mixin],
getInitialState() {
return { step: 0 };
},
componentWillReceiveProps(nextProps) {
if (nextProps.animation === 'ROTATE')
@natew
natew / gist:d89650fe753f418650d6
Created December 9, 2014 18:00
react diffing
<li class="ListItem" style="list-style:none;margin:0;padding:0;overflow:hidden;flex-flow:row;align-items:center;justify-content:space-between;min-height:44px;border-top:1px solid #c8c7cc;position:relative;padding-right:20px;" data-reactid=".0.1.1:1.2:$=10:$0.1.0.2.1:$=12:$2">
<span class="ListItem--wrapper" style="position:absolute;top:0;left:-10px;right:0;bottom:0;max-width:none;flex-flow:row;justify-content:flex-end;z-index:1;" data-reactid=".0.1.1:1.2:$=10:$0.1.0.2.1:$=12:$2.$27">
<a href="/kitchen/modals" style="position:absolute;top:0;left:-10px;right:0;bottom:0;max-width:none;flex-flow:row;justify-content:flex-end;z-index:1;" data-reactid=".0.1.1:1.2:$=10:$0.1.0.2.1:$=12:$2.$27.0">
<span style="color:#c8c7cc;width:12px;height:12px;overflow:hidden;margin:auto 8px auto 0;" class="Icon" data-reactid=".0.1.1:1.2:$=10:$0.1.0.2.1:$=12:$2.$27.0.0"><svg style="width:12px;height:12px;shape-rendering:initial;fill:currentColor;" viewBox="0 0 64 64" fill="#c8c7cc" stroke="#c8c7cc" stroke-width="8" stroke-linecap="r