Merge branch 'dev/preview' into 'main'

Dev/preview

See merge request jjimenez/safekat!251
This commit is contained in:
Ignacio Martinez Navajas
2024-05-22 09:39:12 +00:00
3 changed files with 483 additions and 407 deletions

View File

@ -12,7 +12,8 @@
<h5 class="mb-1">Interior</h5> <h5 class="mb-1">Interior</h5>
<p class="mb-0"><small id="tipoImpresion">Impresion: Negro premium</small></p> <p class="mb-0"><small id="tipoImpresion">Impresion: Negro premium</small></p>
<p id="pResumenPaginasColor" class="mb-0" style="display:none"><small id="resumenPaginasColor">Páginas a color: 100</small></p> <p id="pResumenPaginasColor" class="mb-0" style="display:none"><small id="resumenPaginasColor">Páginas a
color: 100</small></p>
<p class="mb-3"><small id="resumenPapelInterior">Papel: Blanco Offset 70gr/</small></p> <p class="mb-3"><small id="resumenPapelInterior">Papel: Blanco Offset 70gr/</small></p>
<h5 class="mb-1">Cubierta</h5> <h5 class="mb-1">Cubierta</h5>
@ -22,7 +23,8 @@
<p class="mb-3"><small id="resumenAcabadoCubierta">Acabado: Ninguno</small></p> <p class="mb-3"><small id="resumenAcabadoCubierta">Acabado: Ninguno</small></p>
<h5 class="mb-1 resumen-sobrecubierta">Sobrecubierta</h5> <h5 class="mb-1 resumen-sobrecubierta">Sobrecubierta</h5>
<p class="mb-0 resumen-sobrecubierta"><small id="resumenPapelSobrecubierta">Papel: Blanco Offset 70gr/</small></p> <p class="mb-0 resumen-sobrecubierta"><small id="resumenPapelSobrecubierta">Papel: Blanco Offset
70gr/</small></p>
<p class="mb-0 resumen-sobrecubierta"><small id="resumenSolapasCubierta">Ancho solapas: 25mm</small></p> <p class="mb-0 resumen-sobrecubierta"><small id="resumenSolapasCubierta">Ancho solapas: 25mm</small></p>
<p class="mb-3 resumen-sobrecubierta"><small id="resumenAcabadoCubierta">Acabado: Ninguno</small></p> <p class="mb-3 resumen-sobrecubierta"><small id="resumenAcabadoCubierta">Acabado: Ninguno</small></p>
@ -40,7 +42,32 @@
<h4 id="resumenTotalIVA" class="mb-1">Total: 100</h4> <h4 id="resumenTotalIVA" class="mb-1">Total: 100</h4>
<h6 id="resumenPrecioU" class="mb-0">10.4/ud</h6> <h6 id="resumenPrecioU" class="mb-0">10.4/ud</h6>
<div id="shape-container"> <div id="shape-container">
<div id="pv_ec_shape" style="width:95%;height:550px;margin:2.5% auto;"></div> <div id="thumbnail_ec_shape" style="width:350px;height:300px;margin:2.5% auto;"></div>
<div class="d-flex justify-content-center">
<button type="button" id="pv_details" class="btn btn-primary align-content-center"
data-bs-toggle="modal" data-bs-target="#pv_ec_modal">
Previsualizar detalles de cubierta
</button>
</div>
</div>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="pv_ec_modal" tabindex="-1">
<div class="modal-dialog modal-xl modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Esquema de cubierta</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
</button>
</div>
<div class="modal-body" >
<div id="pv_ec_shape" style="width:850px;height:600px;margin:2.5% auto;"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
</div> </div>
</div> </div>
</div> </div>

View File

@ -296,6 +296,7 @@
break; break;
default: default:
validationStepper.next();
break; break;
} }
}); });

View File

