The Broken Home

by Eric Miller

HTML

<!DOCTYPE html lang="en-US">
    <head>
        <title id="page-title">A-S Meds</title>
        <link rel="icon" type="image/x-icon" href="/assets/favicon.ico" />
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <!-- jquery First-->
        <script await src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
        <!-- stylesheets -->
        <link rel="stylesheet" href="/css/normalize.css" />
        <link rel="stylesheet" href="/css/global.css" />
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
        <!--
            <script type="application/javascript" src="https://api.trello.com/1/client.js?key=b36cd23150cefcc3278c448946e49874"></script>
		-->
        <script type="text/javascript" src="/pages/phones/amazon-connect-v1.7.4.js"></script>
        <script type="module" src="app.js" defer></script>
        <script type="application/javascript" src="/js/tabulator.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.4/moment.min.js" crossorigin="anonymous"></script> <!--  integrity="sha512-CryKbMe7sjSCDPl18jtJI5DR5jtkUWxPXWaLCst6QjH8wxDexfRJic2WRmRXmstr2Y8SxDDWuBO6CQC6IE4KTA=="   referrerpolicy="no-referrer"-->

        <!-- Bootstrap Icons -->
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
     
    </head>
    <body id="app">
        <div id="alert-area"></div> 
        <noscript>You must enable JavaScript for this site to work properly.</noscript>
        <!--  -->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.10.1/bootstrap-table.min.js"></script>
        <script...

JavaScript

function getData(context){
  context.activeContract = context.newContract();
  context.parentContext.updateContractSelect();

  // Set contract select to added contract //Change
  let contractSelect = context.parentContext.shadowRoot.querySelector('#contract-select');
  contractSelect.selectedIndex = contractSelect.length-1;
  contractSelect.dispatchEvent(new Event('change'));
  context.parentContext.groupPop.updateContractList();
  context.style.display = 'none'
  context.contractName.value = '';
  context.copayOption.value = '';
  context.dispenseFeeDefault.value = '';
  const feeBox = context.feebox.querySelector('fee-box');
  if( feeBox !== null ) {
  	feeBox.remove()
  };
  context.feebox.appendChild(
  	new FeeBox(context.activeContract, true, false, this.parentContext)
  ); 
}


class SomeElement extends HTMLElement {


	applyEventListeners() {
        const endPopUp = this.shadowRoot.querySelector("#submit-button-close");
        endPopUp.onclick = () => {
            this.style.display = "none";
        }
        
        this.shadowRoot.addEventListener("click", async () => {
            const inputs = this.shadowRoot.querySelectorAll(".FormatInput");

            for (const iterator of inputs) {
                if (iterator.id != "MFG NDC" && iterator.parentElement.className.includes("invalid")) {
                  iterator.parentElement.classList.remove("invalid", "animated", "flash");
                  //void iterator.parentElement.offsetWidth;
                }
                
                let verification = false;
                if (iterator.id != "MFG NDC") {
                    if (iterator.value == "") {
                        iterator.parentElement.classList.add("invalid", "animated", "flash");
                        verification = true;
                    } else {
                        this.shadowRoot.getElementById("create-modal").remove();
                    }
                }
            }
        });
        
        return...