course: tables, tags and refs
This commit is contained in:
@ -1,70 +1,188 @@
|
||||
class CTX {
|
||||
addPageNumbers() {
|
||||
let pages = this.pages
|
||||
for (let i = 2; i <= pages.length; i++) {
|
||||
let div = document.createElement('div')
|
||||
div.classList.add('page-number')
|
||||
div.textContent = i
|
||||
pages[i - 1].appendChild(div)
|
||||
}
|
||||
}
|
||||
function addPageNumbers() {
|
||||
let pages = document.getElementsByTagName('section')
|
||||
|
||||
addTableOfContents() {
|
||||
let hs = document.querySelectorAll('h1,h2,h3')
|
||||
let ol = document.createElement('ol')
|
||||
ol.classList.add('table-of-contents')
|
||||
|
||||
let prefix_counter = [0, 0, 0]
|
||||
let page_counter = 2
|
||||
let page
|
||||
|
||||
for (let h of hs) {
|
||||
let level = {
|
||||
'H1': 0,
|
||||
'H2': 1,
|
||||
'H3': 2,
|
||||
}[h.tagName]
|
||||
|
||||
prefix_counter[level]++
|
||||
for (let i = level + 1; i < prefix_counter.length; i++)
|
||||
prefix_counter[i] = 0
|
||||
|
||||
let prefix = ''
|
||||
for (let i = 0; i <= level; i++)
|
||||
prefix += prefix_counter[i] + '.'
|
||||
|
||||
prefix = prefix.slice(0, prefix.length - 1)
|
||||
console.log(h.tagName)
|
||||
|
||||
let li = document.createElement('li')
|
||||
let name = document.createElement('span')
|
||||
let page_number = document.createElement('span')
|
||||
|
||||
name.innerHTML = prefix + ' - ' + h.innerHTML
|
||||
|
||||
let cur_page = h.closest('section')
|
||||
if (page != cur_page) {
|
||||
page = cur_page
|
||||
page_counter++
|
||||
}
|
||||
page_number.innerHTML = page_counter
|
||||
|
||||
li.append(name, page_number)
|
||||
ol.appendChild(li)
|
||||
}
|
||||
|
||||
let header = document.createElement('header')
|
||||
header.innerText = 'Содержание'
|
||||
this.pages[0].after(document.createElement('section'))
|
||||
this.pages[1].appendChild(header)
|
||||
this.pages[1].appendChild(ol)
|
||||
}
|
||||
|
||||
get pages() {
|
||||
return document.getElementsByTagName('section')
|
||||
for (let i = 2; i <= pages.length; i++) {
|
||||
let div = document.createElement('div')
|
||||
div.classList.add('page-number')
|
||||
div.textContent = i
|
||||
pages[i - 1].appendChild(div)
|
||||
}
|
||||
}
|
||||
|
||||
let ctx = new CTX
|
||||
ctx.addTableOfContents()
|
||||
ctx.addPageNumbers()
|
||||
function addTableOfContents() {
|
||||
let pages = document.getElementsByTagName('section')
|
||||
let hs = document.querySelectorAll('h1,h2,h3')
|
||||
let ol = document.createElement('ol')
|
||||
ol.classList.add('table-of-contents')
|
||||
|
||||
let prefix_counter = [0, 0, 0]
|
||||
let page_counter = 2
|
||||
let page
|
||||
|
||||
for (const h of hs) {
|
||||
let level = {
|
||||
'H1': 0,
|
||||
'H2': 1,
|
||||
'H3': 2,
|
||||
}[h.tagName]
|
||||
|
||||
prefix_counter[level]++
|
||||
for (let i = level + 1; i < prefix_counter.length; i++)
|
||||
prefix_counter[i] = 0
|
||||
|
||||
let prefix = ''
|
||||
for (let i = 0; i <= level; i++)
|
||||
prefix += prefix_counter[i] + '.'
|
||||
|
||||
prefix = prefix.slice(0, prefix.length - 1)
|
||||
|
||||
let li = document.createElement('li')
|
||||
let name = document.createElement('span')
|
||||
let page_number = document.createElement('span')
|
||||
|
||||
name.innerHTML = prefix + ' - ' + h.innerHTML
|
||||
h.innerHTML = name.innerHTML
|
||||
|
||||
let cur_page = h.closest('section')
|
||||
if (page != cur_page) {
|
||||
page = cur_page
|
||||
page_counter++
|
||||
}
|
||||
page_number.innerHTML = page_counter
|
||||
|
||||
li.append(name, page_number)
|
||||
ol.appendChild(li)
|
||||
}
|
||||
|
||||
let header = document.createElement('header')
|
||||
header.innerText = 'Содержание'
|
||||
let section = document.createElement('section')
|
||||
section.classList.add('col')
|
||||
pages[0].after(section)
|
||||
pages[1].appendChild(header)
|
||||
pages[1].appendChild(ol)
|
||||
}
|
||||
|
||||
function addCaptions() {
|
||||
const objs = document.querySelectorAll('img, table')
|
||||
const obj_counter = {
|
||||
'IMG': 1,
|
||||
'TABLE': 1,
|
||||
}
|
||||
|
||||
const counter_by_tag = {}
|
||||
|
||||
for (const obj of objs) {
|
||||
const cap = document.createElement('caption')
|
||||
|
||||
const prefix = {
|
||||
'IMG': 'Рисунок ',
|
||||
'TABLE': 'Таблица ',
|
||||
}[obj.tagName] + obj_counter[obj.tagName]
|
||||
|
||||
cap.innerHTML = prefix + ' - ' + {
|
||||
'IMG': obj.alt,
|
||||
'TABLE': obj.dataset.alt,
|
||||
}[obj.tagName]
|
||||
|
||||
if (obj.dataset.tag) {
|
||||
counter_by_tag[obj.dataset.tag] = obj_counter[obj.tagName]
|
||||
}
|
||||
|
||||
let div = document.createElement('div')
|
||||
div.classList.add(...({
|
||||
'IMG': ['col'],
|
||||
'TABLE': ['colr', 'y-start'],
|
||||
})[obj.tagName])
|
||||
div.style.cssText = obj.style.cssText
|
||||
obj.style.cssText = 'width: 100%'
|
||||
|
||||
let prev = obj.previousSibling
|
||||
obj.remove()
|
||||
div.append(obj, cap)
|
||||
prev.after(div)
|
||||
obj_counter[obj.tagName]++
|
||||
}
|
||||
|
||||
const refs = document.querySelectorAll('span[data-ref]')
|
||||
console.log(refs)
|
||||
|
||||
for (const ref of refs) {
|
||||
ref.innerHTML = counter_by_tag[ref.dataset.ref] ?? 'без номера'
|
||||
}
|
||||
}
|
||||
|
||||
function genTables() {
|
||||
let tables = document.getElementsByTagName('table')
|
||||
|
||||
for (const table of tables) {
|
||||
if (!table.dataset.gen)
|
||||
continue
|
||||
|
||||
let row = document.createElement('tr')
|
||||
let dot = document.createElement('td')
|
||||
let value = ''
|
||||
|
||||
const gen = table.dataset.gen
|
||||
for (let i = 0; i < gen.length;) {
|
||||
const char = gen[i]
|
||||
switch (char) {
|
||||
case ',':
|
||||
dot.innerHTML = value
|
||||
value = ''
|
||||
row.appendChild(dot)
|
||||
dot = document.createElement('td')
|
||||
i++
|
||||
break
|
||||
|
||||
case ';':
|
||||
dot.innerHTML = value
|
||||
value = ''
|
||||
row.appendChild(dot)
|
||||
dot = document.createElement('td')
|
||||
table.appendChild(row)
|
||||
row = document.createElement('tr')
|
||||
i++
|
||||
break
|
||||
|
||||
case '$':
|
||||
const args_end = gen.indexOf('$', i+2)
|
||||
const args = gen.slice(i+1, args_end).split(',')
|
||||
switch (args[0]) {
|
||||
case 'C':
|
||||
dot.colSpan = +args[1]
|
||||
break
|
||||
|
||||
case 'c':
|
||||
dot.style.backgroundColor = {
|
||||
'r': 'lightcoral',
|
||||
'g': 'lightgreen',
|
||||
'b': 'lightblue',
|
||||
}[args[1]] ?? 'white'
|
||||
break
|
||||
}
|
||||
i = args_end + 1
|
||||
break
|
||||
|
||||
default:
|
||||
value += char
|
||||
i++
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function genMathML() {
|
||||
TeXZilla.setSafeMode(true)
|
||||
const maths = document.querySelectorAll('.tex')
|
||||
|
||||
for (const math of maths)
|
||||
TeXZilla.filterElement(math)
|
||||
}
|
||||
|
||||
addTableOfContents()
|
||||
addPageNumbers()
|
||||
addCaptions()
|
||||
genTables()
|
||||
genMathML()
|
||||
|
||||
Reference in New Issue
Block a user