T('datepicker', `
<div id="datepicker" class="datepicker">
	<div id="monthLabel">[@ T.monthLabel(ctx) #]</div>
	<div class="dayLabel">
		[# var work = new Date('1970-06-01'); #]
		[# for (var i = 0; i < 7; i++) { #]
			<div class="[@ work.toLocaleString('en',{weekday:'short'}) #]">[@ work.toLocaleString(lang,{weekday:'short'}) #]</div>
		[# work.setDate(work.getDate() + 1); } #]	
	</div>
	<div id="monthContainer" ontransitionend="DP.te()">[@ T.month(ctx) #]</div>
</div>
`)

T('monthLabel', `
[# 
	var pdis = ctx.min && DP.yyyymm(show) <= DP.yyyymm(min);
	var	ndis = ctx.max && DP.yyyymm(show) >= DP.yyyymm(max); 
#]
<div class="nav prev[@ pdis?' disabled':'' #]" onclick="[@ pdis?'':'DP.nav(-1)' #]"></div>
<label>[@ show.toLocaleString(lang, {month:'long',year:'numeric'}) #]</label>
<div class="nav next[@ ndis?' disabled':'' #]" onclick="[@ ndis?'':'DP.nav(+1)' #]"></div>
`)

T('month', `
<div class="month">
	[#
		var work = new Date(show); 
		work.setDate(1); 
		work.setDate(work.getDate()-(work.getDay()==0?6:work.getDay()-1));
	#]
	[# for (var i = 0; i < 42; i++) { #]
		[#
			var ext = work.getMonth() != show.getMonth();
			var dis = ext || (ctx.min && DP.yyyymmdd(work) < DP.yyyymmdd(min))||(ctx.max && DP.yyyymmdd(work) > DP.yyyymmdd(max));
			var cur = current && DP.yyyymmdd(work) == DP.yyyymmdd(current);
			var now = DP.yyyymmdd(work) == DP.yyyymmdd(new Date());
		#]
		<div class="[@ work.toLocaleString('en',{weekday:'short'}) #][@ dis?' disabled':'' #][@ ext?' external':'' #][@ cur?' current':'' #][@ now?' now':'' #]"
			onclick="[@ dis?'':'DP.setDate(' + work.getTime() + ')' #]">[@ ext?'':work.getDate() #]</div>
	[# work.setDate(work.getDate() + 1); } #]
</div>
`)