You have been redirected from an outdated version of the article. Below is the content available on this topic. To view the old article click here.

lt()

Usage

lt(val1, val2)

Description
Returns a boolean value that indicates whether the numerical value val1 is smaller than the numerical value val2. This method tries to convert its parameter objects into numerical values, i.e. you can compare strings numerically.

Example

${lt(1, 2)}

results in

true

Search results for "lt()"

lt()

Returns a boolean value that indicates whether the numerical value val1 is smaller than the numerical value val2. This method tries to convert its parameter objects into numerical values, i.e. you can compare strings numerically.

lt(val1, val2)

Built-In Functions: lt()

mult()

Returns the product of all given parameters.

mult(val1, val2...)

Built-In Functions: mult()

Example Implementation

// get all required elements
const loginForm     = document.getElementById('login-form');
const emailInput    = document.getElementById('email');
const passwordInput = document.getElementById('password');
const loginButton   = document.getElementById('login-button');
   
loginForm.addEventListener('submit', async (event) => {

   event.preventDefault();

   loginButton.disabled = true;
   
   // get from values
   const email    = emailInput.value;
   const password = passwordInput.value;
   
   // login
   const response = await fetch('/structr/rest/login', {
      method: 'POST',
      body: JSON.stringify({
         eMail: email,
         password: password
      })
   });

   if (response.status === 202) {

      let redirectUrl      = response.headers.get('twoFactorLoginPage')
            + '?token=' + response.headers.get('token')
            + '&qrdata=' + (response.headers.get('qrdata') ?? '');

      window.location.href = redirectUrl;

   } else {
      
      if (response.ok) {
         
         loginButton.textContent = 'Login successful';
         window.location.href    = '/';

      } else {
         
         loginButton.disabled    = false;
         loginButton.textContent = 'Wrong username or password.';

         window.setTimeout(function() {
            loginButton.value    = 'Login';
            loginButton.disabled = false;
         }, 2000);
      }
   }
});

Two-Factor Authentication: Example Implementation

<div id="qrimage-wrapper">
   <img id="qrimage" style="margin-left: calc(50% - 100px);">
   <div>To use two factor authentication, scan this QR code with an authenticator app on your smartphone.</div>

   <div class="text-sm mt-6">
      <div>
         <b>Android: </b>
         <a class="cursor-pointer hover:text-blue-400 text-blue-700" href="https://play.google.com/store/apps/details?id=com.google.android.apps.authenticator2&hl=en&gl=US">Google Authenticator</a> on Google Playstore
      </div>
      <div>
         <b>Apple iOS: </b>
         <a class="cursor-pointer hover:text-blue-400 text-blue-700" href="https://apps.apple.com/us/app/google-authenticator/id388497605">Google Authenticator</a> on App Store
      </div>
   </div>
</div>

<form action="#" id="twoFactorForm">
   <input id="twoFactorToken" type="hidden" value="${request.token}">
   <div class="my-6">
      <label class="block text-sm font-medium leading-5 text-gray-700">Two Factor Code</label>
      <input id="twoFactorCode" class="appearance-none block w-full px-3 py-2 bg-blue-100 border border-gray-300 rounded-md placeholder-gray-400 focus:outline-none focus:shadow-outline-blue focus:border-blue-300 transition duration-150 ease-in-out sm:text-sm sm:leading-5">
   </div>
   <button type="submit" id="login-button" class="w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-blue-600 hover:bg-blue-500 focus:outline-none focus:border-blue-700 focus:shadow-outline-indigo active:bg-blue-700 transition duration-150 ease-in-out">Login</button>
</form>

<script>
   document.addEventListener('DOMContentLoaded', () => {

      // get all required elements
      const qrimageWrapper = document.getElementById('qrimage-wrapper');
      const token          = document.getElementById('twoFactorToken').value;
      const codeInput      = document.getElementById('twoFactorCode').value;
      const loginButton    = document.getElementById('login-button');

      let qrdata = (new URLSearchParams(location.search)).get('qrdata');

      if (!qrdata) {
         // remove qr code placeholder if user is not shown qr code
         qrimageWrapper.remove();
      } else {
         // transform url-safe qr code to regular base64 to display as image
         qrimageWrapper.querySelector('#qrimage').src = 'data:image/png;base64, ' + qrdata.replaceAll('_', '/').replaceAll('-', '+');
      }

      document.getElementById('twoFactorForm').addEventListener('submit', async (event) => {

         event.preventDefault();

         loginButton.disabled = true;

         const response = await fetch('/structr/rest/login', {
            method: 'POST',
            body: JSON.stringify({
               twoFactorToken: token,
               twoFactorCode: codeInput
            })
         });
         
         if (response.ok) {
            
            loginButton.textContent = 'Login successful';
            window.location.href    = '/';

         } else {

            let buttonText = 'Login failed - is device time correct?';
            
            let reason = response.headers.get('reason');
            
            if (reason === 'wrongTwoFactorCode') {
               buttonText = 'Two Factor Code is not correct';
            }

            loginButton.disabled    = false;
            loginButton.textContent = buttonText;

            window.setTimeout(function() {
               loginButton.textContent = 'Login';
               loginButton.disabled    = false;
            }, 2000);
         }
      });
   });
</script>

Two-Factor Authentication: Example Implementation