nodebb-plugin-recent-cards-2 1.0.0

package/.gitattributes

@@ -0,0 +1,22 @@
+# Auto detect text files and perform LF normalization
+* text=auto
+
+# Custom for Visual Studio
+*.cs     diff=csharp
+*.sln    merge=union
+*.csproj merge=union
+*.vbproj merge=union
+*.fsproj merge=union
+*.dbproj merge=union
+
+# Standard to msysgit
+*.doc	 diff=astextplain
+*.DOC	 diff=astextplain
+*.docx diff=astextplain
+*.DOCX diff=astextplain
+*.dot  diff=astextplain
+*.DOT  diff=astextplain
+*.pdf  diff=astextplain
+*.PDF	 diff=astextplain
+*.rtf	 diff=astextplain
+*.RTF	 diff=astextplain

package/LICENSE

@@ -0,0 +1,8 @@
+Copyright (c) 2013-2014, psychobunny <psycho.bunny@hotmail.com>
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
+
+Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
+Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

package/README.md

@@ -0,0 +1,78 @@
+# Recent Cards plugin for NodeBB's Persona Theme
+
+This is a plugin that creates a new widget that can be placed on various widget areas. It's inspired by the previous default theme, Lavender, which used Modern UI styling for the category layout.
+
+
+## Installation
+
+Install via one-click activation in the Admin Control Panel or run the following command:
+
+    npm i nodebb-plugin-recent-cards
+
+Then head over to Admin -> Extend -> Widgets and place the widget. Additional settings can be found at Admin -> Plugins -> Recent Cards and under the individual widget settings.
+
+## Screenshot
+
+![](https://i.imgur.com/r3NKmY1.jpg)
+
+# Standalone installation for external websites (Advanced)
+
+Use this plugin on any external non-nodebb site (ex. Wordpress, etc) to show recent topics from your NodeBB install.
+
+### Header Scripts + Styles
+
+Place these in the `header` section of your external site, and replace all instances of `{forumURL}` to your forum's URL:
+
+```
+<script src="{forumURL}/plugins/nodebb-plugin-recent-cards/static/bxslider/jquery.bxslider.min.js"></script>
+<script>
+window.path_to_nodebb = '{forumURL}';
+</script>
+<script src="{forumURL}/plugins/nodebb-plugin-recent-cards/static/lib/external.js"></script>
+<link rel="stylesheet" type="text/css" href="{forumURL}/plugins/nodebb-plugin-recent-cards/render/style.css" />
+<link rel="stylesheet" type="text/css" href="{forumURL}/plugins/nodebb-plugin-recent-cards/static/bxslider/jquery.bxslider.css" />
+```
+
+If your external site doesn't have jQuery included, you will have include it above the previous lines. Get the latest jQuery at https://code.jquery.com/
+
+You should also (optionally) require the jQuery Timeago library in order to display human-readable timestamps:
+
+```
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-timeago/1.6.1/jquery.timeago.min.js"></script>
+```
+
+If your external site doesn't have Bootstrap included, you will have to include this line as well in your `header`, which is the bare minimum (grid + responsive utilities) required for this plugin:
+
+```
+<link rel="stylesheet" type="text/css" href="{forumURL}/plugins/nodebb-plugin-recent-cards/static/external/bootstrap-grid.css" />
+```
+
+Similarly, if your external site does not use FontAwesome, then you will have to include this line as well in order to display category icons:
+
+```
+<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />
+```
+
+
+Finally, if you need to include the default Persona font to match your external site's recent cards with your forum's, then include this:
+
+```
+<link rel="prefetch stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" />
+```
+
+
+### Body Content
+
+Place the following code wherever you'd like recent cards to be displayed:
+
+```
+<div id="nodebb-plugin-recent-cards"></div>
+```
+
+### Configure ACAO in NodeBB
+
+Under Settings -> Advanced in the NodeBB control panel, add the external site's URL to `Access-Control-Allow-Origin`
+
+### Stuck?
+
+No problem! Visit https://yourforum.com/admin/plugins/nodebb-plugin-recent-cards/tests/external, which will render the standalone version of the plugin tailored for your website. Keep in mind that this includes all extra scripts and styling that you may not necessarily need if you already have Bootstrap, jQuery, etc. on your external site.

package/eslint.config.mjs

@@ -0,0 +1,12 @@
+'use strict';
+
+import serverConfig from 'eslint-config-nodebb';
+import publicConfig from 'eslint-config-nodebb/public';
+
+export default [
+	...publicConfig,
+	...serverConfig,
+	{
+		ignores: ['static/slick/**'],
+	},
+];

package/library.js

@@ -0,0 +1,340 @@
+/* eslint-disable no-await-in-loop */
+
+'use strict';
+
+const nconf = require.main.require('nconf');
+const _ = require.main.require('lodash');
+const validator = require.main.require('validator');
+const db = require.main.require('./src/database');
+const topics = require.main.require('./src/topics');
+const settings = require.main.require('./src/settings');
+const groups = require.main.require('./src/groups');
+const user = require.main.require('./src/user');
+
+const defaultSettings = {
+	enableCarousel: 1,
+	enableCarouselPagination: 0,
+	minSlides: 1,
+	maxSlides: 4,
+};
+
+const plugin = module.exports;
+let app;
+
+plugin.init = async function (params) {
+	app = params.app;
+	const { router } = params;
+	const routeHelpers = require.main.require('./src/routes/helpers');
+	routeHelpers.setupAdminPageRoute(router, '/admin/plugins/recentcards', renderAdmin);
+
+	router.get('/plugins/nodebb-plugin-recent-cards/render', renderExternal);
+	router.get('/plugins/nodebb-plugin-recent-cards/render/style.css', renderExternalStyle);
+	router.get('/plugins/nodebb-plugin-recent-cards/filter', renderFiltered);
+	router.get('/admin/plugins/nodebb-plugin-recent-cards/tests/external', testRenderExternal);
+
+	plugin.settings = new settings('recentcards', '1.0.0', defaultSettings);
+};
+
+plugin.addAdminNavigation = async function (header) {
+	header.plugins.push({
+		route: '/plugins/recentcards',
+		icon: 'fa-tint',
+		name: 'Recent Cards',
+	});
+	return header;
+};
+
+plugin.defineWidgets = async function (widgets) {
+	const groupNames = await db.getSortedSetRevRange('groups:visible:createtime', 0, -1);
+	let groupsData = await groups.getGroupsData(groupNames);
+	groupsData = groupsData.filter(Boolean);
+	groupsData.forEach((group) => {
+		group.name = validator.escape(String(group.name));
+	});
+
+	const html = await app.renderAsync('admin/plugins/nodebb-plugin-recent-cards/widget', {
+		groups: groupsData,
+	});
+
+	widgets.push({
+		widget: 'recentCards',
+		name: 'Recent Cards',
+		description: 'Recent topics carousel',
+		content: html,
+	});
+	return widgets;
+};
+
+plugin.getConfig = async function (config) {
+	config.recentCards = {
+		title: plugin.settings.get('title'),
+		opacity: plugin.settings.get('opacity'),
+		textShadow: plugin.settings.get('shadow'),
+		enableCarousel: plugin.settings.get('enableCarousel'),
+		enableCarouselPagination: plugin.settings.get('enableCarouselPagination'),
+		minSlides: plugin.settings.get('minSlides'),
+		maxSlides: plugin.settings.get('maxSlides'),
+	};
+	return config;
+};
+
+plugin.renderWidget = async function (widget) {
+	if (!isVisibleInCategory(widget)) {
+		return null;
+	}
+	const topics = await getTopics(widget);
+
+	const categoryMap = {};
+	topics.forEach((t) => {
+		if (t && t.category && !categoryMap[t.category.cid]) {
+			categoryMap[t.category.cid] = {
+				cid: t.category.cid,
+				name: t.category.name,
+				icon: t.category.icon,
+				bgColor: t.category.bgColor,
+				color: t.category.color,
+			};
+		}
+	});
+	const categories = Object.values(categoryMap);
+
+	const widgetConfig = {
+		sort: widget.data.sort || 'recent',
+		teaserPost: widget.data.teaserPost || 'first',
+		teaserParseType: widget.data.teaserParseType || 'default',
+		thumbnailStyle: widget.data.thumbnailStyle || 'background',
+	};
+
+	widget.html = await app.renderAsync('partials/nodebb-plugin-recent-cards/header', {
+		topics: topics,
+		config: widget.templateData.config,
+		title: widget.data.title || '',
+		carouselMode: plugin.settings.get('enableCarousel'),
+		categories: JSON.stringify(categories).replace(/</g, '\\u003c'),
+		widgetConfig: JSON.stringify(widgetConfig).replace(/</g, '\\u003c'),
+	});
+	return widget;
+};
+
+function getIdsArray(data, field) {
+	const ids = String(data[field] || '');
+	return ids.split(',').map(c => c.trim()).filter(Boolean);
+}
+
+function isVisibleInCategory(widget) {
+	const cids = getIdsArray(widget.data, 'cid');
+	return !(
+		cids.length &&
+		(widget.templateData.template.category || widget.templateData.template.topic) &&
+		!cids.includes(String(widget.templateData.cid))
+	);
+}
+
+async function getTopics(widget) {
+	const teaserPost = widget.data.teaserPost || 'first';
+	const teaserParseType = widget.data.teaserParseType || 'default';
+	const getTopicsOptions = {
+		uid: widget.uid,
+		teaserPost,
+		teaserParseType,
+		thumbsOnly: true,
+	};
+	async function getTopicsFromSet(set) {
+		let start = 0;
+		const topicsData = [];
+
+		do {
+			let tids = await db.getSortedSetRevRangeByScore(set, start, 20, Date.now(), '-inf');
+			if (!tids.length) {
+				break;
+			}
+
+			tids = await topics.filterNotIgnoredTids(tids, widget.uid);
+			let nextTopics = await topics.getTopics(tids, getTopicsOptions);
+
+			nextTopics = await user.blocks.filter(widget.uid, nextTopics);
+			topicsData.push(...nextTopics);
+			start += 20;
+		} while (topicsData.length < 20);
+		return { topics: topicsData.slice(0, 20) };
+	}
+
+	let topicsData = {
+		topics: [],
+	};
+	let filterCids = getIdsArray(widget.data, 'topicsFromCid');
+	if (!filterCids.length && widget.templateData.cid) {
+		filterCids = [String(widget.templateData.cid)];
+	}
+
+	widget.data.sort = widget.data.sort || 'recent';
+	let fromGroups = widget.data.fromGroups || [];
+	if (fromGroups && !Array.isArray(fromGroups)) {
+		fromGroups = [fromGroups];
+	}
+	// hard coded to show these topic tids only
+	const topicsTids = getIdsArray(widget.data, 'topicsTids');
+	if (topicsTids.length) {
+		topicsData.topics = await topics.getTopics(topicsTids, getTopicsOptions);
+	} else if (fromGroups.length) {
+		const uids = _.uniq(_.flatten(await groups.getMembersOfGroups(fromGroups)));
+		const sets = uids.map((uid) => {
+			if (filterCids.length) {
+				return filterCids.map(cid => `cid:${cid}:uid:${uid}:tids`);
+			}
+			return `uid:${uid}:topics`;
+		});
+		topicsData = await getTopicsFromSet(sets.flat());
+		topicsData.topics.sort((t1, t2) => {
+			if (widget.data.sort === 'recent') {
+				return t2.lastposttime - t1.lastposttime;
+			} else if (widget.data.sort === 'votes') {
+				return t2.votes - t1.votes;
+			} else if (widget.data.sort === 'posts') {
+				return t2.postcount - t1.postcount;
+			}
+			return 0;
+		});
+	} else if (filterCids.length) {
+		let searchSuffix = '';
+		if (widget.data.sort === 'recent') {
+			searchSuffix += ':lastposttime';
+		} else if (widget.data.sort === 'votes' || widget.data.sort === 'posts' || widget.data.sort === 'create') {
+			searchSuffix += `:${widget.data.sort}`;
+		}
+		topicsData = await getTopicsFromSet(
+			filterCids.map(cid => `cid:${cid}:tids${searchSuffix}`)
+		);
+	} else {
+		const map = {
+			votes: 'topics:votes',
+			posts: 'topics:posts',
+			recent: 'topics:recent',
+			create: 'topics:tid',
+		};
+		topicsData = await getTopicsFromSet(map[widget.data.sort]);
+	}
+
+	let i = 0;
+	const cids = [];
+	let finalTopics = [];
+
+	if (!plugin.settings.get('enableCarousel')) {
+		while (finalTopics.length < 4 && i < topicsData.topics.length) {
+			const cid = String(topicsData.topics[i].cid);
+
+			if (filterCids.length || !cids.includes(cid) || topicsData.topics.length <= 4) {
+				cids.push(cid);
+				finalTopics.push(topicsData.topics[i]);
+			}
+
+			i += 1;
+		}
+	} else {
+		finalTopics = topicsData.topics;
+	}
+
+	const thumbStyle = widget.data.thumbnailStyle || 'background';
+	finalTopics.forEach((t) => {
+		if (t) {
+			const showThumbs = t.thumbs?.length && String(t?.teaser.pid) === String(t.mainPid);
+			t.showThumbnailInBackground = showThumbs && thumbStyle === 'background';
+			t.showThumbnailInline = showThumbs && thumbStyle === 'inline';
+		}
+	});
+
+	return finalTopics;
+}
+
+async function renderExternal(req, res, next) {
+	try {
+		const topicsData = await getTopics({
+			uid: req.uid,
+			data: {
+				teaserPost: 'first',
+			},
+			templateData: {},
+		});
+
+		const categoryMap = {};
+		topicsData.forEach((t) => {
+			if (t && t.category && !categoryMap[t.category.cid]) {
+				categoryMap[t.category.cid] = {
+					cid: t.category.cid,
+					name: t.category.name,
+					icon: t.category.icon,
+					bgColor: t.category.bgColor,
+					color: t.category.color,
+				};
+			}
+		});
+
+		res.render('partials/nodebb-plugin-recent-cards/header', {
+			topics: topicsData,
+			config: {
+				relative_path: nconf.get('url'),
+			},
+			categories: JSON.stringify(Object.values(categoryMap)).replace(/</g, '\\u003c'),
+			widgetConfig: '{}',
+		});
+	} catch (err) {
+		next(err);
+	}
+}
+
+async function renderFiltered(req, res, next) {
+	try {
+		const cids = String(req.query.cids || '');
+		const sort = String(req.query.sort || 'recent');
+		const teaserPost = String(req.query.teaserPost || 'first');
+		const teaserParseType = String(req.query.teaserParseType || 'default');
+		const thumbnailStyle = String(req.query.thumbnailStyle || 'background');
+
+		const allowedSorts = ['recent', 'create', 'votes', 'posts'];
+		const allowedTeasers = ['first', 'last-post'];
+		const allowedParseTypes = ['default', 'plaintext'];
+		const allowedThumbs = ['background', 'inline'];
+
+		const filteredTopics = await getTopics({
+			uid: req.uid,
+			data: {
+				topicsFromCid: cids,
+				sort: allowedSorts.includes(sort) ? sort : 'recent',
+				teaserPost: allowedTeasers.includes(teaserPost) ? teaserPost : 'first',
+				teaserParseType: allowedParseTypes.includes(teaserParseType) ? teaserParseType : 'default',
+				thumbnailStyle: allowedThumbs.includes(thumbnailStyle) ? thumbnailStyle : 'background',
+			},
+			templateData: {},
+		});
+
+		const html = await app.renderAsync('partials/nodebb-plugin-recent-cards/header', {
+			topics: filteredTopics,
+			config: { relative_path: nconf.get('relative_path') },
+			carouselMode: plugin.settings.get('enableCarousel'),
+			categories: '[]',
+			widgetConfig: '{}',
+		});
+
+		res.json({ html: html });
+	} catch (err) {
+		next(err);
+	}
+}
+
+function renderExternalStyle(req, res) {
+	res.render('partials/nodebb-plugin-recent-cards/external/style', {
+		forumURL: nconf.get('url'),
+	});
+}
+
+function testRenderExternal(req, res) {
+	res.render('admin/plugins/nodebb-plugin-recent-cards/tests/external', {
+		forumURL: nconf.get('url'),
+	});
+}
+
+async function renderAdmin(req, res) {
+	res.render('admin/plugins/recentcards', {
+		title: 'Recent Cards',
+	});
+}

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "nodebb-plugin-recent-cards-2",
+  "version": "1.0.0",
+  "description": "Add lavender-style cards of recent topics to Persona's category homepage",
+  "main": "library.js",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/psychobunny/nodebb-plugin-recent-cards"
+  },
+  "scripts": {
+    "lint": "eslint ."
+  },
+  "keywords": [
+    "nodebb",
+    "plugin",
+    "recent",
+    "cards",
+    "persona"
+  ],
+  "author": {
+    "name": "psychobunny",
+    "email": "psycho.bunny@hotmail.com"
+  },
+  "license": "BSD-2-Clause",
+  "bugs": {
+    "url": "https://github.com/psychobunny/nodebb-plugin-recent-cards/issues"
+  },
+  "readmeFilename": "README.md",
+  "devDependencies": {
+    "eslint": "^9.x",
+    "eslint-config-nodebb": "1.1.11",
+    "eslint-plugin-import": "2.32.0"
+  },
+  "nbbpm": {
+    "compatibility": "^4.0.0"
+  }
+}

