chinese version of "about me"

Signed-off-by: zhaohuabing <zhaohuabing@gmail.com>

3 files changed, 74 insertions, 3 deletions

diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index a77f778..f061726 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -294,7 +294,6 @@
     })();
 </script>
 
-
 <!-- Baidu Tongji -->
 <script>
     // dynamic User by Hux
@@ -377,3 +376,57 @@
     });
 </script>
 {{ end }}
+
+{{ if eq (.Param "multilingual") true }}
+<script type="text/javascript">
+    // get nodes
+    var $zh = document.querySelector(".zh");
+    var $en = document.querySelector(".en");
+    var $select = document.querySelector("select");
+
+    // Changes at v1.8.1: include lang flag as a url query. This interop well with catalog hash anchors.
+    function getLang() { return new URLSearchParams(document.location.search).get("lang") }
+
+    function setLang(newLang) {
+        var params = new URLSearchParams(document.location.search)
+        params.set("lang", newLang)
+        document.location.search = params.toString()  // refresh.
+    }
+
+    // handle render
+    function _render() {
+        var lang = getLang()
+        // en
+        if (lang == "en") {
+            $select.selectedIndex = 1;
+            $en.style.display = "block";
+            $en.classList.add("active");
+            $zh.style.display = "none";
+            $zh.classList.remove("active");
+            // default to zh-cn
+        } else {
+            $select.selectedIndex = 0;
+            $zh.style.display = "block";
+            $zh.classList.add("active");
+            $en.style.display = "none";
+            $en.classList.remove("active");
+        }
+        // interop with catalog 
+        generateCatalog(".catalog-body");
+    }
+
+    // handle select change
+    function onLanChange(index) {
+        if (index == 0) {
+            lang = "zh"
+        } else {
+            lang = "en"
+        }
+        setLang(lang)
+    }
+
+    // init
+    _render();
+</script>
+{{ end }}
+
diff --git a/layouts/partials/multilingual-sel.html b/layouts/partials/multilingual-sel.html
new file mode 100644
index 0000000..34dcedd
--- /dev/null
+++ b/layouts/partials/multilingual-sel.html
@@ -0,0 +1,5 @@
+ <!-- Language Selector -->
+ <select class="sel-lang" onchange= "onLanChange(this.options[this.options.selectedIndex].value)">
+    <option value="0" selected> 中文 | Chinese </option>
+    <option value="1"> 英文 | English </option>
+</select>
\ No newline at end of file
diff --git a/layouts/top/single.html b/layouts/top/single.html
index 7034463..79ac538 100644
--- a/layouts/top/single.html
+++ b/layouts/top/single.html
@@ -4,7 +4,6 @@
 <article>
     <div class="container">
         <div class="row">
-
             <!-- Post Container -->
             <div class="
             col-lg-8 col-lg-offset-1
@@ -12,8 +11,22 @@
             col-sm-12
             col-xs-12
             post-container">
+            {{ if eq (.Param "multilingual") true }}
+                {{ partial "multilingual-sel.html" . }}
 
-         	{{ .Content }}
+                <!-- Chinese Version -->
+                <div class="zh post-container">
+                    {{$file :=  "/top/about-zh.md"}}
+                    {{ $file | readFile | markdownify}}
+                </div>
+            
+                <!-- English Version -->
+                <div class="en post-container">
+                    {{ .Content }}
+                </div>
+            {{ else }}
+                {{ .Content }}
+            {{ end }}
              <!-- 
             {{ partial "comments.html" . }}
             -->