diff --git a/demo/src/index.ts b/demo/src/index.ts index b4a1c32..a8cf588 100644 --- a/demo/src/index.ts +++ b/demo/src/index.ts @@ -4,7 +4,7 @@ import { Glyph, Line, Vec } from "../../src/type"; console.log( JSON.stringify( font["3"].map( - (l: Line) => l.map((v: Vec) => [0.33 + v[0] * 0.33, 0.166 + v[1] * 0.33] as Vec) as Line, + (l: Line) => l.map((v: Vec) => [0.166 + v[0] * 0.33, 0.166 + v[1] * 0.33] as Vec) as Line, ) as Glyph, ), ); @@ -20,29 +20,30 @@ const app = document.getElementById("app"), group = document.createElementNS(namespace, "g"); const update = () => { + let height = window.innerHeight const userInput = input.value !== textAtLaunch ? input.value : glyphKeys, text = userInput.split("") as string[], fontScale = parseFloat(inputSize.value), width = window.innerWidth - 40, - height = window.innerHeight, - baseSize = Math.max(16, Math.min(Math.floor(width * fontScale), 264)), + baseSize = Math.max(16, Math.min(Math.floor(Math.hypot(width, height) * fontScale), 264)), textSize = [baseSize, baseSize * 1.2], charPerLine = Math.floor(width / textSize[0]) - 2, nbLines = Math.ceil(text.length / charPerLine), margin = [ (width - charPerLine * textSize[0]) / 2, - (height - 40 - nbLines * textSize[1]) / 2, + 40, ]; group.textContent = ""; for (let y = 0; y < nbLines; y++) { const remainingChar = Math.min(charPerLine, text.length - y * charPerLine); + if ((y+1)*textSize[1] >= height-margin[1]) height += (textSize[1]+margin[1]) for (let x = 0; x < remainingChar; x++) { const char = text[y * charPerLine + x]; const lines = getGlyphPath(char, textSize, [ margin[0] + x * textSize[0], - margin[1] + y * textSize[1], + margin[1] + y * textSize[1], textSize[1] ]); const rect = document.createElementNS(namespace, "rect"); rect.setAttribute("x", `${margin[0] + x * textSize[0]}`); @@ -61,8 +62,8 @@ const update = () => { group.setAttribute("stroke-width", `${fontScale * 40}`); svg.setAttribute("width", `${width}`); - svg.setAttribute("height", `${height - 40}`); - svg.setAttribute("viewbox", `0 0 ${width} ${height - 40}`); + svg.setAttribute("height", `${height+40}`); + svg.setAttribute("viewbox", `0 0 ${width} ${height+40}`); }; const init = () => { diff --git a/src/glyphs/poncuation.ts b/src/glyphs/poncuation.ts index 773c03d..798fa99 100644 --- a/src/glyphs/poncuation.ts +++ b/src/glyphs/poncuation.ts @@ -193,6 +193,16 @@ const ponctuation = { [0.65, 0.45], ], ], + "×": [ + [ + [0.3, 0.35], + [0.6, 0.65] + ], + [ + [0.6, 0.35], + [0.3, 0.65] + ] + ], _: [ [ [0.25, 0.7], @@ -525,6 +535,30 @@ const ponctuation = { [0.5, 0.6], ], ], + º: [ + [ + [0.4125, 0.235], + [0.4125, 0.4], + [0.5775, 0.4], + [0.5775, 0.235], + [0.4125, 0.235], + ], + [ + [0.4125, 0.235], + [0.5775, 0.4], + ], + ], + "¹": [ + [ + [0.4125, 0.235], + [0.495, 0.235], + [0.5, 0.4], + ], + [ + [0.4125, 0.4], + [0.5775, 0.4], + ], + ], "²": [ [ [0.4125, 0.232], @@ -547,6 +581,78 @@ const ponctuation = { [0.5775, 0.3], ], ], + "¼": [ + [ + [0.6, 0.35], + [0.3, 0.65], + ], + [ + [0.2485, 0.235], + [0.33, 0.235], + [0.33, 0.4], + ], + [ + [0.2485, 0.397], + [0.4135, 0.397], + ], + [ + [0.5825, 0.566], + [0.5825, 0.7], + [0.764, 0.7], + ], + [ + [0.73, 0.566], + [0.73, 0.73], + ], + ], + "½": [ + [ + [0.6, 0.35], + [0.3, 0.65], + ], + [ + [0.2485, 0.235], + [0.33, 0.235], + [0.33, 0.4], + ], + [ + [0.2485, 0.397], + [0.4135, 0.397], + ], + [ + [0.5825, 0.566], + [0.75, 0.566], + [0.75, 0.632], + [0.5825, 0.632], + [0.5825, 0.73], + [0.75, 0.73], + ], + ], + "¾": [ + [ + [0.6, 0.35], + [0.3, 0.65], + ], + [ + [0.2485, 0.232], + [0.4135, 0.232], + [0.4135, 0.397], + [0.2485, 0.397], + ], + [ + [0.331, 0.3], + [0.4135, 0.3], + ], + [ + [0.5825, 0.566], + [0.5825, 0.67], + [0.77, 0.67], + ], + [ + [0.73, 0.566], + [0.73, 0.73], + ], + ], "´": [ [ [0.45, 0.3], diff --git a/src/glyphs/uppercase.ts b/src/glyphs/uppercase.ts index 0d94079..8f3df14 100644 --- a/src/glyphs/uppercase.ts +++ b/src/glyphs/uppercase.ts @@ -1,271 +1,272 @@ const uppercase = { - A: [ - [ - [0.8, 0.7], - [0.5, 0.2], - [0.2, 0.7] - ], - [ - [0.2, 0.5], - [0.8, 0.5] - ] - ], - B: [ - [ - [0.6, 0.5], - [0.6, 0.2], - [0.2, 0.2], - [0.2, 0.7], - [0.8, 0.7], - [0.8, 0.5], - [0.2, 0.5] - ] - ], - C: [ - [ - [0.75, 0.2], - [0.25, 0.2], - [0.25, 0.7], - [0.75, 0.7] - ] - ], - D: [ - [ - [0.2, 0.2], - [0.8, 0.2], - [0.8, 0.7], - [0.2, 0.7] - ], - [ - [0.3, 0.2], - [0.3, 0.7] - ] - ], - E: [ - [ - [0.75, 0.2], - [0.25, 0.2], - [0.25, 0.7], - [0.75, 0.7] - ], - [ - [0.25, 0.5], - [0.55, 0.5] - ] - ], - F: [ - [ - [0.75, 0.2], - [0.25, 0.2], - [0.25, 0.7] - ], - [ - [0.25, 0.5], - [0.55, 0.5] - ] - ], - G: [ - [ - [0.8, 0.2], - [0.2, 0.2], - [0.2, 0.7], - [0.8, 0.7], - [0.8, 0.5], - [0.5, 0.5] - ] - ], - H: [ - [ - [0.2, 0.2], - [0.2, 0.7] - ], - [ - [0.2, 0.5], - [0.8, 0.5] - ], - [ - [0.8, 0.2], - [0.8, 0.7] - ] - ], - I: [ - [ - [0.3, 0.2], - [0.7, 0.2] - ], - [ - [0.3, 0.7], - [0.7, 0.7] - ], - [ - [0.5, 0.2], - [0.5, 0.7] - ] - ], - J: [ - [ - [0.4, 0.2], - [0.8, 0.2] - ], - [ - [0.6, 0.2], - [0.6, 0.7], - [0.2, 0.7], - [0.2, 0.6] - ] - ], - K: [ - [ - [0.25, 0.2], - [0.25, 0.7] - ], - [ - [0.7, 0.2], - [0.25, 0.5], - [0.7, 0.7] - ] - ], - L: [ - [ - [0.25, 0.2], - [0.25, 0.7], - [0.7, 0.7] - ] - ], - M: [ - [ - [0.2, 0.7], - [0.2, 0.2], - [0.5, 0.5], - [0.8, 0.2], - [0.8, 0.7] - ] - ], - N: [ - [ - [0.25, 0.7], - [0.25, 0.2], - [0.75, 0.7], - [0.75, 0.2] - ] - ], - O: [ - [ - [0.25, 0.2], - [0.25, 0.7], - [0.75, 0.7], - [0.75, 0.2], - [0.25, 0.2] - ] - ], - P: [ - [ - [0.2, 0.5], - [0.7, 0.5], - [0.7, 0.2], - [0.2, 0.2], - [0.2, 0.7] - ] - ], - Q: [ - [ - [0.25, 0.2], - [0.25, 0.7], - [0.75, 0.7], - [0.75, 0.2], - [0.25, 0.2] - ], - [ - [0.6, 0.6], - [0.8, 0.75] - ] - ], - R: [ - [ - [0.25, 0.5], - [0.7, 0.5], - [0.7, 0.2], - [0.25, 0.2], - [0.25, 0.7] - ], - [ - [0.25, 0.5], - [0.7, 0.7] - ] - ], - S: [ - [ - [0.75, 0.2], - [0.25, 0.2], - [0.25, 0.5], - [0.75, 0.5], - [0.75, 0.7], - [0.25, 0.7] - ] - ], - T: [ - [ - [0.25, 0.2], - [0.75, 0.2] - ], - [ - [0.5, 0.2], - [0.5, 0.7] - ] - ], - U: [ - [ - [0.25, 0.2], - [0.25, 0.7], - [0.75, 0.7], - [0.75, 0.2] - ] - ], - V: [ - [ - [0.2, 0.2], - [0.5, 0.7], - [0.8, 0.2] - ] - ], - W: [ - [ - [0.2, 0.2], - [0.3, 0.7], - [0.5, 0.5], - [0.7, 0.7], - [0.8, 0.2] - ] - ], - X: [ - [ - [0.2, 0.2], - [0.8, 0.7] - ], - [ - [0.2, 0.7], - [0.8, 0.2] - ] - ], - Y: [ - [ - [0.2, 0.2], - [0.5, 0.5], - [0.8, 0.2] - ], - [ - [0.5, 0.5], - [0.5, 0.7] - ] - ], - Z: [ - [ - [0.25, 0.2], - [0.75, 0.2], - [0.25, 0.7], - [0.75, 0.7] - ] - ] -} + A: [ + [ + [0.8, 0.7], + [0.8, 0.2], + [0.2, 0.2], + [0.2, 0.7], + ], + [ + [0.2, 0.5], + [0.8, 0.5], + ], + ], + B: [ + [ + [0.6, 0.5], + [0.6, 0.2], + [0.2, 0.2], + [0.2, 0.7], + [0.8, 0.7], + [0.8, 0.5], + [0.2, 0.5], + ], + ], + C: [ + [ + [0.75, 0.2], + [0.25, 0.2], + [0.25, 0.7], + [0.75, 0.7], + ], + ], + D: [ + [ + [0.2, 0.2], + [0.8, 0.2], + [0.8, 0.7], + [0.2, 0.7], + ], + [ + [0.3, 0.2], + [0.3, 0.7], + ], + ], + E: [ + [ + [0.75, 0.2], + [0.25, 0.2], + [0.25, 0.7], + [0.75, 0.7], + ], + [ + [0.25, 0.5], + [0.55, 0.5], + ], + ], + F: [ + [ + [0.75, 0.2], + [0.25, 0.2], + [0.25, 0.7], + ], + [ + [0.25, 0.5], + [0.55, 0.5], + ], + ], + G: [ + [ + [0.8, 0.2], + [0.2, 0.2], + [0.2, 0.7], + [0.8, 0.7], + [0.8, 0.5], + [0.5, 0.5], + ], + ], + H: [ + [ + [0.2, 0.2], + [0.2, 0.7], + ], + [ + [0.2, 0.5], + [0.8, 0.5], + ], + [ + [0.8, 0.2], + [0.8, 0.7], + ], + ], + I: [ + [ + [0.3, 0.2], + [0.7, 0.2], + ], + [ + [0.3, 0.7], + [0.7, 0.7], + ], + [ + [0.5, 0.2], + [0.5, 0.7], + ], + ], + J: [ + [ + [0.4, 0.2], + [0.8, 0.2], + ], + [ + [0.6, 0.2], + [0.6, 0.7], + [0.2, 0.7], + [0.2, 0.6], + ], + ], + K: [ + [ + [0.25, 0.2], + [0.25, 0.7], + ], + [ + [0.7, 0.2], + [0.25, 0.5], + [0.7, 0.7], + ], + ], + L: [ + [ + [0.25, 0.2], + [0.25, 0.7], + [0.7, 0.7], + ], + ], + M: [ + [ + [0.2, 0.7], + [0.2, 0.2], + [0.5, 0.5], + [0.8, 0.2], + [0.8, 0.7], + ], + ], + N: [ + [ + [0.25, 0.7], + [0.25, 0.2], + [0.75, 0.7], + [0.75, 0.2], + ], + ], + O: [ + [ + [0.25, 0.2], + [0.25, 0.7], + [0.75, 0.7], + [0.75, 0.2], + [0.25, 0.2], + ], + ], + P: [ + [ + [0.2, 0.5], + [0.7, 0.5], + [0.7, 0.2], + [0.2, 0.2], + [0.2, 0.7], + ], + ], + Q: [ + [ + [0.25, 0.2], + [0.25, 0.7], + [0.75, 0.7], + [0.75, 0.2], + [0.25, 0.2], + ], + [ + [0.6, 0.6], + [0.8, 0.75], + ], + ], + R: [ + [ + [0.25, 0.5], + [0.7, 0.5], + [0.7, 0.2], + [0.25, 0.2], + [0.25, 0.7], + ], + [ + [0.25, 0.5], + [0.7, 0.7], + ], + ], + S: [ + [ + [0.75, 0.2], + [0.25, 0.2], + [0.25, 0.5], + [0.75, 0.5], + [0.75, 0.7], + [0.25, 0.7], + ], + ], + T: [ + [ + [0.25, 0.2], + [0.75, 0.2], + ], + [ + [0.5, 0.2], + [0.5, 0.7], + ], + ], + U: [ + [ + [0.25, 0.2], + [0.25, 0.7], + [0.75, 0.7], + [0.75, 0.2], + ], + ], + V: [ + [ + [0.2, 0.2], + [0.5, 0.7], + [0.8, 0.2], + ], + ], + W: [ + [ + [0.2, 0.2], + [0.3, 0.7], + [0.5, 0.5], + [0.7, 0.7], + [0.8, 0.2], + ], + ], + X: [ + [ + [0.2, 0.2], + [0.8, 0.7], + ], + [ + [0.2, 0.7], + [0.8, 0.2], + ], + ], + Y: [ + [ + [0.2, 0.2], + [0.5, 0.5], + [0.8, 0.2], + ], + [ + [0.5, 0.5], + [0.5, 0.7], + ], + ], + Z: [ + [ + [0.25, 0.2], + [0.75, 0.2], + [0.25, 0.7], + [0.75, 0.7], + ], + ], +}; -export default uppercase +export default uppercase;