package/plugin.json

@@ -0,0 +1,42 @@
+{
+	"id": "nodebb-plugin-recent-cards",
+	"name": "Recent Cards plugin for NodeBB's Persona Theme",
+	"description": "Add lavender-style cards of recent topics to Persona's category homepage",
+	"url": "https://github.com/NodeBB/nodebb-plugin-recent-cards",
+	"library": "./library.js",
+	"hooks": [
+		{
+			"hook": "static:app.load", "method": "init"
+		},
+		{
+			"hook": "filter:config.get", "method": "getConfig"
+		},
+		{
+			"hook": "filter:admin.header.build", "method": "addAdminNavigation"
+		},
+		{
+			"hook": "filter:widgets.getWidgets", "method": "defineWidgets"
+		},
+		{
+			"hook": "filter:widget.render:recentCards", "method": "renderWidget"
+		}
+	],
+	"staticDirs": {
+		"static": "./static"
+	},
+	"css": [
+		"static/slick/slick.css",
+		"static/slick/slick-theme.css"
+	],
+	"scss": [
+		"static/style.scss"
+	],
+	"scripts": [
+		"static/slick/slick.min.js",
+		"static/lib/main.js"
+	],
+	"modules": {
+		"../admin/plugins/recentcards.js": "static/lib/admin.js"
+	},
+	"templates": "static/templates"
+}

