JSFiddle - React, Tailwind, and code Playground

by redeyes2015

HTML

<script src="https://raw.github.com/andrewplummer/Sugar/master/release/edge/sugar-edge-full.min.js"></script>
<div id=inputs>
    <ul>
        <li><label for='team'>Team Name</label><input id=team type=text></li>
        <li><label for='year'>Which Year?</label><input id=year type=text></li>
        <li><label for='day'>Meeting day(1/Mon ~ 5/Fri)</label><input id=day type=text></li>
        <li><button type=button>Generate!</button></li>
    </ul>
</div>

CSS

#inputs li {
    margin: 5px;
}
input {
    margin-left: 1em;
}

JavaScript

var padding = function(num){ return ('00' + (Number(num))).slice(-2) }
var gen = function(team, year, day){
    var result = [(''+year)];
    var template = (function(team){
        var prefix = '[[' + team + ':Meeting minutes ';
        return function(date){
            var year = '' + date.getFullYear();
            var month = padding(date.getMonth() + 1);
            var day = padding(date.getDate());
            return [prefix, year, month, day, '|',
                    year , '/', month, '/', day, ']]'].join('');
            //return '[[NVR2:Meeting minutes 20121005|2012/10/05]]'
        }
    })(team);
    //return template(new Date(year, 0, 1));
    
    var findFirstMeetingDay = function(month /* 0~ 11 */){
        var theDay = new Date(year, month, 1);        
        while(theDay.getDay() != day){
            theDay.advance({day: 1});
        }
        return theDay;
    }
    //return '' + findFirstMeetingDay(0);
        
    var meetingDay, month_line;
    for(var month = 0; month < 12; ++month){
        if(!(new Date(year, month, 1).endOfMonth().isFuture())){
            continue;
        }
        result.push('==' + month_mapper[month] + '==');
        meetingDay = findFirstMeetingDay(month);
        month_line = [];
        while(meetingDay.getMonth() == month){
            month_line.push(template(meetingDay));
            meetingDay.advance({day: 7})
        }
        result.push(month_line.join(' '));
    }
    result.push('[[Team:{team}|Back to Team {team}]]'.replace(/{team}/g, team));
    return result.join('\n\n');
};
var month_mapper = [
    'Jan', 'Fab', 'Mar', 'Apr', 'May', 'Jun',
    'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'
];
var weekday_mapper = {
    mon: 1,
    tue: 2,
    wed: 3,
    thu: 4,
    fri: 5
};
(function(weekday_mapper){
for(var i=1; i<6; ++i){
    weekday_mapper[''+i] = i;
}
})(weekday_mapper);

var print = function(msg){
    $('<div class=msg></div>').text(msg).insertAfter('#inputs');
};

$(function(){
   ...