Skip to content

Instantly share code, notes, and snippets.

@clalimarmo clalimarmo/task_store.js
Last active Sep 21, 2015

Embed
What would you like to do?
Deep Linking with React + Flux, Task Store, modified to route on "navigate" Actions
TaskStore = (function() {
var TaskStore = {};
var state = {};
TaskStore.addChangeListener = function() {
// left as an exercise - hint: event emitters
};
TaskStore.addChangeListener = function() {
// left as an exercise - hint: event emitters
};
TaskStore.selectedTask = function() {
return state.selectedTask;
};
TaskStore.tasks = function() {
return Object.keys(state.tasks).map(function(taskId) {
return state.tasks[taskId];
});
};
init();
return TaskStore;
function init() {
var router = Router();
router.register(/^\/tasks\/?$/, function() {
state.selectedTask = null;
triggerChangeEvent();
});
router.register(/^\/tasks\/(\d+)\/?$/, function(path, matcher) {
var taskId = path.match(matcher)[1];
state.selectedTask = state.tasks[taskId];
});
Dispatcher.register(function(action) {
switch (action.type) {
case 'initialize app':
loadTasks();
router.route(action.path);
break;
// update the store appropriately when the user follows an AppLink
case 'navigate':
router.route(action.path);
break;
}
});
}
function triggerChangeEvent() {
// left as an exercise - this should trigger the callbacks added
// via the addChangeListener method
}
function loadTasks() {
state.tasks = [];
// left as an exercise: add mock task data, or integrate with API
triggerChangeEvent();
}
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.