status-im
/
codimd
mirror of https://github.com/status-im/codimd.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Support empty fretboard title 

Signed-off-by: Yukai Huang <yukaihuangtw@gmail.com>
This commit is contained in:
Yukai Huang 2020-08-12 17:19:20 +08:00
parent 374bda0489
commit 94aa54b495
No known key found for this signature in database
GPG Key ID: A76CBD50B22052C0
1 changed files with 23 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
public/js/lib/renderer/fretboard/fretboard.js
View File

@ -32,26 +32,33 @@ const switchListH = {
'\n': `<div class='cell empty'>${dotEmptyH}</div><div class='cell empty'>${dotEmptyH}</div>` '\n': `<div class='cell empty'>${dotEmptyH}</div><div class='cell empty'>${dotEmptyH}</div>`
} }
export const renderFretBoard = (content, { title: fretTitle, type }) => { export const renderFretBoard = (content, { title: fretTitle = '', type = '' }) => {
const fretType = type.split(' ') const isVertical = !(typeof type[0] === 'string' && type[0].startsWith('h'))
const containerClass = fretType && fretType[0].startsWith('h') ? 'fretContainer_h' : 'fretContainer'
const containerClass = isVertical ? 'fretContainer' : 'fretContainer_h'
const [fretType, nutOption] = type.split(' ')
const fretboardHTML = $(`<div class="${containerClass}"></div>`) const fretboardHTML = $(`<div class="${containerClass}"></div>`)
$(fretboardHTML).append($(`<div class="fretTitle">${fretTitle}</div>`)) if (fretTitle) {
$(fretboardHTML).append(`<div class="fretTitle">${fretTitle}</div>`)
}
// create fretboard background HTML // create fretboard background HTML
const fretbOrientation = fretType && fretType[0].startsWith('v') ? 'vert' : 'horiz' const fretbOrientation = isVertical ? 'vert' : 'horiz'
const fretbLen = fretType && fretType[0].substring(1) const fretbLen = fretType && fretType.substring(1)
const fretbClass = fretType && fretType[0][0] + ' ' + fretType[0] const fretbClass = fretType && fretType[0] + ' ' + fretType
const nut = (fretType[1] && fretType[1] === 'noNut') ? 'noNut' : '' const nut = nutOption === 'noNut' ? 'noNut' : ''
const svgHTML = $(`<div class="svg_wrapper ${fretbClass} ${nut}"></div>`) const svgHTML = $(`<div class="svg_wrapper ${fretbClass} ${nut}"></div>`)
const fretbBg = require(`./svg/fretb_${fretbOrientation}_${fretbLen}.svg`) const fretbBg = require(`./svg/fretb_${fretbOrientation}_${fretbLen}.svg`)
$(svgHTML).append($(fretbBg)) $(svgHTML).append($(fretbBg))
// create cells HTML // create cells HTML
const cellsHTML = $('<div class="cells"></div>') const cellsHTML = $('<div class="cells"></div>')
let switchList = '' let switchList = {}
if (fretbOrientation && fretbOrientation === 'vert') { if (isVertical) {
switchList = switchListV switchList = switchListV
} else { } else {
// calculate position // calculate position
@ -66,16 +73,16 @@ export const renderFretBoard = (content, { title: fretTitle, type }) => {
const numArray = [...Array(10).keys()].slice(1) const numArray = [...Array(10).keys()].slice(1)
contentCell && contentCell.forEach(char => { contentCell && contentCell.forEach(char => {
if (numArray.toString().indexOf(char) !== -1) { if (numArray.toString().indexOf(char) !== -1) {
const numType = fretType && fretType[0].startsWith('h') ? '_h' : '' const numType = isVertical ? '' : '_h'
const numSvg = require(`./svg/number${char}${numType}.svg`) const numSvg = require(`./svg/number${char}${numType}.svg`)
cellsHTML.append($(`<div class='cell empty'>${numSvg}</div>`)) cellsHTML.append(`<div class='cell empty'>${numSvg}</div>`)
} else if (switchList[char] !== undefined) { } else if (typeof switchList[char] !== 'undefined') {
cellsHTML.append($(switchList[char])) cellsHTML.append(switchList[char])
} }
}) })
$(svgHTML).append($(cellsHTML)) $(svgHTML).append(cellsHTML)
$(fretboardHTML).append($(svgHTML)) $(fretboardHTML).append(svgHTML)
return fretboardHTML[0].outerHTML return fretboardHTML[0].outerHTML
} }