package/static/external/bootstrap-grid.css

@@ -0,0 +1,14 @@
+/*!
+ * Bootstrap v3.3.7 (http://getbootstrap.com)
+ * Copyright 2011-2018 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
+
+/*!
+ * Generated using the Bootstrap Customizer (https://getbootstrap.com/docs/3.3/customize/?id=cd87b217e33874f77fb457b6338264bb)
+ * Config saved to config.json and https://gist.github.com/cd87b217e33874f77fb457b6338264bb
+ *//*!
+ * Bootstrap v3.3.7 (http://getbootstrap.com)
+ * Copyright 2011-2016 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ *//*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:0.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace, monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}*:before,*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html{font-size:10px;-webkit-tap-highlight-color:rgba(0,0,0,0)}body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.42857143;color:#333;background-color:#fff}input,button,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}a{color:#337ab7;text-decoration:none}a:hover,a:focus{color:#23527c;text-decoration:underline}a:focus{outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}figure{margin:0}img{vertical-align:middle}.img-responsive{display:block;max-width:100%;height:auto}.img-rounded{border-radius:6px}.img-thumbnail{padding:4px;line-height:1.42857143;background-color:#fff;border:1px solid #ddd;border-radius:4px;-webkit-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out;display:inline-block;max-width:100%;height:auto}.img-circle{border-radius:50%}hr{margin-top:20px;margin-bottom:20px;border:0;border-top:1px solid #eee}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.sr-only-focusable:active,.sr-only-focusable:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}[role="button"]{cursor:pointer}.container{margin-right:auto;margin-left:auto;padding-left:15px;padding-right:15px}@media (min-width:768px){.container{width:750px}}@media (min-width:992px){.container{width:970px}}@media (min-width:1200px){.container{width:1170px}}.container-fluid{margin-right:auto;margin-left:auto;padding-left:15px;padding-right:15px}.row{margin-left:-15px;margin-right:-15px}.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12{position:relative;min-height:1px;padding-left:15px;padding-right:15px}.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12{float:left}.col-xs-12{width:100%}.col-xs-11{width:91.66666667%}.col-xs-10{width:83.33333333%}.col-xs-9{width:75%}.col-xs-8{width:66.66666667%}.col-xs-7{width:58.33333333%}.col-xs-6{width:50%}.col-xs-5{width:41.66666667%}.col-xs-4{width:33.33333333%}.col-xs-3{width:25%}.col-xs-2{width:16.66666667%}.col-xs-1{width:8.33333333%}.col-xs-pull-12{right:100%}.col-xs-pull-11{right:91.66666667%}.col-xs-pull-10{right:83.33333333%}.col-xs-pull-9{right:75%}.col-xs-pull-8{right:66.66666667%}.col-xs-pull-7{right:58.33333333%}.col-xs-pull-6{right:50%}.col-xs-pull-5{right:41.66666667%}.col-xs-pull-4{right:33.33333333%}.col-xs-pull-3{right:25%}.col-xs-pull-2{right:16.66666667%}.col-xs-pull-1{right:8.33333333%}.col-xs-pull-0{right:auto}.col-xs-push-12{left:100%}.col-xs-push-11{left:91.66666667%}.col-xs-push-10{left:83.33333333%}.col-xs-push-9{left:75%}.col-xs-push-8{left:66.66666667%}.col-xs-push-7{left:58.33333333%}.col-xs-push-6{left:50%}.col-xs-push-5{left:41.66666667%}.col-xs-push-4{left:33.33333333%}.col-xs-push-3{left:25%}.col-xs-push-2{left:16.66666667%}.col-xs-push-1{left:8.33333333%}.col-xs-push-0{left:auto}.col-xs-offset-12{margin-left:100%}.col-xs-offset-11{margin-left:91.66666667%}.col-xs-offset-10{margin-left:83.33333333%}.col-xs-offset-9{margin-left:75%}.col-xs-offset-8{margin-left:66.66666667%}.col-xs-offset-7{margin-left:58.33333333%}.col-xs-offset-6{margin-left:50%}.col-xs-offset-5{margin-left:41.66666667%}.col-xs-offset-4{margin-left:33.33333333%}.col-xs-offset-3{margin-left:25%}.col-xs-offset-2{margin-left:16.66666667%}.col-xs-offset-1{margin-left:8.33333333%}.col-xs-offset-0{margin-left:0}@media (min-width:768px){.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12{float:left}.col-sm-12{width:100%}.col-sm-11{width:91.66666667%}.col-sm-10{width:83.33333333%}.col-sm-9{width:75%}.col-sm-8{width:66.66666667%}.col-sm-7{width:58.33333333%}.col-sm-6{width:50%}.col-sm-5{width:41.66666667%}.col-sm-4{width:33.33333333%}.col-sm-3{width:25%}.col-sm-2{width:16.66666667%}.col-sm-1{width:8.33333333%}.col-sm-pull-12{right:100%}.col-sm-pull-11{right:91.66666667%}.col-sm-pull-10{right:83.33333333%}.col-sm-pull-9{right:75%}.col-sm-pull-8{right:66.66666667%}.col-sm-pull-7{right:58.33333333%}.col-sm-pull-6{right:50%}.col-sm-pull-5{right:41.66666667%}.col-sm-pull-4{right:33.33333333%}.col-sm-pull-3{right:25%}.col-sm-pull-2{right:16.66666667%}.col-sm-pull-1{right:8.33333333%}.col-sm-pull-0{right:auto}.col-sm-push-12{left:100%}.col-sm-push-11{left:91.66666667%}.col-sm-push-10{left:83.33333333%}.col-sm-push-9{left:75%}.col-sm-push-8{left:66.66666667%}.col-sm-push-7{left:58.33333333%}.col-sm-push-6{left:50%}.col-sm-push-5{left:41.66666667%}.col-sm-push-4{left:33.33333333%}.col-sm-push-3{left:25%}.col-sm-push-2{left:16.66666667%}.col-sm-push-1{left:8.33333333%}.col-sm-push-0{left:auto}.col-sm-offset-12{margin-left:100%}.col-sm-offset-11{margin-left:91.66666667%}.col-sm-offset-10{margin-left:83.33333333%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-8{margin-left:66.66666667%}.col-sm-offset-7{margin-left:58.33333333%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-5{margin-left:41.66666667%}.col-sm-offset-4{margin-left:33.33333333%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-2{margin-left:16.66666667%}.col-sm-offset-1{margin-left:8.33333333%}.col-sm-offset-0{margin-left:0}}@media (min-width:992px){.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12{float:left}.col-md-12{width:100%}.col-md-11{width:91.66666667%}.col-md-10{width:83.33333333%}.col-md-9{width:75%}.col-md-8{width:66.66666667%}.col-md-7{width:58.33333333%}.col-md-6{width:50%}.col-md-5{width:41.66666667%}.col-md-4{width:33.33333333%}.col-md-3{width:25%}.col-md-2{width:16.66666667%}.col-md-1{width:8.33333333%}.col-md-pull-12{right:100%}.col-md-pull-11{right:91.66666667%}.col-md-pull-10{right:83.33333333%}.col-md-pull-9{right:75%}.col-md-pull-8{right:66.66666667%}.col-md-pull-7{right:58.33333333%}.col-md-pull-6{right:50%}.col-md-pull-5{right:41.66666667%}.col-md-pull-4{right:33.33333333%}.col-md-pull-3{right:25%}.col-md-pull-2{right:16.66666667%}.col-md-pull-1{right:8.33333333%}.col-md-pull-0{right:auto}.col-md-push-12{left:100%}.col-md-push-11{left:91.66666667%}.col-md-push-10{left:83.33333333%}.col-md-push-9{left:75%}.col-md-push-8{left:66.66666667%}.col-md-push-7{left:58.33333333%}.col-md-push-6{left:50%}.col-md-push-5{left:41.66666667%}.col-md-push-4{left:33.33333333%}.col-md-push-3{left:25%}.col-md-push-2{left:16.66666667%}.col-md-push-1{left:8.33333333%}.col-md-push-0{left:auto}.col-md-offset-12{margin-left:100%}.col-md-offset-11{margin-left:91.66666667%}.col-md-offset-10{margin-left:83.33333333%}.col-md-offset-9{margin-left:75%}.col-md-offset-8{margin-left:66.66666667%}.col-md-offset-7{margin-left:58.33333333%}.col-md-offset-6{margin-left:50%}.col-md-offset-5{margin-left:41.66666667%}.col-md-offset-4{margin-left:33.33333333%}.col-md-offset-3{margin-left:25%}.col-md-offset-2{margin-left:16.66666667%}.col-md-offset-1{margin-left:8.33333333%}.col-md-offset-0{margin-left:0}}@media (min-width:1200px){.col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12{float:left}.col-lg-12{width:100%}.col-lg-11{width:91.66666667%}.col-lg-10{width:83.33333333%}.col-lg-9{width:75%}.col-lg-8{width:66.66666667%}.col-lg-7{width:58.33333333%}.col-lg-6{width:50%}.col-lg-5{width:41.66666667%}.col-lg-4{width:33.33333333%}.col-lg-3{width:25%}.col-lg-2{width:16.66666667%}.col-lg-1{width:8.33333333%}.col-lg-pull-12{right:100%}.col-lg-pull-11{right:91.66666667%}.col-lg-pull-10{right:83.33333333%}.col-lg-pull-9{right:75%}.col-lg-pull-8{right:66.66666667%}.col-lg-pull-7{right:58.33333333%}.col-lg-pull-6{right:50%}.col-lg-pull-5{right:41.66666667%}.col-lg-pull-4{right:33.33333333%}.col-lg-pull-3{right:25%}.col-lg-pull-2{right:16.66666667%}.col-lg-pull-1{right:8.33333333%}.col-lg-pull-0{right:auto}.col-lg-push-12{left:100%}.col-lg-push-11{left:91.66666667%}.col-lg-push-10{left:83.33333333%}.col-lg-push-9{left:75%}.col-lg-push-8{left:66.66666667%}.col-lg-push-7{left:58.33333333%}.col-lg-push-6{left:50%}.col-lg-push-5{left:41.66666667%}.col-lg-push-4{left:33.33333333%}.col-lg-push-3{left:25%}.col-lg-push-2{left:16.66666667%}.col-lg-push-1{left:8.33333333%}.col-lg-push-0{left:auto}.col-lg-offset-12{margin-left:100%}.col-lg-offset-11{margin-left:91.66666667%}.col-lg-offset-10{margin-left:83.33333333%}.col-lg-offset-9{margin-left:75%}.col-lg-offset-8{margin-left:66.66666667%}.col-lg-offset-7{margin-left:58.33333333%}.col-lg-offset-6{margin-left:50%}.col-lg-offset-5{margin-left:41.66666667%}.col-lg-offset-4{margin-left:33.33333333%}.col-lg-offset-3{margin-left:25%}.col-lg-offset-2{margin-left:16.66666667%}.col-lg-offset-1{margin-left:8.33333333%}.col-lg-offset-0{margin-left:0}}.clearfix:before,.clearfix:after,.container:before,.container:after,.container-fluid:before,.container-fluid:after,.row:before,.row:after{content:" ";display:table}.clearfix:after,.container:after,.container-fluid:after,.row:after{clear:both}.center-block{display:block;margin-left:auto;margin-right:auto}.pull-right{float:right !important}.pull-left{float:left !important}.hide{display:none !important}.show{display:block !important}.invisible{visibility:hidden}.text-hide{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0}.hidden{display:none !important}.affix{position:fixed}@-ms-viewport{width:device-width}.visible-xs,.visible-sm,.visible-md,.visible-lg{display:none !important}.visible-xs-block,.visible-xs-inline,.visible-xs-inline-block,.visible-sm-block,.visible-sm-inline,.visible-sm-inline-block,.visible-md-block,.visible-md-inline,.visible-md-inline-block,.visible-lg-block,.visible-lg-inline,.visible-lg-inline-block{display:none !important}@media (max-width:767px){.visible-xs{display:block !important}table.visible-xs{display:table !important}tr.visible-xs{display:table-row !important}th.visible-xs,td.visible-xs{display:table-cell !important}}@media (max-width:767px){.visible-xs-block{display:block !important}}@media (max-width:767px){.visible-xs-inline{display:inline !important}}@media (max-width:767px){.visible-xs-inline-block{display:inline-block !important}}@media (min-width:768px) and (max-width:991px){.visible-sm{display:block !important}table.visible-sm{display:table !important}tr.visible-sm{display:table-row !important}th.visible-sm,td.visible-sm{display:table-cell !important}}@media (min-width:768px) and (max-width:991px){.visible-sm-block{display:block !important}}@media (min-width:768px) and (max-width:991px){.visible-sm-inline{display:inline !important}}@media (min-width:768px) and (max-width:991px){.visible-sm-inline-block{display:inline-block !important}}@media (min-width:992px) and (max-width:1199px){.visible-md{display:block !important}table.visible-md{display:table !important}tr.visible-md{display:table-row !important}th.visible-md,td.visible-md{display:table-cell !important}}@media (min-width:992px) and (max-width:1199px){.visible-md-block{display:block !important}}@media (min-width:992px) and (max-width:1199px){.visible-md-inline{display:inline !important}}@media (min-width:992px) and (max-width:1199px){.visible-md-inline-block{display:inline-block !important}}@media (min-width:1200px){.visible-lg{display:block !important}table.visible-lg{display:table !important}tr.visible-lg{display:table-row !important}th.visible-lg,td.visible-lg{display:table-cell !important}}@media (min-width:1200px){.visible-lg-block{display:block !important}}@media (min-width:1200px){.visible-lg-inline{display:inline !important}}@media (min-width:1200px){.visible-lg-inline-block{display:inline-block !important}}@media (max-width:767px){.hidden-xs{display:none !important}}@media (min-width:768px) and (max-width:991px){.hidden-sm{display:none !important}}@media (min-width:992px) and (max-width:1199px){.hidden-md{display:none !important}}@media (min-width:1200px){.hidden-lg{display:none !important}}.visible-print{display:none !important}@media print{.visible-print{display:block !important}table.visible-print{display:table !important}tr.visible-print{display:table-row !important}th.visible-print,td.visible-print{display:table-cell !important}}.visible-print-block{display:none !important}@media print{.visible-print-block{display:block !important}}.visible-print-inline{display:none !important}@media print{.visible-print-inline{display:inline !important}}.visible-print-inline-block{display:none !important}@media print{.visible-print-inline-block{display:inline-block !important}}@media print{.hidden-print{display:none !important}}

package/static/lib/admin.js

@@ -0,0 +1,13 @@
+'use strict';
+
+define('admin/plugins/recentcards', ['settings'], function (settings) {
+	const admin = {};
+	admin.init = function () {
+		settings.sync('recentcards', $('#recentcards'));
+
+		$('#save').click(function () {
+			settings.persist('recentcards', $('#recentcards'));
+		});
+	};
+	return admin;
+});

package/static/lib/external.js

@@ -0,0 +1,33 @@
+'use strict';
+
+$(document).ready(function () {
+	$.get(window.path_to_nodebb + '/plugins/nodebb-plugin-recent-cards/render', {}, function (html) {
+		html = $(html);
+		if (html.length !== 5) {
+			return;
+		}
+
+		$('#nodebb-plugin-recent-cards').html($(html[2]));
+
+		var ajaxifyData = $(html[4]);
+
+		if (ajaxifyData.length) {
+			ajaxifyData = JSON.parse(ajaxifyData.text());
+
+			if (ajaxifyData.recentCards.enableCarousel) {
+				$('#nodebb-plugin-recent-cards .recent-cards').bxSlider({
+					slideWidth: 292,
+					minSlides: 1,
+					maxSlides: 4,
+					pager: ajaxifyData.recentCards.enableCarouselPagination ? true : false,
+				});
+			} else {
+				$('#nodebb-plugin-recent-cards .recent-cards').removeClass('carousel-mode');
+			}
+
+			if ($.timeago) {
+				$('#nodebb-plugin-recent-cards .timeago').not('[datetime]').timeago();
+			}
+		}
+	});
+});