mirror of
https://github.com/NodeBB/NodeBB.git
synced 2025-11-01 11:35:55 +01:00
added post button, post window, added click handler to toaster alert, started on posts and topics schema and code
This commit is contained in:
4
app.js
4
app.js
@@ -1,5 +1,7 @@
|
|||||||
var modules = {
|
var modules = {
|
||||||
user: require('./src/user.js'),
|
user: require('./src/user.js'),
|
||||||
|
topics: require('./src/topics.js'),
|
||||||
|
posts: require('./src/posts.js'),
|
||||||
templates: require('./src/templates.js'),
|
templates: require('./src/templates.js'),
|
||||||
webserver: require('./src/webserver.js'),
|
webserver: require('./src/webserver.js'),
|
||||||
websockets: require('./src/websockets.js')
|
websockets: require('./src/websockets.js')
|
||||||
@@ -11,6 +13,8 @@ var modules = {
|
|||||||
global.configuration = {};
|
global.configuration = {};
|
||||||
global.modules = modules;
|
global.modules = modules;
|
||||||
|
|
||||||
|
// change this to = null when auth module is complete
|
||||||
|
global.uid = 1;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ var socket,
|
|||||||
config,
|
config,
|
||||||
app = {};
|
app = {};
|
||||||
|
|
||||||
|
// todo: cleanup,etc
|
||||||
(function() {
|
(function() {
|
||||||
|
|
||||||
$.ajax({
|
$.ajax({
|
||||||
@@ -42,7 +43,7 @@ var socket,
|
|||||||
p.innerHTML = params.message;
|
p.innerHTML = params.message;
|
||||||
strong.innerHTML = params.title;
|
strong.innerHTML = params.title;
|
||||||
|
|
||||||
div.className = "alert " + ((params.type=='warning') ? '' : "alert-" + params.type);
|
div.className = "alert toaster-alert " + ((params.type=='warning') ? '' : "alert-" + params.type);
|
||||||
|
|
||||||
div.setAttribute('id', alert_id);
|
div.setAttribute('id', alert_id);
|
||||||
div.appendChild(button);
|
div.appendChild(button);
|
||||||
@@ -61,9 +62,52 @@ var socket,
|
|||||||
|
|
||||||
if (params.timeout) {
|
if (params.timeout) {
|
||||||
setTimeout(function() {
|
setTimeout(function() {
|
||||||
jQuery(div).fadeOut('1000');
|
jQuery(div).fadeOut(1000);
|
||||||
}, params.timeout)
|
}, params.timeout)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (params.clickfn) {
|
||||||
|
div.onclick = function() {
|
||||||
|
params.clickfn();
|
||||||
|
jQuery(div).fadeOut(500);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var post_window = null;
|
||||||
|
app.open_post_window = function() {
|
||||||
|
post_window = post_window || document.getElementById('post_window');
|
||||||
|
|
||||||
|
jQuery(post_window).slideToggle(250);
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
app.post_topic = function() {
|
||||||
|
var title = document.getElementById('post_title').innerHTML,
|
||||||
|
content = document.getElementById('post_content').innerHTML;
|
||||||
|
|
||||||
|
if (title.length < 5 || content.length < 5) {
|
||||||
|
app.alert({
|
||||||
|
title: 'Topic Post Failure',
|
||||||
|
message: 'You need to write more dude.',
|
||||||
|
type: 'error',
|
||||||
|
timeout: 2000,
|
||||||
|
clickfn: function() {
|
||||||
|
ajaxify.go('register');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
socket.emit('topics.post', {
|
||||||
|
'title' : title,
|
||||||
|
'content' : content
|
||||||
|
});
|
||||||
|
jQuery(post_window).slideToggle(250);
|
||||||
|
};
|
||||||
|
|
||||||
|
jQuery('document').ready(function() {
|
||||||
|
jQuery('#post_window').slideToggle(0);
|
||||||
|
})
|
||||||
}());
|
}());
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
|
|
||||||
</div><!--END container -->
|
</div><!--END container -->
|
||||||
<!-- START Forum Info -->
|
<!-- START Forum Info -->
|
||||||
<div class="container">
|
<div class="container" style="padding-top: 50px;">
|
||||||
<div class="alert alert-info">
|
<div class="alert alert-info">
|
||||||
<span id="number_of_users"></span><br />
|
<span id="number_of_users"></span><br />
|
||||||
<span id="latest_user"></span>
|
<span id="latest_user"></span>
|
||||||
|
|||||||
@@ -10,6 +10,7 @@
|
|||||||
<script type="text/javascript" src="/src/app.js"></script>
|
<script type="text/javascript" src="/src/app.js"></script>
|
||||||
<script type="text/javascript" src="/src/templates.js"></script>
|
<script type="text/javascript" src="/src/templates.js"></script>
|
||||||
<script type="text/javascript" src="/src/ajaxify.js"></script>
|
<script type="text/javascript" src="/src/ajaxify.js"></script>
|
||||||
|
<script type="text/javascript" src="/vendor/ckeditor/ckeditor.js"></script>
|
||||||
<style type="text/css">
|
<style type="text/css">
|
||||||
body {
|
body {
|
||||||
padding-top: 60px;
|
padding-top: 60px;
|
||||||
@@ -21,8 +22,13 @@
|
|||||||
top: 80px;
|
top: 80px;
|
||||||
width: 300px;
|
width: 300px;
|
||||||
height: 0px;
|
height: 0px;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.toaster-alert {
|
||||||
|
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
footer.footer {
|
footer.footer {
|
||||||
color: #555;
|
color: #555;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@@ -30,6 +36,47 @@
|
|||||||
footer.footer a {
|
footer.footer a {
|
||||||
color: #222;
|
color: #222;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#post_window {
|
||||||
|
width: 100%;
|
||||||
|
position: absolute;
|
||||||
|
height: 350px;
|
||||||
|
left: 0px;
|
||||||
|
bottom: 0px;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
#post_window input {
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
#post_window textarea {
|
||||||
|
width: 100%;
|
||||||
|
background: #222;
|
||||||
|
height: 220px;
|
||||||
|
resize: none;
|
||||||
|
border-radius: 0;
|
||||||
|
border: 1px solid #111;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #bebebe;
|
||||||
|
}
|
||||||
|
#post_window textarea:focus {
|
||||||
|
outline: none;
|
||||||
|
border:none !important;
|
||||||
|
box-shadow:none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#post_window .post-title-container {
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#post_window .post-content-container {
|
||||||
|
background: #000;
|
||||||
|
width: 100%;
|
||||||
|
height: 300px;
|
||||||
|
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
@@ -47,6 +94,32 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="notification_window"></div>
|
<div id="post_window">
|
||||||
<div class="container" id="content">
|
<div class="post-title-container">
|
||||||
|
<div class="container">
|
||||||
|
<input id="post_title" placeholder="Enter your topic title here." />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="post-content-container">
|
||||||
|
<div class="container">
|
||||||
|
|
||||||
|
<div class="btn-toolbar">
|
||||||
|
<div class="btn-group">
|
||||||
|
<a class="btn btn-link" href="#"><i class="icon-bold"></i></a>
|
||||||
|
<a class="btn btn-link" href="#"><i class="icon-italic"></i></a>
|
||||||
|
<a class="btn btn-link" href="#"><i class="icon-font"></i></a>
|
||||||
|
<a class="btn btn-link" href="#"><i class="icon-list"></i></a>
|
||||||
|
</div>
|
||||||
|
<div class="btn-group" style="float: right; margin-right: -12px">
|
||||||
|
<a class="btn" onclick="app.post_topic()"><i class="icon-ok"></i> Submit</a>
|
||||||
|
<a class="btn" onclick="jQuery(post_window).slideToggle(250);"><i class="icon-remove"></i> Discard</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<textarea id="post_content" placeholder="Type your message here."></textarea>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="notification_window"></div>
|
||||||
|
<div class="container" id="content">
|
||||||
@@ -1,6 +1,13 @@
|
|||||||
dis is home nibs
|
<button id="new_post" class="btn btn-primary btn-large">New Post</button>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
|
var new_post = document.getElementById('new_post');
|
||||||
|
new_post.onclick = function() {
|
||||||
|
app.open_post_window();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*app.alert({
|
/*app.alert({
|
||||||
title: 'Welcome back',
|
title: 'Welcome back',
|
||||||
message: 'Some welcome message to test alerts!',
|
message: 'Some welcome message to test alerts!',
|
||||||
|
|||||||
70
public/vendor/ajaxify/ajaxify.js
vendored
70
public/vendor/ajaxify/ajaxify.js
vendored
@@ -1,70 +0,0 @@
|
|||||||
// https://gist.github.com/balupton/858093/raw/187833dc344a576e404fbdd40ef96de1f944b33b/ajaxify-html4.js
|
|
||||||
console.log('derp2');
|
|
||||||
(function(window,undefined){
|
|
||||||
|
|
||||||
// Prepare our Variables
|
|
||||||
var
|
|
||||||
document = window.document,
|
|
||||||
$ = window.jQuery;
|
|
||||||
|
|
||||||
// Wait for Document
|
|
||||||
$(document).ready(function(){
|
|
||||||
// Prepare Variables
|
|
||||||
var
|
|
||||||
$content = $('#content'),
|
|
||||||
$body = $(document.body),
|
|
||||||
rootUrl = document.location.protocol+'//'+(document.location.hostname||document.location.host);
|
|
||||||
console.log('derp');
|
|
||||||
// Ajaxify our Internal Links
|
|
||||||
$.fn.ajaxify = function(){
|
|
||||||
|
|
||||||
|
|
||||||
// Ajaxify internal links
|
|
||||||
$(this).find('a[href^="/"],a[href^="'+rootUrl+'"]').unbind('click').bind('click',function(event){
|
|
||||||
var $this = $(this), url = $this.attr('href'), title = $this.attr('title')||null, relativeUrl = $(this).attr('href').replace(rootUrl,'');
|
|
||||||
document.location.hash = '!' + relativeUrl;
|
|
||||||
event.preventDefault();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
// Chain
|
|
||||||
return this;
|
|
||||||
};
|
|
||||||
|
|
||||||
// Ajaxify Page
|
|
||||||
$body.ajaxify();
|
|
||||||
|
|
||||||
// Hook into State Changes
|
|
||||||
$(window).bind('hashchange',function(){
|
|
||||||
// Prepare
|
|
||||||
var
|
|
||||||
relativeUrl = document.location.hash.replace(/^\//,'').replace(/^#!/,''),
|
|
||||||
fullUrl = rootUrl+relativeUrl;
|
|
||||||
|
|
||||||
// Set Loading
|
|
||||||
$body.addClass('loading');
|
|
||||||
|
|
||||||
// Start Fade Out
|
|
||||||
$content.fadeOut(800);
|
|
||||||
|
|
||||||
// Ajax Request the Traditional Page
|
|
||||||
$.get(fullUrl,function(data){
|
|
||||||
console.log('here');
|
|
||||||
// Find the content in the page's html, and apply it to our current page's content
|
|
||||||
$content.stop(true,true).show();
|
|
||||||
$content.html(data).ajaxify();
|
|
||||||
//$content.html($(data).find('#content')).ajaxify();
|
|
||||||
if ( $content.ScrollTo||false ) $content.ScrollTo(); // http://balupton.com/projects/jquery-scrollto
|
|
||||||
$body.removeClass('loading');
|
|
||||||
|
|
||||||
// Inform Google Analytics of the change
|
|
||||||
if ( typeof pageTracker !== 'undefined' ) {
|
|
||||||
pageTracker._trackPageview(relativeUrl);
|
|
||||||
}
|
|
||||||
}); // end get
|
|
||||||
|
|
||||||
}); // end onStateChange
|
|
||||||
|
|
||||||
}); // end onDomLoad
|
|
||||||
|
|
||||||
})(window); // end closure
|
|
||||||
40
src/posts.js
Normal file
40
src/posts.js
Normal file
@@ -0,0 +1,40 @@
|
|||||||
|
var RDB = require('./redis.js');
|
||||||
|
|
||||||
|
(function(Posts) {
|
||||||
|
//data structure
|
||||||
|
//*global:next_post_id
|
||||||
|
// *pid:1:content
|
||||||
|
// *pid:1:uid
|
||||||
|
// *pid:1:timestamp
|
||||||
|
// ***pid:1:replies
|
||||||
|
// *uid:1:posts
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Posts.get = function(topic) {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
Posts.reply = function() {
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
Posts.create = function(content, callback) {
|
||||||
|
if (global.uid === null) return;
|
||||||
|
|
||||||
|
RDB.incr('global:next_post_id', function(pid) {
|
||||||
|
// Posts Info
|
||||||
|
RDB.set('pid:' + pid + ':content', content);
|
||||||
|
RDB.set('pid:' + pid + ':uid', global.uid);
|
||||||
|
RDB.set('pid:' + pid + ':timestamp', new Date().getTime());
|
||||||
|
|
||||||
|
// User Details - move this out later
|
||||||
|
RDB.lpush('uid:' + uid + ':posts', pid);
|
||||||
|
|
||||||
|
if (callback) callback(pid);
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}(exports));
|
||||||
111
src/topics.js
Normal file
111
src/topics.js
Normal file
@@ -0,0 +1,111 @@
|
|||||||
|
var RDB = require('./redis.js'),
|
||||||
|
posts = require('./posts.js');
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
(function(Topics) {
|
||||||
|
//data structure
|
||||||
|
|
||||||
|
//*global:next_topic_id
|
||||||
|
// *tid:1:title
|
||||||
|
// *tid:1:uid
|
||||||
|
// *tid:1:posts (array of pid)
|
||||||
|
// *tid:1:timestamp
|
||||||
|
// *uid:1:topics
|
||||||
|
// *topic:slug:how-to-eat-chicken:tid
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Topics.get_by_category = function(category, start, end) {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
Topics.get = function(start, end) {
|
||||||
|
if (start == null) start = 0;
|
||||||
|
if (end == null) end = start + 10;
|
||||||
|
|
||||||
|
|
||||||
|
RDB.lrange('topics:tid', start, end, function() {
|
||||||
|
global.socket.emit
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
Topics.post = function(title, content, category) {
|
||||||
|
if (global.uid === null) {
|
||||||
|
global.socket.emit('event:alert', {
|
||||||
|
title: 'Thank you for posting',
|
||||||
|
message: 'Since you are unregistered, your post is awaiting approval. Click here to register now.',
|
||||||
|
type: 'warning',
|
||||||
|
timeout: 7500,
|
||||||
|
clickfn: function() {
|
||||||
|
ajaxify.go('register');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return; // for now, until anon code is written.
|
||||||
|
}
|
||||||
|
|
||||||
|
RDB.incr('global:next_topic_id', function(tid) {
|
||||||
|
// Global Topics
|
||||||
|
if (global.uid !== null) {
|
||||||
|
RDB.lpush('topics:tid', tid);
|
||||||
|
} else {
|
||||||
|
// need to add some unique key sent by client so we can update this with the real uid later
|
||||||
|
RDB.lpush('topics:queued:tid', tid);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
if (category) {
|
||||||
|
RDB.lpush('topics:' + category + ':tid', tid);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Topic Info
|
||||||
|
RDB.set('tid:' + tid + ':title', title);
|
||||||
|
RDB.set('tid:' + tid + ':uid', global.uid);
|
||||||
|
RDB.set('tid:' + tid + ':timestamp', new Date().getTime());
|
||||||
|
|
||||||
|
RDB.set('topic:slug:' + slugify(title) + ':tid', tid);
|
||||||
|
|
||||||
|
// Posts
|
||||||
|
posts.create(content, function(pid) {
|
||||||
|
RDB.lpush('tid:' + tid + ':posts', pid);
|
||||||
|
});
|
||||||
|
|
||||||
|
// User Details - move this out later
|
||||||
|
RDB.lpush('uid:' + uid + ':topics', tid);
|
||||||
|
|
||||||
|
|
||||||
|
global.socket.emit('event:alert', {
|
||||||
|
title: 'Thank you for registering',
|
||||||
|
message: 'You have successfully registered - welcome to nodebb!',
|
||||||
|
type: 'notify',
|
||||||
|
timeout: 2000
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
}(exports));
|
||||||
|
|
||||||
|
|
||||||
|
//http://dense13.com/blog/2009/05/03/converting-string-to-slug-javascript/
|
||||||
|
function slugify(str) {
|
||||||
|
str = str.replace(/^\s+|\s+$/g, ''); // trim
|
||||||
|
str = str.toLowerCase();
|
||||||
|
|
||||||
|
// remove accents, swap ñ for n, etc
|
||||||
|
var from = "àáäâèéëêìíïîòóöôùúüûñç·/_,:;";
|
||||||
|
var to = "aaaaeeeeiiiioooouuuunc------";
|
||||||
|
for (var i=0, l=from.length ; i<l ; i++) {
|
||||||
|
str = str.replace(new RegExp(from.charAt(i), 'g'), to.charAt(i));
|
||||||
|
}
|
||||||
|
|
||||||
|
str = str.replace(/[^a-z0-9 -]/g, '') // remove invalid chars
|
||||||
|
.replace(/\s+/g, '-') // collapse whitespace and replace by -
|
||||||
|
.replace(/-+/g, '-'); // collapse dashes
|
||||||
|
|
||||||
|
return str;
|
||||||
|
}
|
||||||
@@ -7,35 +7,23 @@ var express = require('express'),
|
|||||||
(function(app) {
|
(function(app) {
|
||||||
var templates = global.templates;
|
var templates = global.templates;
|
||||||
|
|
||||||
function refreshTemplates() {
|
|
||||||
//need a better solution than copying this code on every call. is there an "onconnect" event?
|
|
||||||
if (DEVELOPMENT === true) {
|
|
||||||
// refreshing templates
|
|
||||||
modules.templates.init();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
app.get('/', function(req, res) {
|
app.get('/', function(req, res) {
|
||||||
refreshTemplates();
|
|
||||||
res.send(templates['header'] + templates['home'] + templates['footer']);
|
res.send(templates['header'] + templates['home'] + templates['footer']);
|
||||||
});
|
});
|
||||||
|
|
||||||
app.get('/login', function(req, res) {
|
app.get('/login', function(req, res) {
|
||||||
refreshTemplates();
|
|
||||||
res.send(templates['header'] + templates['login'] + templates['footer']);
|
res.send(templates['header'] + templates['login'] + templates['footer']);
|
||||||
});
|
});
|
||||||
|
|
||||||
app.get('/reset/:code', function(req, res) {
|
app.get('/reset/:code', function(req, res) {
|
||||||
refreshTemplates();
|
|
||||||
res.send(templates['header'] + templates['reset_code'].parse({ reset_code: req.params.code }) + templates['footer']);
|
res.send(templates['header'] + templates['reset_code'].parse({ reset_code: req.params.code }) + templates['footer']);
|
||||||
});
|
});
|
||||||
|
|
||||||
app.get('/reset', function(req, res) {
|
app.get('/reset', function(req, res) {
|
||||||
refreshTemplates();
|
|
||||||
res.send(templates['header'] + templates['reset'] + templates['footer']);
|
res.send(templates['header'] + templates['reset'] + templates['footer']);
|
||||||
});
|
});
|
||||||
|
|
||||||
app.get('/register', function(req, res) {
|
app.get('/register', function(req, res) {
|
||||||
refreshTemplates();
|
|
||||||
res.send(templates['header'] + templates['register'] + templates['footer']);
|
res.send(templates['header'] + templates['register'] + templates['footer']);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -56,6 +56,10 @@ var SocketIO = require('socket.io').listen(global.server);
|
|||||||
socket.on('user:reset.commit', function(data) {
|
socket.on('user:reset.commit', function(data) {
|
||||||
modules.user.reset.commit(data.code, data.password);
|
modules.user.reset.commit(data.code, data.password);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
socket.on('api:topics.post', function(data) {
|
||||||
|
modules.topics.post(data.title, data.content);
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
}(SocketIO));
|
}(SocketIO));
|
||||||
|
|||||||
Reference in New Issue
Block a user