{% extends "site.html" %}


{% block head %}
    {{ block.super }}
    <script>
        let start_time;
        let end_time;

        jQuery.validator.addMethod("notEqual", function(value, element, param) {
            return value !== param;
        }, "This has to be different...");

        var editinstance_idx = 1;
        var editpackage_idx = 1;

        var mfgAutocomplete = {
            source: "{% url 'site:drug-sitedrug-manufacturer-lookup' %}",
            minLength: 2
        };

        var shapeAutocomplete = {
            source: "{% url 'site:drug-sitedrug-shape-lookup' %}",
            minLength: 2
        };

        var colorAutocomplete = {
            source: "{% url 'site:drug-sitedrug-color-lookup' %}",
            minLength: 2
        };

        function cUpper(cObj) {
            cObj.value = cObj.value.toUpperCase();
        }

        function doAddPackageRow(new_pack_code) {
            var packCodeName = "drug-pack-code-new-" + editpackage_idx.toString();
            var qtyName = "drug-quantity-new-" + editpackage_idx.toString();
            var barcodeName = "drug-barcode-new-" + editpackage_idx.toString();
            var delRowName = "del-package-new-" + editpackage_idx.toString();
            var rowId = "new-package-row-" + editpackage_idx.toString();
            var packVal = "value=\"";
            if (new_pack_code != "None" && new_pack_code != "" && new_pack_code != null) {
                packVal += new_pack_code + "\"";
            } else {
                packVal += "\"";
            }

            var pkgrow = "<tr id=\"" + rowId + "\">";
            var curpkg_count = 1;
            if (!($("#edit-package-drugnum").length)) {
                {% if drugnum_type == 'NDC' %}
                 pkgrow += "<td id=\"edit-package-drugnum\" class=\"site-drug-edit-td\" style=\"width: 200px;\"" +
                            "rowspan=\"1\"><input type=\"text\" id=\"drug-number-labeller\" name=\"drug-number-labeller\"" +
                            "style=\"width: 5em;\" value=\"{{ authorityData.drug_number|slice:"0:5" }}\" required readonly><b>-</b>" +
                            "<input type=\"text\" id=\"drug-number-product\" name=\"drug-number-product\" style=\"width: 4em;\"" +
                            "value=\"{{ authorityData.drug_number|slice:"5:9" }}\" required readonly><b>-</b></td>";
                {% endif %}

            } else {
                curpkg_count = parseInt($("#edit-package-drugnum").attr("rowspan"));
            }
            pkgrow += "<td class=\"site-drug-edit-td\" style=\"text-align: left;\">" +
                    "<input type=\"text\" id=\"" + packCodeName +
                    "\" name=\"" + packCodeName + "\" " + packVal + " style=\"width: 2em;\"></td>" +
                    "<td class=\"site-drug-edit-td\"><input type=\"text\" id=\"" + qtyName +
                    "\" name=\"" + qtyName + "\" style=\"width: 5em;\" ></td>" +
                    "<td class=\"site-drug-edit-td\"><input type=\"text\" id=\"" + barcodeName +
                    "\" name=\"" + barcodeName + "\" style=\"width: 12em;\"></td>" +
                    "<td class=\"site-drug-edit-td\"><button type=\"button\" id=\"" + delRowName +
                    "\"><i class=\"icon-remove\"></i></button></tr></tr>";
            curpkg_count = curpkg_count + editpackage_idx;
            editpackage_idx++;
            $("#edit-package-table tbody").append(pkgrow);
            $("#edit-package-drugnum").attr("rowspan", curpkg_count.toString());
            //add validation also
            addDrugPackCodeValidation($("#" + packCodeName));
            addDrugQuantityValidation($("#" + qtyName));
            //add remove button handler
            $("#" + delRowName).click(function () {
                $("#" + rowId).remove();
            });
        }

        function doAddInstanceRow() {
            var tdtag = "<td class=\"site-drug-edit-td\">";
            var mfgName = "drug-manufacturer-new-" + editinstance_idx.toString();
            var shapeName = "drug-shape-new-" + editinstance_idx.toString();
            var colorName = "drug-color-new-" + editinstance_idx.toString();
            var frontImpName = "drug-front-imprint-new-" + editinstance_idx.toString();
            var backImpName = "drug-back-imprint-new-" + editinstance_idx.toString();
            var drugCostName = "drug-cost-new-" + editinstance_idx.toString();
            var distNumName = "drug-dist-num-new-" + editinstance_idx.toString();
            var delRowName = "del-instance-new-" + editinstance_idx.toString();
            var maxQtyName = "drug-max-canister-quantity-new-" + editinstance_idx.toString();
            var rowId = "new-instance-row-" + editinstance_idx.toString();
            var instrow = "<tr id=\"" + rowId + "\">" + tdtag + "<input type=\"text\" id=\"" + mfgName +
                    "\" name=\"" + mfgName + "\" style=\"width: 15em; text-transform: uppercase;\" required></td>" +
                    tdtag + "<input type=\"text\" id=\"" + shapeName +
                    "\" name=\"" + shapeName + "\" style=\"width: 8em; text-transform: uppercase;\" required></td>" +
                    tdtag + "<input type=\"text\" id=\"" + colorName +
                    "\" name=\"" + colorName + "\" style=\"width: 10em; text-transform: uppercase;\" required></td>" +
                    tdtag + "<input type=\"text\" id=\"" + frontImpName +
                    "\" name=\"" + frontImpName + "\" style=\"width: 6em;\"></td>" +
                    tdtag + "<input type=\"text\" id=\"" + backImpName +
                    "\" name=\"" + backImpName + "\" style=\"width: 6em;\"></td>" +
                    tdtag + "<input type=\"text\" id=\"" + drugCostName +
                    "\" name=\"" + drugCostName + "\" style=\"width: 4em;\"></td>" +
                    tdtag + "<input type=\"text\" id=\"" + distNumName +
                    "\" name=\"" + distNumName + "\" style=\"width: 6em;\"></td>" +
                    "<td class=\"site-drug-edit-td\" name=\"qty-td\">" + "<input type=\"number\" id=\"" + maxQtyName +
                    "\" name=\"" + maxQtyName + "\" style=\"width: 6em;\"></td>" +
                    tdtag + "<button type=\"button\" id=\"" + delRowName +
                    "\"><i class=\"icon-remove\"></i></button></tr>";
            editinstance_idx++;
            $("#edit-instance-table tbody").append(instrow);

            {% if not show_max_qty %}
            var cells = document.getElementsByName("qty-td");
            for (let i of cells.keys()) {
                cells[i].style.display = 'none'
            }
            {% endif %}
            //add autocomplete
            $("#" + mfgName).autocomplete(mfgAutocomplete);
            $("#" + shapeName).autocomplete(shapeAutocomplete);
            $("#" + colorName).autocomplete(colorAutocomplete);
            //add validation also
            addDrugManufacturerValidation($("#" + mfgName));
            addDrugShapeValidation($("#" + shapeName));
            addDrugColorValidation($("#" + colorName));
            addDrugCostValidation($("#" + drugCostName));
            //add remove button handler
            $("#" + delRowName).click(function () {
                $("#" + rowId).remove();
            });
        }

        function addDrugNumLabellerValidation(target) {
            target.rules('add', {
                required: true,
                digits: true,
                notEqual: "00000",
                messages: {
                    required: "Labeller portion of drug number cannot be blank.",
                    rangelength: "Labeller portion of drug number must be 5 digits.",
                    digits: "Labeller portion of drug number must be numeric.",
                    notEqual: "Labeller porition of drug number cannot be 00000."
                }
            });
        }

        function addDrugNumProductValidation(target) {
            target.rules('add', {
                required: true,
                digits: true,
                notEqual: "0000",
                messages: {
                    required: "Product portion of drug number cannot be blank.",
                    rangelength: "Product portion of drug number must be 4 digits.",
                    digits: "Product portion of drug number must be numeric.",
                    notEqual: "Product portion of drug number cannot be 0000."
                }
            });
        }

        function addDrugPackCodeValidation(target) {
            target.rules('add', {
                required: true,
                digits: true,
                messages: {
                    required: "Package Code portion of drug number cannot be blank.",
                    rangelength: "Package Code portion of drug number must be 2 digits.",
                    digits: "Package Code portion of drug number must be numeric.",
                }
            });
        }

        function addDrugNumOtherValidation(target) {
            target.rules('add', {
                required: true,
                digits: true,
                messages: {
                    required: "Drug Number cannot be blank.",
                    digits: "Drug Number must be numeric."
                }
            });
        }


        function addNewPharmaceuticalValidation(target) {
            target.rules('add', {
                required: true,
                remote: {
                    url: "{% url 'site:drug-sitedrug-pharmaceutical-check' %}",
                    type: "GET"
                },
                messages: {
                    required: "Pharmaceutical cannot be blank.",
                    remote: jQuery.validator.format("{0} is not in the pharmaceutical list. <button type=\"button\" name=\"add-add-pharmaceutical-link\"" +
                            " onclick=\"addAddNewPharmaceutical()\">Add Pharmaceutical</button>")
                }
            });
        }

        function addNewPharmaceutical() {
            $("#drug-name-input").val('');
            $("#drug-strength").val('');
            $("#drug-unit").val('');
            $("#drug-form").val('');
            addDrugNameValidation($("#drug-name-input"));
            addDrugStrengthValidation($("#drug-strength"));
            addDrugUnitValidation($("#drug-unit"));
            addDrugFormValidation($("#drug-form"));
            $("#add-pharmaceutical-row").show();
        }

        function addAddNewPharmaceutical() {
            $("#add-drug-name-input").val('');
            $("#add-drug-strength").val('');
            $("#add-drug-unit").val('');
            $("#add-drug-form").val('');
            addDrugNameValidation($("#add-drug-name-input"));
            addDrugStrengthValidation($("#add-drug-strength"));
            addDrugUnitValidation($("#add-drug-unit"));
            addDrugFormValidation($("#add-drug-form"));
            $("#add-new-pharmaceutical-row").show();
        }

        function cancelAddNewPharmaceutical() {
            $("#drug-name-input").val('');
            $("#drug-strength").val('');
            $("#drug-unit").val('');
            $("#drug-form").val('');
            $("#drug-name-input").rules("remove");
            $("#drug-strength").rules("remove");
            $("#drug-unit").rules("remove");
            $("#drug-form").rules("remove");
            $("form").each(function () {
                var validator = $(this).validate();
                validator.resetForm();
                validator.form();
            });
            $("#add-pharmaceutical-row").hide();
        }

        function cancelAddAddNewPharmaceutical() {
            $("#add-drug-name-input").val('');
            $("#add-drug-strength").val('');
            $("#add-drug-unit").val('');
            $("#add-drug-form").val('');
            $("#add-drug-name-input").rules("remove");
            $("#add-drug-strength").rules("remove");
            $("#add-drug-unit").rules("remove");
            $("#add-drug-form").rules("remove");
            $("form").each(function () {
                var validator = $(this).validate();
                validator.resetForm();
                validator.form();
            });
            $("#add-new-pharmaceutical-row").hide();
        }

        function addDrugLabelNameValidation(target) {
            target.rules('add', {
                required: true,
                messages: {
                    required: "Drug Label Name cannot be blank."
                }
            });
        }

        function addDrugLabelFormValidation(target) {
            target.rules('add', {
                required: true,
                messages: {
                    required: "Drug Label Form cannot be blank."
                }
            });
        }


        function addDrugNameToList(drugname) {
            $.get("{% url 'site:drug-sitedrug-name-add' %}?drugname=" + drugname.trim(), null, function() {
                $("#add-drug-name-input").removeData("previousValue");
                $("#add-drug-name-input").valid();
                $("#drug-name-input").removeData("previousValue");
                $("#drug-name-input").valid();
            });

        }

        function addDrugNameValidation(target) {
            target.rules('add', {
                required: true,
                remote: {
                    url: "{% url 'site:drug-sitedrug-name-check' %}",
                    type: "GET"
                },
                messages: {
                    required: "Drug Name cannot be blank.",
                    remote: jQuery.validator.format("{0} is not in the drug name list. <button type=\"button\" name=\"add-drug-name\"" +
                            " onclick=\"addDrugNameToList('{0}')\">Add To List</button>")
                }
            });
        }

        function addDrugStrengthToList(strength) {
            $.get("{% url 'site:drug-sitedrug-strength-add' %}?strength=" + strength.trim(), null, function() {
                $("#add-drug-strength").removeData("previousValue");
                $("#add-drug-strength").valid();
                $("#drug-strength").removeData("previousValue");
                $("#drug-strength").valid();
            });
        }

        function addDrugStrengthValidation(target) {
            target.rules('add', {
                remote: {
                    url: "{% url 'site:drug-sitedrug-strength-check' %}",
                    type: "GET"
                },
                messages: {
                    remote: jQuery.validator.format("{0} is not in the strength list. <button type=\"button\" name=\"add-drug-strength\"" +
                            " onclick=\"addDrugStrengthToList('{0}')\">Add To List</button>")
                }
            });
        }

        function addDrugUnitToList(unit) {
            $.get("{% url 'site:drug-sitedrug-unit-add' %}?unit=" + unit.trim(), null, function() {
                 $("#add-drug-unit").removeData("previousValue");
                $("#add-drug-unit").valid();
                $("#drug-unit").removeData("previousValue");
                $("#drug-unit").valid();
            });
        }

        function addDrugUnitValidation(target) {
            target.rules('add', {
                remote: {
                    url: "{% url 'site:drug-sitedrug-unit-check' %}",
                    type: "GET"
                },
                messages: {
                    remote: jQuery.validator.format("{0} is not in the unit list. <button type=\"button\" name=\"add-drug-unit\"" +
                            " onclick=\"addDrugUnitToList('{0}')\">Add To List</button>")
                }
            });
        }

        function addDrugFormToList(form) {
            $.get("{% url 'site:drug-sitedrug-form-add' %}?form=" + form.trim(), null, function() {
                 $("#add-drug-form").removeData("previousValue");
                $("#add-drug-form").valid();
                $("#drug-form").removeData("previousValue");
                $("#drug-form").valid();
            });
        }

        function addDrugFormValidation(target) {
            target.rules('add', {
                required: true,
                remote: {
                    url: "{% url 'site:drug-sitedrug-form-check' %}",
                    type: "GET"
                },
                messages: {
                    required: "Dosage Form cannot be blank.",
                    remote: jQuery.validator.format("{0} is not in the dosage form list. <button type=\"button\" name=\"add-drug-form\"" +
                            " onclick=\"addDrugFormToList('{0}')\">Add To List</button>")
                }
            });
        }

        function addDrugManufacturerToList(manufacturer) {
            $.get("{% url 'site:drug-sitedrug-manufacturer-add' %}?manufacturer=" + manufacturer.trim());
            /*$("#add-drug-manufacturer").removeData("previousValue");
            $("#add-drug-manufacturer").valid();*/
            $("input[name^='drug-manufacturer']").each(function () {
                $(this).removeData("previousValue");
                $(this).valid();
            });
        }

        function addDrugManufacturerValidation(target) {
            target.rules('add', {
                required: true,
                remote: {
                    url: "{% url 'site:drug-sitedrug-manufacturer-check' %}",
                    type: "GET"
                },
                messages: {
                    required: "Manufacturer cannot be blank.",
                    remote: jQuery.validator.format("{0} is not in the manufacturerlist. <button type=\"button\" name=\"add-drug-manufacturer\"" +
                            " onclick=\"addDrugManufacturerToList('{0}')\">Add To List</button>")
                }
            });
        }

        function addDrugShapeToList(shape) {
            $.get("{% url 'site:drug-sitedrug-shape-add' %}?shape=" + shape.trim());
            /*$("#add-drug-shape").removeData("previousValue");
            $("#add-drug-shape").valid();*/
            $("input[name^='drug-shape']").each(function () {
                $(this).removeData("previousValue");
                $(this).valid();
            });
        }

        function addDrugShapeValidation(target) {
            target.rules('add', {
                required: true,
                remote: {
                    url: "{% url 'site:drug-sitedrug-shape-check' %}",
                    type: "GET"
                },
                messages: {
                    required: "Shape cannot be blank.",
                    remote: jQuery.validator.format("{0} is not in the shape list. <button type=\"button\" name=\"add-drug-shape\"" +
                            " onclick=\"addDrugShapeToList('{0}')\">Add To List</button>")
                }
            });
        }

        function addDrugColorToList(color) {
            $.get("{% url 'site:drug-sitedrug-color-add' %}?color=" + color.trim());
            /*$("#add-drug-color").removeData("previousValue");
            $("#add-drug-color").valid();*/
            $("input[name^='drug-color']").each(function () {
                $(this).removeData("previousValue");
                $(this).valid();
            });
        }

        function addDrugColorValidation(target) {
            target.rules('add', {
                required: true,
                remote: {
                    url: "{% url 'site:drug-sitedrug-color-check' %}",
                    type: "GET"
                },
                messages: {
                    required: "Color cannot be blank.",
                    remote: jQuery.validator.format("{0} is not in the color list. <button type=\"button\" name=\"add-drug-color\"" +
                            " onclick=\"addDrugColorToList('{0}')\">Add To List</button>")
                }
            });
        }

        function addDrugCostValidation(target) {
            target.rules('add', {
                number: true,
                messages: {
                    number: "Pill Cost must be numeric."
                }
            });
        }

        function addDrugQuantityValidation(target) {
            target.rules('add', {
                required: true,
                digits: true,
                messages: {
                    required: "Stock bottle quantity is required.",
                    digits: "Stock bottle quantity must be numeric."
                }
            });
        }

        function hideAddSiteDrugFields() {
            $("#add-site-drug-save-button").hide();
            $("#check-drugnum-exists").show();
            $("#clear-drugnum-fields").show();
            $("#ndc-help-row").show();
            $("#add-drug-pharmaceutical-row").hide();
            $("#add-pharma-attribs-row").hide();
            $("#add-manufacturer-info-table").hide();
            $("#add-stock-bottle-info-table").hide();
            $("#add-drug-image-upload-tr").hide();
            $("#drug-alternate-id-add").hide();
            $("#drug-black-box-warn").hide();
            $("#drug-secure-drug").hide();
            $("#show-add-drug-advanced").hide();
        }

        function showAddSiteDrugFields() {
            $("#check-drugnum-exists").hide();
            $("#clear-drugnum-fields").hide();
            $("#add-site-drug-save-button").show();
            $("#add-drug-pharmaceutical-row").show();
            $("#ndc-help-row").hide();
            $("#add-dosage-form-row").show();
            $("#add-pharma-attribs-row").show();
            $("#add-manufacturer-info-table").show();
            $("#add-stock-bottle-info-table").show();
            $("#add-drug-image-upload-tr").show();
            $("#drug-alternate-id-add").show();
            $("#drug-black-box-warn").show();
            $("#drug-secure-drug").show();
            $("#show-add-drug-advanced").show();

            {% if drugnum_type == 'NDC' %}
                $("#drug-number-labeller-add").attr("readonly", true);
                $("#drug-number-product-add").attr("readonly", true);
                $("#drug-pack-code-add").attr("readonly", true);
            {% else %}
                $("#drug-number-other-add").attr("readonly", true);
            {% endif %}

        }

        $(function () {
            $("#drug-blister-allowed").sortable();
            $("#drug-blister-allowed-add").sortable();

            $("#show-edit-drug-advanced").click(function () {
                $(this).hide();
                $("#edit-drug-advanced").show();
                $("#hide-edit-drug-advanced").show();
            });

            $("#hide-edit-drug-advanced").click(function () {
                $(this).hide();
                $("#edit-drug-advanced").hide();
                $("#show-edit-drug-advanced").show();
            });

            $("#show-add-drug-advanced").click(function () {
                $(this).hide();
                $("#add-drug-advanced").show();
                $("#hide-add-drug-advanced").show();
            });

            $("#hide-add-drug-advanced").click(function () {
                $(this).hide();
                $("#add-drug-advanced").hide();
                $("#show-add-drug-advanced").show();
            });

            $("#max-per-blister").dialog({
                autoOpen: false,
                closeOnEscape: true,
                modal: true,
                draggable: false,
                width: 800,
                position: {my: "top", at: "top", of: window},
                open: function (event, ui) {
                    $("#max-per-blister-content").html("Loading Instance Data...");
                    $.ajax({
                        url: "{% url 'support:get-max-per-blister' %}",
                        type: "POST",
                        data: {
                            csrfmiddlewaretoken: "{{csrf_token}}",
                            inst_id: $("#current_inst_id").val()
                        },
                        success: function (data, status, jqXHR) {
                            $("#max-per-blister-content").html(data);
                        }
                    })
                },
                buttons: [
                    {
                        text: "Close",
                        "class": "modal-dialog-button-right",
                        click: function () {
                            $(this).dialog("close");
                        }
                    },
                    {
                        text: "Save",
                        "class": "modal-dialog-button-left",
                        click: function () {
                            submitMaxPillsForm();
                        }
                    }
                ]
            });

            $("button[name^='btn-max-per-blister']").click(function (event) {
                $("#current_inst_id").val(get_icon_button_value(event));
                $("#max-per-blister").dialog("open");
            });

            $("#add-site-drug").dialog({
                {% if showAddEdit == "ADD"%}
                    autoOpen: true,
                {% else %}
                    autoOpen: false,
                {% endif %}
                closeOnEscape: false,
                modal: true,
                draggable: false,
                open: function (event, ui) {
                    {% if showFullForm == True %}
                        showAddSiteDrugFields();
                    {% else %}
                        hideAddSiteDrugFields();
                    {% endif %}
                },
                width: 1200,
                buttons: [
                    {
                        text: "Close",
                        "class": 'modal-dialog-button-right',
                        click: function () {
                            $("#addSiteDrugForm").validate().resetForm();
                            $(this).dialog("close");
                            location.href = "{% url 'site:drug-site-drugs' %}?page={{ current_page }}&sort={{ current_sort }}";
                        }
                    },
                    {
                        text: "Save",
                        id: "add-site-drug-save-button",
                        "class": 'modal-dialog-button-left',
                        click: function () {
                            // $("#addSiteDrugForm").validate();
                            if ($("#addSiteDrugForm").valid()) {
                                $("#addSiteDrugForm").attr("action", "{% url 'site:drug-add-site-drug' %}?page={{ current_page }}&sort={{ current_sort }}");
                                $("#blister-type-sort-add").val($("#drug-blister-allowed-add").sortable('toArray'));
                                document.addSiteDrugForm.submit();
                                $(this).dialog("close");
                            }
                        }
                    }
                ]
            });

            $("#edit-site-drug").dialog({
                {% if showAddEdit == "EDIT"%}
                    autoOpen: true,
                {% else %}
                    autoOpen: false,
                {% endif %}
                closeOnEscape: false,
                modal: true,
                draggable: false,
                width: 1220,
                buttons: [
                    {
                        text: "Close",
                        "class": 'modal-dialog-button-right',
                        click: function () {
                            $("#editSiteDrugForm").validate().resetForm();
                            $(this).dialog("close");
                            location.href = "{% url 'site:drug-site-drugs' %}?page={{ current_page }}&sort={{ current_sort }}";
                        }
                    },
                    {
                        text: "Save",
                        "class": 'modal-dialog-button-left',
                        click: function (event) {
                            //$("#editSiteDrugForm").validate();
                            if ($("#editSiteDrugForm").valid()) {
                                {% if authorityData %}
                                    $("#editSiteDrugForm").attr("action", "{% url 'site:drug-site-drug-edit' authorityData.id %}?page={{ current_page }}&sort={{ current_sort }}");
                                {% else %}
                                    $("#editSiteDrugForm").attr("action", "?page={{ current_page }}&sort={{ current_sort }}");
                                {% endif %}
                                $("#blister-type-sort").val($("#drug-blister-allowed").sortable('toArray'));
                                document.editSiteDrugForm.submit();
                                $(this).dialog("close");
                            }
                        }
                    }
                ]
            });

            $("#check-drugnum-exists").click(function () {
                {% if drugnum_type == 'NDC' %}
                    //$("#drug-number-labeller-add").validate();
                    //$("#drug-number-product-add").validate();
                    //$("#drug-pack-code-add").validate();
                    if ($("#drug-number-labeller-add").valid() && $("#drug-number-product-add").valid() && $("#drug-pack-code-add").valid()) {
                        $("#addSiteDrugForm").attr("action", "{% url 'site:drug-check-drugnum-exists' %}");
                        $("#addSiteDrugForm").submit();
                    }
                {% else %}
                    //$("#drug-number-other-add").validate();
                    if ($("#drug-number-other-add").valid()) {
                        $("#addSiteDrugForm").attr("action", "{% url 'site:drug-check-drugnum-exists' %}");
                        $("#addSiteDrugForm").submit();
                    }
                {% endif %}
            });

            $("#clear-drugnum-fields").click(function () {
                {% if drugnum_type == 'NDC' %}
                    $("#drug-number-labeller-add").focus();
                    $("#drug-number-labeller-add").val('');
                    $("#drug-number-product-add").val('');
                    $("#drug-pack-code-add").val('');
                {% else %}
                    $("#drug-number-other-add").val('');
                    $("#drug-number-other-add").focus();
                {% endif %}
            });

            $("#add-instance-link").click(function () {
                doAddInstanceRow();
            });

            $("#add-package-link").click(function () {
                doAddPackageRow();
            });

            $("button[id^='disable_site_drug_']").click(function (event) {
                $.post("{% url 'site:set-site-drug-disabled' %}", {
                    inst_id: $(this).val(),
                    csrfmiddlewaretoken: '{{csrf_token}}'
                });
                $("#disable_site_drug_" + $(this).val()).hide();
                $("#enable_site_drug_" + $(this).val()).show();
                var btnrow = $(this).closest('tr');
                btnrow.children().each (function() {
                    $(this).addClass('inactive-cell');
                });
            });

            $("button[id^='enable_site_drug_']").click(function (event) {
                $.post("{% url 'site:set-site-drug-enabled' %}", {
                    inst_id: $(this).val(),
                    csrfmiddlewaretoken: '{{csrf_token}}'
                });
                $("#disable_site_drug_" + $(this).val()).show();
                $("#enable_site_drug_" + $(this).val()).hide();
                var btnrow = $(this).closest('tr');
                btnrow.children().each (function() {
                    $(this).removeClass('inactive-cell');
                });
            });

            $("button[id^='disable-instance-']").click(function (event) {
                $.post("{% url 'site:set-site-drug-disabled' %}", {
                    inst_id: $(this).val(),
                    csrfmiddlewaretoken: '{{csrf_token}}'
                });
                $("#disable-instance-" + $(this).val()).hide();
                $("#enable-instance-" + $(this).val()).show();
                var btnrow = $(this).closest('tr');
                btnrow.children().each (function() {
                    $(this).addClass('inactive-cell');
                    $(this).children().each (function() {
                        $(this).addClass('inactive-cell');
                    });
                });
            });

            $("button[id^='enable-instance-']").click(function (event) {
                $.post("{% url 'site:set-site-drug-enabled' %}", {
                    inst_id: $(this).val(),
                    csrfmiddlewaretoken: '{{csrf_token}}'
                });
                $("#disable-instance-" + $(this).val()).show();
                $("#enable-instance-" + $(this).val()).hide();
                var btnrow = $(this).closest('tr');
                btnrow.children().each (function() {
                    $(this).removeClass('inactive-cell');
                     $(this).children().each (function() {
                        $(this).removeClass('inactive-cell');
                    });
                });
            });

            $("input[name$='pharmaceutical-input']").autocomplete({
                source: "{% url 'site:drug-sitedrug-pharmaceutical-lookup' %}",
                minLength: 2
            });

            $("input[name$='drug-name-input']").autocomplete({
                source: "{% url 'site:drug-sitedrug-name-lookup' %}",
                minLength: 2
            });

            $("input[name$='drug-strength']").autocomplete({
                source: "{% url 'site:drug-sitedrug-strength-lookup' %}",
                minLength: 1
            });

            $("input[name$='drug-unit']").autocomplete({
                source: "{% url 'site:drug-sitedrug-unit-lookup' %}",
                minLength: 1
            });

            $("input[name$='drug-form']").autocomplete({
                source: "{% url 'site:drug-sitedrug-form-lookup' %}",
                minLength: 2
            });

            $("input[name^='drug-manufacturer']").autocomplete(mfgAutocomplete);
            $("input[name^='drug-shape']").autocomplete(shapeAutocomplete);
            $("input[name^='drug-color']").autocomplete(colorAutocomplete);

            var addcontainer = $("#add-site-drug-validation-alert");
            var editcontainer = $("#edit-site-drug-validation-alert");

            $("#addSiteDrugForm").validate({
                onkeyup: false,
                onfocusout: function (element) {
                    $(element).valid();
                },
                errorContainer: addcontainer,
                errorLabelContainer: $("ul", addcontainer),
                wrapper: 'li'
            });

            $("#editSiteDrugForm").validate({
                onkeyup: false,
                onfocusout: function (element) {
                    $(element).valid();
                },
                errorContainer: editcontainer,
                errorLabelContainer: $("ul", editcontainer),
                wrapper: 'li'
            });

            $("input[name^='drug-number-labeller']").each(function () {
                addDrugNumLabellerValidation($(this));
                $(this).blur(function () {
                    $(this).val(("00000" + $(this).val()).slice(-5));
                });
            });

            $("input[name^='drug-number-other']").each(function () {
                addDrugNumOtherValidation($(this));
            });


            $("#drug-number-labeller-add").keydown(function (event) {
                if (this.value.length === 1) {
                    start_time = new Date();
                }
                if (event.which == 109 || event.which == 173 || event.which == 189) {  //-
                    $("#drug-number-product-add").focus();
                    return false;
                }
            });

            $("#drug-number-labeller-add").keyup(function (event) {
                if (this.value.length == this.maxLength) {
                      $("#drug-number-product-add").focus();
                }
            });

            $("#drug-number-product-add").keydown(function (event) {
                if (event.which == 109 || event.which == 173 || event.which == 189) {  //-
                    $("#drug-pack-code-add").focus();
                    return false;
                }
            });

            $("#drug-number-product-add").keyup(function (event) {
                if (this.value.length == this.maxLength) {
                      $("#drug-pack-code-add").focus();
                }
            });

            $("#drug-pack-code-add").keyup(function (event) {
                if (this.value.length == this.maxLength) {
                    end_time = new Date();
                    let timeDiff = end_time - start_time;
                    if (timeDiff > 1200) {
                        $("#drug-pack-code-add").valid();
                    } else {
                        setTimeout(() => {
                            $("#drug-number-labeller-add").focus();
                            $("#drug-number-labeller-add").val('');
                            $("#drug-number-product-add").val('');
                            $("#drug-pack-code-add").val('');
                            const currentSize = parseFloat($('#ndc-help-row').children().css('font-size'));
                            let newSize = currentSize * 1.10;
                            if (newSize > 32) {
                                newSize = 32;
                            }
                            $('#ndc-help-row').children().css('font-size', newSize);
                            $('#scan-warn').css('color', 'red')
                        }, 150);
                    }
                }
            });

            $("#drug-number-labeller-edit").keydown(function (event) {
                if (event.which == 109 || event.which == 173 || event.which == 189) {  //-
                    $("#drug-number-product-edit").focus();
                    return false;
                }
            });

            $("#drug-number-product-edit").keydown(function (event) {
                if (event.which == 109 || event.which == 173 || event.which == 189) {  //-
                    $("#drug-pack-code-edit").focus();
                    return false;
                }
            });


            $("input[name^='drug-number-product']").each(function () {
                addDrugNumProductValidation($(this));
                $(this).blur(function () {
                    $(this).val(("0000" + $(this).val()).slice(-4));
                });
                $(this).keypress(function (event) {
                    if (event.charCode == 109 || event.which == 173 || event.charCode == 189) {  //-
                        alert("dash pressed");
                    }
                });
            });

            $("input[name^='drug-pack-code']").each(function () {
                addDrugPackCodeValidation($(this));
                $(this).blur(function () {
                    $(this).val(("00" + $(this).val()).slice(-2));
                });
                $(this).keypress(function (event) {
                    if (event.charCode == 109 || event.which == 173 || event.charCode == 189) {  //-
                        $(this).blur();
                    }
                });
            });

            $("input[name='add-pharmaceutical-input']").each(function () {
                addNewPharmaceuticalValidation($(this));
            });

            $("input[name='pharmaceutical-input']").change(function () {
                $('[id$=pharmaceutical-display]').html('Updating...');
                $.ajax({
                    url: "{% url 'site:site-drug-update-pharma-label-display' %}",
                    type: "POST",
                    data: {
                        csrfmiddlewaretoken: '{{csrf_token}}',
                        pharma: $("#pharmaceutical-input").val()
                    },
                    success: function (data, status, jqXHR) {
                        $('[id$=pharmaceutical-display]').html(data.display);
                        $("#drug-label-name").val(data.drug_name);
                        $("#drug-label-strength").val(data.strength);
                        $("#drug-label-unit").val(data.unit);
                        $("#drug-label-form").val(data.form);
                        $("#current-pharm-id").val(data.pharm_id);
                    }
                })
            });

            $("input[name='add-pharmaceutical-input']").on('autocompletechange', function () {
                $('#add-pharmaceutical-display').html('Updating...');
                $.ajax({
                    url: "{% url 'site:site-drug-update-pharma-label-display' %}",
                    type: "POST",
                    data: {
                        csrfmiddlewaretoken: '{{csrf_token}}',
                        pharma: $("#add-pharmaceutical-input").val()
                    },
                    success: function (data, status, jqXHR) {
                        $('#add-pharmaceutical-display').html(data.display);
                        $("#add-drug-label-name").val(data.drug_name);
                        $("#add-drug-label-strength").val(data.strength);
                        $("#add-drug-label-unit").val(data.unit);
                        $("#add-drug-label-form").val(data.form);
                        $("#add-current-pharm-id").val(data.pharm_id);
                    }
                })
            });

            $("input[name^='drug-label-name']").each(function () {
                addDrugLabelNameValidation($(this));
            });

            $("input[name^='drug-label-form']").each(function () {
                addDrugLabelFormValidation($(this));
            });

            $("input").keyup(function (event) {
                return cUpper(this);
            });

            $("input[name^='drug-manufacturer']").each(function () {
                addDrugManufacturerValidation($(this));
            });

            $("input[name^='drug-shape']").each(function () {
                addDrugShapeValidation($(this));
            });

            $("input[name^='drug-color']").each(function () {
                addDrugColorValidation($(this));
            });

            $("input[name^='drug-cost']").each(function () {
                addDrugCostValidation($(this));
            });

            $("input[name^='drug-quantity']").each(function () {
                addDrugQuantityValidation($(this));
            });

            $("input[name$='-drug-allowed-blister']").click(function () {
                var blistitm = $(this).attr("id").replace("-drug-allowed-blister", "");
                var spanid = $("#" + blistitm + "-drug-allowed-text");
                var iconid = $("#" + blistitm + "-drug-allowed-sort");
                if ($(this).prop('checked')) {
                    spanid.attr("class", "ui-state-highlight");
                    iconid.attr("class", "ui-state-highlight icon-resize-vertical");
                } else {
                    spanid.attr("class", "ui-state-disabled");
                    iconid.attr("class", "ui-state-disabled icon-resize-vertical");
                }
            });

            $("input[name$='-drug-allowed-blister-add']").click(function () {
                var blistitm = $(this).attr("id").replace("-drug-allowed-blister-add", "");
                var spanid = $("#" + blistitm + "-drug-allowed-text-add");
                var iconid = $("#" + blistitm + "-drug-allowed-sort-add");
                if ($(this).prop('checked')) {
                    spanid.attr("class", "ui-state-highlight");
                    iconid.attr("class", "ui-state-highlight icon-resize-vertical");
                } else {
                    spanid.attr("class", "ui-state-disabled");
                    iconid.attr("class", "ui-state-disabled icon-resize-vertical");
                }
            });

            $("#edit-pharmaceutical-display-link").click(function () {
                $("#edit-pharmaceutical-label-row").show();
                $(".edit-pharmaceutical-label-row-spacer").show();
            });

            $("#edit-pharmaceutical-link").click(function () {
                addNewPharmaceutical();
            });

            $("#cancel-pharmaceutical-label-btn").click(function () {
                $("#edit-pharmaceutical-label-row").hide();
                $(".edit-pharmaceutical-label-row-spacer").hide();
            });

            $("#add-edit-pharmaceutical-display-link").click(function () {
                $("#add-edit-pharmaceutical-label-row").show();
                $(".add-edit-pharmaceutical-label-row-spacer").show();
            });

            $("#cancel-add-pharmaceutical-label-btn").click(function () {
                $("#add-edit-pharmaceutical-label-row").hide();
                $(".add-edit-pharmaceutical-label-row-spacer").hide();
            });


            $("#cancel-pharmaceutical-add-btn").click(function () {
                cancelAddNewPharmaceutical();
            });

            $("#cancel-new-pharmaceutical-add-btn").click(function () {
                cancelAddAddNewPharmaceutical();
            });

            $("#save-pharmaceutical-label-btn").click(function () {
                $('#pharmaceutical-display').html('Updating...');
                $.ajax({
                    url: "{% url 'site:drug-site-drug-save-pharma-label-name' %}",
                    type: "POST",
                    data: {
                        csrfmiddlewaretoken: '{{csrf_token}}',
                        drug_name: $("#drug-label-name").val(),
                        strength: $("#drug-label-strength").val(),
                        unit: $("#drug-label-unit").val(),
                        form: $("#drug-label-form").val(),
                        pharm_id: $("#current-pharm-id").val()
                    },
                    success: function (data, status, jqXHR) {
                        $('#pharmaceutical-display').html(data);
                    }
                })
                $("#edit-pharmaceutical-label-row").hide();
                $(".edit-pharmaceutical-label-row-spacer").hide();
            });

            $("#save-add-pharmaceutical-label-btn").click(function () {
                $('#add-pharmaceutical-display').html('Updating...');
                $.ajax({
                    url: "{% url 'site:drug-site-drug-save-pharma-label-name' %}",
                    type: "POST",
                    data: {
                        csrfmiddlewaretoken: '{{csrf_token}}',
                        drug_name: $("#add-drug-label-name").val(),
                        strength: $("#add-drug-label-strength").val(),
                        unit: $("#add-drug-label-unit").val(),
                        form: $("#add-drug-label-form").val(),
                        pharm_id: $("#add-current-pharm-id").val()
                    },
                    success: function (data, status, jqXHR) {
                        $('#add-pharmaceutical-display').html(data);
                    }
                })
                $("#add-edit-pharmaceutical-label-row").hide();
                $(".add-edit-pharmaceutical-label-row-spacer").hide();
            });

            $("#add-pharmaceutical-btn").click(function () {
                if ($("#drug-name-input").valid() && $("#drug-strength").valid()
                        && $("#drug-unit").valid() && $("#drug-form").valid()) {
                    $("#edit-form-type").val('add-pharma');
                    $("#editSiteDrugForm").attr("action", "?page={{ current_page }}&sort={{ current_sort }}");
                    $("#blister-type-sort").val($("#drug-blister-allowed").sortable('toArray'));
                    document.editSiteDrugForm.submit();
                }
            });

            $("#add-new-pharmaceutical-btn").click(function () {
                if ($("#add-drug-name-input").valid() && $("#add-drug-strength").valid()
                        && $("#add-drug-unit").valid() && $("#add-drug-form").valid()) {
                    $("#add-form-type").val('add-pharma');
                    $("#addSiteDrugForm").attr("action", "?page={{ current_page }}&sort={{ current_sort }}");
                    $("#blister-type-sort").val($("#drug-blister-allowed-add").sortable('toArray'));
                    document.addSiteDrugForm.submit();
                }
            });

            {% if newPackCode %}
                doAddPackageRow({{ newPackCode }});
            {% endif %}

             $("#drug-strict-match").change(function() {
                if ($(this).is(':checked')) {
                    let packcount = {{ packagingData|length }};
                    if (packcount > 1) {
                        $(".pack-active-strict-match").show();
                    }
                } else {
                    $(".pack-active-strict-match").hide();
                }
            });

            if ($("#drug-strict-match").is(':checked')) {
                let packcount = {{ packagingData|length }};
                if (packcount > 1) {
                    $(".pack-active-strict-match").show();
                }
            } else {
                $(".pack-active-strict-match").hide();
            }

            if (window.location.hash) {
                let fragment = window.location.hash.substring(1);
                if (fragment.length === 11){
                    if (/^\d+$/.test(fragment)){
                        $('#drug-number-labeller-add').val(fragment.substring(0,5));
                        $('#drug-number-product-add').val(fragment.substring(5,9));
                        $('#drug-pack-code-add').val(fragment.substring(9,11));
                        $('#drug-number-labeller-add').valid();
                        $('#drug-number-product-add').valid();
                        $('#drug-pack-code-add').valid();
                        $('#check-drugnum-exists').click();
                    }
                }
            }
        });

        {% if not show_max_qty %}
        $(document).ready( function(){
            let header = document.getElementsByName("qty-th");
            header[0].style.display = 'none'
            let header2 = document.getElementsByName("qty-th-edit");
            header2[0].style.display = 'none'
            let cells = document.getElementsByName("qty-td");
            for (let i of cells.keys()) {
                cells[i].style.display = 'none'
            }
        });
        {% endif %}
    </script>
{% endblock %}

