[opt] data_services

_config.yml

@@ -369,7 +369,7 @@ dependencies:
 
 
 # 内置服务，按需加载（页面内用到了就会加载，没有用到就不会加载）
-services:
+data_services:
   # 外部 md 渲染
   mdrender:
     js: /js/services/mdrender.js

layout/_partial/main/navbar/ghinfo.ejs

@@ -5,7 +5,7 @@ function layoutDiv() {
     return ''
   }
   return `
-  <div class="right ghrepo stellar-ghinfo-api" api="${theme.api_host.ghapi}/repos/${repo}">
+  <div class="right ghrepo ds-ghinfo" api="${theme.api_host.ghapi}/repos/${repo}">
     <a class="repo-link bold" href="https://github.com/${repo}">
       ${icon('github:repo')}
       <span type="text">${repo}</span>

layout/_partial/scripts/services.ejs

@@ -1,18 +1,8 @@
-<script>
+<script defer>
-  ctx.services = {
-    fcircle: `<%- theme.services.fcircle?.js %>`,
-    friends: `<%- theme.services.friends?.js %>`,
-    ghinfo: `<%- theme.services.ghinfo?.js %>`,
-    siteinfo: `<%- theme.services.siteinfo?.js %>`,
-    mdrender: `<%- theme.services.mdrender?.js %>`,
-    memos: `<%- theme.services.memos?.js %>`,
-    sites: `<%- theme.services.sites?.js %>`,
-    timeline: `<%- theme.services.timeline?.js %>`,
-    weibo: `<%- theme.services.weibo?.js %>`,
-  }
   window.addEventListener('DOMContentLoaded', (event) => {
+    ctx.services = Object.assign({}, JSON.parse(`<%- JSON.stringify(theme.data_services) %>`));
     for (let id of Object.keys(ctx.services)) {
-      const js = ctx.services[id];
+      const js = ctx.services[id].js;
       if (id == 'siteinfo') {
         ctx.cardlinks = document.querySelectorAll('a.link-card[cardlink]');
         if (ctx.cardlinks?.length > 0) {
@@ -21,7 +11,7 @@
           });
         }
       } else {
-        const els = document.getElementsByClassName(`stellar-${id}-api`);
+        const els = document.getElementsByClassName(`ds-${id}`);
         if (els?.length > 0) {
           utils.jq(() => {
             if (id == 'timeline' || 'memos' || 'marked') {

layout/_partial/widgets/ghissues.ejs

@@ -26,7 +26,7 @@ function layoutDiv() {
       el += '</div>';
     }
     el += '<div class="widget-body fs14">';
-      el += '<div class="tag-plugin timeline stellar-timeline-api"';
+      el += '<div class="tag-plugin timeline ds-timeline"';
       ['api', 'user'].forEach(key => {
         if (item[key]) {
           el += ' ' + key + '="' + item[key] + '"';

layout/_partial/widgets/ghrepo.ejs

@@ -19,7 +19,7 @@ function layoutDiv() {
   el += `<widget class="widget-wrapper${scrollreveal(' ')} ghrepo">`
   // body
   el += '<div class="widget-body">';
-  el += '<div class="items stellar-ghinfo-api" api="' + theme.api_host.ghapi + '/repos/' + repo + '">';
+  el += '<div class="items ds-ghinfo" api="' + theme.api_host.ghapi + '/repos/' + repo + '">';
   el += '<a class="repo" href="https://github.com/' + repo + '" target="_blank" rel="external nofollow noopener noreferrer">';
     el += '<div class="repo-name flex-row">';
       el += icon('github:repo')
@@ -35,7 +35,7 @@ function layoutDiv() {
         el += icon('github:fork')
         el += '<span type="text" id="forks_count"></span>';
       el += '</div>';
-      el += '<div class="flex-row stellar-ghinfo-api" index="0" api="' + theme.api_host.ghapi + '/repos/' + repo + '/tags">';
+      el += '<div class="flex-row ds-ghinfo" index="0" api="' + theme.api_host.ghapi + '/repos/' + repo + '/tags">';
         el += icon('github:tag')
         el += '<span type="text" id="latest-tag-name">0</span>';
       el += '</div>';

layout/_partial/widgets/ghuser.ejs

@@ -24,7 +24,7 @@ function layoutDiv() {
 
   el += `<widget class="widget-wrapper${scrollreveal(' ')} user-card ghuser">`
   // body
-  el += '<div class="widget-body stellar-ghinfo-api" api="' + theme.api_host.ghapi + '/users/' + item.username + '">';
+  el += '<div class="widget-body ds-ghinfo" api="' + theme.api_host.ghapi + '/users/' + item.username + '">';
     if (item.avatar) {
       el += '<div class="avatar" ><img no-lazy type="img" id="avatar_url" src="' + config.avatar + '"></div>';
     }

layout/_partial/widgets/markdown.ejs

@@ -13,7 +13,7 @@ function layoutDiv() {
     el += markdown(item.content);
   }
   if (item.src) {
-    el += `<div class="stellar-marked-api md-marked" src="${item.src}"></div>`
+    el += `<div class="ds-mdrender" src="${item.src}"></div>`
   }
   if (item.linklist) {
     el += partial('components/linklist', {item: item.linklist})

layout/_partial/widgets/timeline.ejs

@@ -11,7 +11,7 @@ function layoutDiv() {
       el += '</div>';
     }
     el += '<div class="widget-body fs14">';
-      el += '<div class="tag-plugin timeline stellar-' + (item.type || "timeline") + '-api"';
+      el += `<div class="tag-plugin timeline ds-${(item.type || 'timeline')}"`;
       ['api', 'user', 'hide', 'limit'].forEach(key => {
         if (item[key]) {
           el += ' ' + key + '="' + item[key] + '"';

layout/_plugins/fancybox.ejs

@@ -10,7 +10,7 @@
   }
   var needFancybox = document.querySelectorAll(selector).length !== 0;
   if (!needFancybox) {
-    const els = document.getElementsByClassName('stellar-memos-api');
+    const els = document.getElementsByClassName('ds-memos');
     if (els != undefined && els.length > 0) {
       needFancybox = true;
     }

scripts/tags/lib/albums.js

@@ -22,7 +22,7 @@ module.exports = ctx => function(args) {
   var el = ''
   el += `<div class="tag-plugin albums-wrap">`
   if (api) {
-    el += `<div class="stellar-friends-api" api="${api}"><div class="tag-plugin gallery grid-box" layout="grid" ratio="square" ${ctx.args.joinTags(args, ['size']).join(' ')}></div></div>`
+    el += `<div class="ds-friends" api="${api}"><div class="tag-plugin gallery grid-box" layout="grid" ratio="square" ${ctx.args.joinTags(args, ['size']).join(' ')}></div></div>`
   } else if (args.group) {
     const links = ctx.theme.config.links || {}
     el += `<div class="tag-plugin gallery grid-box" layout="grid" ratio="square" ${ctx.args.joinTags(args, ['size']).join(' ')}>`

scripts/tags/lib/friends.js

@@ -18,7 +18,7 @@ module.exports = ctx => function(args) {
   
   var el = '<div class="tag-plugin users-wrap">'
   if (api) {
-    el += `<div class="stellar-friends-api" ${ctx.args.joinTags(args, ['size']).join(' ')} api="${api}"><div class="grid-box"></div></div>`
+    el += `<div class="ds-friends" ${ctx.args.joinTags(args, ['size']).join(' ')} api="${api}"><div class="grid-box"></div></div>`
   } else if (args.group) {
     const links = ctx.theme.config.links || {}
     el += '<div class="grid-box">'

scripts/tags/lib/link.js

@@ -14,7 +14,7 @@ module.exports = ctx => function(args) {
     return '';
   }
   const url = full_url_for(args.url)
-  args.api = ctx.theme.config.services.siteinfo?.api
+  args.api = ctx.theme.config.data_services.siteinfo?.api
   if (args.api) {
     args.api = args.api.replace('${href}', url)
   }

scripts/tags/lib/md.js

@@ -15,6 +15,6 @@ module.exports = ctx => function(args) {
   args = ctx.args.map(args, [''], ['src'])
   const md_id = "md_" + ++md_index
   return `
