jjimenez/safekat
1
0
Fork 0
mirror of https://git.imnavajas.es/jjimenez/safekat.git synced 2025-07-25 22:52:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

Desarrollados previsualizadores de portada y cubierta

Browse Source
This commit is contained in:
imnavajas
2023-11-13 08:33:18 +01:00
parent 8e50186cf6
commit 5b90461bff
5 changed files with 196 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
ci4/app/Controllers/Js_loader.php
View File

@ -21,6 +21,12 @@ class Js_loader extends BaseController
}
function previsualizador_js()
{
$this->response->setHeader('Content-Type', 'text/javascript');
return view('themes/backend/vuexy/form/presupuestos/cosidotapablanda/previews.js');
}
}

24
ci4/app/Controllers/Presupuestos/Js_loader.php
View File

@ -1,24 +0,0 @@
<?php
namespace App\Controllers\Presupuestos;
use App\Controllers\BaseController;
class Js_loader extends BaseController
{
function __construct()
{
}
function comparadorCosidoTapablanda_js()
{
$this->load->view('themes/backend/vuexy/form/presupuestos/cosidotapablanda/comparador.js');
$this->output->set_content_type('text/javascript');
}
}

133
ci4/app/Views/themes/backend/vuexy/form/presupuestos/cosidotapablanda/_previewItems.php
View File

@ -13,7 +13,7 @@
<div class="accordion-body">
<div class="nav-align-top mb-4">
<ul class="nav nav-pills mb-3" role="tablist">
<li class="nav-item">
<li id="tab-preview-maquina" class="nav-item">
<button
type="button"
class="nav-link active"
@ -25,7 +25,7 @@
<?= lang("Presupuestos.previewMaquina") ?>
</button>
</li>
<li class="nav-item">
<li id="tab-preview-cubierta" class="nav-item">
<button
type="button"
class="nav-link"
@ -37,7 +37,7 @@
<?= lang("Presupuestos.previewCubierta") ?>
</button>
</li>
<li class="nav-item">
<li id="tab-preview-portada" class="nav-item">
<button
type="button"
class="nav-link"
@ -206,7 +206,56 @@
<div class="tab-pane fade" id="preview-portada" role="tabpanel">
<div class="row">
<div class="col-12">
<div class="col-3">
<div class="p-4 mb-3 pb-3" >
<!-- Configuraciones -->
<h6>Configuración de portada</h6>
<div class="row g-3 mb-3">
<div class="col-12">
<a href="#">
<div class="d-grid">
<button type="button" class="btn btn-label-primary">Papel
generico
</button>
</div>
</a>
</div>
<div class="col-12">
<a href="#">
<div class="d-grid">
<button type="button" class="btn btn-label-primary">Papel de
compra
</button>
</div>
</a>
</div>
<div class="col-12">
<a href="#">
<div class="d-grid">
<button type="button" class="btn btn-label-primary">Máquina
</button>
</div>
</a>
</div>
</div>
<hr class="mx-n4"/>
<!-- Detalles del presupuesto -->
<h6>Detalles del trabajo</h6>
<dl class="row mb-0">
<dt class="col-6 fw-normal">Libro:</dt>
<dd id='prevLibro' class="col-6 text-left">TBDxTBD</dd>
<dt class="col-6 fw-normal">Lomo:</dt>
<dd id='prevLomo' class="col-6 text-left">TBD</dd>
<dt class="col-6 fw-normal">Solapas:</dt>
<dd id='prevSolapas' class="col-6 text-left">TBD</dd>
</dl>
</div>
</div>
<div class="col-9">
<div class="p-4 mb-3 pb-3">
<!-- Configuraciones -->
<h6>Posición de formas</h6>
@ -233,6 +282,34 @@
<!------------------------------------------------------->
<?= $this->section("additionalInlineJs") ?>
$('#tab-preview-cubierta').on( "click", function() {
var cubiertaObjeto = {
anchoMaquina: 487,
altoMaquina: 330,
anchoImpresion: 475,
altoImpresion: 310,
anchoLibro:170,
altoLibro:240,
solapas:45,
lomo:25};
previewCubierta(cubiertaObjeto);
} );
$('#tab-preview-portada').on( "click", function() {
var portadaObjeto = {
anchoLibro:170,
altoLibro:240,
solapas:45,
lomo:25};
previewPortada(portadaObjeto);
} );
var elem = document.getElementById('draw-maquina');
var twoMaquina = new Two({fitted: true}).appendTo(elem);
@ -298,54 +375,6 @@
twoMaquina.update();
var elemCubierta = document.getElementById('draw-cubierta');
var twoCubierta = new Two({fitted: true}).appendTo(elemCubierta);
var originCub = new Two.Vector(twoCubierta.width/2, twoCubierta.height/2);
var areaMaquinaCubierta = twoCubierta.makeRectangle(originCub.x, originCub.y, 360, 255);
areaMaquinaCubierta.stroke = 'black';
areaMaquinaCubierta.linewidth = 1;
var areaImpresionCubierta = twoCubierta.makeRectangle(originCub.x, originCub.y, AIx, AIy);
areaImpresionCubierta.stroke = 'red';
areaImpresionCubierta.linewidth = 1;
var formaCubierta = twoCubierta.makeRectangle(originCub.x, originCub.y, 2*sizeX, 2*sizeY);
formaCubierta.stroke = 'blue';
formaCubierta.fill = 'blue';
formaCubierta.linewidth = 1;
twoCubierta.update();
var elemPortada = document.getElementById('draw-portada');
var twoPortada = new Two({fitted: true}).appendTo(elemPortada);
var originPor = new Two.Vector(twoPortada.width/2, twoPortada.height/2);
var solapas = twoPortada.makeRectangle(originPor.x, originPor.y, 360, 255);
solapas.stroke = 'black';
solapas.fill = 'black';
solapas.linewidth = 1;
var libro = twoPortada.makeRectangle(originPor.x, originPor.y, 300, 255);
libro.stroke = 'red';
libro.fill = 'red';
libro.linewidth = 1;
var lomo = twoPortada.makeRectangle(originPor.x, originPor.y, 40, 255);
lomo.stroke = 'blue';
lomo.fill = 'blue';
lomo.linewidth = 1;
twoPortada.update();
<?= $this->endSection() ?>

