JSFiddle - React, Tailwind, and code Playground

by Nibin George

HTML

<div id="call_checkin"></div>

JavaScript

var checkin_status = [{
    "startdate": "2015-01-08",
        "ischecked": 1,
        "totaldays": 0,
        "roadmap": [

    {
        "gifttype": "stars",
        "quantity": 100,
        "day": 1
    }, {
        "gifttype": "stars",
        "quantity": 500,
        "day": 3
    }, {
        "gifttype": "stars",
        "quantity": 1000,
        "day": 10
    }, {
        "gifttype": "stars",
        "quantity": 1200,
        "day": 20
    }, {
        "gifttype": "stars",
        "quantity": 2200,
        "day": 30
    },

    ]

}];
checkinlayout(checkin_status);

function checkinlayout() {
    var ischecked = checkin_status[0].ischecked;
    var total_checkin_days = checkin_status[0].totaldays;

    var call_checkin_date = "<div class='checkin_container'>" +
        "<div class='checkin_status'>Day <label>" + total_checkin_days + "</label></div>" +
        "<div class='chekcin_button_container'>" +
        "<center>" +
        "<input type='button' id='checkin_button' class='checkin_button' value='Check me now' />" +
        "<label class='checkin_button_chcked'>" +
        "<img class='checkin_button_chcked_img' src='img/check.png'/>" +
        "Checked</label>" +
        "</center>" +
        "</div>" +
        "<div class='checkin_space'></div>" +
        "<div class='checkin_progress'>" +

        "</div>" +
        "</div>";

    $("#call_checkin").append(call_checkin_date);
    if (ischecked == 1) {
        $("#checkin_button").click(function () {
            /*				$("#checkin_button").hide();
				$(".checkin_button_chcked").css("display","block");*/
            checkin_status[0].totaldays += 1;
            alert(JSON.stringify(checkin_status));
            checkinforfun(checkin_status);
        });
    } else {
        $("#checkin_button").hide();
        $(".checkin_button_chcked").css("display", "block");

    }


}


checkinforfun(checkin_status);

function checkinforfun() {
    var total_checkin_days = checkin_status[0].totaldays;

    var...