Skip to content

Instantly share code, notes, and snippets.

View nightspirit's full-sized avatar

Pochen Lin nightspirit

  • Everbridge
  • United States
View GitHub Profile
@nightspirit
nightspirit / ngUpload.htm
Last active August 29, 2015 14:14
Angular directive for blueimp/jQuery-File-Upload
<div ng-controller="uploadCtrl as upload">
<!-- input file
input name can be changed to fit the server side
-->
<input type="file" name="myFile"
file-read
upload-data="upload.data",
preview="upload.preview",
validate="upload.validate.file"/>
@nightspirit
nightspirit / cookie.js
Last active August 29, 2015 14:14
Global cookie getter/setter
@nightspirit
nightspirit / defer.js
Created March 20, 2015 23:12
Javascript Defer snippet
function Defer () {
var result = {};
result.promise = new Promise(function(resolve, reject) {
result.resolve = resolve;
result.reject = reject;
});
return result;
};
@nightspirit
nightspirit / observable.js
Last active October 5, 2017 21:24
Observable
function Observable(init_value) {
var _value = init_value;
var subscriber = [];
function obs() {
if (arguments.length) {
_value = arguments[0];
obs.trigger();
return this;
} else {
@nightspirit
nightspirit / fetch-external-data.js
Last active April 11, 2018 08:26
React 16.3 Life cycle hooks example
//before
componentWillMount() {
this._asyncRequest = asyncLoadData()
.then(externalData => {
this._asyncRequest = null
this.setState({externalData})
})
}
//after
@nightspirit
nightspirit / componentWillUpdate.js
Created April 11, 2018 08:27
React 16.3 lifecycle hook
// before
componentWillUpdate(nextProps, nextState) {
if (
this.state.someStatefulValue !==
nextState.someStatefulValue
) {
nextProps.onChange(nextState.someStatefulValue);
}
}
// before
componentWillReceiveProps(nextProps) {
if (this.props.currentRow !== nextProps.currentRow) {
this.setState({
isScrollingDown: nextProps.currentRow > this.props.currentRow
})
}
}
// after
componentDidUpdate(prevProps, prevState) {
if (this.props.reqPending !== prevProps.reqPending && !this.props.reqPending) {
if(!this.props.error){
this.props.history.push('/next-page')
}
}
}
@nightspirit
nightspirit / context.js
Created April 15, 2018 02:10
react context example
import React from 'react'
const ctx = React.createContext()
export const {Provider, Consumer} = ctx
export const withCounter = Component => props => <Consumer>{value => <Component {...props} counter={value} />}</Consumer>
export default ctx
@nightspirit
nightspirit / CounterIncBtn .js
Created April 15, 2018 02:13
react context example
import React from 'react'
import { withCounter } from './context'
const IncBtn = ({ counter }) => <button type='button' className='btn btn-primary btn-block' onClick={counter.inc}>+</button>
const CounterIncBtn = withCounter(IncBtn)
export default CounterIncBtn