☰

Generate markdown files' table of contents or anchor links menu automatically

Generate markdown files' table of contents or anchor links menu automatically, make markdown files easy to read

  1. // ==UserScript==
  2. // @name         Generate markdown files' table of contents or anchor links menu automatically
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.5
  5. // @description  Generate markdown files' table of contents or anchor links menu automatically, make markdown files easy to read
  6. // @author       ladyrank
  7. // @include      https://github.com/*
  8. // @include      https://*.muc*.cn/*
  9. // @include      https://*.zuim*.com/*
  10. // @grant        none
  11. // @require      https://cdn.staticfile.org/jquery/3.4.1/jquery.min.js
  12. // ==/UserScript==
  13.  
  14. (function () {
  15.     'use strict';
  16.  
  17.     var detect = function (){
  18.         var links = $('a.anchor');
  19.         var html = '';
  20.         var $wrap = '';
  21.         var winH = window.screen.availHeight || window.screen.height;
  22.     
  23.         if (!links || !links.length) {
  24.             return false;
  25.         }
  26.     
  27.         html = '<div id="wx-mkd-toc" style="z-index: 9999; position: fixed; bottom: 50px; right: 20px; background: #f2f2f2; padding: 10px; border: 1px solid #f2f2f2;"><h1 style="margin: 0; font-size: 16px;"><a href="javascript:;"><span>+</span>目录预览</a></h1><div class="wx-mkd-con" style="display: none; overflow: hidden; overflow-y: scroll; padding: 20px; max-height: '+ (winH*.5)+'px;"><ul style="margin: 0; padding: 0;">';
  28.         $wrap = $('body');
  29.     
  30.         $.each(links, function (idx, item) {
  31.             var $this = $(item);
  32.             var $p = $this.parent();
  33.             var tag = (($p[0] && $p[0].tagName) || '').toLowerCase();
  34.             var tagNum = (tag || '').replace(/h/gi, '');
  35.             var mLeft = tagNum * 10;
  36.     
  37.             html += '<li style="margin-left: ' + mLeft + 'px;" class="c_toc_' + tag + '"><a href="' + $this.attr('href') + '">' + $p.text() + '</a></li>'
  38.         });
  39.     
  40.         html += '</ul></div></div>';
  41.     
  42.         $wrap.prepend(html);
  43.  
  44.         $wrap.on('click', '#wx-mkd-toc h1', function(){
  45.             var $this = $(this);
  46.             var $thisSpan = $this.find('span');
  47.             var thisSpanTxt = $thisSpan.text();
  48.             var $thisCon = $this.parent().find('.wx-mkd-con');
  49.     
  50.             if(thisSpanTxt.match(/\+/gi)){
  51.                 $thisCon.show();
  52.                 $thisSpan.text('-');
  53.             } else {
  54.                 $thisCon.hide();
  55.                 $thisSpan.text('+');
  56.             }
  57.         });
  58.     };
  59.  
  60.     setTimeout(function(){
  61.         detect();
  62.     }, 2000);
  63.  
  64. })();