Custom password protect website and show different section based on input password

Ask the community
,
2

There many way to do it.
For example, you can add a multistate box, have the following States:

  1. password state with “Welcome, please fill in the password” + text input (or number input if only numbers are allowed)

  2. dayGuest state with the elements relevant to type1 guests

  3. eveningGuest

Now it depends:

    • if you only have 2 password, you can hardcoded them in the page code (assuming that you don’t really afraid that a guest will get into the page code to read the forbidden password which is not really hard to do by the way. (If you are, go for the next option)
    • If you wish to have a unique password per guest (or alternatively instead of asking them to fill-in a password. ask them to fill-in email/phone number and use it as password behind the scenes) or if you want to protect the password from guests who know where to look for it in the code files, you’ll have to store them in the database and query the data for match.

Let’s say you go for the first option, then you can do:


//page code
let dayPw = 'abcde123';
let eveningPw = 'qwert456';
$w.onReady(() => {
    $e('input1').onInput(event => {
        if(event.target.value.trim() === dayPw){
            $w('#mulitiStateBox').changeState('dayGuest');
        } else if(event.target.value.trim() === dayPw){
            $w('#mulitiStateBox').changeState('eveningPw');
        } 
    })
})