|
|
@ -1,3 +1,44 @@ |
|
|
|
'use strict'; |
|
|
|
"use strict"; |
|
|
|
|
|
|
|
const footer = document.getElementById("footer"); |
|
|
|
const canvas = document.getElementById("imprint"); |
|
|
|
const ctx = canvas.getContext("2d"); |
|
|
|
|
|
|
|
const draw = () => { |
|
|
|
canvas.width = footer.clientWidth; |
|
|
|
ctx.font = "14px sans-serif"; |
|
|
|
|
|
|
|
const words = decodeURIComponent(Array.prototype.map.call(atob("TGVnYWwgY29udGFjdDogTWlsYW4gUMOkc3NsZXIsIEFtIFN0YWRlcmhvZiA4YSA0Mjc5OSBMZWljaGxpbmdlbiwgRW1haWw6IG1lQHBiYi5sYwo="), function(c) { return "%" + ("00" + c.charCodeAt(0).toString(16)).slice(-2); }).join("")).split(" "); |
|
|
|
let lines = [""]; |
|
|
|
let i = 0; |
|
|
|
|
|
|
|
console.log("!") |
|
|
|
while (words.length) { |
|
|
|
while (words.length) { |
|
|
|
if (ctx.measureText(lines[i] + words[0]).width < canvas.width) { |
|
|
|
lines[i] += words.shift() + " "; |
|
|
|
} else { |
|
|
|
break; |
|
|
|
} |
|
|
|
} |
|
|
|
lines.push(""); |
|
|
|
i++; |
|
|
|
} |
|
|
|
|
|
|
|
canvas.height = lines.length * 25; |
|
|
|
ctx.font = "14px sans-serif"; |
|
|
|
ctx.fillStyle = "white"; |
|
|
|
ctx.textAlign = "center"; |
|
|
|
|
|
|
|
ctx.clearRect(0, 0, canvas.width, canvas.height); |
|
|
|
for (let i = 0; i < lines.length; i++) { |
|
|
|
ctx.fillText(lines[i], canvas.width/2, (i+1) * 25); |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
window.addEventListener("resize", () => { |
|
|
|
draw(); |
|
|
|
}); |
|
|
|
|
|
|
|
window.onready = draw(); |
|
|
|
|
|
|
|
document.getElementById('footer').innerHTML = decodeURIComponent(Array.prototype.map.call(atob('TGVnYWwgY29udGFjdDogTWlsYW4gUMOkc3NsZXIsIEFtIFN0YWRlcmhvZiA4YSA0Mjc5OSBMZWljaGxpbmdlbiwgRW1haWw6IG1lQHBiYi5sYwo='), function(c) { return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2); }).join('')); |