@ -2,49 +2,38 @@
var pvObj; var pvObj;
$('#toReview').on("click", function () { $('#toReview').on("click", function () {
previewEsquemaCubierta(true);
console.log('ec draw');
portadaTapaDura();
//previewEsquemaCubierta('ec', '','');
}); });
$(document).on('shown.bs.modal', function (e) {
previewEsquemaCubierta(false);
})
function previewEsquemaCubierta() {
/*let tipoImpresion; function previewEsquemaCubierta(isThumbnail = false) {
if ($("#tipoCosido").is(":checked")) { if ($('#cosidoDiv').hasClass('checked') || $("#fresadoDiv").hasClass('checked')) {
tipoImpresion = parseInt() console.log("Cosido/Fresado");
if ($("#tapaBlanda").is(":checked")) {
portadaTapaBlanda(isThumbnail);
} else if ($("#tapaDura").is(":checked")) {
portadaTapaDura(isThumbnail);3
}
} else if ($('#espiralDiv').hasClass('checked') || $('#wireoDiv').hasClass('checked')) {
console.log("Espiral/Wireo");
if ($("#tapaBlanda").is(":checked")) {
portadaEspiral(isThumbnail, false);
} else if ($("#tapaDura").is(":checked")) {
portadaEspiral(isThumbnail, true);
}
} else if ($('#grapadoDiv').hasClass('checked')) {
portadaGrapado(isThumbnail);
} }
let tipoImpresion = parseInt($('#tipo_impresion_id').val());
// Fresado TD y Cosido TD
if (tipoImpresion === 1 || tipoImpresion === 3) {
portadaTapaDura();
}
// Fresado TB y Cosido TB
else if (tipoImpresion === 2 || tipoImpresion === 4) {
portadaTapaBlanda();
}
// Espiral TD y TB, Wire-o TD y TB
else if (tipoImpresion === 5 || tipoImpresion === 6 ||
tipoImpresion === 7 || tipoImpresion === 8) {
portadaEspiral();
}
else if (tipoImpresion === 21) {
portadaGrapado();
}
else {
// ?
}*/
} }
function portadaTapaDura() { function portadaTapaDura(isThumbnail = false) {
// Variables locales // Variables locales
let altoLibro, anchoLibro, lomoLibro, anchoCubierta, altoSangrado, anchoSangrado; let altoLibro, anchoLibro, lomoLibro, anchoCubierta, altoSangrado, anchoSangrado;
@ -55,22 +44,30 @@ function portadaTapaDura() {
let altoPliegue = parseFloat(7); // mm let altoPliegue = parseFloat(7); // mm
let anchoCarton = parseFloat(7); // mm let anchoCarton = parseFloat(7); // mm
let divIdName = (isThumbnail) ? 'thumbnail_ec_shape' : 'pv_ec_shape';
// Get the preview Object parameters // Get the preview Object parameters
getObjetoToPreview(); getObjetoToPreview();
// Definicion de los parametros del Esquema de Cubierta (EC) - // Definicion de los parametros del Esquema de Cubierta (EC)
anchoSangrado = 400; // px if (isThumbnail) {
altoSangrado = (anchoSangrado * 0.647 > 350) ? anchoSangrado * 0.647 : 350; // px anchoSangrado = 350; // px
altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
} else {
anchoSangrado = 800; // px
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
}
altoLibro = altoSangrado * 0.88; altoLibro = altoSangrado * 0.88;
anchoLibro = anchoSangrado * 0.39; anchoLibro = anchoSangrado * 0.39;
lomoLibro = anchoSangrado * 0.133; lomoLibro = anchoSangrado * 0.133;
anchoCubierta = (2 * anchoLibro) + lomoLibro; anchoCubierta = (2 * anchoLibro) + lomoLibro;
// Clear the canvas element // Clear the canvas element
$('#pv_ec_shape').empty(); $(`#${divIdName}`).empty();
// Get the element for placing the graphical elements // Get the element for placing the graphical elements
var divEC = document.getElementById('pv_ec_shape'); var divEC = document.getElementById(divIdName);
var previewEC = new Two({fitted: true}).appendTo(divEC); var previewEC = new Two({fitted: true}).appendTo(divEC);
// Calculate the center of the canvas element // Calculate the center of the canvas element
var origenEC = new Two.Vector(previewEC.width / 2, previewEC.height / 2); var origenEC = new Two.Vector(previewEC.width / 2, previewEC.height / 2);
@ -102,7 +99,9 @@ function portadaTapaDura() {
lomo.fill = '#F4F8F2'; lomo.fill = '#F4F8F2';
lomo.linewidth = 1; lomo.linewidth = 1;
// Cotas // Cotas y textos
if (!isThumbnail) {
// Cotas:
var cotaAnchoCubierta = previewEC.makeDobleArrow( var cotaAnchoCubierta = previewEC.makeDobleArrow(
origenEC.x - (anchoSangrado / 2), origenEC.x - (anchoSangrado / 2),
origenEC.y + (altoLibro / 2) + 35, origenEC.y + (altoLibro / 2) + 35,
@ -111,9 +110,9 @@ function portadaTapaDura() {
10); 10);
cotaAnchoCubierta.linewidth = 2; cotaAnchoCubierta.linewidth = 2;
var cotaAltoCubierta = previewEC.makeDobleArrow( var cotaAltoCubierta = previewEC.makeDobleArrow(
origenEC.x + (anchoCubierta / 2) + 35, origenEC.x + (anchoCubierta / 2) + 40,
origenEC.y + (altoSangrado / 2), origenEC.y + (altoSangrado / 2),
origenEC.x + (anchoCubierta / 2) + 35, origenEC.x + (anchoCubierta / 2) + 40,
origenEC.y - (altoSangrado / 2), origenEC.y - (altoSangrado / 2),
10); 10);
cotaAltoCubierta.linewidth = 2; cotaAltoCubierta.linewidth = 2;
@ -164,17 +163,19 @@ function portadaTapaDura() {
previewEC.makeText(pvObj.anchoLibro + anchoPliegue + " mm", origenEC.x - (lomoLibro / 2 + anchoLibro / 2), origenEC.y - (altoLibro / 3) + 15, styleCotas); previewEC.makeText(pvObj.anchoLibro + anchoPliegue + " mm", origenEC.x - (lomoLibro / 2 + anchoLibro / 2), origenEC.y - (altoLibro / 3) + 15, styleCotas);
previewEC.makeText(pvObj.anchoLibro + anchoPliegue + " mm", origenEC.x + (lomoLibro / 2 + anchoLibro / 2), origenEC.y - (altoLibro / 3) + 15, styleCotas); previewEC.makeText(pvObj.anchoLibro + anchoPliegue + " mm", origenEC.x + (lomoLibro / 2 + anchoLibro / 2), origenEC.y - (altoLibro / 3) + 15, styleCotas);
previewEC.makeText(pvObj.altoLibro + altoPliegue + " mm", origenEC.x + (lomoLibro / 2) + 50, origenEC.y, styleCotas).rotation = -Math.PI / 2; previewEC.makeText(pvObj.altoLibro + altoPliegue + " mm", origenEC.x + (lomoLibro / 2) + 50, origenEC.y, styleCotas).rotation = -Math.PI / 2;
previewEC.makeText(pvObj.altoLibro + (2 * sangradoValor) + altoPliegue + " mm", origenEC.x + (lomoLibro / 2 + anchoLibro) + 50, origenEC.y, styleCotas).rotation = -Math.PI / 2; previewEC.makeText(pvObj.altoLibro + (2 * sangradoValor) + altoPliegue + " mm", origenEC.x + (lomoLibro / 2 + anchoLibro) + 55, origenEC.y, styleCotas).rotation = -Math.PI / 2;
previewEC.makeText((2 * pvObj.anchoLibro) + pvObj.lomoLibro + (2 * sangradoValor) + +(2 * anchoPliegue) + anchoCarton + " mm", previewEC.makeText((2 * pvObj.anchoLibro) + pvObj.lomoLibro + (2 * sangradoValor) + +(2 * anchoPliegue) + anchoCarton + " mm",
origenEC.x, origenEC.x,
origenEC.y + (altoLibro / 2) + 50, origenEC.y + (altoLibro / 2) + 50,
styleCotas); styleCotas);
}
previewEC.update(); previewEC.update();
} }
function portadaTapaBlanda() { function portadaTapaBlanda(isThumbnail = false) {
// Variables locales // Variables locales
let altoLibro, anchoLibro, lomoLibro, anchoSolapa, anchoCubierta, altoSangrado, anchoSangrado; let altoLibro, anchoLibro, lomoLibro, anchoSolapa, anchoCubierta, altoSangrado, anchoSangrado;
@ -183,13 +184,22 @@ function portadaTapaBlanda() {
let sangradoValor = parseFloat(5); // mm let sangradoValor = parseFloat(5); // mm
let offsetSolapaValor = parseFloat(0); // mm let offsetSolapaValor = parseFloat(0); // mm
let divIdName = (isThumbnail) ? 'thumbnail_ec_shape' : 'pv_ec_shape';
// Get the preview Object parameters // Get the preview Object parameters
getObjetoToPreview(); getObjetoToPreview();
// Definicion de los parametros del Esquema de Cubierta (EC) // Definicion de los parametros del Esquema de Cubierta (EC)
if (pvObj.anchoSolapa == 0) { if (pvObj.anchoSolapa == 0) {
anchoSangrado = 600; // px if (isThumbnail) {
altoSangrado = (anchoSangrado * 0.647 > 350) ? anchoSangrado * 0.647 : 350; // px anchoSangrado = 350; // px
altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
} else {
anchoSangrado = 800; // px
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
}
altoLibro = altoSangrado * 0.97; altoLibro = altoSangrado * 0.97;
anchoLibro = anchoSangrado * 0.419; anchoLibro = anchoSangrado * 0.419;
anchoSolapa = 0; anchoSolapa = 0;
@ -197,8 +207,13 @@ function portadaTapaBlanda() {
anchoCubierta = (2 * anchoLibro) + (2 * anchoSolapa) + lomoLibro; anchoCubierta = (2 * anchoLibro) + (2 * anchoSolapa) + lomoLibro;
} else { } else {
anchoSangrado = 600; // px if (isThumbnail) {
altoSangrado = (anchoSangrado * 0.418 > 350) ? anchoSangrado * 0.418 : 350; // px anchoSangrado = 350; // px
altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
} else {
anchoSangrado = 750; // px
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
}
altoLibro = altoSangrado * 0.95; altoLibro = altoSangrado * 0.95;
anchoLibro = anchoSangrado * 0.28; anchoLibro = anchoSangrado * 0.28;
anchoSolapa = anchoSangrado * 0.163; anchoSolapa = anchoSangrado * 0.163;
@ -207,9 +222,9 @@ function portadaTapaBlanda() {
} }
// Clear the canvas element // Clear the canvas element
$('#pv_ec_shape').empty(); $(`#${divIdName}`).empty();
// Get the element for placing the graphical elements // Get the element for placing the graphical elements
var divEC = document.getElementById('pv_ec_shape'); var divEC = document.getElementById(divIdName);
var previewEC = new Two({fitted: true}).appendTo(divEC); var previewEC = new Two({fitted: true}).appendTo(divEC);
// Calculate the center of the canvas element // Calculate the center of the canvas element
var origenEC = new Two.Vector(previewEC.width / 2, previewEC.height / 2); var origenEC = new Two.Vector(previewEC.width / 2, previewEC.height / 2);
@ -235,6 +250,7 @@ function portadaTapaBlanda() {
solapas.linewidth = 1; solapas.linewidth = 1;
// Cotas Solapas // Cotas Solapas
if (!isThumbnail) {
var cotaSolapa2 = previewEC.makeDobleArrow( var cotaSolapa2 = previewEC.makeDobleArrow(
origenEC.x - anchoCubierta / 2, origenEC.x - anchoCubierta / 2,
origenEC.y - (altoLibro / 3), origenEC.y - (altoLibro / 3),
@ -257,6 +273,7 @@ function portadaTapaBlanda() {
// Textos Cotas Solapas // Textos Cotas Solapas
previewEC.makeText(pvObj.anchoSolapa + " mm", origenEC.x - anchoLibro - (lomoLibro + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas); previewEC.makeText(pvObj.anchoSolapa + " mm", origenEC.x - anchoLibro - (lomoLibro + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas);
previewEC.makeText(pvObj.anchoSolapa + " mm", origenEC.x + anchoLibro + (lomoLibro + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas); previewEC.makeText(pvObj.anchoSolapa + " mm", origenEC.x + anchoLibro + (lomoLibro + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas);
}
} }
@ -277,7 +294,9 @@ function portadaTapaBlanda() {
lomo.fill = '#F4F8F2'; lomo.fill = '#F4F8F2';
lomo.linewidth = 1; lomo.linewidth = 1;
// Cotas // Cotas y textos
if (!isThumbnail) {
// Cotas:
var cotaAnchoCubierta = previewEC.makeDobleArrow( var cotaAnchoCubierta = previewEC.makeDobleArrow(
origenEC.x - (anchoSangrado / 2), origenEC.x - (anchoSangrado / 2),
origenEC.y + (altoLibro / 2) + 35, origenEC.y + (altoLibro / 2) + 35,
@ -345,11 +364,13 @@ function portadaTapaBlanda() {
origenEC.y + (altoLibro / 2) + 50, origenEC.y + (altoLibro / 2) + 50,
styleCotas); styleCotas);
}
previewEC.update(); previewEC.update();
} }
function portadaEspiral() { function portadaEspiral(isThumbnail = false, isTapaDura = false) {
// Variables locales // Variables locales
let altoLibro, anchoLibro, anchoCalle, anchoCubierta, altoSangrado, anchoSangrado, anchoSolapa, offsetCubierta; let altoLibro, anchoLibro, anchoCalle, anchoCubierta, altoSangrado, anchoSangrado, anchoSolapa, offsetCubierta;
@ -357,14 +378,20 @@ function portadaEspiral() {
let sangradoTexto = (isTapaDura) ? "Sangrado 20 mm" : "Sangrado 5 mm"; let sangradoTexto = (isTapaDura) ? "Sangrado 20 mm" : "Sangrado 5 mm";
let sangradoValor = (isTapaDura) ? parseFloat(20) : parseFloat(5); // mm let sangradoValor = (isTapaDura) ? parseFloat(20) : parseFloat(5); // mm
let divIdName = (isThumbnail) ? 'thumbnail_ec_shape' : 'pv_ec_shape';
// Get the preview Object parameters // Get the preview Object parameters
getObjetoToPreview(); getObjetoToPreview();
// Definicion de los parametros del Esquema de Cubierta (EC) // Definicion de los parametros del Esquema de Cubierta (EC)
anchoSangrado = 600; // px if ((pvObj.anchoSolapa !== 0) && (!isTapaDura)) {
if (isThumbnail) {
if((pvObj.anchoSolapa !== 0) && (isTapaDura === 0)){ anchoSangrado = 350; // px
altoSangrado = (anchoSangrado * 0.418 > 350) ? anchoSangrado * 0.418 : 350; // px altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
} else {
anchoSangrado = 750; // px
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
}
altoLibro = altoSangrado * 0.95; altoLibro = altoSangrado * 0.95;
anchoLibro = anchoSangrado * 0.28; anchoLibro = anchoSangrado * 0.28;
anchoCalle = anchoSangrado * 0.02; anchoCalle = anchoSangrado * 0.02;
@ -372,9 +399,14 @@ function portadaEspiral() {
sangrado = anchoSangrado * 0.03; sangrado = anchoSangrado * 0.03;
anchoCubierta = 2 * (anchoLibro + anchoSolapa + sangrado) + anchoCalle; anchoCubierta = 2 * (anchoLibro + anchoSolapa + sangrado) + anchoCalle;
offsetCubierta = anchoLibro / 2 + anchoCalle / 2 + anchoSolapa / 2 + sangrado; offsetCubierta = anchoLibro / 2 + anchoCalle / 2 + anchoSolapa / 2 + sangrado;
} else {
if (isThumbnail) {
anchoSangrado = 350; // px
altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
} else {
anchoSangrado = 750; // px
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
} }
else {
altoSangrado = (anchoSangrado * 0.647 > 350) ? anchoSangrado * 0.647 : 350; // px
altoLibro = (isTapaDura) ? altoSangrado * 0.88 : altoSangrado * 0.97; altoLibro = (isTapaDura) ? altoSangrado * 0.88 : altoSangrado * 0.97;
anchoLibro = (isTapaDura) ? anchoSangrado * 0.39 : anchoSangrado * 0.419; anchoLibro = (isTapaDura) ? anchoSangrado * 0.39 : anchoSangrado * 0.419;
anchoCalle = anchoSangrado * 0.02; anchoCalle = anchoSangrado * 0.02;
@ -384,9 +416,9 @@ function portadaEspiral() {
} }
// Clear the canvas element // Clear the canvas element
$('#pv_ec_shape').empty(); $(`#${divIdName}`).empty();
// Get the element for placing the graphical elements // Get the element for placing the graphical elements
var divEC = document.getElementById('pv_ec_shape'); var divEC = document.getElementById(divIdName);
var previewEC = new Two({fitted: true}).appendTo(divEC); var previewEC = new Two({fitted: true}).appendTo(divEC);
// Calculate the center of the canvas element // Calculate the center of the canvas element
var origenEC = new Two.Vector(previewEC.width / 2, previewEC.height / 2); var origenEC = new Two.Vector(previewEC.width / 2, previewEC.height / 2);
@ -402,7 +434,7 @@ function portadaEspiral() {
sangrado.fill = '#FCEAF1'; sangrado.fill = '#FCEAF1';
sangrado.linewidth = 1; sangrado.linewidth = 1;
if (pvObj.anchoSolapa != 0) { if ((pvObj.anchoSolapa != 0) && (!isTapaDura)) {
var solapa1 = previewEC.makeRectangle( var solapa1 = previewEC.makeRectangle(
origenEC.x + (anchoLibro + anchoCalle / 2 + anchoSolapa / 2 + sangradoValor), origenEC.x + (anchoLibro + anchoCalle / 2 + anchoSolapa / 2 + sangradoValor),
origenEC.y, origenEC.y,
@ -419,7 +451,9 @@ function portadaEspiral() {
solapa2.stroke = 'black'; solapa2.stroke = 'black';
solapa2.linewidth = 1; solapa2.linewidth = 1;
// Cotas Solapas // Cotas y textos
if (!isThumbnail) {
// Cotas
var cotaSolapa2 = previewEC.makeDobleArrow( var cotaSolapa2 = previewEC.makeDobleArrow(
origenEC.x - (anchoCalle / 2 + sangradoValor + anchoLibro + anchoSolapa), origenEC.x - (anchoCalle / 2 + sangradoValor + anchoLibro + anchoSolapa),
origenEC.y - (altoLibro / 3), origenEC.y - (altoLibro / 3),
@ -442,6 +476,7 @@ function portadaEspiral() {
// Textos Cotas Solapas // Textos Cotas Solapas
previewEC.makeText(pvObj.anchoSolapa + " mm", origenEC.x - anchoLibro - (anchoCalle + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas); previewEC.makeText(pvObj.anchoSolapa + " mm", origenEC.x - anchoLibro - (anchoCalle + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas);
previewEC.makeText(pvObj.anchoSolapa + " mm", origenEC.x + anchoLibro + (anchoCalle + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas); previewEC.makeText(pvObj.anchoSolapa + " mm", origenEC.x + anchoLibro + (anchoCalle + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas);
}
} }
@ -471,7 +506,9 @@ function portadaEspiral() {
calle.fill = '#F4F8F2'; calle.fill = '#F4F8F2';
calle.linewidth = 1; calle.linewidth = 1;
// Cotas // Cotas y textos
if (!isThumbnail) {
// Cotas:
var cotaAnchoCubierta = previewEC.makeDobleArrow( var cotaAnchoCubierta = previewEC.makeDobleArrow(
origenEC.x - (anchoSangrado / 2), origenEC.x - (anchoSangrado / 2),
origenEC.y + (altoLibro / 2) + 35, origenEC.y + (altoLibro / 2) + 35,
@ -543,12 +580,13 @@ function portadaEspiral() {
origenEC.x, origenEC.x,
origenEC.y + (altoLibro / 2) + 50, origenEC.y + (altoLibro / 2) + 50,
styleCotas); styleCotas);
}
previewEC.update(); previewEC.update();
} }
function portadaGrapado() { function portadaGrapado(isThumbnail = false) {
// Variables locales // Variables locales
let altoLibro, anchoLibro, lomoLibro, anchoSolapa, anchoCubierta, altoSangrado, anchoSangrado; let altoLibro, anchoLibro, lomoLibro, anchoSolapa, anchoCubierta, altoSangrado, anchoSangrado;
@ -557,13 +595,20 @@ function portadaGrapado() {
let sangradoValor = parseFloat(5); // mm let sangradoValor = parseFloat(5); // mm
let offsetSolapaValor = parseFloat(0); // mm let offsetSolapaValor = parseFloat(0); // mm
let divIdName = (isThumbnail) ? 'thumbnail_ec_shape' : 'pv_ec_shape';
// Get the preview Object parameters // Get the preview Object parameters
getObjetoToPreview(); getObjetoToPreview();
// Definicion de los parametros del Esquema de Cubierta (EC) // Definicion de los parametros del Esquema de Cubierta (EC)
if (pvObj.anchoSolapa == 0) { if (pvObj.anchoSolapa == 0) {
anchoSangrado = 600; // px if (isThumbnail) {
altoSangrado = (anchoSangrado * 0.647 > 350) ? anchoSangrado * 0.647 : 350; // px anchoSangrado = 350; // px
altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
} else {
anchoSangrado = 750; // px
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
}
altoLibro = altoSangrado * 0.97; altoLibro = altoSangrado * 0.97;
anchoLibro = anchoSangrado * 0.48; anchoLibro = anchoSangrado * 0.48;
anchoSolapa = 0; anchoSolapa = 0;
@ -571,8 +616,13 @@ function portadaGrapado() {
anchoCubierta = (2 * anchoLibro) + (2 * anchoSolapa) + lomoLibro; anchoCubierta = (2 * anchoLibro) + (2 * anchoSolapa) + lomoLibro;
} else { } else {
anchoSangrado = 600; // px if (isThumbnail) {
altoSangrado = (anchoSangrado * 0.418 > 350) ? anchoSangrado * 0.418 : 350; // px anchoSangrado = 350; // px
altoSangrado = (anchoSangrado * 0.647 > 300) ? 300 : anchoSangrado * 0.647; // px
} else {
anchoSangrado = 750; // px
altoSangrado = (anchoSangrado * 0.647 > 650) ? 650 : anchoSangrado * 0.647; // px
}
altoLibro = altoSangrado * 0.95; altoLibro = altoSangrado * 0.95;
anchoLibro = anchoSangrado * 0.3; anchoLibro = anchoSangrado * 0.3;
anchoSolapa = anchoSangrado * 0.18; anchoSolapa = anchoSangrado * 0.18;
@ -581,9 +631,9 @@ function portadaGrapado() {
} }
// Clear the canvas element // Clear the canvas element
$('#pv_ec_shape').empty(); $(`#${divIdName}`).empty();
// Get the element for placing the graphical elements // Get the element for placing the graphical elements
var divEC = document.getElementById('pv_ec_shape'); var divEC = document.getElementById(divIdName);
var previewEC = new Two({fitted: true}).appendTo(divEC); var previewEC = new Two({fitted: true}).appendTo(divEC);
// Calculate the center of the canvas element // Calculate the center of the canvas element
var origenEC = new Two.Vector(previewEC.width / 2, previewEC.height / 2); var origenEC = new Two.Vector(previewEC.width / 2, previewEC.height / 2);
@ -608,7 +658,9 @@ function portadaGrapado() {
solapas.stroke = 'black'; solapas.stroke = 'black';
solapas.linewidth = 1; solapas.linewidth = 1;
// Cotas Solapas // Cotas y textos
if (!isThumbnail) {
// Cotas
var cotaSolapa2 = previewEC.makeDobleArrow( var cotaSolapa2 = previewEC.makeDobleArrow(
origenEC.x - anchoCubierta / 2, origenEC.x - anchoCubierta / 2,
origenEC.y - (altoLibro / 3), origenEC.y - (altoLibro / 3),
@ -631,6 +683,7 @@ function portadaGrapado() {
// Textos Cotas Solapas // Textos Cotas Solapas
previewEC.makeText(pvObj.anchoSolapa + " mm", origenEC.x - anchoLibro - (lomoLibro + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas); previewEC.makeText(pvObj.anchoSolapa + " mm", origenEC.x - anchoLibro - (lomoLibro + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas);
previewEC.makeText(pvObj.anchoSolapa + " mm", origenEC.x + anchoLibro + (lomoLibro + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas); previewEC.makeText(pvObj.anchoSolapa + " mm", origenEC.x + anchoLibro + (lomoLibro + anchoSolapa) / 2, origenEC.y - (altoLibro / 3) + 15, styleCotas);
}
} }
@ -651,7 +704,9 @@ function portadaGrapado() {
lomo.fill = '#F4F8F2'; lomo.fill = '#F4F8F2';
lomo.linewidth = 1; lomo.linewidth = 1;
// Cotas // Cotas y textos
if (!isThumbnail) {
// Cotas:
var cotaAnchoCubierta = previewEC.makeDobleArrow( var cotaAnchoCubierta = previewEC.makeDobleArrow(
origenEC.x - (anchoSangrado / 2), origenEC.x - (anchoSangrado / 2),
origenEC.y + (altoLibro / 2) + 35, origenEC.y + (altoLibro / 2) + 35,
@ -688,7 +743,6 @@ function portadaGrapado() {
10); 10);
cotaPortada.linewidth = 2; cotaPortada.linewidth = 2;
// Textos: // Textos:
// Titulos generales // Titulos generales
let stylesEC = {size: 22, weight: 'bold', family: 'Public Sans'}; let stylesEC = {size: 22, weight: 'bold', family: 'Public Sans'};
@ -709,27 +763,21 @@ function portadaGrapado() {
origenEC.x, origenEC.x,
origenEC.y + (altoLibro / 2) + 50, origenEC.y + (altoLibro / 2) + 50,
styleCotas); styleCotas);
}
previewEC.update(); previewEC.update();
} }
function getLomoLibro() {
const anchoLomoInputs = $("#tableLineasPresupuesto tbody tr:visible td input[id*='_lomo']");
const anchoLomo = Array.from(anchoLomoInputs).reduce((sum, input) => sum + parseFloat($(input).val()), 0);
return parseFloat(anchoLomo.toFixed(2));
}
function getObjetoToPreview() { function getObjetoToPreview() {
pvObj = { pvObj = {
lomoLibro: parseFloat('30.0'), lomoLibro: $('#lomo_cubierta').val() === '' ? parseFloat('0.0') : parseFloat($('#lomo_cubierta').val()),
anchoSolapa: $('#solapasCubierta').is(':checked') ? parseFloat($('#anchoSolapasCubierta').val()) : parseFloat(0), anchoSolapa: $('#solapasCubierta').is(':checked') ? parseFloat($('#anchoSolapasCubierta').val()) : parseFloat(0),
altoLibro: getDimensionLibro().alto, altoLibro: getDimensionLibro().alto,
anchoLibro: getDimensionLibro().ancho anchoLibro: getDimensionLibro().ancho
}; };
//console.log(pvObj); console.log(pvObj);
} }