Skip to content

Instantly share code, notes, and snippets.

Avatar

Carl Vitullo vcarl

  • Stellar Development Foundation
  • Nomadic
  • @vcarl_
View GitHub Profile
View _findIndexed
public $findMethods = array('indexed' => true);
/**
* Similar to find('list'), but allows for multiple fields to be retrieved.
*/
protected function _findIndexed($state, $query, $results = array()) {
if ($state === 'before') {
return $query;
}
if ($state == 'after') {
// Temporary array for returning data.
View elevators.js
{
init: function(elevators, floors) {
setTimeout(function(){
window.queue = [];
function removeIfInQueue(floor) {
window.queue.forEach(function(val, index) {
if (val.floor === floor) {
window.queue.splice(index, 1);
}
@vcarl
vcarl / auth.jsx
Last active Aug 29, 2015
Auth handling for a simple React applicatoin
View auth.jsx
module.exports = (function() {
'use strict';
var React = require('react');
var Login = require('../components/login.jsx');
var { RouteHandler } = require('react-router');
var Actions = require('../actions/actions.js');
var Auth = React.createClass({
propTypes: {
View responsive.js
// Responsive image handlers.
// By putting `data-filename` and `data-root` attributes on an `img`,
// different image sizes are pulled in automatically.
// e.g. <img data-filename='hero.jpg' data-root='/images/' />
// with media queries to set body:after's `content` to one of mobile, tablet, or desktop
// the `src` will be set to 'hero.mobile.jpg', 'hero.tablet.jpg', or hero.desktop.jpg'
$(function() {
var getSize = function() {
return window
View redux.md

you can't get around not cloning state, part of the point of redux is that object references don't get reused, so you can do oldstate === newstate and not have to do a deep comparison

only way to get that is by using a new object to get a new reference

not every property on the state object needs to be clone (e.g. it's a shallow clone) because each reducer either returns its previous state (so no clone) or a new object if there's been a change

so if you have 100 properties on the root state object and one key changes, oldstate !== newstate, but oldstate['unchangedKey'] === newstate['unchangedKey']

View change.js
change: function(field) {
return function(event) {
state = {};
state[field] = event.target.value;
this.setState(state);
}.bind(this)
}
// To use:
@vcarl
vcarl / text.md
Last active Dec 14, 2015
How to learn React
View text.md

Read "Smart and Dumb Components" by Dan Abramov (who later wrote Redux, a hugely popular variation on Facebook's Flux architecture).

https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0#.mo7f1h57v

In general, you need to make more components than you think you do. Facebook has over 15,000. Not only is more components not harmful to performance, by giving a lot of split points and more narrowly defining what data is needed to render, you can reduce how much DOM gets invalidated--which is a massive performance gain.

As of React 0.14.0, React supports stateless function components which are functions that take a props object as an argument and return as a render function. They have caveats though, like no lifecycle, state, or refs. So why use them? Because they encourage writing small, focused components t

View visible-hoc.cjsx
define (require) ->
_ = require('lodash')
React = require('react')
ReactDOM = require('react-dom')
# Modified from http://stackoverflow.com/questions/123999/how-to-tell-if-a-dom-element-is-visible-in-the-current-viewport
isElementInViewport = (el) ->
rect = el.getBoundingClientRect();
(
@vcarl
vcarl / router.js
Created Sep 14, 2016
Synchronous routing example
View router.js
import Restify from 'restify';
import SyncRoute from './sync-route';
const server = Restify.createServer({
name: 'SyncRoutingDemo'
});
server.use(Restify.bodyParser());
SyncRoute(server, {
verb: 'post',
@vcarl
vcarl / package.json
Last active Oct 27, 2016
Sample webpack 2 config
View package.json
{
"name": "jstest",
"version": "1.0.0",
"description": "",
"main": "src/index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",