closes #831, user profile changes

v1.18.x
Baris Soner Usakli 11 years ago
parent 3c63b135c7
commit 574e981de9

@ -9,6 +9,7 @@
"age": "Age",
"joined": "Joined",
"lastonline": "Last Online",
"profile": "Profile",
"profile_views": "Profile views",
"reputation": "Reputation",
"posts": "Posts",

@ -88,11 +88,7 @@ define(['forum/accountheader'], function(header) {
return;
}
translator.get('global:' + data.status, function(translated) {
onlineStatus.find('span span').text(translated);
onlineStatus.find('i').attr('class', 'fa fa-circle status ' + data.status);
});
onlineStatus.attr('class', 'account-online-status fa fa-circle status ' + data.status);
};
return Account;

@ -42,7 +42,7 @@ define(['forum/accountheader', 'uploader'], function(header, uploader) {
$('.account-username-box a').each(function(index) {
$(this).attr('href', $(this).attr('href').replace(oldslug, data.userslug));
});
$('.account-username a:first-child').html(userData.username);
$('.account-username-box').attr('data-userslug', data.userslug);
$('#user-profile-link').attr('href', config.relative_path + '/user/' + data.userslug);

@ -2,45 +2,60 @@ define(function() {
var AccountHeader = {};
AccountHeader.init = function() {
var yourid = templates.get('yourid'),
theirid = templates.get('theirid');
AccountHeader.createMenu();
hideLinks();
selectActivePill();
}
AccountHeader.createMenu = function() {
var userslug = $('.account-username-box').attr('data-userslug');
var html ='<ul class="nav nav-tabs account-sub-links">\
<li id="settingsLink"><a href="' + RELATIVE_PATH + '/user/' + userslug + '/settings">[[user:settings]]</a></li>\
<li id="favouritesLink"><a href="' + RELATIVE_PATH + '/user/' + userslug + '/favourites">[[user:favourites]]</a></li>\
<li><a href="' + RELATIVE_PATH + '/user/' + userslug + '/posts">[[global:posts]]</a></li>\
<li><a href="' + RELATIVE_PATH + '/user/' + userslug + '/followers">[[user:followers]]</a></li>\
<li><a href="' + RELATIVE_PATH + '/user/' + userslug + '/following">[[user:following]]</a></li>\
<li id="editLink"><a href="' + RELATIVE_PATH + '/user/' + userslug + '/edit">[[user:edit]]</a></li>\
<li id="profile"><a href="' + RELATIVE_PATH + '/user/' + userslug + '">[[user:profile]]</a></li>\
</ul>';
translator.translate(html, function(translatedHtml) {
$('.account-username-box').append(translatedHtml);
selectActivePill();
hideLinks();
});
}
function hideLinks() {
var yourid = templates.get('yourid'),
theirid = templates.get('theirid');
var editLink = $('#editLink');
var settingsLink = $('#settingsLink');
var favouritesLink = $('#favouritesLink');
if (yourid === "0" || yourid !== theirid) {
if (parseInt(yourid, 10) === 0 || parseInt(yourid, 10) !== parseInt(theirid, 10)) {
editLink.hide();
settingsLink.hide();
favouritesLink.hide();
}
}
jQuery('.account-sub-links span a').removeClass('bold').each(function() {
var href = this.getAttribute('href');
function selectActivePill() {
$('.account-sub-links li').removeClass('active').each(function() {
var href = $(this).find('a').attr('href');
if (window.location.href.indexOf(href) !== -1) {
jQuery(this).addClass('bold');
$(this).addClass('active');
return false;
}
});
}
AccountHeader.createMenu = function() {
var userslug = $('.account-username-box').attr('data-userslug');
var html = '<div class="account-sub-links inline-block pull-right">\
<span id="settingsLink" class="pull-right"><a href="' + RELATIVE_PATH + '/user/' + userslug + '/settings">[[user:settings]]</a></span>\
<span id="favouritesLink" class="pull-right"><a href="' + RELATIVE_PATH + '/user/' + userslug + '/favourites">[[user:favourites]]</a></span>\
<span class="pull-right"><a href="' + RELATIVE_PATH + '/user/' + userslug + '/followers">[[user:followers]]</a></span>\
<span class="pull-right"><a href="' + RELATIVE_PATH + '/user/' + userslug + '/following">[[user:following]]</a></span>\
<span id="editLink" class="pull-right"><a href="' + RELATIVE_PATH + '/user/' + userslug + '/edit">[[user:edit]]</a></span>\
</div>'
translator.translate(html, function(translatedHtml) {
$('.account-username-box').append(translatedHtml);
});
}
return AccountHeader;
});

@ -0,0 +1,52 @@
define(['forum/accountheader'], function(header) {
var AccountPosts = {},
loadingMore = false;
AccountPosts.init = function() {
header.init();
app.enableInfiniteLoading(function() {
if(!loadingMore) {
loadMore();
}
});
};
function loadMore() {
loadingMore = true;
socket.emit('posts.loadMoreUserPosts', {
uid: $('.account-username-box').attr('data-uid'),
after: $('.user-favourite-posts').attr('data-nextstart')
}, function(err, data) {
if(err) {
return app.alertError(err.message);
}
if (data.posts && data.posts.length) {
onTopicsLoaded(data.posts);
$('.user-favourite-posts').attr('data-nextstart', data.nextStart);
}
loadingMore = false;
});
}
function onTopicsLoaded(posts) {
var html = templates.prepare(templates['accountposts'].blocks['posts']).parse({
posts: posts
});
translator.translate(html, function(translatedHTML) {
$('#category-no-topics').remove();
html = $(translatedHTML);
$('.user-favourite-posts').append(html);
$('span.timeago').timeago();
app.createUserTooltips();
app.makeNumbersHumanReadable(html.find('.human-readable-number'));
});
}
return AccountPosts;
});

@ -2,112 +2,119 @@
<div class="well account">
<div class="account-username-box" data-userslug="{userslug}">
<span class="account-username">
<a href="{relative_path}/user/{userslug}">{username}</a>
</span>
</div>
<div class="row">
<div class="col-md-2 account-block" style="text-align: center; margin-bottom:20px;">
<div class="account-picture-block">
<img src="{picture}" class="user-profile-picture img-thumbnail"/>
</div>
<div class="account-online-status">
<span><i class="fa fa-circle status offline"></i> <span>[[user:offline]]</span></span>
</div>
<!-- IF banned -->
<div>
<span class="label label-danger">[[user:banned]]</span>
</div>
<!-- ENDIF banned -->
<div>
<a id="chat-btn" href="#" class="btn btn-default hide">Chat</a>
<div class="col-md-5 account-block">
<div class="text-center account-picture-block">
<div>
<a href="{relative_path}/user/{userslug}"><img src="{picture}" class="user-profile-picture img-thumbnail"/></a>
</div>
<div>
<div>
<span>
<i class="account-online-status fa fa-circle status offline"></i>
<span class="account-username"> {username}</span>
</span>
</div>
<!-- IF banned -->
<div>
<span class="label label-danger">[[user:banned]]</span>
</div>
<!-- ENDIF banned -->
<div>
<a id="chat-btn" href="#" class="btn btn-primary hide">Chat</a>
<a id="follow-btn" href="#" class="btn btn-success hide">Follow</a>
<a id="unfollow-btn" href="#" class="btn btn-warning hide">Unfollow</a>
</div>
</div>
</div>
<div id="user-actions">
<a id="follow-btn" href="#" class="btn btn-default hide">Follow</a>
<a id="unfollow-btn" href="#" class="btn btn-default hide">Unfollow</a>
<div class="text-center account-stats panel panel-default">
<div class="panel-body">
<div class="inline-block text-center">
<div class="formatted-number">{postcount}</div>
<div class="account-bio-label">[[user:posts]]</div>
</div>
<div class="inline-block text-center">
<div class="formatted-number">{followerCount}</div>
<div class="account-bio-label">[[user:followers]]</div>
</div>
<div class="inline-block text-center">
<div class="formatted-number">{followingCount}</div>
<div class="account-bio-label">[[user:following]]</div>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="inline-block">
<div class="account-bio-block">
<span class="account-bio-label">[[user:email]]</span><i class="fa fa-eye-slash {emailClass}" title="[[user:email_hidden]]"></i>
<div class="panel panel-default">
<div class="panel-body">
<span class="account-bio-label">[[user:email]]</span>
<!-- IF email -->
<span>{email}</span>
<span class="account-bio-value"><i class="fa fa-eye-slash {emailClass}" title="[[user:email_hidden]]"></i> {email}</span>
<!-- ELSE -->
<i class="fa fa-eye-slash" title="[[user:email_hidden]]"></i> [[user:hidden]]
<!-- ENDIF email -->
<br/>
<!-- IF fullname -->
<span class="account-bio-label">[[user:fullname]]</span>
<span>{fullname}</span>
<br/>
<span class="account-bio-value">{fullname}</span>
<!-- ENDIF fullname -->
<!-- IF website -->
<span class="account-bio-label">[[user:website]]</span>
<span><a href="{website}">{websiteName}</a></span>
<br/>
<span class="account-bio-value"><a href="{website}">{websiteName}</a></span>
<!-- ENDIF website -->
<!-- IF location -->
<span class="account-bio-label">[[user:location]]</span>
<span>{location}</span>
<br/>
<span class="account-bio-value">{location}</span>
<!-- ENDIF location -->
<!-- IF age -->
<span class="account-bio-label">[[user:age]]</span>
<span>{age}</span>
<br/>
<span class="account-bio-value">{age}</span>
<!-- ENDIF age -->
<hr/>
<span class="account-bio-label">[[user:joined]]</span>
<span class="timeago" title="{joindate}"></span>
<br/>
<span class="account-bio-label">[[user:lastonline]]</span>
<span class="timeago" title="{lastonline}"></span>
<br/>
<span class="account-bio-label">[[user:profile_views]]</span>
<span class="formatted-number">{profileviews}</span>
<br/>
<span class="formatted-number account-bio-value">{profileviews}</span>
<span class="account-bio-label">[[user:reputation]]</span>
<span class="formatted-number">{reputation}</span>
<br/>
<span class="account-bio-label">[[user:posts]]</span>
<span class="formatted-number">{postcount}</span>
<br/>
<span class="formatted-number account-bio-value">{reputation}</span>
<span class="account-bio-label">[[user:followers]]</span>
<span class="formatted-number">{followerCount}</span>
<br/>
<span class="account-bio-label">[[user:joined]]</span>
<span class="timeago account-bio-value" title="{joindate}"></span>
<span class="account-bio-label">[[user:following]]</span>
<span class="formatted-number">{followingCount}</span>
<br/>
<span class="account-bio-label">[[user:lastonline]]</span>
<span class="timeago account-bio-value" title="{lastonline}"></span>
<hr/>
<!-- IF !disableSignatures -->
<!-- IF signature -->
<hr/>
<span class="account-bio-label">[[user:signature]]</span>
<div class="post-signature">
<div class="post-signature account-bio-value">
<span id='signature'>{signature}</span>
</div>
<!-- ENDIF signature -->
<!-- ENDIF !disableSignatures -->
</div>
</div>
</div>
<div class="col-md-6 user-recent-posts">
<div class="col-md-7 user-recent-posts">
<div class="topic-row panel panel-default clearfix">
<div class="panel-heading">
<h3 class="panel-title">[[global:recentposts]]</h3>

@ -30,11 +30,8 @@
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<div class="account-username-box" data-userslug="{userslug}">
<span class="account-username">
<a href="{relative_path}/user/{userslug}">{username}</a> <i class="fa fa-chevron-right"></i>
<a href="{relative_path}/user/{userslug}/edit">[[user:edit]]</a>
</span>
<div class="account-username-box clearfix" data-userslug="{userslug}">
</div>
<div class="row">

@ -0,0 +1,41 @@
<div class="well favourites">
<div class="account-username-box clearfix" data-userslug="{userslug}" data-uid="{uid}">
</div>
<!-- IF !posts.length -->
<div class="alert alert-warning">[[topic:favourites.has_no_favourites]]</div>
<!-- ENDIF !posts.length -->
<div class="row">
<div class="col-md-12 user-favourite-posts" data-nextstart="{nextStart}">
<!-- BEGIN posts -->
<div class="topic-row panel panel-default clearfix">
<div class="panel-body">
<a href="../../user/{posts.userslug}">
<img title="{posts.username}" class="img-rounded user-img" src="{posts.picture}">
</a>
<a href="../../user/{posts.userslug}">
<strong><span>{posts.username}</span></strong>
</a>
<p>{posts.content}</p>
<div>
<small>
<span class="pull-right">
<a href="../../topic/{posts.tid}/#{posts.pid}">posted</a>
in
<a href="../../category/{posts.categorySlug}">
<i class="fa {posts.categoryIcon}"></i> {posts.categoryName}
</a>
<span class="timeago" title="{posts.relativeTime}"></span>
</span>
</small>
</div>
</div>
</div>
<!-- END posts -->
</div>
</div>
</div>

@ -1,10 +1,7 @@
<div class="well account">
<div class="account-username-box" data-userslug="{userslug}">
<span class="account-username">
<a href="{relative_path}/user/{userslug}">{username}</a> <i class="fa fa-chevron-right"></i>
<a href="{relative_path}/user/{userslug}/settings">[[user:settings]]</a>
</span>
<div class="account-username-box clearfix" data-userslug="{userslug}">
</div>
<div class="row">

@ -23,6 +23,7 @@
"^user.*followers": "followers",
"^user.*settings": "accountsettings",
"^user.*favourites": "favourites",
"^user.*posts": "accountposts",
"^user/.*": "account",
"^recent/.*": "recent",

@ -1,13 +1,10 @@
<div class="well favourites">
<div class="account-username-box" data-userslug="{userslug}">
<span class="account-username">
<a href="{relative_path}/user/{userslug}">{username}</a> <i class="fa fa-chevron-right"></i>
<a href="{relative_path}/user/{userslug}/favourites">[[topic:favourites]]</a>
</span>
<div class="account-username-box clearfix" data-userslug="{userslug}">
</div>
<!-- IF !posts.length -->
<div id="no-favourites-notice" class="alert alert-warning">[[topic:favourites.has_no_favourites]]</div>
<div class="alert alert-warning">[[topic:favourites.has_no_favourites]]</div>
<!-- ENDIF !posts.length -->
<div class="row">

@ -1,10 +1,7 @@
<div class="well users account">
<div class="account-username-box" data-userslug="{userslug}">
<span class="account-username">
<a href="../../user/{userslug}">{username}</a> <i class="fa fa-chevron-right"></i>
<a href="../../user/{userslug}/followers">[[user:followers]]</a>
</span>
<div class="account-username-box clearfix" data-userslug="{userslug}">
</div>
<div>

@ -1,10 +1,7 @@
<div class="well users account">
<div class="account-username-box" data-userslug="{userslug}">
<span class="account-username">
<a href="../../user/{userslug}">{username}</a> <i class="fa fa-chevron-right"></i>
<a href="../../user/{userslug}/following">[[user:following]]</a>
</span>
<div class="account-username-box clearfix" data-userslug="{userslug}">
</div>
<div>

@ -169,11 +169,30 @@ var db = require('./database'),
});
}, function(pids) {
if (!(pids && pids.length)) {
return callback(null, []);
return callback(null, { posts: [], nextStart: 0});
}
Posts.getPostSummaryByPids(pids, false, callback);
Posts.getPostSummaryByPids(pids, false, function(err, posts) {
if(err) {
return callback(err);
}
if(!posts || !posts.length) {
return callback(null, { posts: [], nextStart: 0});
}
db.sortedSetRevRank('uid:' + uid + ':posts', posts[posts.length - 1].pid, function(err, rank) {
if(err) {
return calllback(err);
}
var userPosts = {
posts: posts,
nextStart: parseInt(rank, 10) + 1
};
callback(null, userPosts);
});
});
});
});
}

