Skip to content

Instantly share code, notes, and snippets.

View hadijaveed's full-sized avatar
:octocat:
Chatbots & Autonomous Agents

hadi javeed hadijaveed

:octocat:
Chatbots & Autonomous Agents
View GitHub Profile
@hadijaveed
hadijaveed / difference.js
Created October 14, 2017 18:53
Find missing element from 2nd Array
function differenceFromSecondArray(arr1, arr2) {
let arr1Map = arr1.reduce((acc, curr) => {
return { ...acc, [curr]: 1 }
}, {})
return arr2.reduce((acc, curr) => arr1Map.hasOwnProperty(curr) ? acc : acc.concat(curr), [])
}
@hadijaveed
hadijaveed / counter-redux.js
Last active May 28, 2017 22:45
Counter Example With Redux
let reducer = function(state = 0, action) {
switch(action.type) {
case 'INCREMENT':
return state + 1;
case 'DECEMENT':
return state - 1;
default:
return state;
}
};
@hadijaveed
hadijaveed / counter.js
Created May 28, 2017 22:14
Vanilla Counter Example
let totalCount = 0;
let render = count => document.getElementById('count').innerHTML = count;
document.getElementById('increment')
.addEventListener('click', () => {
totalCount += 1;
render(totalCount);
});
document.getElementById('decerement')
let counter = new ReactiveHbs({
container: '.mount', // html template mount point
template: '#tpl', // hadnlebars template
data: {
count: 0
}
});
// Events
counter.events({
ReactiveHbs.promises({
getAllUsers() {
return $.get('https://api.github.com/users');
},
});
// usage
ReactiveHbs.executePromise('getAllUsers', (err, data) => {
if ( !err ) console.log(data);
});
// non-delegated events
ReactiveHbs.onRendered(function() {
let self = this;
$('button[type="submit"]').on('click', (e) => {
e.preventDefault();
self.set('someData', $(elem).attr('data-text'));
});
});
// bind delegated events
ReactiveHbs.events({
'click button[type="submit"]': (e, elm, tpl) => {
e.preventDefault();
tpl.set('someData', $(elem).attr('data-text'));
}
});
// bind helpers to only one template
ReactiveHbs.helpers({
add(x, y) {
return x + y;
}
});
// updates the DOM as well
ReactiveHbs.set('counter', counter.get() + 1);
// Observer
ReactiveHbs.reactOnChange('counter', { debounce: 1000 }, (tpl) => {
console.log( 'counter have been changed ' );
console.log( 'value', tpl.get('counter') );
});
$('div[name="some"]').on('click', () => {
console.log('div have been clicked !');
});