Merge pull request #28 from djyde/dev

docisify doc

Author: djyde

public/doc/_sidebar.md

@@ -4,6 +4,8 @@
 - **Self-host Guide**
   - [Docker](/self-host/docker.md)
   - [Vercel](/self-host/vercel.md)
+- **Integration**
+  - [Docsify](/integration/docsify.md)
 - **Advanced**
   - [JS SDK Reference](/advanced/sdk.md)
 - [**Contributing**](/contributing.md)

public/doc/integration/docsify.md

@@ -1 +1,21 @@
-# Integrate with Docsify
+# Integrate with Docsify
+
+[Docsify](https://docsify.js.org) is a powerful document site generator, which also powers this Cusdis document. Cusdis has a built-in Docsify plugin.
+
+## Usage
+
+```html
+<script>
+  window.$docsify = {
+    cusdis: {
+      host: 'https://cusdis.com', // change the host if you are using self-hosted Cusdis
+      appId: 'xxxx',
+    },
+  }
+</script>
+<script src="//cdn.jsdelivr.net/npm/docsify@4"></script>
+<script src="https://cusdis.com/js/cusdis.docsify.js"></script> <!-- change the host if you are using self-hosted Cusdis -->
+
+```
+
+

public/js/cusdis.docsify.js

@@ -1,19 +1,19 @@
-function CusdisPlugin(hook, vm) {
-  window.cusdisTag = 'cusdis_thread'
+window.CUSDIS_PREVENT_INITIAL_RENDER = true
 
+function CusdisPlugin(hook, vm) {
   const config = vm.config.cusdis
 
-  const { appId, host } = config;
+  const { appId, host } = config
 
   const dom = Docsify.dom
 
-  hook.init(_ => {
-    const script = dom.create("script");
-    script.async = true;
+  hook.init((_) => {
+    const script = dom.create('script')
+    script.async = true
     // script.src = `http://localhost:3000/js/cusdis.es.js`;
-    script.src = `${host}/js/cusdis.es.js`;
-    script.setAttribute("data-timestamp", Number(new Date()));
-    dom.appendTo(dom.body, script);
+    script.src = `${host}/js/cusdis.es.js`
+    script.setAttribute('data-timestamp', Number(new Date()))
+    dom.appendTo(dom.body, script)
   })
 
   function createCusdis() {
@@ -29,8 +29,9 @@ function CusdisPlugin(hook, vm) {
   hook.doneEach(() => {
     const cusdis = createCusdis()
     dom.find('#main').append(cusdis)
-    window.renderCusdis(cusdis);
+    // TODO: waiting for script loaded
+    window.renderCusdis(cusdis)
   })
 }
 
-window.$docsify.plugins = (window.$docsify.plugins || []).concat(CusdisPlugin);
+window.$docsify.plugins = (window.$docsify.plugins || []).concat(CusdisPlugin)

widget/index.js

@@ -25,6 +25,10 @@ if (window.cusdisElementId) {
   target = document.querySelector("#cusdis");
 }
 
-if (target) {
-  render(target);
-}
+if (window.CUSDIS_PREVENT_INITIAL_RENDER === true) {
+
+} else {
+  if (target) {
+    render(target)
+  }
+}