diff --git a/web/app/common/constants.js b/web/app/common/constants.js index b8250aee..49886beb 100644 --- a/web/app/common/constants.js +++ b/web/app/common/constants.js @@ -1,9 +1,11 @@ const BASE_URL = 'https://demo.remark42.com'; const API_BASE = '/api/v1'; const NODE_ID = 'remark42'; +const COUNTER_NODE_CLASSNAME = 'remark42__counter'; module.exports = { BASE_URL, API_BASE, NODE_ID, + COUNTER_NODE_CLASSNAME, }; diff --git a/web/app/counter.js b/web/app/counter.js new file mode 100644 index 00000000..351bc386 --- /dev/null +++ b/web/app/counter.js @@ -0,0 +1,37 @@ +import { COUNTER_NODE_CLASSNAME } from './common/constants' + +import api from 'common/api'; + +if (document.readyState !== 'interactive') { + document.addEventListener('DOMContentLoaded', initEmbed); +} else { + initCounter(); +} + +function initCounter() { + const nodes = document.getElementsByClassName(COUNTER_NODE_CLASSNAME); + + if (!nodes) { + console.error('Remark42: Can\'t find counter nodes.'); + return; + } + + try { + remark_config = remark_config || {} + } catch (e) { + console.error('Remark42: Config object is undefined.'); + return; + } + + if (!remark_config.site_id) { + console.error('Remark42: Site ID is undefined.'); + return; + } + + [].slice.call(nodes).forEach(node => { + const url = node.dataset.url || remark_config.url || window.location.href; + api.count({ url, siteId: remark_config.site_id }) + .then(({ count }) => { node.innerHTML = count; }); + }); +} + diff --git a/web/app/embed.js b/web/app/embed.js index 1fb86ebc..c772deee 100644 --- a/web/app/embed.js +++ b/web/app/embed.js @@ -1,4 +1,4 @@ -import { NODE_ID } from 'common/constants'; +import { BASE_URL, NODE_ID } from 'common/constants'; if (document.readyState !== 'interactive') { document.addEventListener('DOMContentLoaded', initEmbed); @@ -34,7 +34,7 @@ function initEmbed() { node.innerHTML = `