LemonadeJS - Two-way binding JS library

State variable example with lemonadejs.

by joaovmvini

HTML

<html>
<link rel="stylesheet" href="https://jsuites.net/v3/jsuites.css" type="text/css" />
<link rel="stylesheet" href="https://jsuites.net/v3/jsuites.layout.css" type="text/css" />
<script type="text/javascript" src="https://jsuites.net/v3/jsuites.js"></script>
<script src="https://lemonadejs.net/v1/lemonade.js"></script>
<div id='root'></div>
<script>
var countdown = (function(container){
    var self = {};
    
    self.days = '00';
    self.hours = '00';
    self.minutes = '00';
    self.seconds = '00';
    self.calendar = null;
    self.eventTimeElement = null;
    self.selectedDate = null;
 
    self.createCalendar = function(o) {
        self.calendar = jSuites.calendar(o);
    }
 
    self.startCountdown = function() {
        var userInput = self.validateInput();
        if(userInput) {
            self.selectedDate = self.calendar.getValue().slice(0,10) + " " + userInput;
            var timeLeft = self.getTimeLeft(self.selectedDate);
            if(timeLeft) {
                self.start();
            }else {
                alert('Invalid date, please select a later date')
            }
        }else {
            alert('Invalid input');
        }
    }
 
    self.validateInput = function() {
        var [h, m, s] = self.eventTimeElement.value.split(':');
        if(! isNaN(h) && ! isNaN(m) && ! isNaN(s) && (h >= 0 && h <= 24) && (m >= 0 && m <= 60) && (s >= 0 && s <= 60)) {
            return self.eventTimeElement.value;
        }
        return false;
    }
 
    self.getTimeLeft = function(eventDate) {
        var timeLeft = new Date(eventDate) - Date.now();
        return timeLeft > 0 ? timeLeft : false;
    }
 
    self.getFormattedTimeLeft = function(timeLeft) {
        var days = timeLeft / (1000 * 3600 * 24);
        var hours = (days - parseInt(days)) * 24;
        var minutes = (hours - parseInt(hours)) * 60;
        var seconds = (minutes - parseInt(minutes)) * 60;
        return [days, hours, minutes, seconds].map(n => parseInt(n));
    }
...