{% block pagehead %}
    {% include 'pagehead.html' %}
{% endblock %}

{% block content %}
    {% include report_template %}
    {% include 'pagenav.html' %}
    <div id="add-site-drug" title="Add Site Drug" class="span9" style="margin-left: 2px;">
        <form name="addSiteDrugForm" id="addSiteDrugForm" method="post" enctype="multipart/form-data">
            {% csrf_token %}
            <input type="hidden" id="add-form-type" name="add-form-type" value="add-drug"/>
            <input type="hidden" id="add-current-pharm-id" name="add-current-pharm-id"
                   value="{{ authorityData.pharmaceutical.id }}"/>
            <input type="hidden" id="add-current-auth-id" name="add-current-auth-id" value="{{ authorityData.id }}"/>
            <input type="hidden" id="blister-type-sort-add" name="blister-type-sort-add"
                   value="{{ authorityData.pharmaceutical.id }}"/>
            <div class="alert alert-error" id="add-site-drug-validation-alert" {% if not ndc_9_match %}style="display: none;"{% endif %}>
                <button type="button" class="close" data-dismiss="alert">&times;</button>
                <ul id="add-site-drug-validation-error-list">
                </ul>
                {% if ndc_9_match %}
                <ul id="add-site-drug-warning-list">
                    <li>WARNING - NDC-9 Match found for other drug entry marked as NDC-11 Strict Match!</li>
                </ul>
                {% endif %}
                <div id="add-new-pharmaceutical-row" style="display: none; padding: 8px; border: 3px solid black;">
                    Drug Name: <input id="add-drug-name-input" name="add-drug-name-input" type="text"
                                      style="width: 25em; text-transform: uppercase;"
                                      value="">&nbsp;&nbsp;&nbsp;Strength:
                    <input type="text" id="add-drug-strength" name="add-drug-strength"
                           style="width: 5em; text-transform: uppercase;"
                           value=""><br/>
                    Unit: <input type="text" id="add-drug-unit" name="add-drug-unit"
                                 style="width: 5em; text-transform: uppercase;"
                                 value="">&nbsp;&nbsp;&nbsp;
                    Dosage Form: <input type="text" id="add-drug-form" name="add-drug-form"
                                        style="width: 12em; text-transform: uppercase;"
                                        value="">&nbsp;&nbsp;&nbsp;
                    <button id="add-new-pharmaceutical-btn" name="add-new-pharmaceutical-btn" class="btn" type="button">
                        <i class="icon-save"></i></button>
                    &nbsp;&nbsp;&nbsp;
                    <button id="cancel-new-pharmaceutical-add-btn" name="cancel-new-pharmaceutical-add-btn" class="btn"
                            type="button"><i class="icon-remove"></i></button>
                </div>
            </div>
            <table>
                <tr>
                    <td>
                        <fieldset>
                            <table style="width: 1180px; height: 100%;">
                                {% if drugnum_type == 'NDC' %}
                                    <tr>
                                        <td class="site-drug-edit-td">Drug Number:
                                            <input type="text" id="drug-number-labeller-add"
                                                   name="drug-number-labeller-add"
                                                   style="width: 5em;" value="{{ add_labeller }}" maxlength="5"> <b>-</b>
                                            <input type="text" id="drug-number-product-add"
                                                   name="drug-number-product-add"
                                                   style="width: 4em;" value="{{ add_product }}" maxlength="4"> <b>-</b>
                                            <input type="text" id="drug-pack-code-add" name="drug-pack-code-add"
                                                   style="width: 2em;" value="{{ add_pack_code }}" maxlength="2">
                                            &nbsp;&nbsp;&nbsp;
                                            <button type="button" id="clear-drugnum-fields"><i class="icon-remove"></i>
                                                Clear
                                            </button>
                                            <button type="button" id="check-drugnum-exists"><i class="icon-search"></i>
                                                Check
                                            </button>
                                        </td>
                                    </tr>
                                    <tr id="ndc-help-row">
                                        <td style="font-size: 12pt; color: blue; font-weight: bold; line-height: normal;">Manually enter NDC # (5-4-2, 4-4-2, 5-4-1, or 5-3-2). <span id="scan-warn">DO NOT scan a Stock Bottle barcode</span> in this field</td>
                                    </tr>
                                {% else %}
                                    <tr>
                                        <td class="site-drug-edit-td">Drug Number:
                                            <input type="text" id="drug-number-other-add" name="drug-number-other-add"
                                                   style="width: 15em;" value="{{ add_other }}">
                                            &nbsp;&nbsp;&nbsp;
                                            <button type="button" id="clear-drugnum-fields"><i class="icon-remove"></i>
                                                Clear
                                            </button>
                                            <button type="button" id="check-drugnum-exists"><i class="icon-search"></i>
                                                Check
                                            </button>
                                        </td>
                                    </tr>
                                {% endif %}
                                <tr>
                                    <td style="height: 5px;">&nbsp;</td>
                                </tr>
                                <tr>
                                    <td>
                                        <div id="add-edit-pharmaceutical-label-row"
                                             style="display: none; padding: 8px; border: 5px solid darkorange;">
                                            Drug Name: <input id="add-drug-label-name" name="add-drug-label-name"
                                                              type="text"
                                                              style="width: 30em; text-transform: uppercase;"
                                                              value="{{ authorityData.pharmaceutical.drug_name.label_name }}">&nbsp;&nbsp;&nbsp;Strength:
                                            <input type="text" id="add-drug-label-strength"
                                                   name="add-drug-label-strength"
                                                   style="width: 5em; text-transform: uppercase;"
                                                   value="{{ authorityData.pharmaceutical.strength.label_name }}">&nbsp;&nbsp;&nbsp;
                                            Unit: <input type="text" id="add-drug-label-unit" name="add-drug-label-unit"
                                                         style="width: 5em; text-transform: uppercase;"
                                                         value="{{ authorityData.pharmaceutical.unit.label_name }}"><br/>
                                            Dosage Form: <input type="text" id="add-drug-label-form"
                                                                name="add-drug-label-form"
                                                                style="width: 12em; text-transform: uppercase;"
                                                                value="{{ authorityData.pharmaceutical.form.label_name }}">&nbsp;&nbsp;&nbsp;
                                            <button id="save-add-pharmaceutical-label-btn"
                                                    name="save-add-pharmaceutical-label-btn" class="btn" type="button">
                                                <i class="icon-save"></i></button>
                                            &nbsp;&nbsp;&nbsp;
                                            <button id="cancel-add-pharmaceutical-label-btn"
                                                    name="cancel-add-pharmaceutical-label-btn" class="btn"
                                                    type="button"><i class="icon-remove"></i></button>
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="add-edit-pharmaceutical-label-row-spacer"
                                        style="display: none; height: 15px;">&nbsp;</td>
                                </tr>
                                <tr id="add-drug-pharmaceutical-row">
                                    <td>
                                        <table>
                                            <tr>
                                                <td>Pharmaceutical: <input id="add-pharmaceutical-input"
                                                                           name="add-pharmaceutical-input" type="text"
                                                                           style="width: 45em; text-transform: uppercase;"
                                                                           value="{{ authorityData.pharmaceutical.drug_name.brand_name }}{% if authorityData.pharmaceutical.strength.id > 1 %} {{ authorityData.pharmaceutical.strength.name }}{% endif %}{% if authorityData.pharmaceutical.unit.id > 1 %} {{ authorityData.pharmaceutical.unit.name }} {% endif %}{{ authorityData.pharmaceutical.form.name }}"
                                                                           required></td>
                                            </tr>
                                            <tr>
                                                <td>Displayed As: <span
                                                        id="add-pharmaceutical-display">{{ authorityData.pharmaceutical.drug_name.label_name }} {{ authorityData.pharmaceutical.strength.label_name }} {{ authorityData.pharmaceutical.unit.label_name }} {{ authorityData.pharmaceutical.form.label_name }}</span>
                                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                                    <!--button type="button" id="add-edit-pharmaceutical-display-link">Edit
                                                        Drug Display
                                                    </button-->
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    Alt. Id: <input type="text" id="drug-alternate-id-add" name="drug-alternate-id-add"
                                                                    style="width: 10em;"
                                                                    value="{{ authorityData.pharmaceutical.alternate_id|default_if_none:"" }}">&nbsp;&nbsp;&nbsp;
                                                    <input type="checkbox" id="drug-black-box-warn" name="drug-black-box-warn"
                                                           value="True"
                                                           {% if authorityData.pharmaceutical.black_box_warning %}checked{% endif %}>
                                                    Black Box Warning?&nbsp;&nbsp;&nbsp;
                                                    {% if show_secure_drug_add %}
                                                    <input type="checkbox" id="drug-secure-drug-add" name="drug-secure-drug-add"
                                                           value="True"
                                                           {% if authorityData.pharmaceutical.secured %}checked{% endif %}>
                                                    Secured?&nbsp;&nbsp;&nbsp;{% endif %}
                                                    <button type="button" id="show-add-drug-advanced"
                                                            name="show-add-drug-advanced"
                                                            class="btn btn-link">Show Advanced Settings
                                                    </button>
                                                    <button type="button" id="hide-add-drug-advanced"
                                                            name="hide-add-drug-advanced"
                                                            class="btn btn-link" style="display: none;">Hide Advanced Settings
                                                    </button>
                                                </td>
                                            </tr>
                                        </table>
                                    </td>
                                </tr>
                                <tr id="add-pharma-attribs-row">
                                    <td>
                                        <div id="add-drug-advanced" style="display: none;">
                                            <table style="float: left; margin-left: 50px;">
                                                <tr>
                                                    <td>{% if drugnum_type == 'NDC' and show_ndc_11_option %}
                                                        <input type="checkbox" id="drug-strict-match-add"
                                                               name="drug-strict-match-add" value="True" {% if default_strict_match %}checked{% endif %}> NDC-11 Match?
                                                        &nbsp;&nbsp;&nbsp;
                                                    {% endif %}</td>
                                                    <td style="padding-left: 8px;"><input type="checkbox" id="drug-additional-label-add"
                                                               name="drug-additional-label-add" value="True"> Additional
                                                        Label Required?
                                                    </td>
                                                    <td style="padding-left: 8px;"><input type="checkbox" id="drug-otc-add"
                                                               name="drug-otc-add" value="True"
                                                               {% if authorityData.pharmaceutical.otc %}checked{% endif %}>
                                                        OTC Drug?
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td colspan="3">&nbsp;</td>
                                                </tr>
                                                <tr>
                                                    <td><input type="checkbox" id="drug-allow-automation-add"
                                                               name="drug-allow-automation-add" value="True" checked>
                                                        Allow Automation Fill?
                                                    </td>
                                                    <td style="padding-left: 8px;"><input type="checkbox" id="drug-rx-info-label-add"
                                                               name="drug-rx-info-label-add" value="True">
                                                        Rx Info Label Required?
                                                    </td>
                                                    <td style="padding-left: 8px;"><input type="checkbox" id="drug-usp-800-add"
                                                               name="drug-usp-800-add" value="True"
                                                               {% if authorityData.pharmaceutical.usp_800 %}checked{% endif %}>
                                                        USP 800 Drug?
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td colspan="3">&nbsp;</td>
                                                </tr>
                                                <tr>
                                                    <td><input type="checkbox" id="drug-allow-calendar-add"
                                                               name="drug-allow-calendar-add" value="True" checked>
                                                        Allow Calendar Fill?
                                                    </td>
                                                    <td style="padding-left: 8px;"><input type="checkbox" id="drug-prepack-manage-add"
                                                               name="drug-prepack-manage-add" value="True" {% if default_allow_prepack_mgr %}checked{% endif %}>
                                                        Allow Prepack Management?
                                                    </td>
                                                    <td style="padding-left: 8px;"><input type="checkbox" id="drug-generic"
                                                               name="drug-generic" value="True"
                                                               {% if authorityData.pharmaceutical.generic %}checked{% endif %}>
                                                        Generic?
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td colspan="3">&nbsp;</td>
                                                </tr>
                                                {% if multidose_enabled %}
                                                <tr>
                                                    <td><input type="checkbox" id="drug-allow-multidose-add"
                                                               name="drug-allow-multidose-add" value="True" checked>
                                                        Allow Multi-Dose Fill?
                                                    </td>
                                                <td>&nbsp;</td>
                                                </tr>
                                                <tr>
                                                    <td colspan="3">&nbsp;</td>
                                                </tr>
                                                {% endif %}
                                            </table>
                                            <table style="float: right; margin-right: 50px;">
                                                <tr>
                                                    <th style="text-align: center;">Allowed Package Types</th>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        <ul id="drug-blister-allowed-add" class="sortable-list">
                                                            {% for package in package_list %}
                                                                <li id="{{ package.id }}-drug-blister-allowed-li-add"
                                                                    class="ui-state-highlight sortable-list-li">
                                                                    <input type="checkbox"
                                                                           id="{{ package.id }}-drug-allowed-blister-add"
                                                                           name="{{ package.id }}-drug-allowed-blister-add"
                                                                           value="{{ package.tag }}"
                                                                           {% if package.tag == 'DEFAULT' %}checked{% endif %}>
                                                                    <span id="{{ package.id }}-drug-allowed-text-add"
                                                                          class="{% if package.tag == 'DEFAULT' %}ui-state-highlight{% else %}ui-state-disabled{% endif %}">{{ package.description }}</span>
                                                                    <i id="{{ package.id }}-drug-allowed-sort-add"
                                                                       class="{% if package.tag == 'DEFAULT' %}ui-state-highlight{% else %}ui-state-disabled{% endif %} icon-resize-vertical"
                                                                       style="float: right;"></i></li>
                                                            {% endfor %}
                                                        </ul>
                                                    </td>
                                                </tr>
                                            </table>
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                                </tr>
                            </table>
                        </fieldset>
                    </td>
                </tr>
                <tr>
                    <td>
                        <table style="width: 1180px;" id="add-manufacturer-info-table">
                            <caption style="text-align: left; font-weight: bold; border-bottom:1px solid black;">
                                Manufacturer Information
                            </caption>
                            <tr>
                                <th align="left">Manufacturer</th>
                                <th align="left">Shape</th>
                                <th align="left">Color</th>
                                <th align="left">Front Imp.</th>
                                <th align="left">Back Imp.</th>
                                <th align="left">Pill Cost</th>
                                <th align="left">Dist. Num.</th>
                                <th align="left" name="qty-th">Max QTY. Per Canister</th>
                            </tr>
                            <tr>
                                <td class="site-drug-edit-td"><input type="text" id="drug-manufacturer-add"
                                                                     name="drug-manufacturer-add"
                                                                     style="width: 15em; text-transform: uppercase;"
                                                                     required></td>
                                <td class="site-drug-edit-td"><input type="text" id="drug-shape-add"
                                                                     name="drug-shape-add"
                                                                     style="width: 10em; text-transform: uppercase;"
                                                                     required></td>
                                <td class="site-drug-edit-td"><input type="text" id="drug-color-add"
                                                                     name="drug-color-add"
                                                                     style="width: 10em; text-transform: uppercase;"
                                                                     required></td>
                                <td class="site-drug-edit-td"><input type="text" id="drug-front-imprint-add"
                                                                     name="drug-front-imprint-add"
                                                                     style="width: 6em;"></td>
                                <td class="site-drug-edit-td"><input type="text" id="drug-back-imprint-add"
                                                                     name="drug-back-imprint-add"
                                                                     style="width: 6em;"></td>
                                <td class="site-drug-edit-td"><input type="text" id="drug-cost-add" name="drug-cost-add"
                                                                     style="width: 5em;"></td>
                                <td class="site-drug-edit-td"><input type="text" id="drug-dist-num-add"
                                                                     name="drug-dist-num-add"
                                                                     style="width: 6em;"></td>
                                <td name="qty-td" class="site-drug-edit-td"><input type="number"
                                                                                   id="drug-max-canister-quantity-add"
                                                                                   name="drug-max-canister-quantity-add"
                                                                                   min="0"
                                                                                   style="width: 6em;"></td>
                            </tr>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td>
                        <table style="width: 1180px;" id="add-stock-bottle-info-table">
                            <caption style="text-align: left; font-weight: bold; border-bottom:1px solid black;">Stock
                                Bottle Information
                            </caption>
                            <tr>
                                <th align="left">Quantity</th>
                                <th align="left">Barcode</th>
                            </tr>
                            <tr>
                                <td class="site-drug-edit-td"><input type="text" id="drug-quantity-add"
                                                                     name="drug-quantity-add"
                                                                     style="width: 5em;" required></td>
                                <td class="site-drug-edit-td"><input type="text" id="drug-barcode-add"
                                                                     name="drug-barcode-add"
                                                                     style="width: 12em;"></td>
                            </tr>
                        </table>
                    </td>
                </tr>
                {% if allow_drug_img_upload %}
                <tr id="add-drug-image-upload-tr">
                    <td><input type="checkbox" id="chk-upload-drug-image" name="chk-upload-drug-image" value="True">
                         Upload Drug Imaqe
                    </td>
                </tr>
                {% endif %}
            </table>
        </form>
    </div>
    <div id="edit-site-drug" title="Edit Site Drug Information">
        <form name="editSiteDrugForm" id="editSiteDrugForm" method="post">
            {% csrf_token %}
            <input type="hidden" id="blister-type-sort" name="blister-type-sort" value=""/>
            <input type="hidden" id="edit-form-type" name="edit-form-type" value="edit-drug"/>
            <input type="hidden" id="current-pharm-id" name="current-pharm-id"
                   value="{{ authorityData.pharmaceutical.id }}"/>

            <div class="alert alert-error" id="edit-site-drug-validation-alert" style="display: none;">
                <button type="button" class="close" data-dismiss="alert">&times;</button>
                <ul id="edit-site-drug-validation-error-list">
                </ul>
            </div>
            <table>
                <tr>
                    <td>
                        <fieldset>
                            <table style="width: 1180px; height: 100%;">
                                <tr>
                                    <td style="height: 5px;">&nbsp;</td>
                                </tr>
                                <tr>
                                    <td>
                                        <div id="add-pharmaceutical-row"
                                             style="display: none; padding: 8px; border: 3px solid black;">
                                            <p>Edit the pharmaceutical when you need to change the drug for this entry.<br/>If you wish to change
                                            how this drug displays on labels/reports then please edit the label name in the Drug Attributes menu.</p>
                                            Drug Name: <input id="drug-name-input" name="drug-name-input" type="text"
                                                              style="width: 25em; text-transform: uppercase;"
                                                              value="">&nbsp;&nbsp;&nbsp;Strength:
                                            <input type="text" id="drug-strength" name="drug-strength"
                                                   style="width: 5em; text-transform: uppercase;"
                                                   value=""><br/>
                                            Unit: <input type="text" id="drug-unit" name="drug-unit"
                                                         style="width: 5em; text-transform: uppercase;"
                                                         value="">&nbsp;&nbsp;&nbsp;
                                            Dosage Form: <input type="text" id="drug-form" name="drug-form"
                                                                style="width: 12em; text-transform: uppercase;"
                                                                value="">&nbsp;&nbsp;&nbsp;
                                            <button id="add-pharmaceutical-btn" name="add-pharmaceuticall-btn"
                                                    class="btn" type="button"><i
                                                    class="icon-save"></i></button>
                                            &nbsp;&nbsp;&nbsp;
                                            <button id="cancel-pharmaceutical-add-btn"
                                                    name="cancel-pharmaceutical-add-btn" class="btn"
                                                    type="button"><i class="icon-remove"></i></button>
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div id="edit-pharmaceutical-label-row"
                                             style="display: none; padding: 8px; border: 5px solid darkorange;">
                                            Drug Name: <input id="drug-label-name" name="drug-label-name" type="text"
                                                              style="width: 30em; text-transform: uppercase;"
                                                              value="{{ authorityData.pharmaceutical.drug_name.label_name }}">&nbsp;&nbsp;&nbsp;Strength:
                                            <input type="text" id="drug-label-strength" name="drug-label-strength"
                                                   style="width: 5em; text-transform: uppercase;"
                                                   value="{{ authorityData.pharmaceutical.strength.label_name }}">&nbsp;&nbsp;&nbsp;
                                            Unit: <input type="text" id="drug-label-unit" name="drug-label-unit"
                                                         style="width: 5em; text-transform: uppercase;"
                                                         value="{{ authorityData.pharmaceutical.unit.label_name }}"><br/>
                                            Dosage Form: <input type="text" id="drug-label-form" name="drug-label-form"
                                                                style="width: 12em; text-transform: uppercase;"
                                                                value="{{ authorityData.pharmaceutical.form.label_name }}">&nbsp;&nbsp;&nbsp;
                                            <button id="save-pharmaceutical-label-btn"
                                                    name="save-pharmaceutical-label-btn" class="btn" type="button"><i
                                                    class="icon-save"></i></button>
                                            &nbsp;&nbsp;&nbsp;
                                            <button id="cancel-pharmaceutical-label-btn"
                                                    name="cancel-pharmaceutical-label-btn" class="btn" type="button"><i
                                                    class="icon-remove"></i></button>
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="edit-pharmaceutical-label-row-spacer"
                                        style="display: none; height: 15px;">&nbsp;</td>
                                </tr>
                                <tr>
                                    <td>
                                        <table>
                                            <tr>
                                                <td>Pharmaceutical: <input id="pharmaceutical-input"
                                                                           name="pharmaceutical-input" type="text"
                                                                           style="width: 45em; text-transform: uppercase;"
                                                                           value="{{ authorityData.pharmaceutical.drug_name.brand_name }}{% if authorityData.pharmaceutical.strength.id > 1 %} {{ authorityData.pharmaceutical.strength.name }}{% endif %}{% if authorityData.pharmaceutical.unit.id > 1 %} {{ authorityData.pharmaceutical.unit.name }}{% endif %} {{ authorityData.pharmaceutical.form.name }}"
                                                                           required readonly>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                                    <button type="button" id="edit-pharmaceutical-link">Change
                                                        Pharmaceutical
                                                    </button>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>Displayed As: <span
                                                        id="pharmaceutical-display">{{ authorityData.pharmaceutical.drug_name.label_name }} {{ authorityData.pharmaceutical.strength.label_name }} {{ authorityData.pharmaceutical.unit.label_name }} {{ authorityData.pharmaceutical.form.label_name }}</span>
                                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                                    {% if authorityData.pharmaceutical.schedule.tag != 'UNKNOWN' %}
                                                    <span>Schedule: {{ authorityData.pharmaceutical.schedule.name }}</span>
                                                    {% endif %}
                                                    <!--button type="button" id="edit-pharmaceutical-display-link">Edit
                                                        Drug Display
                                                    </button-->
                                                </td>
                                            </tr>
                                        </table>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="edit-pharmaceutical-label-row-spacer"
                                        style="display: none; height: 15px;">&nbsp;</td>
                                </tr>
                                <tr>
                                    <td>
                                        Alt. Id: <input type="text" id="drug-alternate-id" name="drug-alternate-id"
                                                        style="width: 10em;"
                                                        value="{{ authorityData.pharmaceutical.alternate_id|default_if_none:"" }}">&nbsp;&nbsp;&nbsp;
                                        <input type="checkbox" id="drug-black-box-warn" name="drug-black-box-warn"
                                               value="True"
                                               {% if authorityData.pharmaceutical.black_box_warning %}checked{% endif %}>
                                        Black Box Warning?&nbsp;&nbsp;&nbsp;
                                        {% if show_secure_drug %}
                                        <input type="checkbox" id="drug-secure-drug" name="drug-secure-drug"
                                               value="True"
                                               {% if authorityData.pharmaceutical.secured %}checked{% endif %}>
                                        Secured?&nbsp;&nbsp;&nbsp;{% endif %}
                                        <button type="button" id="show-edit-drug-advanced"
                                                name="show-edit-drug-advanced"
                                                class="btn btn-link">Show Advanced Settings
                                        </button>
                                        <button type="button" id="hide-edit-drug-advanced"
                                                name="hide-edit-drug-advanced"
                                                class="btn btn-link" style="display: none;">Hide Advanced Settings
                                        </button>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div id="edit-drug-advanced" style="display: none;">
                                            <table style="float: left; margin-left: 50px;">
                                                <tr>
                                                    <td>{% if drugnum_type == 'NDC' and show_ndc_11_option %}
                                                        <input type="checkbox" id="drug-strict-match"
                                                               name="drug-strict-match" value="True"
                                                               {% if authorityData.strict_match %}checked{% endif %}>
                                                        NDC-11 Match?{% endif %}
                                                    </td>
                                                   <td style="padding-left: 8px;"><input type="checkbox" id="drug-additional-label"
                                                               name="drug-additional-label" value="True"
                                                               {% if authorityData.pharmaceutical.additional_label_required %}checked{% endif %}>
                                                        Additional Label Required?
                                                    </td>
                                                    <td style="padding-left: 8px;"><input type="checkbox" id="drug-otc"
                                                               name="drug-otc" value="True"
                                                               {% if authorityData.pharmaceutical.otc %}checked{% endif %}>
                                                        OTC Drug?
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td colspan="3">&nbsp;</td>
                                                </tr>
                                                <tr>
                                                    <td><input type="checkbox" id="drug-allow-automation"
                                                               name="drug-allow-automation" value="True"
                                                               {% if authorityData.pharmaceutical.allow_automation_fill %}checked{% endif %}>
                                                        Allow Automation Fill?
                                                    </td>
                                                    <td style="padding-left: 8px;"><input type="checkbox" id="drug-rx-info-label"
                                                               name="drug-rx-info-label" value="True"
                                                               {% if authorityData.pharmaceutical.rx_info_required %}checked{% endif %}>
                                                        Rx Info Label Required?
                                                    </td>
                                                    <td style="padding-left: 8px;"><input type="checkbox" id="drug-usp-800"
                                                               name="drug-usp-800" value="True"
                                                               {% if authorityData.pharmaceutical.usp_800 %}checked{% endif %}>
                                                        USP 800 Drug?
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td colspan="3">&nbsp;</td>
                                                </tr>
                                                <tr>
                                                    <td><input type="checkbox" id="drug-allow-calendar"
                                                               name="drug-allow-calendar" value="True"
                                                               {% if authorityData.pharmaceutical.allow_calendar_fill %}checked{% endif %}>
                                                        Allow Calendar Fill?
                                                    </td>
                                                    <td style="padding-left: 8px;"><input type="checkbox" id="drug-prepack-manage"
                                                               name="drug-prepack-manage" value="True"
                                                               {% if authorityData.prepack_management %}checked{% endif %}>
                                                        Allow Prepack Management?
                                                    </td>
                                                    <td style="padding-left: 8px;"><input type="checkbox" id="drug-generic"
                                                               name="drug-generic" value="True"
                                                               {% if authorityData.pharmaceutical.generic %}checked{% endif %}>
                                                        Generic?
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td colspan="3">&nbsp;</td>
                                                </tr>
                                                {% if multidose_enabled %}
                                                <tr>
                                                    <td><input type="checkbox" id="drug-allow-multidose"
                                                               name="drug-allow-multidose" value="True"
                                                               {% if authorityData.pharmaceutical.allow_multi_dose_fill %}checked{% endif %}>
                                                        Allow Multi-Dose Fill?
                                                    </td>
                                                    <td>&nbsp;</td>
                                                </tr>
                                                <tr>
                                                    <td colspan="3">&nbsp;</td>
                                                </tr>
                                                {% endif %}
                                            </table>
                                            <table style="float: right; margin-right: 30px;">
                                                <tr>
                                                    <th style="text-align: center;">Allowed Blister Types</th>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        <ul id="drug-blister-allowed" class="sortable-list">
                                                            {% for package in package_list %}
                                                                <li id="{{ package.id }}-drug-blister-allowed-li"
                                                                    class="ui-state-highlight sortable-list-li">
                                                                    <input type="checkbox"
                                                                           id="{{ package.id }}-drug-allowed-blister"
                                                                           name="{{ package.id }}-drug-allowed-blister"
                                                                           value="{{ package.tag }}"
                                                                           {% if package.tag in authorityData.pharmaceutical.allowed_package_tags %}checked{% endif %}>
                                                                    <span id="{{ package.id }}-drug-allowed-text"
                                                                          class="{% if package.tag in authorityData.pharmaceutical.allowed_package_tags %}ui-state-highlight{% else %}ui-state-disabled{% endif %}">{{ package.description }}</span>
                                                                    <i id="{{ package.id }}-drug-allowed-sort"
                                                                       class="{% if package.tag in authorityData.pharmaceutical.allowed_package_tags %}ui-state-highlight{% else %}ui-state-disabled{% endif %} icon-resize-vertical"
                                                                       style="float: right;"></i></li>
                                                            {% endfor %}
                                                        </ul>
                                                    </td>
                                                </tr>
                                            </table>
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <td>&nbsp;</td>
                                </tr>
                            </table>
                        </fieldset>
                    </td>
                </tr>
                <tr>
                    <td>
                        <table id="edit-instance-table" style="width: 1180px;">
                            <caption
                                    style="width: 100%; text-align: left; font-weight: bold; border-bottom:1px solid black;">
                                <span style="text-align: left;">Manufacturer Information</span>
                                {% if drugnum_type == 'NDC' %}{% if allow_multiple_instance %}
                                    <span style="float: right; text-align: right;">
                                    <button type="button" id="add-instance-link"><i class="icon-plus-sign-alt"></i>Add
                                        Instance
                                    </button>
                                </span>{% endif %}{% endif %}</caption>
                            <thead>
                            <tr>
                                <th align="left">Manufacturer</th>
                                <th align="left">Shape</th>
                                <th align="left">Color</th>
                                <th align="left">Front Imp.</th>
                                <th align="left">Back Imp.</th>
                                <th align="left">Pill Cost</th>
                                <th align="left">Dist. Num.</th>
                                <th align="left" name="qty-th-edit">Max QTY. Per Canister</th>
                            </tr>
                            </thead>
                            <tbody>
                            {% for inst in instanceData %}
                                <tr>
                                    <td class="site-drug-edit-td{% if inst.active == False %} inactive-cell{% endif %}">
                                        <input type="text" id="drug-manufacturer-{{ inst.id }}" name="drug-manufacturer-{{ inst.id }}"
                                               {% if inst.active == False %}class="inactive-cell"{% endif %}
                                               style="width: 15em; text-transform: uppercase;" value="{{ inst.manufacturer.name }}" required></td>
                                    <td class="site-drug-edit-td {% if inst.active == False %} inactive-cell{% endif %}">
                                        <input type="text" id="drug-shape-{{ inst.id }}" name="drug-shape-{{ inst.id }}"
                                               {% if inst.active == False %}class="inactive-cell"{% endif %}
                                               style="width: 8em; text-transform: uppercase;" value="{{ inst.shape.name }}" required></td>
                                    <td class="site-drug-edit-td {% if inst.active == False %} inactive-cell{% endif %}">
                                        <input type="text" id="drug-color-{{ inst.id }}" name="drug-color-{{ inst.id }}"
                                               {% if inst.active == False %}class="inactive-cell"{% endif %}
                                               style="width: 10em; text-transform: uppercase;" value="{{ inst.color.name }}" required></td>
                                    <td class="site-drug-edit-td {% if inst.active == False %} inactive-cell{% endif %}">
                                        <input type="text" id="drug-front-imprint-{{ inst.id }}" name="drug-front-imprint-{{ inst.id }}"
                                               {% if inst.active == False %}class="inactive-cell"{% endif %}
                                               style="width: 6em;" value="{{ inst.imprint_front|default_if_none:"" }}"></td>
                                    <td class="site-drug-edit-td {% if inst.active == False %} inactive-cell{% endif %}">
                                        <input type="text" id="drug-back-imprint-{{ inst.id }}" name="drug-back-imprint-{{ inst.id }}"
                                               {% if inst.active == False %}class="inactive-cell"{% endif %}
                                               style="width: 6em;" value="{{ inst.imprint_back|default_if_none:"" }}"></td>
                                    <td class="site-drug-edit-td {% if inst.active == False %} inactive-cell{% endif %}">
                                        <input type="text" id="drug-cost-{{ inst.id }}" name="drug-cost-{{ inst.id }}"
                                               {% if inst.active == False %}class="inactive-cell"{% endif %}
                                               style="width: 4em;" value="{{ inst.pill_cost|default_if_none:"" }}"></td>
                                    <td class="site-drug-edit-td {% if inst.active == False %} inactive-cell{% endif %}">
                                        <input type="text" id="drug-dist-num-{{ inst.id }}" name="drug-dist-num-{{ inst.id }}"
                                               {% if inst.active == False %}class="inactive-cell"{% endif %}
                                               style="width: 6em;" value="{{ inst.distribution_number|default_if_none:"" }}"></td>
                                    <td name="qty-td" class="site-drug-edit-td {% if inst.active == False %} inactive-cell{% endif %}">
                                        <input type="number" id="drug-max-canister-quantity-{{ inst.id }}" name="drug-max-canister-quantity-{{ inst.id }}"
                                               {% if inst.active == False %}class="inactive-cell"{% endif %} min="0"
                                               style="width: 6em;" value="{{ inst.max_canister_quantity|default_if_none:"" }}"></td>
                                    <td class="site-drug-edit-td {% if inst.active == False %} inactive-cell{% endif %}">
                                     <button class="btn btn-small btn-link" type="button" name="disable-instance-{{ inst.id }}"
                                             id="disable-instance-{{ inst.id }}" value="{{ inst.id }}"
                                             title="Disable Drug Instance" {% if inst.active == False %}style="display: none;"{% endif %}>
                                         <i class="icon-ban-circle"></i></button>
                                     <button class="btn btn-small btn-link" type="button" name="enable-instance-{{ inst.id }}"
                                             id="enable-instance-{{ inst.id }}" value="{{ inst.id }}"
                                             title="Enable Drug Instance" {% if inst.active == True %}style="display: none;"{% endif %}>
                                         <i class="icon-ok"></i></button>&nbsp;&nbsp;&nbsp;
                                    </td>
                                </tr>
                            {% endfor %}
                            </tbody>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td>
                        <table id="edit-package-table" style="width: 1180px;">
                            <caption style="text-align: left; font-weight: bold; border-bottom:1px solid black;">
                                <span style="text-align: left;">Stock Bottle Information</span>
                                {% if drugnum_type == 'NDC' %}
                                    <span style="float: right; text-align: right;">
                                    <button type="button" id="add-package-link"><i class="icon-plus-sign-alt"></i>Add
                                        Package
                                    </button>
                                </span>{% endif %}
                            </caption>
                            <thead>
                            <tr>
                                <th align="left" style="width: 200px;">Drug Number</th>
                                {% if drugnum_type == 'NDC' %}
                                    <th align="left" style="text-align: left;">Pack Code</th>
                                {% endif %}
                                <th align="left">Quantity</th>
                                <th align="left">Barcode</th>
                                <th class="pack-active-strict-match" align="left" style="display: none;">Active</th>
                            </tr>
                            </thead>
                            <tbody>
                            {% for pack in packagingData %}
                                <tr>{% if drugnum_type == 'NDC' %}{% if forloop.first %}
                                    <td id="edit-package-drugnum" class="site-drug-edit-td" style="width: 200px;"
                                        rowspan="{{ packagingData.count }}">
                                        <input type="text" id="drug-number-labeller" name="drug-number-labeller"
                                               style="width: 5em;"
                                               value="{{ authorityData.drug_number|slice:"0:5" }}" required>
                                        <b>-</b>
                                        <input type="text" id="drug-number-product" name="drug-number-product"
                                               style="width: 4em;"
                                               value="{{ authorityData.drug_number|slice:"5:9" }}" required>
                                        <b>-</b>
                                    </td>{% endif %}
                                    <td class="site-drug-edit-td" style="text-align: left;"><input type="text"
                                                                                                   id="drug-pack-code-{{ pack.id }}"
                                                                                                   name="drug-pack-code-{{ pack.id }}"
                                                                                                   style="width: 2em;"
                                                                                                   value="{{ pack.pack_code }}"
                                                                                                   required>
                                    </td>
                                {% else %}
                                    <td id="edit-package-drugnum" class="site-drug-edit-td">
                                        <input type="text" id="drug-number-other" name="drug-number-other"
                                               style="width: 15em;" value="{{ authorityData.drug_number }}" required>
                                    </td>
                                {% endif %}
                                    <td class="site-drug-edit-td"><input type="text" id="drug-quantity-{{ pack.id }}"
                                                                         name="drug-quantity-{{ pack.id }}"
                                                                         style="width: 5em;"
                                                                         value="{{ pack.quantity }}" required></td>
                                    <td class="site-drug-edit-td"><input type="text" id="drug-barcode-{{ pack.id }}"
                                                                         name="drug-barcode-{{ pack.id }}"
                                                                         style="width: 12em;"
                                                                         value="{% if pack.barcode %}{{ pack.barcode }}{% endif %}"></td>
                                    <td id="edit-package-active-cell-{{ pack.id }}" class="site-drug-edit-td pack-active-strict-match" style="display: none;">
                                        <input type="radio" name="package-active" id="edit-package-active-{{ pack.id }}"
                                               value="{{ pack.id }}" {% if authorityData.strict_match %}{% if drugnum_type == 'NDC' %}
                                               {% if authorityData.drug_number|slice:"9:11" == pack.pack_code %}
                                               checked{% endif %}{% endif %}{% endif %}>
                                    </td>
                                </tr>
                            {% endfor %}
                            </tbody>
                        </table>
                    </td>
                </tr>
            </table>
        </form>
    </div>
    <form id="frmSetPillsPerBlister" name="frmSetPillsPerBlister" method="POST">
        {% csrf_token %}
        <input type="hidden" id="current_inst_id" name="current_inst_id" value=""/>

        <div id="max-per-blister" title="Set Max Pills Per Blister" style="margin-left: 2px;">
            <div id="max-per-blister-content">
                Loading Instance Data...
            </div>
        </div>
    </form>
{% endblock %}