@ -72,6 +72,7 @@ var fs = require('fs'),
createRoute('/:userslug/following', '/following', 'following');
createRoute('/:userslug/followers', '/followers', 'followers');
createRoute('/:userslug/favourites', '/favourites', 'favourites');
createRoute('/:userslug/posts', '/posts', 'accountposts');
app.get('/:userslug/edit', function (req, res) {
@ -363,6 +364,42 @@ var fs = require('fs'),
});
});
app.get('/api/user/:userslug/posts', function (req, res, next) {
var callerUID = req.user ? req.user.uid : '0';
user.getUidByUserslug(req.params.userslug, function (err, uid) {
if (!uid) {
res.json(404, {
error: 'User not found!'
});
return;
}
user.getUserFields(uid, ['username', 'userslug'], function (err, userData) {
if (err) {
return next(err);
}
if (userData) {
posts.getPostsByUid(callerUID, uid, 0, 19, function (err, userPosts) {
if (err) {
return next(err);
}
userData.uid = uid;
userData.posts = userPosts.posts;
userData.nextStart = userPosts.nextStart;
res.json(userData);
});
} else {
res.json(404, {
error: 'User not found!'
});
}
});
});
});
app.get('/api/user/:userslug', function (req, res, next) {
var callerUID = req.user ? req.user.uid : '0';
@ -375,13 +412,13 @@ var fs = require('fs'),
user.isFollowing(callerUID, userData.theirid, function (isFollowing) {
posts.getPostsByUid(callerUID, userData.theirid, 0, 9, function (err, posts) {
posts.getPostsByUid(callerUID, userData.theirid, 0, 9, function (err, userPosts) {
if(err) {
return next(err);
}
userData.posts = posts.filter(function (p) {
userData.posts = userPosts.posts.filter(function (p) {
return p && parseInt(p.deleted, 10) !== 1;
});

@ -258,4 +258,15 @@ SocketPosts.loadMoreFavourites = function(socket, data, callback) {
posts.getFavourites(socket.uid, start, end, callback);
};
SocketPosts.loadMoreUserPosts = function(socket, data, callback) {
if(!data || !data.after || !data.uid) {
return callback(new Error('invalid data'));
}
var start = parseInt(data.after, 10),
end = start + 9;
posts.getPostsByUid(socket.uid, data.uid, start, end, callback);
};
module.exports = SocketPosts;
Loading…
Cancel
Save