node.js-based imageboard

1. ChanJS http://chanjs.nodester.com/ https://github.com/wearefractal/chanjs @WeAreFractal

2. ChanJS Pure-javascript image board using node.js, socket.io, mongoose, jade, stylus and spine.js Real time Not written in Perl Not written in 1995 Similarities to Facebook UI

4. Templating

7. - if (data.length) - each thread in data div include Thread - else p Sorry, there are no threads! - if (data.length) - each thread in data div include Thread - else p Sorry, there are no threads! - if (data.length) - each thread in data div include Thread - else p Sorry, there are no threads! Board.tpl -> - if (data.length) - each thread in data div include Thread - else p Sorry, there are no threads! CommentInput.tpl -> form input type="text", placeholder = "Comment" input type="button" ... span image

9. - if (data.length) - each thread in data div include Thread - else p Sorry, there are no threads! - if (data.length) - each thread in data div include Thread - else p Sorry, there are no threads! - if (data.length) - each thread in data div include Thread - else p Sorry, there are no threads! Thread.tpl -> - if (data.length) - each comment in item include Comment include CommentInput - else p Sorry, there are no Comments. CommentInput.tpl -> form input type="text", placeholder = "Comment" input type="button" ... span image

11. - if (data.length) - each thread in data div include Thread - else p Sorry, there are no threads! - if (data.length) - each thread in data div include Thread - else p Sorry, there are no threads! - if (data.length) - each thread in data div include Thread - else p Sorry, there are no threads! Comment.tpl -> - if (data.length) div #{comment.text} CommentInput.tpl -> form input type="text", placeholder = "Comment" input type="button" ... span image

12. ChanJS – Category.tpl - if (data.length) ul - each item in data li= a(href='#/category/' + item._id item.name - else p Sorry, there are no categories.

13. Spine.js http://maccman.github.com/spine/

14. Spine.js Routing o.app =Spine.Controller.create({ init:function () { this.routes({ "/thread/:id":function (id) { o.renderModel('chanjs.Thread', {_id : id}); }, "/board/:id":function (id) { o.renderModel('chanjs.Board', {name : id}); }, "/category/:id":function (id) { o.renderModel('chanjs.Category', {_id: id}); }, "/":function (id) { o.loadTemplate('Category', function(){ o.renderModel('chanjs.Category', {}); }); }, }); } }).init(); Spine.Route.setup();