Coder Social home page Coder Social logo

toc-bar-userscript's Introduction

Toc Bar

A user script that adds floating widget displaying table of content of current page.

Currently only tailored for some personal most-visited sites. Feel free to tweak the settings or open a PR.

✨Features

  • Use tocbot for toc generation.
  • For some sites, there are no ids on header elements so it would be impossible to navigate by clicking the toc link. Toc Bar will generate ids - which are derived from a simple hash of the header textContent, and prefixed with tocbar- - for these headers.
  • A toggle button is offered, if you don't want toc bar to cover current page content.
  • For some sites in SPA mode, if you navigate to another article, there is no easy way detecting url change in userscript, so I add a refresh button to refresh TOC contents.

Screenshots

devto

zhuanlan-sspai

Acknowledgements

Inspired by github-toc by Mottie.

The logo uses Mexellent font made by Raymond Larabie.

CHANGELOG

v1.9.2 (2022-03-11)

  • add support for 'gitlab.com' and 'juejin.cn/book'

v1.9.0 (2021-12-24)

  • feat: don't generate 'toc**' header id for github.com (bb37969)

v1.8.1 (2021-11-02)

  • feat: add support to indepth.dev (e502408)
  • feat: hide toc-bar in print mode, close #7 (7b3b149), closes #7

v1.8.0 (2021-09-28)

  • feat: Add light/dark mode toggle, #6 (cd0e0b8), closes #6

v1.7.0 (2021-02-04)

  • feat: optimize for github issues, related #2 (27ce1b0), closes #2
  • feat: optimize right edge distance while dragging (ca20775)

v1.6.0 (2021-02-1)

  • feat: adjust detection on github issues and wiki, close #2 (6d6c26b), closes #2

v1.5.1 (2021-01-15)

v1.5.0 (2020-10-12)

  • feat: keep header content hash records to prevent id conflict, close #1

v1.4.3 (2020-07-22)

  • feat: tocbar style top should not be less than 0 (8ffc3c1)

v1.4.2 (2020-07-13)

  • fix: Toc trigger shrinks outside page when toggling off (4722d05)
  • feat: Add match *://www.zhihu.com/pub/reader/*, and fix a little style (36269a5)

v1.4.1 (2020-07-10)

  • fix: isEmpty dysfunctioning (8374ceb)

v1.4.0 (2020-07-08)

  • feat: Add match *://learning.oreilly.com/library/view/* (c6648ce)
  • feat: Add site ://developer.chrome.com/extensions/ (27eb121)
  • optimize: should ignore empty cachedPosition (61b0eab)
  • Add @icon for displaying logo (c33e258)

v1.3.0 (2020-07-05)

Features

  • store tocbar position and toggle status using GM_setValue, read them during init
  • add initialTop to site setting

v1.2.0 (2020-07-05)

Features

  • Add logo, and adjust some styles (ba90dac)

v1.1.0 (2020-07-04)

Features

  • Add header hash functionality (970dd0a)
  • guess theme color from document.head meta (4db05b5)
  • remove tocbot style resource, add a modified version to tocbar style (5ebdde0)

toc-bar-userscript's People

Contributors

hikerpig avatar davuses avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.