-  <div class="stellar-marked-api md-marked" src="${args.src}" id="${md_id}"></div>
+  <div class="ds-mdrender" src="${args.src}" id="${md_id}"></div>
   `
 }

scripts/tags/lib/posters.js

@@ -22,7 +22,7 @@ module.exports = ctx => function(args) {
   var el = ''
   el += `<div class="tag-plugin posters-wrap">`
   if (api) {
-    el += `<div class="stellar-friends-api" api="${api}"><div class="tag-plugin gallery grid-box" layout="grid" ratio="square" ${ctx.args.joinTags(args, ['size']).join(' ')}></div></div>`
+    el += `<div class="ds-friends" api="${api}"><div class="tag-plugin gallery grid-box" layout="grid" ratio="square" ${ctx.args.joinTags(args, ['size']).join(' ')}></div></div>`
   } else if (args.group) {
     const links = ctx.theme.config.links || {}
     el += `<div class="tag-plugin gallery grid-box" layout="grid" ratio="portrait" ${ctx.args.joinTags(args, ['size']).join(' ')}>`

scripts/tags/lib/sites.js

@@ -18,7 +18,7 @@ module.exports = ctx => function(args) {
   
   var el = '<div class="tag-plugin sites-wrap">'
   if (api) {
-    el += '<div class="stellar-sites-api"'
+    el += '<div class="ds-sites"'
     el += ' api="' + api + '"'
     el += '>'
     el += '<div class="grid-box"></div>'

scripts/tags/lib/timeline.js

@@ -41,7 +41,7 @@ module.exports = ctx => function(args, content = '') {
     args.type = 'timeline'
   }
   if (args.api && args.api.length > 0) {
-    el += '<div class="tag-plugin timeline stellar-' + args.type + '-api"'
+    el += `<div class="tag-plugin timeline ds-${args.type}"`
     el += ' ' + ctx.args.joinTags(args, ['api', 'user', 'limit', 'hide', 'avatar']).join(' ')
     el += '>'
   } else {

source/css/_layout/tag-plugins/timeline.styl

@@ -220,7 +220,7 @@
     margin: 0.5rem 0
     line-height: 1.2
 
-.tag-plugin.timeline.stellar-memos-api .body
+.tag-plugin.timeline.ds-memos .body
   p:first-child 
     margin-top: 2px
   p:last-child

source/js/services/fcircle.js

@@ -1,6 +1,6 @@
 utils.jq(() => {
   $(function () {
-    const els = document.getElementsByClassName('stellar-fcircle-api');
+    const els = document.getElementsByClassName('ds-fcircle');
     for (var i = 0; i < els.length; i++) {
       const el = els[i];
       const api = el.getAttribute('api');

source/js/services/friends.js

@@ -1,6 +1,6 @@
 utils.jq(() => {
   $(function () {
-    const els = document.getElementsByClassName('stellar-friends-api');
+    const els = document.getElementsByClassName('ds-friends');
     for (var i = 0; i < els.length; i++) {
       const el = els[i];
       const api = el.getAttribute('api');

source/js/services/ghinfo.js

@@ -1,6 +1,6 @@
 utils.jq(() => {
   $(function () {
-    const els = document.getElementsByClassName('stellar-ghinfo-api');
+    const els = document.getElementsByClassName('ds-ghinfo');
     for (var i = 0; i < els.length; i++) {
       const el = els[i];
       const api = el.getAttribute('api');

source/js/services/mdrender.js

@@ -1,5 +1,5 @@
 utils.jq(() => {
-  const els = document.getElementsByClassName('stellar-marked-api');
+  const els = document.getElementsByClassName('ds-mdrender');
   for (var i = 0; i < els.length; i++) {
     const el = els[i];
     const src = `${el.getAttribute('src')}?t=${new Date().getTime()}`;

source/js/services/memos.js

@@ -1,6 +1,6 @@
 utils.jq(() => {
   $(function () {
-    const els = document.getElementsByClassName('stellar-memos-api');
+    const els = document.getElementsByClassName('ds-memos');
     for (var i = 0; i < els.length; i++) {
       const el = els[i];
       const api = el.getAttribute('api');

source/js/services/sites.js

@@ -1,6 +1,6 @@
 utils.jq(() => {
   $(function () {
-    const els = document.getElementsByClassName('stellar-sites-api');
+    const els = document.getElementsByClassName('ds-sites');
     for (var i = 0; i < els.length; i++) {
       const el = els[i];
       const api = el.getAttribute('api');

source/js/services/timeline.js

@@ -10,7 +10,7 @@ utils.jq(() => {
       'rocket': '🚀', 
       'eyes': '👀'
     }
-    const timelines = document.getElementsByClassName('stellar-timeline-api');
+    const timelines = document.getElementsByClassName('ds-timeline');
     for (var i = 0; i < timelines.length; i++) {
       const el = timelines[i];
       const api = el.getAttribute('api');

source/js/services/weibo.js

@@ -1,6 +1,6 @@
 utils.jq(() => {
   $(function () {
-    const els = document.getElementsByClassName('stellar-weibo-api');
+    const els = document.getElementsByClassName('ds-weibo');
     for (var i = 0; i < els.length; i++) {
       const el = els[i];
       const api = el.getAttribute('api');