⚡ 🔥 Refactor struct & code for loading 3rd scripts.

assets/css/_common/components/third-party/search.scss

@@ -24,11 +24,13 @@
   .search-popup {
     background: var(--card-bg-color);
     border-radius: 5px;
-    height: 80%;
+    height: 60%;
     margin: auto;
     transform: scale(0);
     transition: transform .4s;
     width: 700px;
+    //display: flex;
+    //flex-wrap: wrap;
 
     .search-active & {
       transform: scale(1);
@@ -75,7 +77,10 @@
     }
 
     .search-result-container {
-      height: calc(100% - 55px);
+     /*  height: calc(100% - 65px);
+      @include mobile() {
+        height: calc(100% - 105px); 
+      } */
       overflow: auto;
       padding: 0px 25px;
     }
@@ -89,23 +94,28 @@
 
       .search-meta-info {
         height: 26px;
-        display: flex;
         padding: 5px 0;
         
         .search-hit-stats {
-          font-size: $font-size-smaller;
-          width: 65%;
+          font-size: $font-size-smaller;          
           padding: 2px 8px;
+          float: left;
         }
 
         .search-vendor {
-          width: 34%;
           text-align: right;
           font-size: $font-size-small;
+          @include mobile() {
+            font-size: $font-size-smaller;
+          }
           font-weight: bold;
+          float: right;
           
           img {
             width: 68px;
+            @include mobile() {
+              width: 48px;
+            }
             margin: 5px;
             vertical-align: middle;
             display: inline;

assets/js/config.js

@@ -31,6 +31,15 @@ NexT.plugins.share.register = function() {
   };
 }
 
+// Defined other plugin & add register event
+NexT.plugins.others = {}
+NexT.plugins.others.register = function() {
+  for(var o in NexT.plugins.others) { 
+    if (o === 'register') continue;
+    eval('NexT.plugins.others.'+o)();
+  };
+}
+
 // Add event to register all third party plugins
 NexT.plugins.register = function() {
   for(var p in NexT.plugins) {

assets/js/third-party/others/lawidget.js

@@ -0,0 +1,16 @@
+/* 51La sidebar data widget */
+NexT.plugins.others.lawidget = function() {
+  const element = '#siteinfo-card-widget';
+  const lawt_js = NexT.CONFIG.lawidget.js.replace('laId', NexT.CONFIG.lawidget.id);
+  
+  NexT.utils.lazyLoadComponent(element, function () {    
+    NexT.utils.getScript(lawt_js,{
+      attributes: {
+        id: 'LA-DATA-WIDGET',
+        crossorigin: 'anonymous',
+        charset: 'UTF-8',
+        defer: true
+      }
+    });
+  });
+}

assets/js/third-party/others/math.js

@@ -0,0 +1,38 @@
+/* Math render plugin */
+NexT.plugins.others.math = function() {
+  const render = NexT.CONFIG.page.math.render;
+  
+  if (render === 'mathjax') {
+    const render_js = NexT.utils.getCDNResource(NexT.CONFIG.page.math.js);
+    NexT.utils.getScript(render_js, function(){
+      window.MathJax = {
+        tex: {
+          inlineMath: [["$", "$"]],
+        }
+      };
+    });
+  }
+
+  if (render === 'katex') {
+    const render_css = NexT.utils.getCDNResource(NexT.CONFIG.page.math.css);
+    NexT.utils.getStyle(render_css);
+    const render_js_list = NexT.CONFIG.page.math.js;    
+    render_js_list.forEach(js => {
+      const js_loader = NexT.utils.getScript(NexT.utils.getCDNResource(js));
+      if(js.name === 'auto-render') {
+        js_loader.then(function(){
+          renderMathInElement(document.body, {
+            delimiters: [
+                {left: '$$', right: '$$', display: true},
+                {left: '$', right: '$', display: false},
+                {left: '\\(', right: '\\)', display: false},
+                {left: '\\[', right: '\\]', display: true}
+            ],
+            
+            throwOnError : false
+          })
+        });
+      }
+    });
+  }
+}

assets/js/third-party/others/mermaid.js

@@ -0,0 +1,15 @@
+/* Mermaid plugin */
+NexT.plugins.others.mermaid = function() {
+  const mermaid_js = NexT.utils.getCDNResource(NexT.CONFIG.page.mermaid.js);
+
+  NexT.utils.getScript(mermaid_js, function(){
+    mermaid.initialize({
+      sequence: { 
+        showSequenceNumbers: true,
+        actorMargin: 50, 
+        diagramMarginX:10, 
+        diagramMarginY:10
+      }
+    });
+  });
+}

assets/js/third-party/others/translate.js

@@ -0,0 +1,9 @@
+/* Google translate plugin */
+NexT.plugins.others.translate = function() {
+  const element = '#gtranslate';
+  if (!NexT.utils.checkDOMExist(element)) return;
+  NexT.utils.lazyLoadComponent(element, function() { 
+    window.translateelement_styles='/css/google-translate.min.css'; 
+    NexT.utils.getScript('/js/third-party/google-translate.min.js');
+  });
+}

assets/js/utils.js

@@ -179,9 +179,10 @@ NexT.utils = {
 
   getCDNResource: function (res) {
     let { plugins, router } = NexT.CONFIG.vendor;
-    let { name, version, file, alias } = res;
+    let { name, version, file, alias, alias_name } = res;
 
     let npm_name = name;
+    if (alias_name) npm_name = alias_name;
     let res_src = '';
     switch (plugins) {
       case 'cdnjs':
@@ -522,7 +523,6 @@ NexT.utils = {
     link.setAttribute('href', src);
 
     const head = (parent || document.head);
-    console.log(head)
     if (position === 'before') {
       head.prepend(link);
     } else {