hyperzlib
/
nodebb
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

widgets refactor

Browse Source 
render widgets server side
widgets can use all the data the template can use
v1.18.x
Baris Usakli 8 years ago
parent 121a629de6
commit 9e94edb5aa
10 changed files with 130 additions and 127 deletions
Show Stats Download Patch File Download Diff File

2
public/src/ajaxify.js
Unescape Escape View File

@ -204,7 +204,7 @@ $(document).ready(function () {
}
ajaxify.loadScript(tpl_url, done);
ajaxify.widgets.render(tpl_url, url, done);
ajaxify.widgets.render(tpl_url, done);
$(window).trigger('action:ajaxify.contentLoaded', { url: url, tpl: tpl_url });

93
public/src/widgets.js
Unescape Escape View File

@ -1,6 +1,5 @@
'use strict';
(function (ajaxify) {
ajaxify.widgets = {};
@ -14,77 +13,63 @@
});
};
ajaxify.widgets.render = function (template, url, callback) {
ajaxify.widgets.render = function (template, callback) {
callback = callback || function () {};
if (template.match(/^admin/)) {
return callback();
}
var widgetLocations = ['sidebar', 'footer', 'header'];
var locations = Object.keys(ajaxify.data.widgets);
$('#content [widget-area]').each(function () {
var location = $(this).attr('widget-area');
if ($.inArray(location, widgetLocations) === -1) {
widgetLocations.push(location);
locations.forEach(function (location) {
var area = $('#content [widget-area="' + location + '"]');
if (area.length) {
return;
}
});
$.get(config.relative_path + '/api/widgets/render?' + config['cache-buster'], {
locations: widgetLocations,
template: template + '.tpl',
url: url,
cid: ajaxify.data.cid,
isMobile: utils.isMobile(),
}, function (renderedAreas) {
for (var x = 0; x < renderedAreas.length; x += 1) {
var renderedWidgets = renderedAreas[x].widgets;
var location = renderedAreas[x].location;
var html = '';
var widgetsAtLocation = ajaxify.data.widgets[location] || [];
var html = '';
for (var i = 0; i < renderedWidgets.length; i += 1) {
html += templates.parse(renderedWidgets[i].html, {});
}
var area = $('#content [widget-area="' + location + '"]');
widgetsAtLocation.forEach(function (widget) {
html += widget.html;
if (!area.length && window.location.pathname.indexOf('/admin') === -1 && renderedWidgets.length) {
if (location === 'footer' && !$('#content [widget-area="footer"]').length) {
$('#content').append($('<div class="row"><div widget-area="footer" class="col-xs-12"></div></div>'));
} else if (location === 'sidebar' && !$('#content [widget-area="sidebar"]').length) {
if ($('[component="account/cover"]').length) {
$('[component="account/cover"]').nextAll().wrapAll($('<div class="row"><div class="col-lg-9 col-xs-12"></div><div widget-area="sidebar" class="col-lg-3 col-xs-12"></div></div></div>'));
} else if ($('[component="groups/cover"]').length) {
$('[component="groups/cover"]').nextAll().wrapAll($('<div class="row"><div class="col-lg-9 col-xs-12"></div><div widget-area="sidebar" class="col-lg-3 col-xs-12"></div></div></div>'));
} else {
$('#content > *').wrapAll($('<div class="row"><div class="col-lg-9 col-xs-12"></div><div widget-area="sidebar" class="col-lg-3 col-xs-12"></div></div></div>'));
}
} else if (location === 'header' && !$('#content [widget-area="header"]').length) {
$('#content').prepend($('<div class="row"><div widget-area="header" class="col-xs-12"></div></div>'));
if (location === 'footer' && !$('#content [widget-area="footer"]').length) {
$('#content').append($('<div class="row"><div widget-area="footer" class="col-xs-12"></div></div>'));
} else if (location === 'sidebar' && !$('#content [widget-area="sidebar"]').length) {
if ($('[component="account/cover"]').length) {
$('[component="account/cover"]').nextAll().wrapAll($('<div class="row"><div class="col-lg-9 col-xs-12"></div><div widget-area="sidebar" class="col-lg-3 col-xs-12"></div></div></div>'));
} else if ($('[component="groups/cover"]').length) {
$('[component="groups/cover"]').nextAll().wrapAll($('<div class="row"><div class="col-lg-9 col-xs-12"></div><div widget-area="sidebar" class="col-lg-3 col-xs-12"></div></div></div>'));
} else {
$('#content > *').wrapAll($('<div class="row"><div class="col-lg-9 col-xs-12"></div><div widget-area="sidebar" class="col-lg-3 col-xs-12"></div></div></div>'));
}
area = $('#content [widget-area="' + location + '"]');
} else if (location === 'header' && !$('#content [widget-area="header"]').length) {
$('#content').prepend($('<div class="row"><div widget-area="header" class="col-xs-12"></div></div>'));
}
});
area = $('#content [widget-area="' + location + '"]');
if (html && area.length) {
area.html(html);
}
if (renderedWidgets.length) {
area.removeClass('hidden');
ajaxify.widgets.reposition(location);
}
if (widgetsAtLocation.length) {
area.removeClass('hidden');
ajaxify.widgets.reposition(location);
}
});
var widgetAreas = $('#content [widget-area]');
widgetAreas.find('img:not(.not-responsive)').addClass('img-responsive');
widgetAreas.find('.timeago').timeago();
widgetAreas.find('img[title].teaser-pic,img[title].user-img').each(function () {
$(this).tooltip({
placement: 'top',
title: $(this).attr('title'),
});
var widgetAreas = $('#content [widget-area]');
widgetAreas.find('img:not(.not-responsive)').addClass('img-responsive');
widgetAreas.find('.timeago').timeago();
widgetAreas.find('img[title].teaser-pic,img[title].user-img').each(function () {
$(this).tooltip({
placement: 'top',
title: $(this).attr('title'),
});
$(window).trigger('action:widgets.loaded', {});
callback(renderedAreas);
});
$(window).trigger('action:widgets.loaded', {});
callback();
};
}(ajaxify || {}));

50
src/controllers/api.js
Unescape Escape View File

@ -11,12 +11,11 @@ var topics = require('../topics');
var categories = require('../categories');
var privileges = require('../privileges');
var plugins = require('../plugins');
var widgets = require('../widgets');
var translator = require('../translator');
var apiController = module.exports;
apiController.getConfig = function (req, res, next) {
apiController.loadConfig = function (req, callback) {
var config = {};
config.environment = process.env.NODE_ENV;
config.relative_path = nconf.get('relative_path');
@ -59,7 +58,7 @@ apiController.getConfig = function (req, res, next) {
config.requireEmailConfirmation = parseInt(meta.config.requireEmailConfirmation, 10) === 1;
config.topicPostSort = meta.config.topicPostSort || 'oldest_to_newest';
config.categoryTopicSort = meta.config.categoryTopicSort || 'newest_to_oldest';
config.csrf_token = req.csrfToken();
config.csrf_token = req.csrfToken && req.csrfToken();
config.searchEnabled = plugins.hasListeners('filter:search.query');
config.bootswatchSkin = meta.config.bootswatchSkin || 'noskin';
config.defaultBootswatchSkin = meta.config.bootswatchSkin || 'noskin';
@ -80,7 +79,7 @@ apiController.getConfig = function (req, res, next) {
async.waterfall([
function (next) {
if (!req.user) {
if (!req.uid) {
return next(null, config);
}
user.getSettings(req.uid, next);
@ -98,41 +97,22 @@ apiController.getConfig = function (req, res, next) {
config.bootswatchSkin = (settings.bootswatchSkin && settings.bootswatchSkin !== 'default') ? settings.bootswatchSkin : config.bootswatchSkin;
plugins.fireHook('filter:config.get', config, next);
},
], function (err, config) {
if (err) {
return next(err);
}
if (res.locals.isAPI) {
res.json(config);
} else {
next(null, config);
}
});
], callback);
};
apiController.renderWidgets = function (req, res, next) {
if (!req.query.template || !req.query.locations) {
return res.status(200).json({});
}
widgets.render(req.uid,
{
template: req.query.template,
url: req.query.url,
locations: req.query.locations,
isMobile: req.query.isMobile === 'true',
cid: req.query.cid,
apiController.getConfig = function (req, res, next) {
async.waterfall([
function (next) {
apiController.loadConfig(req, next);
},
req,
res,
function (err, widgets) {
if (err) {
return next(err);
function (config, next) {
if (res.locals.isAPI) {
res.json(config);
} else {
next(null, config);
}
res.status(200).json(widgets);
});
},
], next);
};
apiController.getPostData = function (pid, uid, callback) {

2
src/database/mongo/helpers.js
Unescape Escape View File

@ -6,7 +6,7 @@ helpers.toMap = function (data) {
var map = {};
for (var i = 0; i < data.length; i += 1) {
map[data[i]._key] = data[i];
data[i]._key = undefined;
delete data[i]._key;
}
return map;
};

12
src/middleware/render.js
Unescape Escape View File

@ -7,6 +7,7 @@ var winston = require('winston');
var plugins = require('../plugins');
var translator = require('../translator');
var widgets = require('../widgets');
module.exports = function (middleware) {
middleware.processRender = function (req, res, next) {
@ -49,6 +50,17 @@ module.exports = function (middleware) {
function (data, next) {
options = data.templateData;
widgets.render(req.uid, {
template: template + '.tpl',
url: options.url,
templateData: options,
req: req,
res: res,
}, next);
},
function (data, next) {
options.widgets = data;
res.locals.template = template;
options._locals = undefined;

1
src/routes/api.js
Unescape Escape View File

@ -9,7 +9,6 @@ module.exports = function (app, middleware, controllers) {
app.use('/api', router);
router.get('/config', middleware.applyCSRF, controllers.api.getConfig);
router.get('/widgets/render', controllers.api.renderWidgets);
router.get('/me', middleware.checkGlobalPrivacySettings, controllers.user.getCurrentUser);
router.get('/user/uid/:uid', middleware.checkGlobalPrivacySettings, controllers.user.getUserByUID);

22
src/views/admin/extend/widgets.tpl
Unescape Escape View File

@ -32,32 +32,32 @@
<div class="panel-body">
<div class="available-widgets">
<p>[[admin/extend/widgets:explanation]]</p>
<!-- IF !widgets.length -->
<!-- IF !availableWidgets.length -->
<div class="alert alert-info">[[none-installed, {config.relative_path}/admin/extend/plugins]]</div>
<!-- ENDIF !widgets.length -->
<!-- ENDIF !availableWidgets.length -->
<p>
<select id="widget-selector" class="form-control">
<!-- BEGIN widgets -->
<option value="{widgets.widget}">{widgets.name}</option>
<!-- END widgets -->
<!-- BEGIN availableWidgets -->
<option value="{availableWidgets.widget}">{availableWidgets.name}</option>
<!-- END availableWidgets -->
</select>
</p>
<div class="row">
<!-- BEGIN widgets -->
<!-- BEGIN availableWidgets -->
<div class="col-xs-12">
<div data-widget="{widgets.widget}" class="panel widget-panel panel-default pointer hide">
<div data-widget="{availableWidgets.widget}" class="panel widget-panel panel-default pointer hide">
<div class="panel-heading">
<strong>{widgets.name}</strong>
<small><br />{widgets.description}</small>
<strong>{availableWidgets.name}</strong>
<small><br />{availableWidgets.description}</small>
</div>
<div class="panel-body hidden">
<form>
{widgets.content}
{availableWidgets.content}
</form>
</div>
</div>
</div>
<!-- END widgets -->
<!-- END availableWidgets -->
</div>
</div>
</div>

2
src/widgets/admin.js
Unescape Escape View File

@ -72,7 +72,7 @@ admin.get = function (callback) {
callback(false, {
templates: templates,
areas: widgetData.areas,
widgets: widgetData.widgets,
availableWidgets: widgetData.widgets,
});
});
});

64
src/widgets/index.js
Unescape Escape View File

@ -3,27 +3,35 @@
var async = require('async');
var winston = require('winston');
var templates = require('templates.js');
var _ = require('lodash');
var plugins = require('../plugins');
var translator = require('../translator');
var db = require('../database');
var apiController = require('../controllers/api');
var widgets = module.exports;
widgets.render = function (uid, area, req, res, callback) {
if (!area.locations || !area.template) {
widgets.render = function (uid, options, callback) {
if (!options.template) {
return callback(new Error('[[error:invalid-data]]'));
}
async.waterfall([
function (next) {
widgets.getAreas(['global', area.template], area.locations, next);
widgets.getWidgetDataForTemplates(['global', options.template], next);
},
function (data, next) {
var widgetsByLocation = {};
async.map(area.locations, function (location, done) {
widgetsByLocation[location] = data.global[location].concat(data[area.template][location]);
delete data.global.drafts;
var locations = _.uniq(Object.keys(data.global).concat(Object.keys(data[options.template])));
var returnData = {};
async.each(locations, function (location, done) {
widgetsByLocation[location] = (data.global[location] || []).concat(data[options.template][location] || []);
if (!widgetsByLocation[location].length) {
return done(null, { location: location, widgets: [] });
@ -33,28 +41,43 @@ widgets.render = function (uid, area, req, res, callback) {
if (!widget || !widget.data ||
(!!widget.data['hide-registered'] && uid !== 0) ||
(!!widget.data['hide-guests'] && uid === 0) ||
(!!widget.data['hide-mobile'] && area.isMobile)) {
(!!widget.data['hide-mobile'] && options.req.useragent.isMobile)) {
return next();
}
renderWidget(widget, uid, area, req, res, next);
}, function (err, result) {
done(err, { location: location, widgets: result.filter(Boolean) });
renderWidget(widget, uid, options, next);
}, function (err, renderedWidgets) {
if (err) {
return done(err);
}
returnData[location] = renderedWidgets.filter(Boolean);
done();
});
}, next);
}, function (err) {
next(err, returnData);
});
},
], callback);
};
function renderWidget(widget, uid, area, req, res, callback) {
function renderWidget(widget, uid, options, callback) {
async.waterfall([
function (next) {
if (options.res.locals.isAPI) {
apiController.loadConfig(options.req, next);
} else {
next(null, options.res.locals.config);
}
},
function (config, next) {
var templateData = _.assign(options.templateData, { config: config });
plugins.fireHook('filter:widget.render:' + widget.widget, {
uid: uid,
area: area,
area: options,
templateData: templateData,
data: widget.data,
req: req,
res: res,
req: options.req,
res: options.res,
}, next);
},
function (data, next) {
@ -84,23 +107,28 @@ function renderWidget(widget, uid, area, req, res, callback) {
], callback);
}
widgets.getAreas = function (templates, locations, callback) {
widgets.getWidgetDataForTemplates = function (templates, callback) {
var keys = templates.map(function (tpl) {
return 'widgets:' + tpl;
});
async.waterfall([
function (next) {
db.getObjectsFields(keys, locations, next);
db.getObjects(keys, next);
},
function (data, next) {
var returnData = {};
templates.forEach(function (template, index) {
returnData[template] = returnData[template] || {};
var templateWidgetData = data[index] || {};
var locations = Object.keys(templateWidgetData);
locations.forEach(function (location) {
if (data && data[index] && data[index][location]) {
if (templateWidgetData && templateWidgetData[location]) {
try {
returnData[template][location] = JSON.parse(data[index][location]);
returnData[template][location] = JSON.parse(templateWidgetData[location]);
} catch (err) {
winston.error('can not parse widget data. template: ' + template + ' location: ' + location);
returnData[template][location] = [];

9
test/controllers.js
Unescape Escape View File

@ -688,21 +688,20 @@ describe('Controllers', function () {
});
it('should return {} if there is no template or locations', function (done) {
request(nconf.get('url') + '/api/widgets/render', { json: true }, function (err, res, body) {
request(nconf.get('url') + '/api/users', { json: true }, function (err, res, body) {
assert.ifError(err);
assert.equal(res.statusCode, 200);
assert(body);
assert.equal(Object.keys(body), 0);
assert.equal(Object.keys(body.widgets), 0);
done();
});
});
it('should render templates', function (done) {
var url = nconf.get('url') + '/api/widgets/render?template=categories.tpl&url=&isMobile=false&locations%5B%5D=sidebar&locations%5B%5D=footer&locations%5B%5D=header';
request(url, { json: true }, function (err, res, body) {
request(nconf.get('url') + '/api/categories', { json: true }, function (err, res, body) {
assert.ifError(err);
assert.equal(res.statusCode, 200);
assert(body);
assert(body.widgets && body.widgets.sidebar);
done();
});
});

Write Preview
Loading…
Cancel
Save