JSFiddle - React, Tailwind, and code Playground

by antelopelovefan

HTML

<div class="form">
<input type="checkbox" class="day-of-week" value="Sun" id="Sun"> <label for="Sun">Sun</label><br />
<input type="checkbox" class="day-of-week" value="Mon" id="Mon"> <label for="Mon">Mon</label><br />
<input type="checkbox" class="day-of-week" value="Tue" id="Tue"> <label for="Tue">Tue</label><br />
<input type="checkbox" class="day-of-week" value="Wed" id="Wed"> <label for="Wed">Wed</label><br />
<input type="checkbox" class="day-of-week" value="Thu" id="Thu"> <label for="Thu">Thu</label><br />
<input type="checkbox" class="day-of-week" value="Fri" id="Fri"> <label for="Fri">Fri</label><br />
<input type="checkbox" class="day-of-week" value="Sat" id="Sat"> <label for="Sat">Sat</label>
</div>
<div class="output"></div>

CSS

.output { margin-top: 30px; }

JavaScript

var convertBase = function (num) {
    this.from = function (baseFrom) {
        this.to = function (baseTo) {
            return parseInt(num, baseFrom).toString(baseTo);
        };
        return this;
    };
    return this;
};

this.dec2bin = function (num) {
    return convertBase(num).from(10).to(2);
};

//1 1 1 1 1 1 1 = 127 for every day
//0 0 1 0 0 0 0 = 16 for Tuesday only
//S M T W T F S

var days = {
    Sun: ["1000000", 64],
    Mon: ["0100000", 32],
    Tue: ["0010000", 16],
    Wed: ["0001000", 8],
    Thu: ["0000100", 4],
    Fri: ["0000010", 2],
    Sat: ["0000001", 1]
};

/*
day = day | 64;
day = day | 32;

console.log(day);
console.log(dec2bin(day));
*/
var buildScheduleNumber = function() {
    var day = 0;
    
    $('.day-of-week').each( function() {
        if(days.hasOwnProperty($(this).val())) {
            if($(this).is(':checked')) {
                day = day | days[$(this).val()][1];
                
                $('.output').html(day + '<br />' + dec2bin(day));
            }
        }else {
            alert('The day value ' + $(this).val() + ' is unknown.');   
        }
    });
}

$('.day-of-week').change( function() {
    buildScheduleNumber();
});