108
ci4/app/Views/themes/backend/vuexy/form/presupuestos/cosidotapablanda/previews.js Normal file
View File

@ -0,0 +1,108 @@
// Global parameters
var _offsetSolapas = 2; // millimeters
var styles = {
size: 13,
family: 'Public Sans',
}
function previewCubierta(cubiertaObj) {
// Local parameters
let fullBookWith = ((2 * cubiertaObj.anchoLibro) + (2 * (cubiertaObj.solapas + _offsetSolapas)) + cubiertaObj.lomo);
// Clear the canvas element
$('#draw-cubierta').empty();
// Get the element for placing the graphical elements
var divCubierta = document.getElementById('draw-cubierta');
var _previewCubierta = new Two({fitted: true}).appendTo(divCubierta);
// Calculate the center of the canvas element
var origenCubierta = new Two.Vector(_previewCubierta.width / 2, _previewCubierta.height / 2);
var areaMaquinaCubierta = _previewCubierta.makeRectangle(
origenCubierta.x,
origenCubierta.y,
cubiertaObj.anchoMaquina,
cubiertaObj.altoMaquina);
areaMaquinaCubierta.stroke = 'black';
areaMaquinaCubierta.linewidth = 1;
var areaImpresionCubierta = _previewCubierta.makeRectangle(
origenCubierta.x,
origenCubierta.y,
cubiertaObj.anchoImpresion,
cubiertaObj.altoImpresion);
areaImpresionCubierta.stroke = 'red';
areaImpresionCubierta.linewidth = 1;
var formaCubierta = _previewCubierta.makeRectangle(
origenCubierta.x,
origenCubierta.y,
fullBookWith,
cubiertaObj.altoLibro);
formaCubierta.stroke = '#6997D3';
formaCubierta.fill = '#6997D3';
formaCubierta.linewidth = 1;
// Texts
_previewCubierta.makeText(cubiertaObj.altoLibro, origenCubierta.x + (fullBookWith/2 -25), origenCubierta.y, styles);
_previewCubierta.makeText(fullBookWith, origenCubierta.x, origenCubierta.y + (cubiertaObj.altoLibro/2-15) , styles);
_previewCubierta.update();
// Update preview info fields
$('#prevLibro').text(cubiertaObj.anchoLibro + "X" + cubiertaObj.altoLibro );
$('#prevLomo').text(cubiertaObj.lomo);
$('#prevSolapas').text(cubiertaObj.solapas);
}
function previewPortada(portadaObj) {
// Clear the canvas element
$('#draw-portada').empty();
// Get the element for placing the graphical elements
var divPortada = document.getElementById('draw-portada');
var _previewPortada = new Two({fitted: true}).appendTo(divPortada);
// Calculate the center of the canvas element
var origenPortada = new Two.Vector(_previewPortada.width / 2, _previewPortada.height / 2);
var solapas = _previewPortada.makeRectangle(
origenPortada.x,
origenPortada.y,
((2 * portadaObj.anchoLibro) + (2 * (portadaObj.solapas + _offsetSolapas)) + portadaObj.lomo),
portadaObj.altoLibro);
solapas.stroke = '#5FD2B5';
solapas.fill = '#5FD2B5';
solapas.linewidth = 1;
var libro = _previewPortada.makeRectangle(
origenPortada.x,
origenPortada.y,
((2 * portadaObj.anchoLibro) + portadaObj.lomo),
portadaObj.altoLibro);
libro.stroke = '#6997D3';
libro.fill = '#6997D3';
libro.linewidth = 1;
var lomo = _previewPortada.makeRectangle(
origenPortada.x,
origenPortada.y,
portadaObj.lomo,
portadaObj.altoLibro);
lomo.stroke = '#8171D4';
lomo.fill = '#8171D4';
lomo.linewidth = 1;
_previewPortada.update();
// Update preview info fields
$('#prevLibro').text(portadaObj.anchoLibro + "X" + portadaObj.altoLibro );
$('#prevLomo').text(portadaObj.lomo);
$('#prevSolapas').text(portadaObj.solapas);
}

2
ci4/app/Views/themes/backend/vuexy/form/presupuestos/cosidotapablanda/viewCosidotapablandaForm.php
View File

@ -1090,5 +1090,5 @@
<script src="<?= site_url('themes/vuexy/vendor/libs/autosize/autosize.js') ?>"></script>
<script src="<?= site_url('themes/vuexy/vendor/libs/two/two.js') ?>"></script>
<script src="<?= site_url('js_loader/comparadorCosidoTapaBlanda_js') ?>"></script>
<script src="<?= site_url('js_loader/previsualizador_js') ?>"></script>
<?=$this->endSection() ?>