Eu estou tendo dificuldade de montar uma lógica, onde vai escrever o nome do usuário em um certificado.
Afim de deixar sempre centralizado de acordo com o length
do nome, eu tenho que ficar ajustando à margem-left
, porém é permitido de 1 à 50, pra deixar sempre dinâmico, teria que fazer 50 If
ou 50 case
.
Nessa contagem do length
, eu considero os espaços entre os nomes.
O tamanho da folha é A4 (2480 px de largura 3508 px de altura)
A idéia é centralizar o texto de acordo que diminuir/aumentar o tamanho do nome, baseando na posição da palavra Parabéns
Exemplo de nome que tem entre 0 a 10 de length
Exemplo de nome que tem entre 50+ de length
segue código.
function certificado(codigo) {
$.post("/MeusDados/ConsultarCertificados", { 'certificado': codigo }, function (data) {
if (data != null || data.length > 0) {
var nome = $("#nome").text();
for (var i = 0; i < data.length; i++) {
var html = "";
html += "<div id=\"printDiv" + data[i].bPlanoCodigo + "\" class=\"col-sm-10\" style=\"width: 26%;\">";
html += "<a href=\"#\" onclick=\"JavaScript:printPartOfPage('printDiv" + data[i].bPlanoCodigo + "')\">";
if (nome.length >= 50) {
html += "<span style=\"position: absolute; display:none; margin-left: 30%; font-size: 16px; margin-top: 37%; font-family: Trebuchet MS;\"\">" + nome + "\</span>";
}
else if (nome.length >= 45 && nome.length <= 50) {
html += "<span style=\"position: absolute; display:none; margin-left: 30%; font-size: 16px; margin-top: 37%; font-family: Trebuchet MS;\"\">" + nome + "\</span>";
}
else if (nome.length >= 40 && nome.length < 45) {
html += "<span style=\"position: absolute; display:none; margin-left: 32%; font-size: 16px; margin-top: 37%; font-family: Trebuchet MS;\"\">" + nome + "\</span>";
}
else if (nome.length >= 35 && nome.length < 40) {
html += "<span style=\"position: absolute; display:none; margin-left: 34%; font-size: 16px; margin-top: 37%; font-family: Trebuchet MS;\"\">" + nome + "\</span>";
}
else if (nome.length >= 30 && nome.length < 35) {
html += "<span style=\"position: absolute; display:none; margin-left: 38%; font-size: 16px; margin-top: 37%; font-family: Trebuchet MS;\"\">" + nome + "\</span>";
}
else if (nome.length >= 25 && nome.length < 30) {
html += "<span style=\"position: absolute; display:none; margin-left: 42%; font-size: 16px; margin-top: 37%; font-family: Trebuchet MS;\"\">" + nome + "\</span>";
}
else if (nome.length < 25) {
html += "<span style=\"position: absolute; display:none; margin-left: 48%; font-size: 16px; margin-top: 37%; font-family: Trebuchet MS;\"\">" + nome + "\</span>";
}
html += "<img class=\"imgCertificados\" src=\"data:image/png;base64," + data[i].bPlanoCertificado + "\"/>";
html += "</a>";
html += "</div>";
$("#certificado").append(html);
}
off();
}
});
}