Skip to content

Instantly share code, notes, and snippets.

/index.html

Created December 2, 2016 01:27
Show Gist options
  • Save anonymous/4bb06a19fdbadb61ebd60a22edddab1d to your computer and use it in GitHub Desktop.
Save anonymous/4bb06a19fdbadb61ebd60a22edddab1d to your computer and use it in GitHub Desktop.
Download ZIP
JS Bin // source http://jsbin.com/ruyaqu
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
<script src="https://wzrd.in/standalone/expect@latest"></script>
<script src="https://wzrd.in/standalone/deep-freeze@latest"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/redux/3.3.1/redux.js"></script>
</head>
<script src="http://cdnjs.cloudflare.com/ajax/libs/immutable/3.7.5/immutable.js"></script>
<body>
<script id="jsbin-javascript">
'use strict';
var _Immutable = Immutable;
var Map = _Immutable.Map;
var List = _Immutable.List;
var fromJS = _Immutable.fromJS;
var initialState = fromJS({
basic: {
name: 'John Doe',
pan: 'AGAPC2883K'
},
address: [{ home: 'bg road' }, { office: 'SSZ' }]
});
var modifyBasic = function modifyBasic(state, action) {
switch (action.type) {
case 'MODIFY_NAME':
return state.merge({
name: action.name
});
case 'MODIFY_PAN':
return state.merge({
pan: action.pan
});
default:
return state;
}
};
var modifyAddress = function modifyAddress(state, action) {
switch (action.type) {
case 'MODIFY_ADDRESS_HOME':
debugger;
if (List.isList(state) !== true) {
console.log('Not a List');
return state;
}
return state.map(function (address) {
if (address.has('home')) return address.set('home', action.address);else return address;
});
default:
return state;
}
};
var bpReducer = function bpReducer(state, action) {
if (state === undefined) state = initialState;
return state.merge({
basic: modifyBasic(state.get('basic'), action),
address: modifyAddress(state.get('address'), action)
});
};
var _Redux = Redux;
var createStore = _Redux.createStore;
var store = createStore(bpReducer);
console.log('Initial state:');
console.log(store.getState().toJS());
console.log('--------------');
store.dispatch({
type: 'MODIFY_NAME',
name: 'Sourav Chatterjee'
});
console.log('Name Change:');
console.log(store.getState().toJS());
console.log('--------------');
store.dispatch({
type: 'MODIFY_PAN',
pan: '123456'
});
console.log('PAN Change:');
console.log(store.getState().toJS());
store.dispatch({
type: 'MODIFY_ADDRESS_HOME',
address: 'Jail Road'
});
console.log('Address Change:');
console.log(store.getState().toJS());
console.log('--------------');
</script>
<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
<script src="https://wzrd.in/standalone/expect@latest"><\/script>
<script src="https://wzrd.in/standalone/deep-freeze@latest"><\/script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/redux/3.3.1/redux.js"><\/script>
</head>
<script src="//cdnjs.cloudflare.com/ajax/libs/immutable/3.7.5/immutable.js"><\/script>
<body>
</body>
</html></script>
<script id="jsbin-source-javascript" type="text/javascript">const {Map, List, fromJS} = Immutable;
const initialState = fromJS({
basic:{
name:'John Doe',
pan: 'AGAPC2883K'
},
address: [
{home: 'bg road'},
{office: 'SSZ'}
]
})
const modifyBasic = (state,action) => {
switch(action.type){
case 'MODIFY_NAME':
return state.merge({
name: action.name
});
case 'MODIFY_PAN':
return state.merge({
pan: action.pan
});
default:
return state;
}
}
const modifyAddress = (state,action) => {
switch(action.type){
case 'MODIFY_ADDRESS_HOME':
debugger;
if (List.isList(state) !== true){
console.log('Not a List');
return state;
}
return state.map( address => {
if (address.has('home'))
return address.set('home',action.address );
else
return address;
});
default:
return state;
}
}
const bpReducer = (state = initialState, action) => {
return state.merge(
{
basic: modifyBasic(state.get('basic'),action),
address: modifyAddress(state.get('address'),
action)
}
)
}
const { createStore } = Redux;
const store = createStore(bpReducer);
console.log('Initial state:');
console.log(store.getState().toJS());
console.log('--------------');
store.dispatch({
type:'MODIFY_NAME',
name: 'Sourav Chatterjee'
})
console.log('Name Change:');
console.log(store.getState().toJS());
console.log('--------------');
store.dispatch({
type:'MODIFY_PAN',
pan: '123456'
})
console.log('PAN Change:');
console.log(store.getState().toJS());
store.dispatch({
type:'MODIFY_ADDRESS_HOME',
address: 'Jail Road'
})
console.log('Address Change:');
console.log(store.getState().toJS());
console.log('--------------');
</script></body>
</html>
Raw
jsbin.ruyaqu.js
'use strict';
var _Immutable = Immutable;
var Map = _Immutable.Map;
var List = _Immutable.List;
var fromJS = _Immutable.fromJS;
var initialState = fromJS({
basic: {
name: 'John Doe',
pan: 'AGAPC2883K'
},
address: [{ home: 'bg road' }, { office: 'SSZ' }]
});
var modifyBasic = function modifyBasic(state, action) {
switch (action.type) {
case 'MODIFY_NAME':
return state.merge({
name: action.name
});
case 'MODIFY_PAN':
return state.merge({
pan: action.pan
});
default:
return state;
}
};
var modifyAddress = function modifyAddress(state, action) {
switch (action.type) {
case 'MODIFY_ADDRESS_HOME':
debugger;
if (List.isList(state) !== true) {
console.log('Not a List');
return state;
}
return state.map(function (address) {
if (address.has('home')) return address.set('home', action.address);else return address;
});
default:
return state;
}
};
var bpReducer = function bpReducer(state, action) {
if (state === undefined) state = initialState;
return state.merge({
basic: modifyBasic(state.get('basic'), action),
address: modifyAddress(state.get('address'), action)
});
};
var _Redux = Redux;
var createStore = _Redux.createStore;
var store = createStore(bpReducer);
console.log('Initial state:');
console.log(store.getState().toJS());
console.log('--------------');
store.dispatch({
type: 'MODIFY_NAME',
name: 'Sourav Chatterjee'
});
console.log('Name Change:');
console.log(store.getState().toJS());
console.log('--------------');
store.dispatch({
type: 'MODIFY_PAN',
pan: '123456'
});
console.log('PAN Change:');
console.log(store.getState().toJS());
store.dispatch({
type: 'MODIFY_ADDRESS_HOME',
address: 'Jail Road'
});
console.log('Address Change:');
console.log(store.getState().toJS());
console.log('--------------');
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment