Jqueryに基づいてcron式セレクタを実現
(function($){
if(!$){
throw 'cron-selector : JQuery is needed'
}
var timeTypes = ['second','minute','hour','day','month','week','year'],
timeNames = [' ',' ',' ',' / ',' ',' / ',' '],
timeValues = ['0-59','0-59','0-23','1-31','1-12','1-7','1970-2099'],
localWeekSequence = ['2','3','4','5','6','7','1'],
weekChar = ['/','-','*',',','?','L','C','#'],
typeSelectorClass = 'typeSelector',
valueCheckBoxClass = 'valueCheckBox',
startInputClass = 'start',
endInputClass = 'end',
distanceInputClass = 'distance',
defaultOptions = {
containerClass:'',
locatedWeek:false
},
selectorTypeEnum = {
period:'period',
assign:'assign',
empty:'empty',
};
var typeToName = function (timeType) {
return timeNames[timeTypes.indexOf(timeType)];
};
var typeToValueScope = function (timeType) {
var timeValue = timeValues[timeTypes.indexOf(timeType)];
return timeValue ? timeValue.split('-') : timeValue;
};
$.cronSelector = function(options){
var options = this.options = $.extend(defaultOptions,options);
var container = this.container = $('
').appendTo($(options['container']));
// html
var renderTabHtml = function(){
var tabHtml = ['
'];
var tabItemHtml = [''];
for(var i = 0 ; i < timeTypes.length ; i++){
tabHtml.push(''+timeNames[i]+'');
tabItemHtml.push(' ');
tabItemHtml.push('');
container.append(tabHtml.join(''));
return container.append(tabItemHtml.join(''));
};
var getTimeItemContainer = function(timeType){
return $('div[tabItemCode='+timeType+']',container);
};
//
var renderPeriodHtml = function(timeType){
var timeContainer = getTimeItemContainer(timeType);
var typeName = typeToName(timeType);
var valueScope = typeToValueScope(timeType) || ['',''];
var min = valueScope[0];
var max = valueScope[1];
$(timeContainer).append('
' +
' '+typeName+' ,
' +
' '+typeName+' ,
' +
' '+typeName+'
' +
' ');
};
//
var renderAssignHtml = function(timeType){
var timeContainer = getTimeItemContainer(timeType);
var valueScope = typeToValueScope(timeType);
if(valueScope){
var timeValues = ['
' +
'
' +
' ' +
' '];
for(var i = valueScope[0];i <= valueScope[1];i++){
timeValues.push('
' +
' ' + i +
' ');
}
timeValues.push('');
$(timeContainer).append(timeValues.join(''));
}
}
//
var renderTimeItemHtml = function(){
for(var i= 0;i0 ? checkedSelect.attr('name') : selectorTypeEnum.empty;
if(selectorType == selectorTypeEnum.period){
return getPeriodValue(timeType);
}else if(selectorType == selectorTypeEnum.assign){
return getAssignValue(timeType);
}else if(selectorType == selectorTypeEnum.empty){
return getEmptyValue(timeType);
}
};
//
var getPeriodValue = function(timeType){
var timeContainer = getTimeItemContainer(timeType)
var start = $('input.'+startInputClass,timeContainer).val();
var end = $('input.'+endInputClass,timeContainer).val();
var distance = $('input.'+distanceInputClass,timeContainer).val();
var value = start || '';
if(end && start){
value += ('-' + end)
}
if(distance){
value += ('/' + distance);
}
return value || '*';
};
//
var getAssignValue = function(timeType){
var timeContainer = getTimeItemContainer(timeType);
var selectedValues = [];
$('input.'+valueCheckBoxClass+':checked',timeContainer).each(function () {
selectedValues.push($(this).attr("value"));
});
return selectedValues.join(',') || '0';
};
// /
var translateWeek = function(weekTime,reverse){
if(!weekTime){
return weekTime;
}
var weekDays = weekTime.split('');
for(var i = 0;i < weekDays.length;i++){
if(weekChar.indexOf(weekDays[i]) == -1){
if(reverse){
weekDays[i] = localWeekSequence.indexOf(weekDays[i]) + 1;
}else {
weekDays[i] = localWeekSequence[parseInt(weekDays[i]) - 1];
}
}
}
return weekDays.join('');
}
//
var getEmptyValue = function(timeType){
if(timeType == 'week' || timeType == 'day'){
return '?'
}
return "*"
};
var isNumber = function(value){
var re = /^[0-9]+.?[0-9]*$/;
return re.test(value)
};
//
var getTimeValueSelectorType = function(value){
if(!value || value == '*' || value == '?'){
return selectorTypeEnum.empty;
}
if(value.indexOf('/') != -1 || value.indexOf('-') != -1){
return selectorTypeEnum.period;
}
if(value.indexOf(',') != -1 || isNumber(value)){
return selectorTypeEnum.assign;
}
};
//
var initPeriodValue = function(value,timeType){
var timeContainer = getTimeItemContainer(timeType);
$('input[name="'+selectorTypeEnum.period+'"]',timeContainer).prop("checked",true);
var values = value.split('/');
var startAndEnd = values[0].split('-');
if(startAndEnd != '*') {
$('input.'+startInputClass, timeContainer).val(startAndEnd[0]);
if(startAndEnd.length > 1) {
$('input.'+endInputClass, timeContainer).val(startAndEnd[1]);
}
}
if(values.length > 1) {
var period = values[1];
$('input.'+distanceInputClass, timeContainer).val(period);
}
};
//
var initAssignValue = function(value,timeType){
var timeContainer = getTimeItemContainer(timeType);
$('input[name="'+selectorTypeEnum.assign+'"]',timeContainer).prop("checked",true);
var selectedValues = value.split(',');
for(var i = 0;i < selectedValues.length;i++){
$('input[value='+selectedValues[i]+'].'+valueCheckBoxClass,timeContainer).prop('checked',true);
}
};
var initEvent = function(){
initTabChooseEvent();
initMutualEvent();
};
var init = function(){
renderHtml();
initEvent();
};
init();
this.val = function(){
var values = [];
for(var i = 0;i < timeTypes.length;i++){
values.push(getTimeValue(timeTypes[i]));
}
var weekValue = values[timeTypes.indexOf('week')];
if(weekValue == '?' && values[timeTypes.indexOf('day')] == '?'){
values[timeTypes.indexOf('day')] = '*'
}
if(this.options['locatedWeek']){
values[timeTypes.indexOf('week')] = translateWeek(weekValue);
}
return values.join(' ');
};
this.parseVal = function(value){
var timeValues = value.split(' ');
timeValues[timeTypes.indexOf("week")] = translateWeek(timeValues[timeTypes.indexOf("week")],true);
for(var i = 0;i < timeValues.length;i++){
var timeValue = timeValues[i];
var timeType = timeTypes[i];
var selectorType = getTimeValueSelectorType(timeValue);
if(selectorType == selectorTypeEnum.assign){
initAssignValue(timeValue,timeType);
}else if(selectorType == selectorTypeEnum.period){
initPeriodValue(timeValue,timeType);
}
}
};
return this;
}
})($)
ソースアドレス