diff --git a/web/app/app.js b/web/app/app.js
deleted file mode 100644
index 89a8e9b0..00000000
--- a/web/app/app.js
+++ /dev/null
@@ -1,25 +0,0 @@
-import 'babel-polyfill'; // TODO: remove it
-
-import 'common/polyfills'; // TODO: check it
-
-import { h, render } from 'preact';
-import Root from './components/root';
-
-import { id } from './common/settings';
-
-if (document.readyState !== 'complete') {
- window.addEventListener('DOMContentLoaded', initApp);
-} else {
- initApp();
-}
-
-function initApp() {
- const node = document.getElementById(id);
-
- if (!node) {
- console.error('Remark42: Can\'t find root node.');
- return;
- }
-
- render(, node.parentElement, node);
-}
diff --git a/web/app/embed.js b/web/app/embed.js
new file mode 100644
index 00000000..e87ded8b
--- /dev/null
+++ b/web/app/embed.js
@@ -0,0 +1,42 @@
+if (document.readyState !== 'interactive') {
+ document.addEventListener('DOMContentLoaded', initEmbed);
+} else {
+ initEmbed();
+}
+
+function initEmbed() {
+ remark_config = remark_config || {}
+
+ const siteId = remark_config.site_id || 'remark42';
+ const node = document.getElementById(siteId);
+
+ if (!node) {
+ console.error('Remark42: Can\'t find root node.');
+ return;
+ }
+
+ node.innerHTML = `
+
+ `;
+
+ const iframe = node.getElementsByTagName('iframe')[0];
+ let lastHeight = 0;
+ setInterval(() => {
+ if (iframe.contentWindow.html.innerHeight !== lastHeight) {
+ lastHeight = iframe.contentWindow.html.innerHeight;
+ iframe.style.height = `${lastHeight}px`;
+ }
+ }, 200);
+}
+
diff --git a/web/app/remark.js b/web/app/remark.js
new file mode 100644
index 00000000..a83c8d04
--- /dev/null
+++ b/web/app/remark.js
@@ -0,0 +1,16 @@
+import 'babel-polyfill'; // TODO: remove it
+import 'common/polyfills'; // TODO: check it
+
+import { h, render } from 'preact';
+import Root from './components/root';
+
+import { id } from './common/settings';
+
+const node = document.getElementById(id);
+
+if (!node) {
+ console.error('Remark42: Can\'t find root node.');
+ return;
+}
+
+render(, node.parentElement, node);
diff --git a/web/test-embed.html b/web/test-embed.html
new file mode 100644
index 00000000..05ff9e9c
--- /dev/null
+++ b/web/test-embed.html
@@ -0,0 +1,27 @@
+
+
+
+
+
+ Test page
+
+
+
+
+
+
+
diff --git a/web/webpack.config.js b/web/webpack.config.js
index d1c0b6f8..7b99c727 100644
--- a/web/webpack.config.js
+++ b/web/webpack.config.js
@@ -39,11 +39,12 @@ const commonStyleLoaders = [
module.exports = {
context: __dirname,
entry: {
- app: './app/app',
+ remark: './app/remark',
+ embed: './app/embed',
},
output: {
path: publicFolder,
- filename: `remark${hash}.js`
+ filename: `[name]${hash}.js`
},
resolve: {
extensions: ['.jsx', '.js'],
@@ -105,7 +106,7 @@ module.exports = {
}),
new webpack.optimize.ModuleConcatenationPlugin(),
...(env === 'production' ? [new webpack.optimize.UglifyJsPlugin()] : []),
- ...(env === 'production' ? [new Copy(['./iframe.html'])] : []),
+ ...(env === 'production' ? [new Copy(['./iframe.html', './test-embed.html'])] : []),
],
watch: env === 'dev',
watchOptions: {