{"id":6,"date":"2024-03-18T12:50:45","date_gmt":"2024-03-18T12:50:45","guid":{"rendered":"https:\/\/pay.actraonline.ca\/national\/?page_id=6"},"modified":"2026-03-27T13:08:07","modified_gmt":"2026-03-27T17:08:07","slug":"home","status":"publish","type":"page","link":"https:\/\/pay.actra.ca\/national\/","title":{"rendered":"Home"},"content":{"rendered":"\n<script>\n    function committeeSearch(){\n\n        const listCommittee = document.querySelectorAll('.wp-block-group.committeeSection');\n        const committeeList = document.querySelectorAll('.committeeList li');\n\n        committeeList.forEach(element => {\n            element.classList.remove(\"activeCommittee\")\n        });\n\n        committeeList.forEach(element => {\n            if(element.children[0].hash.substring(1) == location.hash.substring(1)){\n                element.classList.add(\"activeCommittee\");\n            }\n        });\n\n\n        listCommittee.forEach(element => {\n            element.classList.remove(\"currentCommittee\")\n        });\n\n        document.getElementsByClassName(window.location.hash.substring(1))[0].classList.add('currentCommittee')\n\n    }\n\nfunction mobileMenuCommittee(){\n        const committeeSidebar = document.querySelector('.committeeSidebar')\n        const committeeList = document.querySelectorAll('.committeeList li');\n        const mobileMenu = document.createElement('select');\n        mobileMenu.id = \"mobileCommitteeList\";\n\n        committeeList.forEach(li =>{\n            const mobileMenuItems = document.createElement('option');\n            mobileMenuItems.append(li.children[0].cloneNode(true));\n\nif(mobileMenuItems.children[0].hash == location.hash){\nmobileMenuItems.setAttribute('selected','');\n}\n \n            mobileMenu.appendChild(mobileMenuItems);\n        });\n\n        \/\/committeeSidebar.replaceChild(mobileMenu, committeeSidebar.children[0])\n        \/\/committeeSidebar.append(mobileMenu);\n\n        \/\/document.getElementById('mobileCommitteeList').addEventListener('change', function() {\n            \/\/location.hash = this.selectedOptions[0].children[0].href.substring(38);\n            \/\/this.selectedOptions[0].children[0].setAttribute('selected','');\n        \/\/});\n    }\n\n    window.addEventListener('load', function () {\n        if(location.hash == ''){\n            location.hash = \"primary\";\n        }\n        committeeSearch();\n        mobileMenuCommittee();\n\n        if(window.innerWidth <= 1040){\n            \/\/mobileMenuCommittee();\n        }\n    });\n\n    window.addEventListener('hashchange', function () {\n\n        committeeSearch();\n    });\n\n<\/script>\n\n\n\n<div id=\"national_content\" class=\"wp-block-group committeeSection primary\" style=\"text-align: left;\">\n\n<h2>ACTRA National Online Payment System<\/h2>\n    <div>\n        <p>Welcome to ACTRA National's Online Payment System.<\/p>\n        <p>Paying your dues online is safe and easy. For security and to protect your privacy, you will be required to\n            provide your full name, Membership ID and credit card information each time you sign in to make a payment.\n        <\/p>\n        <p>Please enter your full name (either legal or stage) as it appears in your ACTRA Member System personal\n            profile.<\/p>\n<p>\n<strong>Note:<\/strong> We no longer accept American Express as a payment method.\n<\/p>\n    <\/div>\n<\/div>\n\n<div id=\"national_content\" class=\"wp-block-group committeeSection payment\" style=\"text-align: left;\">\n    <p><span class=\"PageHeader\"><br>\n        <\/span><span class=\"PageHeader\">ACTRA National Online Payment<\/span><\/p>\n    <div>\n        <p>\n            The amount below is what our records show as being outstanding. If you require an explanation for the amount\n            outstanding, please contact the ACTRA National Membership department for assistance at edli@actra.ca <\/p>\n    <\/div>\n<\/div>\n\n\n\n<div id=\"modal\" class=\"hide\">\n    <div class=\"modal-content\">\n        <h3>ACTRA National<br>Payment Portal<\/h3>\n        <p>\n            <span>Note:<\/span> We no longer accept <span>American Express<\/span> as a payment method.\n        <\/p>\n        <button id=\"close-modal-btn\">Close<\/button>\n    <\/div>\n<\/div>\n\n<script>\n    function paymentReminderInit() {\n        const closeButton = document.getElementById(\"close-modal-btn\");\n        closeButton.addEventListener(\"click\", function () {\n            modal.style.display = \"none\";\n        });\n\n        const modal = document.getElementById(\"modal\");\n\n        modal.style.display = \"block\";\n    }\n    window.addEventListener('load', function () {\n        if(location.hash == '#primary'){\n            if(document.querySelector('error').classList.length == 0){\n                if(location.href.indexOf('back') > 0 || location.href.indexOf('done') > 0){\n\n                }else{\n                   \/\/paymentReminderInit();\n                    document.querySelector('#modal').classList.remove('hide');\n                }                \n            }\n        }\n    });\n<\/script>\n\n<style>\n    #modal {\n        display: none;\n        \/* Initially hidden *\/\n        position: fixed;\n        \/* Stay in place *\/\n        z-index: 1;\n        \/* Sit on top *\/\n        left: 0;\n        top: 0;\n        width: 100%;\n        \/* Full width *\/\n        height: 100%;\n        \/* Full height *\/\n        overflow: auto;\n        \/* Enable scroll if needed *\/\n        background-color: rgba(0, 0, 0, 0.4);\n        \/* Black background with opacity *\/\n        z-index: 999999;\n    }\n\n    .modal-content {\n        background-color: #fefefe;\n        margin: 15% auto;\n        \/* 15% from the top and centered *\/\n        padding: 20px;\n        border: 1px solid #888;\n        width: 35vw;\n        \/* Adjust width as needed *\/\n        position: relative;\n        text-align: center;\n        border-radius: 15px;\n    }\n\n    .modal-content h3{\n        line-height: 1;\n        font-size: 2rem;\n        font-weight: 900;\n    }\n    .modal-content p{\n        font-size: 1rem;\n    }\n    .modal-content span{\n        font-size: 1.25rem;\n        font-weight: 900;\n    }\n    #close-modal-btn {\n        color: #fff;\n        background-color: #da3838;\n        font-size: 1rem;\n        font-weight: 800;\n        padding: 12px 20px;\n        border: none;\n        cursor: pointer;\n        float: right;\n        position: absolute;\n        top: 0;\n        right: 0;\n        border-radius: 0 15px 0 0;\n    }\n\n    #close-modal-btn:hover {\n        background-color: #ddd;\n        color: #da3838;\n        border-radius: 0 15px 0 0;\n        border-color: #da3838;\n        border-left: 3px solid;\n        border-bottom: 3px solid;\n    }\n<\/style>\n\n\n\n<div class=\"wp-block-group committeeSection primary\"><div class=\"wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading has-text-align-left\">ACTRA NATIONAL ONLINE PAYMENT<\/h2>\n\n\n\n<p class=\"has-text-align-left\">Welcome to ACTRA National's Online Payment System.<\/p>\n\n\n\n<p class=\"has-text-align-left\">Paying your dues online is safe and easy. For security and to protect your privacy, you will be required to provide your full name, Membership ID and credit card information each time you sign in to make a payment.<\/p>\n\n\n\n<p class=\"has-text-align-left\">Please enter your full name (either legal or stage) as it appears in your ACTRA Member System personal profile.<\/p>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-group committeeSection payment\"><div class=\"wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained\">\n<p>The amount below is what our records show as being outstanding. If you require an explanation for the amount outstanding, Please contact the ACTRA National Membership department for assistance.<\/p>\n\n\n\n<p>Full or partial payments are accepted.<br>(Please contact your local branch if you require a payment plan)<\/p>\n\n\n\n<p><br><\/p>\n<\/div><\/div>\n\n\n<link rel=\"stylesheet\" href=\"https:\/\/pay.actra.ca\/national\/wp-content\/plugins\/plugin\/membership\/assets\/css\/main.css?v=1.1.0\">\n<link rel=\"stylesheet\" href=\"https:\/\/pay.actra.ca\/national\/wp-content\/plugins\/plugin\/assets\/css\/language-toggle.css?v=1.1.0\">\n<script src=\"https:\/\/code.jquery.com\/jquery-3.6.0.min.js\"><\/script>\n<script src=\"https:\/\/html2canvas.hertzen.com\/dist\/html2canvas.min.js\"><\/script>\n<script src=\"https:\/\/gateway.moneris.com\/chkt\/js\/chkt_v1.00.js\"><\/script>\n<script src=\"https:\/\/pay.actra.ca\/national\/wp-content\/plugins\/plugin\/membership\/assets\/js\/main.js?v=1.1.0\"><\/script>\n<main id=\"paymentWrapper\" data-lang=\"en\">\n    <div class=\"actra-lang-toggle-container\">\n        <a href=\"#\" class=\"actra-lang-toggle active\" data-lang=\"en\">EN<\/a>\n        <a href=\"#\" class=\"actra-lang-toggle \" data-lang=\"fr\">FR<\/a>\n    <\/div>\n    <script>\n    var currentBranch = \"national\";\n    var currentPath = \"\/toronto\/wp-content\/plugins\/actra-membership-payment\/membership\/assets\";\n<\/script>\n<form action=\"\/national\/wp-json\/wp\/v2\/pages\/6\" method=\"post\" autocomplete=\"off\" class=\"moe\">\n    <error class=\"\">\n            <\/error>\n    <header>\n        <h1>ACTRA ONLINE PAYMENT<\/h1>\n        <img decoding=\"async\" src=\"\" alt=\"\">\n    <\/header>\n    <div class=\"paymentForm2\">\n        <label for=\"member_name\">First and Last Name<\/label>\n        <input type=\"text\" name=\"member_name\" id=\"member_name\" placeholder=\"John Smith\" value=\"\" required autocomplete=\"on\">\n    <\/div>\n            <div class=\"paymentForm2\">\n            <label for=\"member_id\">Membership ID <span>((including dash with no spaces))<\/span><\/label>\n            <input type=\"text\" id=\"member_id\" name=\"member_id\" maxlength=\"8\" placeholder=\"AM-00000\" value=\"\" required autocomplete=\"on\"><br>\n        <\/div>\n        <input type=\"hidden\" name=\"idType\" value=\"\">\n    <input type=\"hidden\" name=\"token\" value=\"19f477f8be8f156187a67ee2370c5812ace7da7fd19e36960b767f5e13375ea528f1c0\">\n    <input type=\"hidden\" name=\"mToken\" value=\"\">\n    <input type=\"hidden\" name=\"cBranch\" value=\"\">\n    <div class=\"membershipFormButtons\">\n        <button class=\"btn\" type=\"submit\">Submit<\/button>\n        <button class=\"btn\" type=\"reset\">Clear<\/button>\n    <\/div>\n<\/form>\n<script>\n        document.addEventListener('DOMContentLoaded', function() {\n            setValues();\n\n            \/\/ Prevent Enter key submission in name field\n            const memberNameField = document.querySelector('#member_name');\n            if (memberNameField) {\n                memberNameField.addEventListener(\"keydown\", function(e) {\n                    if (e.which === 13) {\n                        e.preventDefault();\n                        e.stopPropagation();\n                    }\n                });\n            }\n\n            \/\/ Prevent Enter key submission in membership input fields\n            document.querySelectorAll('.membershipInput input').forEach(function(input) {\n                input.addEventListener(\"keydown\", function(e) {\n                    if (e.which === 13) {\n                        e.preventDefault();\n                        e.stopPropagation();\n                    }\n                });\n            });\n            \/\/ Handle back button clicks in membership type selection\n            document.querySelectorAll('.membershipInput button').forEach(function(btn) {\n                btn.addEventListener(\"click\", function(event) {\n                    event.preventDefault();\n                    btn.parentElement.classList.toggle('hide');\n                    const mbc = document.querySelector('.membershipButtonContainer');\n                    if (mbc) {\n                        mbc.classList.toggle('hide');\n                    }\n                    const formButtons = document.querySelector('.membershipFormButtons');\n                    if (formButtons) {\n                        formButtons.style.display = 'none';\n                    }\n                });\n            });\n\n            \/\/ Handle membership type button clicks\n            const membershipButtons = document.querySelectorAll('#paymentWrapper form .membershipButtonContainer button');\n            if (membershipButtons.length > 0) {\n                \/\/ Full Member button\n                if (membershipButtons[0]) {\n                    membershipButtons[0].addEventListener(\"click\", function(event) {\n                        event.preventDefault();\n                        hideAllMembershipInputs();\n                        document.querySelector('.memFull').classList.toggle('hide');\n                        document.querySelector('.membershipButtonContainer').classList.toggle('hide');\n                        document.querySelector('.membershipFormButtons').style.display = 'block';\n                    });\n                }\n                \/\/ Apprentice Member button\n                if (membershipButtons[1]) {\n                    membershipButtons[1].addEventListener(\"click\", function(event) {\n                        event.preventDefault();\n                        hideAllMembershipInputs();\n                        document.querySelector('.memApp').classList.toggle('hide');\n                        document.querySelector('.membershipButtonContainer').classList.toggle('hide');\n                        document.querySelector('.membershipFormButtons').style.display = 'block';\n                    });\n                }\n                \/\/ Background Member button\n                if (membershipButtons[2]) {\n                    membershipButtons[2].addEventListener(\"click\", function(event) {\n                        event.preventDefault();\n                        hideAllMembershipInputs();\n                        document.querySelector('.memBackground').classList.toggle('hide');\n                        document.querySelector('.membershipButtonContainer').classList.toggle('hide');\n                        document.querySelector('.membershipFormButtons').style.display = 'block';\n                    });\n                }\n            }\n\n            \/\/ Helper function to hide all membership inputs\n            function hideAllMembershipInputs() {\n                document.querySelectorAll('#paymentWrapper form .membershipContainer > div').forEach(function(el) {\n                    if (el && !el.classList.contains(\"hide\")) {\n                        el.classList.add(\"hide\");\n                    }\n                });\n            }\n\n            \/\/ Restore form state if returning from error\n            \n            \/\/ Set form values from POST data\n            function setValues() {\n                            }\n\n            \/\/ Clear form fields\n            function clearClick() {\n                document.getElementById('member_name').value = \"\";\n                const memberIdField = document.getElementById('member_id');\n                if (memberIdField) {\n                    memberIdField.value = \"\";\n                }\n                const memberUbcpIdField = document.getElementById('member_ubcp_id');\n                if (memberUbcpIdField) {\n                    memberUbcpIdField.value = \"\";\n                }\n            }\n\n            \/\/ Attach clear button handler\n            const resetButton = document.querySelector('button[type=\"reset\"]');\n            if (resetButton) {\n                resetButton.addEventListener('click', function() {\n                    clearClick();\n                });\n            }\n        });\n\n        \/\/ Set membership type on form submit\n        document.querySelector('form').addEventListener(\"submit\", function() {\n            document.querySelectorAll('.membershipInput').forEach(function(el, i) {\n                if (el && !el.classList.contains(\"hide\")) {\n                    const idTypeField = document.querySelector('[name=idType]');\n                    if (idTypeField && el.classList.length > 1) {\n                        idTypeField.value = el.classList[1];\n                    }\n                }\n            });\n        });\n    <\/script><\/main>\n\n","protected":false},"excerpt":{"rendered":"<p>ACTRA National Online Payment System Welcome to ACTRA National&#8217;s Online Payment System. Paying your dues online is safe and easy. For security and to protect your privacy, you will be required to provide your full name, Membership ID and credit card information each time you sign in to make a payment. Please enter your full [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-6","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/pay.actra.ca\/national\/wp-json\/wp\/v2\/pages\/6","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pay.actra.ca\/national\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/pay.actra.ca\/national\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/pay.actra.ca\/national\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pay.actra.ca\/national\/wp-json\/wp\/v2\/comments?post=6"}],"version-history":[{"count":13,"href":"https:\/\/pay.actra.ca\/national\/wp-json\/wp\/v2\/pages\/6\/revisions"}],"predecessor-version":[{"id":78,"href":"https:\/\/pay.actra.ca\/national\/wp-json\/wp\/v2\/pages\/6\/revisions\/78"}],"wp:attachment":[{"href":"https:\/\/pay.actra.ca\/national\/wp-json\/wp\/v2\/media?parent=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}