| | |
| | | const panelBox = 'panel_box'; |
| | | const fullHeight = 'initial'; |
| | | const highlightWrap = 'highlight_wrap' |
| | | const highlight = 'highlight'; |
| | | |
| | | function wrapOrphanedPreElements() { |
| | | const pres = elems('pre'); |
| | | Array.from(pres).forEach(function(pre){ |
| | | const parent = pre.parentNode; |
| | | const isOrpaned = !containsClass(parent, 'highlight'); |
| | | const isOrpaned = !containsClass(parent, highlight) ; |
| | | if(isOrpaned) { |
| | | const preWrapper = createEl(); |
| | | preWrapper.className = 'highlight'; |
| | | preWrapper.className = highlight; |
| | | const outerWrapper = createEl(); |
| | | outerWrapper.className = highlightWrap; |
| | | wrapEl(pre, preWrapper); |
| | |
| | | function codeBlocks() { |
| | | const markedCodeBlocks = elems('code'); |
| | | const blocks = Array.from(markedCodeBlocks).filter(function(block){ |
| | | return hasClasses(block) && !Array.from(block.classList).includes('noClass'); |
| | | return block.closest("pre") && !Array.from(block.classList).includes('noClass'); |
| | | }).map(function(block){ |
| | | return block |
| | | }); |
| | |
| | | function codeBlockFits(block) { |
| | | // return false if codeblock overflows |
| | | const blockWidth = block.offsetWidth; |
| | | const highlightBlockWidth = block.parentNode.parentNode.offsetWidth; |
| | | const highlightBlockWidth = block.closest(`.${highlight}`).offsetWidth; |
| | | return blockWidth <= highlightBlockWidth ? true : false; |
| | | } |
| | | |
| | |
| | | function collapseCodeBlock(block) { |
| | | const lines = elems('.ln', block); |
| | | const codeLines = lines.length; |
| | | if(!lines) { |
| | | // hide lines toggle button for blocks that have no lines. |
| | | setTimeout(() => { |
| | | let panelLinesParentEl = block.closest(`.${highlightWrap}`); |
| | | let panelLinesEl = elem(`.${linesId}`, panelLinesParentEl); |
| | | pushClass(panelLinesEl, panelHide); |
| | | }, 2000) |
| | | } |
| | | if (codeLines > maxLines) { |
| | | const expandDot = createEl() |
| | | pushClass(expandDot, panelExpand); |
| | |
| | | // wrap code block in a div |
| | | const highlightWrapper = createEl(); |
| | | highlightWrapper.className = highlightWrapId; |
| | | |
| | | wrapEl(highlightElement, highlightWrapper); |
| | | |
| | | const panel = actionPanel(); |