{"id":1727,"date":"2025-05-06T13:33:32","date_gmt":"2025-05-06T13:33:32","guid":{"rendered":"https:\/\/mawasco.co.ke\/mystaging01\/?page_id=1727"},"modified":"2025-12-09T08:13:44","modified_gmt":"2025-12-09T08:13:44","slug":"calculator","status":"publish","type":"page","link":"https:\/\/mawasco.co.ke\/mystaging01\/calculator\/","title":{"rendered":"Calculator"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"1727\" class=\"elementor elementor-1727\">\n\t\t\t\t<div class=\"elementor-element elementor-element-fc8db82 e-con-full e-flex e-con e-parent\" data-id=\"fc8db82\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-50af9c7 elementor-widget elementor-widget-html\" data-id=\"50af9c7\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n\r\n    <style>\r\n        .slideshow-container {\r\n            position: fixed;\r\n            top: 0;\r\n            left: 0;\r\n            width: 100%;\r\n            height: 100%;\r\n            z-index: -1;\r\n            overflow: hidden;\r\n        }\r\n        \r\n        .slide {\r\n            position: absolute;\r\n            width: 100%;\r\n            height: 100%;\r\n            object-fit: fill;\r\n            opacity: 0;\r\n            transition: opacity 1s ease-in-out;\r\n        }\r\n        \r\n        .slide.active {\r\n            opacity: 1;\r\n        }\r\n    <\/style>\r\n    <script>\r\n        let scrollText = \"Quality water to all always   \";\r\n        let scrollPos = 0;\r\n\r\n        function scrollPlaceholder() {\r\n            const input = document.getElementById(\"units\");\r\n            if (input) {\r\n                input.placeholder = scrollText.substring(scrollPos) + scrollText.substring(0, scrollPos);\r\n                scrollPos = (scrollPos + 1) % scrollText.length;\r\n            }\r\n        }\r\n\r\n        setInterval(scrollPlaceholder, 200);\r\n    <\/script>\r\n<\/head>\r\n\r\n<body style=\"background-color: #e0f7ff; margin: 0; padding: 0; font-family: Arial, sans-serif;\">\r\n\r\n    <div class=\"slideshow-container\">\r\n        <img decoding=\"async\" src=\"https:\/\/mawasco.co.ke\/mystaging01\/wp-content\/uploads\/2025\/07\/bill-3.jpg\" class=\"slide active\" \/>\r\n        <img decoding=\"async\" src=\"https:\/\/mawasco.co.ke\/mystaging01\/wp-content\/uploads\/2025\/07\/bill-1.jpg\" class=\"slide\" \/>\r\n        <img decoding=\"async\" src=\"https:\/\/mawasco.co.ke\/mystaging01\/wp-content\/uploads\/2025\/07\/bill-2.jpg\" class=\"slide\" \/>\r\n    <\/div>\r\n\r\n    <div style=\"max-width: 420px; padding: 30px; background-color: white; margin-top: 30px; margin-left: 100px; box-shadow: 2px 2px 8px rgba(0,0,0,0.1); border-radius: 8px;\">\r\n        <h2 style=\"color: #007ACC; margin-bottom: 20px;\">Mathira Water and Sanitation Co. Calculator<\/h2>\r\n\r\n        <label for=\"accountType\" style=\"display:block; margin-bottom: 6px; color:#007ACC;\"><strong>Account Type:<\/strong><\/label>\r\n        <select id=\"accountType\" onchange=\"toggleSewer()\" style=\"width:100%; padding:10px; margin-bottom: 20px; border: 1px solid #007ACC;\">\r\n            <option value=\"\">-- Select Account Type --<\/option>\r\n            <option value=\"domestic\">Domestic\/Residential<\/option>\r\n            <option value=\"mdu\">Multi-Dwelling Units<\/option>\r\n            <option value=\"commercial\">Commercial\/Industrial\/Government\/Institutions<\/option>\r\n            <option value=\"institution\">Public Schools\/Colleges\/Universities<\/option>\r\n            <option value=\"kiosk\">Water Kiosk<\/option>\r\n        <\/select>\r\n\r\n        <div id=\"sewerSection\">\r\n            <label style=\"display:block; margin-bottom: 8px; color:#007ACC;\"><strong>With Sewer:<\/strong><\/label>\r\n            <div style=\"margin-bottom: 20px;\">\r\n                <label style=\"margin-right: 20px;\"><input type=\"radio\" name=\"sewer\" value=\"yes\"> Yes<\/label>\r\n                <label><input type=\"radio\" name=\"sewer\" value=\"no\"> No<\/label>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <label for=\"units\" style=\"display:block; margin-bottom: 6px; color:#007ACC;\"><strong>Enter No. of Units:<\/strong><\/label>\r\n        <input type=\"number\" id=\"units\" style=\"width:95%; padding:10px; margin-bottom: 6px; border: 1px solid #007ACC;\">\r\n        <div id=\"unitsError\" style=\"color:red; font-size: 14px; margin-bottom: 15px;\"><\/div>\r\n\r\n        <button onclick=\"submitForm()\" style=\"background-color: #007ACC; color: white; border: none; padding: 10px 20px; cursor: pointer; width: 100%;\">\r\n            Calculate Bill\r\n        <\/button>\r\n        <!--output area-->\r\n        <div id=\"output\" style=\"margin-top: 20px; display: none;\">\r\n            <div style=\"\r\n        border: 2px solid #007ACC; \r\n        padding: 10px; \r\n        margin-bottom: 10px; \r\n        border-radius: 8px; \r\n        background-color: #f0f9ff;\r\n        width: 95%;\r\n    \">\r\n                <strong>Water Charge(Ksh)<\/strong>\r\n                <span id=\"water\"><\/span>\r\n            <\/div>\r\n\r\n\r\n            <div style=\"\r\n        border: 2px solid #007ACC; \r\n        padding: 10px; \r\n        margin-bottom: 10px; \r\n        border-radius: 8px; \r\n        background-color: #f0f9ff;\r\n        width: 95%;\r\n    \">\r\n                <strong>Sewer Charge(Ksh)<\/strong>\r\n                <span id=\"sewer\"><\/span>\r\n            <\/div>\r\n\r\n\r\n            <div style=\"\r\n        border: 2px solid #007ACC; \r\n        padding: 10px; \r\n        border-radius: 8px; \r\n        background-color: #e6f7ff;\r\n        font-weight: bold;\r\n        width: 95%;\r\n    \">\r\n                <strong>Total Bill(Ksh)<\/strong>\r\n                <span id=\"total\"><\/span>\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n\r\n        <script>\r\n            function calculateDomesticBill(units, hasSewer) {\r\n                const slabs = [{\r\n                    to: 6,\r\n                    rate: 80\r\n                }, {\r\n                    to: 20,\r\n                    rate: 128\r\n                }, {\r\n                    to: 50,\r\n                    rate: 130\r\n                }, {\r\n                    to: 100,\r\n                    rate: 135\r\n                }, {\r\n                    to: 300,\r\n                    rate: 140\r\n                }, {\r\n                    to: Infinity,\r\n                    rate: 145\r\n                }];\r\n\r\n                let remaining = units;\r\n                let waterTotal = 0;\r\n                let previousTo = 0;\r\n                for (const slab of slabs) {\r\n                    if (remaining <= 0) break;\r\n                    const maxInThisSlab = slab.to - previousTo;\r\n                    const allowedByUserLogic = slab.to;\r\n                    const take = Math.min(remaining, allowedByUserLogic - previousTo);\r\n                    waterTotal += take * slab.rate;\r\n                    remaining -= take;\r\n                    previousTo = slab.to;\r\n                }\r\n\r\n                let sewerTotal = 0;\r\n                if (hasSewer) {\r\n                    let sewerUnits = units * 0.75;\r\n                    let remainingSewer = sewerUnits;\r\n                    previousTo = 0;\r\n                    for (const slab of slabs) {\r\n                        if (remainingSewer <= 0) break;\r\n\r\n                        const take = Math.min(remainingSewer, slab.to - previousTo);\r\n\r\n                        sewerTotal += take * slab.rate;\r\n                        remainingSewer -= take;\r\n                        previousTo = slab.to;\r\n                    }\r\n                }\r\n\r\n                return {\r\n                    water: waterTotal,\r\n                    sewer: sewerTotal,\r\n                    total: waterTotal + sewerTotal\r\n                };\r\n            }\r\n\r\n            function calculateMDUBill(units, hasSewer) {\r\n                const rate = 128;\r\n                const water = units * rate;\r\n                const sewer = hasSewer ? units * 0.75 * rate : 0;\r\n                return {\r\n                    water,\r\n                    sewer,\r\n                    total: water + sewer\r\n                };\r\n            }\r\n\r\n            function calculateCommercialBill(units, hasSewer) {\r\n                const slabs = [{\r\n                    to: 50,\r\n                    rate: 130\r\n                }, {\r\n                    to: 100,\r\n                    rate: 135\r\n                }, {\r\n                    to: 300,\r\n                    rate: 140\r\n                }, {\r\n                    to: Infinity,\r\n                    rate: 145\r\n                }];\r\n\r\n                function compute(u) {\r\n                    let total = 0,\r\n                        remaining = u,\r\n                        prev = 0;\r\n                    for (const slab of slabs) {\r\n                        if (remaining <= 0) break;\r\n                        const take = Math.min(remaining, slab.to - prev);\r\n                        total += take * slab.rate;\r\n                        remaining -= take;\r\n                        prev = slab.to;\r\n                    }\r\n                    return total;\r\n                }\r\n\r\n                const water = compute(units);\r\n                const sewer = hasSewer ? compute(units * 0.75) : 0;\r\n                return {\r\n                    water,\r\n                    sewer,\r\n                    total: water + sewer\r\n                };\r\n            }\r\n\r\n            function calculateInstitutionBill(units, hasSewer) {\r\n                const slabs = [{\r\n                    to: 600,\r\n                    rate: 128\r\n                }, {\r\n                    to: 1200,\r\n                    rate: 135\r\n                }, {\r\n                    to: Infinity,\r\n                    rate: 145\r\n                }];\r\n\r\n\r\n                function computeCharge(unitsToBill) {\r\n                    let total = 0;\r\n                    let previousTo = 0;\r\n\r\n                    for (const slab of slabs) {\r\n                        if (unitsToBill <= 0) break;\r\n\r\n                        const slabRange = slab.to - previousTo;\r\n                        const usedUnits = Math.min(unitsToBill, slabRange);\r\n\r\n                        total += usedUnits * slab.rate;\r\n\r\n                        unitsToBill -= usedUnits;\r\n                        previousTo = slab.to;\r\n                    }\r\n                    return total;\r\n                }\r\n                const waterTotal = computeCharge(units);\r\n                const sewerUnits = hasSewer ? units * 0.75 : 0;\r\n                const sewerTotal = hasSewer ? computeCharge(sewerUnits) : 0;\r\n\r\n                return {\r\n                    water: waterTotal,\r\n                    sewer: sewerTotal,\r\n                    total: waterTotal + sewerTotal\r\n                };\r\n            }\r\n\r\n\r\n            function calculateKioskBill(units) {\r\n                const total = units * 70;\r\n                return {\r\n                    water: total,\r\n                    sewer: 0,\r\n                    total\r\n                };\r\n            }\r\n\r\n            function toggleSewer() {\r\n                const type = document.getElementById(\"accountType\").value;\r\n                const sewerSection = document.getElementById(\"sewerSection\");\r\n                sewerSection.style.display = (type === \"kiosk\") ? \"none\" : \"block\";\r\n            }\r\n\r\n            function validateUnits(units) {\r\n                const errorDiv = document.getElementById(\"unitsError\");\r\n                if (units === \"\" || isNaN(units)) {\r\n                    errorDiv.innerText = \"Please fill all the fields.\";\r\n                    return false;\r\n                }\r\n                if (Number(units) < 0) {\r\n                    errorDiv.innerText = \"Units cannot be negative.\";\r\n                    return false;\r\n                }\r\n                errorDiv.innerText = \"\";\r\n                return true;\r\n            }\r\n\r\n            function submitForm() {\r\n                const units = document.getElementById(\"units\").value.trim();\r\n                const type = document.getElementById(\"accountType\").value;\r\n\r\n                if (!validateUnits(units)) return;\r\n                if (!type) {\r\n                    alert(\"Please select account type.\");\r\n                    return;\r\n                }\r\n\r\n                const u = Number(units);\r\n                const selectedSewer = document.querySelector(\"input[name='sewer']:checked\");\r\n                const sewerChoice = selectedSewer ? selectedSewer.value : undefined;\r\n                const hasSewer = sewerChoice === \"yes\";\r\n\r\n                let result;\r\n                if (type === \"domestic\") result = calculateDomesticBill(u, hasSewer);\r\n                else if (type === \"mdu\") result = calculateMDUBill(u, hasSewer);\r\n                else if (type === \"commercial\") result = calculateCommercialBill(u, hasSewer);\r\n                else if (type === \"institution\") result = calculateInstitutionBill(u, hasSewer);\r\n                else if (type === \"kiosk\") result = calculateKioskBill(u);\r\n\r\n                displayOutput(result);\r\n            }\r\n\r\n            function displayOutput(result) {\r\n                const outputDiv = document.getElementById(\"output\");\r\n                document.getElementById(\"water\").innerText = result.water.toFixed(2);\r\n                document.getElementById(\"sewer\").innerText = result.sewer.toFixed(2);\r\n                document.getElementById(\"total\").innerText = result.total.toFixed(2);\r\n                document.getElementById(\"output\").style.display = \"block\";\r\n\r\n            }\r\n\r\n\r\n            let slideIndex = 0;\r\n            const slides = document.querySelectorAll(\".slide\");\r\n\r\n            function showSlides() {\r\n                slides.forEach(slide => slide.classList.remove(\"active\"));\r\n                slideIndex = (slideIndex + 1) % slides.length;\r\n                slides[slideIndex].classList.add(\"active\");\r\n            }\r\n            setInterval(showSlides, 4000);\r\n        <\/script>\r\n<\/body>\r\n\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Mathira Water and Sanitation Co. Calculator Account Type: &#8212; Select Account Type &#8212;Domestic\/ResidentialMulti-Dwelling UnitsCommercial\/Industrial\/Government\/InstitutionsPublic Schools\/Colleges\/UniversitiesWater Kiosk With Sewer: Yes No [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1727","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/mawasco.co.ke\/mystaging01\/wp-json\/wp\/v2\/pages\/1727","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mawasco.co.ke\/mystaging01\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mawasco.co.ke\/mystaging01\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mawasco.co.ke\/mystaging01\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/mawasco.co.ke\/mystaging01\/wp-json\/wp\/v2\/comments?post=1727"}],"version-history":[{"count":33,"href":"https:\/\/mawasco.co.ke\/mystaging01\/wp-json\/wp\/v2\/pages\/1727\/revisions"}],"predecessor-version":[{"id":2592,"href":"https:\/\/mawasco.co.ke\/mystaging01\/wp-json\/wp\/v2\/pages\/1727\/revisions\/2592"}],"wp:attachment":[{"href":"https:\/\/mawasco.co.ke\/mystaging01\/wp-json\/wp\/v2\/media?parent=1727"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}