FilesExpand file tree

 main

/

dev-toc.js

Copy path

Blame

More file actions

Blame

More file actions

Latest commit

 

History

History

History

39 lines (32 loc) · 1.25 KB

 main

/

dev-toc.js

Copy path

Top

File metadata and controls

• Code
• Blame

39 lines (32 loc) · 1.25 KB

Raw

Copy raw file

Download raw file

Open symbols panel

Edit and raw actions

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

const expandText = 'Expand All'

const closeText = 'Close All'

export default function devToc () {

const expandButton = document.querySelector('.js-expand')

if (!expandButton) return

const detailsElements = document.querySelectorAll('details')

expandButton.addEventListener('click', () => {

// on click, toggle all the details elements open or closed

const anyDetailsOpen = Array.from(detailsElements).find(details => details.open)

for (const detailsElement of detailsElements) {

anyDetailsOpen

? detailsElement.removeAttribute('open')

: detailsElement.open = true

}

// toggle the button text on click

anyDetailsOpen

? expandButton.textContent = expandText

: expandButton.textContent = closeText

})

// also toggle the button text on clicking any of the details elements

for (const detailsElement of detailsElements) {

detailsElement.addEventListener('click', () => {

expandButton.textContent = closeText

// we can only get an accurate count of the open details elements if we wait a fraction after click

setTimeout(() => {

if (!Array.from(detailsElements).find(details => details.open)) {

expandButton.textContent = expandText

}

}, 50)

})

}

}