Gecko [ 167.86.127.34 ]

Name	Size	Permission
agregarFotos.js	15.5 KB	-rw-r--r--
jquery-3.6.3.min.js	87.84 KB	-rw-r--r--
printThis.js	14.8 KB	-rw-r--r--
script.js	41.38 KB	-rw-r--r--
scriptCalibracion.js	2.82 KB	-rw-r--r--
sweetalert.min.js	39.85 KB	-rw-r--r--

Code Editor : script.js

var contador = 1, count1 = 2, count2 = 2, count3 = 2, count4 = 2, count5 = 2, count6 = 2, count7 = 2, count8 = 2; countEliminar = 2; countEliminar2 = 2;
var id1 = 1, id2 = 1;
var countFotos = 1;
var countFotos2 = 1;

(function () {
    "use strict";

var cvs, ctx;
    var nodes = 6;
    var waves = [];
    var waveHeight = 60;
    var colours = ["#f80000", "#00f800", "#0000f8"];

// Initiator function
    function init() {
        cvs = document.getElementById("canvas");
        ctx = cvs.getContext("2d");
        resizeCanvas(cvs);

for (var i = 0; i < 3; i++) {
            waves.push(new wave(colours[i], 1, nodes));
        }

update();
    }

function update() {
        var fill = window.getComputedStyle(document.querySelector(".header"), null).getPropertyValue("background-color");
        ctx.fillStyle = fill;
        ctx.globalCompositeOperation = "source-over";
        ctx.fillRect(0, 0, cvs.width, cvs.height);
        ctx.globalCompositeOperation = "screen";
        for (var i = 0; i < waves.length; i++) {
            for (var j = 0; j < waves[i].nodes.length; j++) {
                bounce(waves[i].nodes[j]);
            }
            drawWave(waves[i]);
        }
        ctx.fillStyle = fill;

requestAnimationFrame(update);
    }

function wave(colour, lambda, nodes) {

this.colour = colour;
        this.lambda = lambda;
        this.nodes = [];
        var tick = 1;

for (var i = 0; i <= nodes + 2; i++) {
            var temp = [(i - 1) * cvs.width / nodes, 0, Math.random() * 200, .3];
            this.nodes.push(temp);
            console.log(temp);
        }
        console.log(this.nodes);
    }

function bounce(nodeArr) {
        nodeArr[1] = waveHeight / 2 * Math.sin(nodeArr[2] / 20) + cvs.height / 2;
        nodeArr[2] = nodeArr[2] + nodeArr[3];

}

function drawWave(obj) {

var diff = function (a, b) {
            return (b - a) / 2 + a;
        }

ctx.fillStyle = obj.colour;
        ctx.beginPath();
        ctx.moveTo(0, cvs.height);
        ctx.lineTo(obj.nodes[0][0], obj.nodes[0][1]);

for (var i = 0; i < obj.nodes.length; i++) {

if (obj.nodes[i + 1]) {
                ctx.quadraticCurveTo(
                    obj.nodes[i][0], obj.nodes[i][1],
                    diff(obj.nodes[i][0], obj.nodes[i + 1][0]), diff(obj.nodes[i][1], obj.nodes[i + 1][1])
                );
            }
            else {
                ctx.lineTo(obj.nodes[i][0], obj.nodes[i][1]);
                ctx.lineTo(cvs.width, cvs.height);
            }
        }
        ctx.closePath();
        ctx.fill();
    }

function drawNodes(array) {
        ctx.strokeStyle = "#888";

for (var i = 0; i < array.length; i++) {
            ctx.beginPath();
            ctx.arc(array[i][0], array[i][1], 4, 0, 2 * Math.PI);
            ctx.closePath();
            ctx.stroke();
        }

}

function drawLine(array) {
        ctx.strokeStyle = "#888";

for (var i = 0; i < array.length; i++) {

if (array[i + 1]) {
                ctx.lineTo(array[i + 1][0], array[i + 1][1]);
            }
        }

ctx.stroke();
    }

function resizeCanvas(canvas, width, height) {

if (width && height) {
            canvas.width = width;
            canvas.height = height;
        }
        else {

if (window.innerWidth > 1920) {
                canvas.width = window.innerWidth;
            }
            else {
                canvas.width = 1920;
            }

canvas.height = waveHeight;
        }
    }

/********************NavBar**************************/
function NavBar() {
    var x = document.getElementById("myTopnav");
    if (x.className === "topnav") {
        x.className += " responsive";
    } else {
        x.className = "topnav";
    }
}
window.onscroll = function () { scrollFunction() };
function scrollFunction() {
    if (document.body.scrollTop > 80 || document.documentElement.scrollTop > 80) {
        document.getElementById("myTopnav").style.width = "100%";
        document.getElementById("header").style.position = "fixed";
        document.getElementById("header").style.top = "0%";
    } else {
        document.getElementById("myTopnav").style.width = "80%";
        document.getElementById("header").style.position = "fixed";
        document.getElementById("header").style.top = "2rem";
    }
}
/*********************************Fotos**********************************/

function initImageUpload(box) {
    let uploadField = box.querySelector('.image-upload');

uploadField.addEventListener('change', getFile);

function getFile(e) {
        let file = e.currentTarget.files[0];
        checkType(file);
    }

function previewImage(file) {
        let thumb = box.querySelector('.js--image-preview'),
            reader = new FileReader();

reader.onload = function () {
            thumb.style.backgroundImage = 'url(' + reader.result + ')';
        }
        reader.readAsDataURL(file);
        thumb.className += ' js--no-default';
    }

}

// initialize box-scope
var boxes = document.querySelectorAll('.box');

for (let i = 0; i < boxes.length; i++) {
    let box = boxes[i];
    initDropEffect(box);
    initImageUpload(box);
}

/// drop-effect
function initDropEffect(box) {
    let area, drop, areaWidth, areaHeight, maxDistance, dropWidth, dropHeight, x, y;

// get clickable area for drop effect
    area = box.querySelector('.js--image-preview');
    area.addEventListener('click', fireRipple);

function fireRipple(e) {
        area = e.currentTarget
        // create drop
        if (!drop) {
            drop = document.createElement('span');
            drop.className = 'drop';
            this.appendChild(drop);
        }
        // reset animate class
        drop.className = 'drop';

// calculate dimensions of area (longest side)
        areaWidth = getComputedStyle(this, null).getPropertyValue("width");
        areaHeight = getComputedStyle(this, null).getPropertyValue("height");
        maxDistance = Math.max(parseInt(areaWidth, 10), parseInt(areaHeight, 10));

// set drop dimensions to fill area
        drop.style.width = maxDistance + 'px';
        drop.style.height = maxDistance + 'px';

// calculate dimensions of drop
        dropWidth = getComputedStyle(this, null).getPropertyValue("width");
        dropHeight = getComputedStyle(this, null).getPropertyValue("height");

// calculate relative coordinates of click
        // logic: click coordinates relative to page - parent's position relative to page - half of self height/width to make it controllable from the center
        x = e.pageX - this.offsetLeft - (parseInt(dropWidth, 10) / 2);
        y = e.pageY - this.offsetTop - (parseInt(dropHeight, 10) / 2) - 30;

// position drop and animate
        drop.style.top = y + 'px';
        drop.style.left = x + 'px';
        drop.className += ' animate';
        e.stopPropagation();
    }
}
/**********************EditarTablas***************************/
var params = null;
var colsEdi = null;
var newColHtml = '<div class="btn-group pull-right">' +
    '<button id="bEdit" type="button" class="btn btn-sm btn-default" onclick="rowEdit(this);">' +
    '<span class="glyphicon glyphicon-pencil" > <ion-icon name="create-outline"></ion-icon></span>' +
    '</button>' +
    '<button id="bElim" type="button" class="btn btn-sm btn-default" onclick="rowElim(this);">' +
    '<span class="glyphicon glyphicon-trash" ><ion-icon name="trash-outline"></ion-icon></span>' +
    '</button>' +
    '<button id="bAcep" type="button" class="btn btn-sm btn-default" style="display:none;" onclick="rowAcep(this);">' +
    '<span class="glyphicon glyphicon-ok" ><ion-icon name="checkmark-done-outline"></ion-icon> </span>' +
    '</button>' +
    '<button id="bCanc" type="button" class="btn btn-sm btn-default" style="display:none;" onclick="rowCancel(this);">' +
    '<span class="glyphicon glyphicon-remove" ><ion-icon name="close-circle-outline"></ion-icon></span>' +
    '</button>' +
    '</div>';
var colEdicHtml = '<td name="buttons">' + newColHtml + '</td>';
function FijModoNormal(but) {
    $(but).parent().find('#bAcep').hide();
    $(but).parent().find('#bCanc').hide();
    $(but).parent().find('#bEdit').show();
    $(but).parent().find('#bElim').show();
    var $row = $(but).parents('tr');
    $row.attr('id', '');
}
function FijModoEdit(but) {
    $(but).parent().find('#bAcep').show();
    $(but).parent().find('#bCanc').show();
    $(but).parent().find('#bEdit').hide();
    $(but).parent().find('#bElim').hide();
    var $row = $(but).parents('tr');
    $row.attr('id', 'editing');
}
function ModoEdicion($row) {
    if ($row.attr('id') == 'editing') {
        return true;
    } else {
        return false;
    }
}
function rowAcep(but) {
    var $row = $(but).parents('tr');
    var $cols = $row.find('td');
    if (!ModoEdicion($row)) return;
    IterarCamposEdit($cols, function ($td) {
        var cont = $td.find('input').val();
        $td.html(cont);
    });
    FijModoNormal(but);
    params.onEdit($row);
}
function rowCancel(but) {
    var $row = $(but).parents('tr');
    var $cols = $row.find('td');
    if (!ModoEdicion($row)) return;
    IterarCamposEdit($cols, function ($td) {
        var cont = $td.find('div').html();
        $td.html(cont);
    });
    FijModoNormal(but);
}
function rowEdit(but) {
    var $row = $(but).parents('tr');
    var $cols = $row.find('td');
    if (ModoEdicion($row)) return;
    IterarCamposEdit($cols, function ($td) {
        var cont = $td.html();
        var div = '<div style="display: none;">' + cont + '</div>';
        var input = '<input class="form-control input-sm" value="' + cont + '"required>';
        $td.html(div + input);
    });
    FijModoEdit(but);
}
function rowElim(but) {
    var $row = $(but).parents('tr');
    params.onBeforeDelete($row);
    $row.remove();
    params.onDelete();

}
function rowAddNew(tabId) {
    var $tab_en_edic = $("#" + tabId);
    var $filas = $tab_en_edic.find('tbody tr');

if ($filas.length == 0) {

var $row = $tab_en_edic.find('thead tr');
        var $cols = $row.find('th');

$tab_en_edic.find('tbody').append('<tr>' + htmlDat + '</tr>');
    } else {

/********************AgregarSeccionFotos**************************/
function agregarHtlm() {
    let contenedor = document.querySelector('#tablaDispensadores1');
    let p = document.createElement('div');
    p.setAttribute("class", "row ");
    p.setAttribute("id", "dispensadoresElim" + countEliminar);

p.innerHTML = ` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"></path></svg>
                    <div class="container">
                        <h1> Equipo `+ count2 + ` antes</h1>
                        <h1 style="display:none"> Equipo `+ count1++ + `</h1>

<div class="row d-flex justify-content-center contDescripcion"Sstyle="display: flex; justify-content: center;">
                            <div class="container">
                                <textarea class="textArea" placeholder="Describa el proceso que se realizado a los equipos...."></textarea>
                            </div>
                            <div class="col-sm d-flex justify-content-center">
                                <button class="btn-info" id="botonSeccionFotos1-`+ count1 + `" onclick="agregarSeccion` + count1 + `()">
                                    <span class="glyphicon glyphicon-plus-sign"></span>AÑADIR FOTOGRAFIAS
                                </button>
                            </div>
                        </div>
                    </div>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"></path></svg>
                    <div class="container">
                        <h1> Equipo `+ count2 + ` despues</h1>
                        <h1 style="display:none"> Equipo `+ count1++ + `</h1>

<div class="row d-flex align-items-center" id="AgregarFila1-`+ count1 + `"style="min-height: 500px;">
                            <div class="letrero col" id="letrero1-`+ id1++ +`">
                                <div class="text-letrero">
                                    <h1 class="text">Clic en añadir fotografías</h1>
                                </div>
                                <div class="arrow-letrero">
                                    <div class="arrow"></div>
                                </div>
                            </div>
                        </div>
                        <div class="row d-flex justify-content-center contDescripcion"Sstyle="display: flex; justify-content: center;">
                            <div class="container">
                                <textarea class="textArea" placeholder="Describa el proceso que se realizado a los equipos...."></textarea>
                            </div>
                            <div class="col-sm d-flex justify-content-center">
                                <button class="btn-info" id="botonSeccionFotos1-`+ count1 + `" onclick="agregarSeccion` + count1 + `()">
                                    <span class="glyphicon glyphicon-plus-sign"></span>AÑADIR FOTOGRAFIAS
                                </button>
                            </div>
                        </div>
                    </div>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>
                    `; 
    contenedor.appendChild(p);
    count2++;
    countEliminar++;

$(document).ready(function () {
        for (let i = 0; i <= 36; i++) {
            let selector = `#botonSeccionFotos1-${i}`;
            let contadorFotos = 1;
            for (let e = 1; e <= 34; e++) {
                let selector2 = `#letrero1-${e}`;
                $(selector).click(function () {
                    $(selector2).css("display", "none");
                });
            }
            $(selector).click(function () {
                contadorFotos++;
                if (contadorFotos >= 7) {
                    $(selector).css("display", "none");
                }
            });
        }
    });
}
function eliminarSeccion() {
    swal({
        title: "¿Desea Eliminar La Última Sección Agregada?",
        icon: "warning",
        buttons: true,
        dangerMode: true,
    })
        .then((willDelete) => {
            if (willDelete) {
                let contenedor = document.querySelector('#tablaDispensadores1');
                let divs = contenedor.querySelectorAll('div[id^="dispensadoresElim"]');
                if (divs.length > 0) {
                    let lastDiv = divs[divs.length - 1];
                    contenedor.removeChild(lastDiv);
                    count2--;
                } else {
                    alert("No Hay Secciones Para Eliminar");
                }
            }
        });
}
function eliminarSeccionCopia() {
    let contenedor = document.querySelector('#tablaDispensadores1');
    let divs = contenedor.querySelectorAll('div[id^="dispensadoresElim"]');
    if (divs.length > 0) {
        let lastDiv = divs[divs.length - 1];
        contenedor.removeChild(lastDiv);
        count2--;
    }
}

/************************************************************************************************************/
function agregarHtlm1() {
    let contenedor = document.querySelector('#tablaTanques1');
    let p = document.createElement('div');
    p.setAttribute("class", "row ");
    p.setAttribute("id", "tanquesElim" + countEliminar2);

p.innerHTML = ` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"></path></svg>
                    <div class="container">
                        <h1> Tanque `+ count4 + ` antes</h1>
                        <h1 style="display:none"> Tanque `+ count3++ + `</h1>

<div class="row d-flex justify-content-center contDescripcion"Sstyle="display: flex; justify-content: center;">
                            <div class="container">
                                <textarea class="textArea" placeholder="Describa el proceso que se realizado a los tanques...."></textarea>
                            </div>
                            <div class="col-sm d-flex justify-content-center">
                                <button class="btn-info" id="botonSeccionFotos2-`+ count3 + `" onclick="agregarSeccionTanques` + count3 + `()">
                                    <span class="glyphicon glyphicon-plus-sign"></span>AÑADIR FOTOGRAFIAS
                                </button>
                            </div>
                        </div>
                    </div>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"></path></svg>
                    <div class="container">
                        <h1> Tanque `+ count4 + ` despues</h1>
                        <h1 style="display:none"> Tanque `+ count3++ + `</h1>

<div class="row d-flex align-items-center" id="AgregarFila2-`+ count3 + `"style="min-height: 500px;">
                            <div class="letrero col" id="letrero2-`+ id2++ + `">
                                <div class="text-letrero">
                                    <h1 class="text">Clic en añadir fotografías</h1>
                                </div>
                                <div class="arrow-letrero">
                                    <div class="arrow"></div>
                                </div>
                            </div>
                        </div>
                        <div class="row d-flex justify-content-center contDescripcion"Sstyle="display: flex; justify-content: center;">
                            <div class="container">
                                <textarea class="textArea" placeholder="Describa el proceso que se realizado a los tnaques...."></textarea>
                            </div>
                            <div class="col-sm d-flex justify-content-center">
                                <button class="btn-info" id="botonSeccionFotos2-`+ count3 + `" onclick="agregarSeccionTanques` + count3 + `()">
                                    <span class="glyphicon glyphicon-plus-sign"></span>AÑADIR FOTOGRAFIAS
                                </button>
                            </div>
                        </div>
                    </div>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>
                    `;
    contenedor.appendChild(p);
    count4++;
    countEliminar2++;

$(document).ready(function () {
        for (let i = 0; i <= 36; i++) {
            let selector = `#botonSeccionFotos2-${i}`;
            let contadorFotos = 1;
            for (let e = 1; e <= 34; e++) {
                let selector2 = `#letrero2-${e}`;
                $(selector).click(function () {
                    $(selector2).css("display", "none");
                });
            }
            $(selector).click(function () {
                contadorFotos++;
                if (contadorFotos >= 7) {
                    $(selector).css("display", "none");
                }
            });
        }
    });
}
function eliminarSeccion2() {
    swal({
        title: "¿Desea Eliminar La Última Sección Agregada?",
        icon: "warning",
        buttons: true,
        dangerMode: true,
    })
        .then((willDelete) => {
            if (willDelete) {
                let contenedor = document.querySelector('#tablaTanques1');
                let divs = contenedor.querySelectorAll('div[id^="tanquesElim"]');
                if (divs.length > 0) {
                    let lastDiv = divs[divs.length - 1];
                    contenedor.removeChild(lastDiv);
                    count2--;
                } else {
                    alert("No Hay Secciones Para Eliminar");
                }
            }
        });
}

function agregarHtlm2() {
    let contenedor = document.querySelector('#consolaVeeder1');
    let p = document.createElement('div');
    p.setAttribute("class", "row ");
    p.setAttribute("id", "dispensadoresElim" + count5);

p.innerHTML = ` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"></path></svg>
                    <div class="container">
                        <h1> Control Ventas `+ count6 + ` antes</h1>
                        <h1 style="display:none"> Control Ventas `+ count5++ + `</h1>

<div class="row d-flex justify-content-center contDescripcion"Sstyle="display: flex; justify-content: center;">
                            <div class="container">
                                <textarea class="textArea" placeholder="Describa el proceso que se realizado a las Consolas...."></textarea>
                            </div>
                            <div class="col-sm d-flex justify-content-center">
                                <button class="btn-info" id="botonSeccionFotos3-`+ count5 + `" onclick="agregarSeccionConsola` + count5 + `()">
                                    <span class="glyphicon glyphicon-plus-sign"></span>AÑADIR FOTOGRAFIAS
                                </button>
                            </div>
                        </div>
                    </div>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"></path></svg>
                    <div class="container">
                        <h1> Control Ventas `+ count6 + ` despues</h1>
                        <h1 style="display:none"> Control Ventas `+ count5++ + `</h1>

<div class="row d-flex align-items-center" id="AgregarFila3-`+ count5 + `"style="min-height: 500px;">
                            <div class="letrero col" id="letrero3-`+ id2++ + `">
                                <div class="text-letrero">
                                    <h1 class="text">Clic en añadir fotografías</h1>
                                </div>
                                <div class="arrow-letrero">
                                    <div class="arrow"></div>
                                </div>
                            </div>
                        </div>
                        <div class="row d-flex justify-content-center contDescripcion"Sstyle="display: flex; justify-content: center;">
                            <div class="container">
                                <textarea class="textArea" placeholder="Describa el proceso que se realizado a los tnaques...."></textarea>
                            </div>
                            <div class="col-sm d-flex justify-content-center">
                                <button class="btn-info" id="botonSeccionFotos3-`+ count5 + `" onclick="agregarSeccionConsola` + count5 + `()">
                                    <span class="glyphicon glyphicon-plus-sign"></span>AÑADIR FOTOGRAFIAS
                                </button>
                            </div>
                        </div>
                    </div>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>
                    `;
    count6++;
    contenedor.appendChild(p);

$(document).ready(function () {
        for (let i = 0; i <= 36; i++) {
            let selector = `#botonSeccionFotos3-${i}`;
            let contadorFotos = 1;
            for (let e = 1; e <= 34; e++) {
                let selector2 = `#letrero3-${e}`;
                $(selector).click(function () {
                    $(selector2).css("display", "none");
                });
            }
            $(selector).click(function () {
                contadorFotos++;
                if (contadorFotos >= 7) {
                    $(selector).css("display", "none");
                }
            });
        }
    });
}
function eliminarSeccion3() {
    swal({
        title: "¿Desea Eliminar La Última Sección Agregada?",
        icon: "warning",
        buttons: true,
        dangerMode: true,
    })
        .then((willDelete) => {
            if (willDelete) {
                let contenedor = document.querySelector('#consolaVeeder1');
                let divs = contenedor.querySelectorAll('div[id^="dispensadoresElim"]');
                if (divs.length > 0) {
                    let lastDiv = divs[divs.length - 1];
                    contenedor.removeChild(lastDiv);
                    count2--;
                } else {
                    alert("No Hay Secciones Para Eliminar");
                }
            }
        });
}

function agregarHtlm3() {
    let contenedor = document.querySelector('#tablaSistemasnx1');
    let p = document.createElement('div');
    p.setAttribute("class", "row ");
    p.setAttribute("id", "sistemasnxElim" + count7);

p.innerHTML = ` <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"></path></svg>
                    <div class="container">
                        <h1> Tablero Electrico `+ count8 + ` antes</h1>
                        <h1 style="display:none"> Tablero Electrico `+ count7++ + `</h1>

<div class="row d-flex justify-content-center contDescripcion"Sstyle="display: flex; justify-content: center;">
                            <div class="container">
                                <textarea class="textArea" placeholder="Describa el proceso que se realizado a las Consolas...."></textarea>
                            </div>
                            <div class="col-sm d-flex justify-content-center">
                                <button class="btn-info" id="botonSeccionFotos4-`+ count7 + `" onclick="agregarSeccionSnx` + count7 + `()">
                                    <span class="glyphicon glyphicon-plus-sign"></span>AÑADIR FOTOGRAFIAS
                                </button>
                            </div>
                        </div>
                    </div>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"></path></svg>
                    <div class="container">
                        <h1> Tablero Electrico `+ count8 + ` despues</h1>
                        <h1 style="display:none"> Tablero Electrico `+ count7++ + `</h1>

<div class="row d-flex align-items-center" id="AgregarFila4-`+ count7 + `"style="min-height: 500px;">
                            <div class="letrero col" id="letrero4-`+ id2++ + `">
                                <div class="text-letrero">
                                    <h1 class="text">Clic en añadir fotografías</h1>
                                </div>
                                <div class="arrow-letrero">
                                    <div class="arrow"></div>
                                </div>
                            </div>
                        </div>
                        <div class="row d-flex justify-content-center contDescripcion"Sstyle="display: flex; justify-content: center;">
                            <div class="container">
                                <textarea class="textArea" placeholder="Describa el proceso que se realizado a los tnaques...."></textarea>
                            </div>
                            <div class="col-sm d-flex justify-content-center">
                                <button class="btn-info" id="botonSeccionFotos4-`+ count7 + `" onclick="agregarSeccionSnx` + count7 + `()">
                                    <span class="glyphicon glyphicon-plus-sign"></span>AÑADIR FOTOGRAFIAS
                                </button>
                            </div>
                        </div>
                    </div>
                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" style="min-width: 300px">><path fill="#0099ff" fill-opacity="1" d="M0,224L48,224C96,224,192,224,288,202.7C384,181,480,139,576,149.3C672,160,768,224,864,234.7C960,245,1056,203,1152,197.3C1248,192,1344,224,1392,240L1440,256L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>
                    `;
    count8++;
    contenedor.appendChild(p);

$(document).ready(function () {
        for (let i = 0; i <= 36; i++) {
            let selector = `#botonSeccionFotos4-${i}`;
            let contadorFotos = 1;
            for (let e = 1; e <= 34; e++) {
                let selector2 = `#letrero4-${e}`;
                $(selector).click(function () {
                    $(selector2).css("display", "none");
                });
            }
            $(selector).click(function () {
                contadorFotos++;
                if (contadorFotos >= 7) {
                    $(selector).css("display", "none");
                }
            });
        }
    });
}
function eliminarSeccion4() {
    swal({
        title: "¿Desea Eliminar La Última Sección Agregada?",
        icon: "warning",
        buttons: true,
        dangerMode: true,
    })
        .then((willDelete) => {
            if (willDelete) {
                let contenedor = document.querySelector('#tablaSistemasnx1');
                let divs = contenedor.querySelectorAll('div[id^="sistemasnxElim"]');
                if (divs.length > 0) {
                    let lastDiv = divs[divs.length - 1];
                    contenedor.removeChild(lastDiv);
                    count2--;
                } else {
                    alert("No Hay Secciones Para Eliminar");
                }
            }
        });
}

${this.title}

Code Editor : script.js