Skip to content

Instantly share code, notes, and snippets.

Parris Khachi parris

  • StoryForj
  • San Francisco
Block or report user

Report or block parris

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@parris
parris / Drag-Drop+Reparenting-Solution-React.md
Last active Nov 15, 2018
Drag/Drop + Reparenting in React
View Drag-Drop+Reparenting-Solution-React.md

React has fairly good support for most drag/drop scenarios except for the case where the dragged component will change parent elements. In that case, touchmove events will stop firing. Without React you'd normally just do something more imparative and just manually move an object around without destory it. In React you likely rely more on state/props to render your scenes; therefore, things become vaguely intractable. Even if your touchmove events are attached to document.body or window (etc) your touchmove event will still not fire.

I've read some discussions on the matter here:

  1. https://github.com/facebook/react/issues/3965
  2. https://github.com/facebook/react/issues/13113

Solution

I recently needed to address this in a codebase I work on. I just wanted to report some findings and success I had working around this particular issue. I found this workaround (and I have no idea why it works) https://stackoverflow.com/questions/33298828/touch-move-event-dont-fire-after-touch-start-target-is-removed

@parris
parris / Delete all Facebook test users (node js)
Last active Aug 20, 2018
Facebook has a 2000 person limit on test users and sometimes you'll consume all of them. There is nothing in the UI that lets you delete all of them. This script will help you do so in an automated way.
View Delete all Facebook test users (node js)
/**
* This will delete facebook test users for the specified appId.
* Usage node ./script/dumpFacebookTestUsers.js [appId] [appSecret]
*
* Copyright 2018 Brigade and Parris Khachi
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
View simple-group-membership.sql
create type user_role as enum ('hatch_anonymous', 'hatch_contributor', 'hatch_admin');
create type group_member_role as enum ('group_person', 'group_admin');
create table person (
id serial not null
constraint person_pkey
primary key
);
create table "group" (
@parris
parris / Login.js
Last active Jan 15, 2018
Fervor + PostgraphQL/Postgraphile + Knex Authentication Example
View Login.js
// src/apps/Login.js
import { React, Form, clientCookies, gql } from 'fervor/lib';
import Template from '../components/Template';
import styles from './styles/about.scss';
const authenticate = gql`
mutation Authenticate($login: AuthenticateInput!) {
authenticate(input: $login) {
jwtToken
@parris
parris / logout.spec.coffee
Created Aug 4, 2014
Example Mocha ReactJS + CoffeeScript Test
View logout.spec.coffee
Parse = require '../../core/parse'
TestUtils = require('react/addons').addons.TestUtils
logoutView = require './logout'
mediator = require '../../core/mediator'
describe 'LogoutView', ->
beforeEach ->
@container = @document.createElement 'div'
@parris
parris / spec_helper.coffee
Created Aug 4, 2014
JSDom + React + Mocha + Sinon
View spec_helper.coffee
jsdom = require 'jsdom'
require 'mocha-sinon'
# move into beforeEach and flip global.window.close on to improve
# cleaning of environment during each test and prevent memory leaks
document = jsdom.jsdom('<html><body></body></html>', jsdom.level(1, 'core'))
beforeEach ->
@document = document
@parris
parris / browserify.coffee
Created Aug 4, 2014
Gulp using coffee-reactify
View browserify.coffee
gulp = require 'gulp'
browserify = require 'gulp-browserify'
rename = require 'gulp-rename'
gulp.task 'js', ->
gulp.src('./public/src/app.coffee', { read: false })
.pipe(browserify({
transform: ['coffee-reactify'],
extensions: ['.coffee'],
}))
@parris
parris / mocha.opts
Created Aug 4, 2014
ReactJS Mocha.opts
View mocha.opts
--require should
--reporter dot
--ui bdd
--debug
--compilers coffee:coffee-react/register
--recursive
View example_shape.js
define(function(require) {
var Backbone = require(‘backbone’),
backboneCanvasMixin = require(‘components/shapes/mixins/backbone_raphael_mixin’),
isMovable = require(‘components/shapes/mixins/is_movable’)
isRotatable = require(‘components/shapes/mixins/is_rotatable’)
// … and more ;
return Backbone.View.extend({ … })
.mixin(backboneCanvasMixin)
View with_stickit_base_mixin.js
define(function(require) {
'use strict';
require('stickit');
return function(options){
// NOTE: this assumes inputs
var bindingDefaults = {
events: ['blur', 'paste', 'change'],
onSet: 'onSet'
You can’t perform that action at this time.