BaseField = function(fieldHTML, fieldId, fieldType, style, styleClass) { this.fieldHTML = fieldHTML; this.setAttribute("id", fieldId); this.setAttribute("type", fieldType); this.setAttribute("style", style); this.setAttribute("class", styleClass); }; BaseField.prototype.setAttribute = function(attributeName, attributeValue) { var index = this.fieldHTML.indexOf(attributeName + '="'); if(index==-1) { index = this.fieldHTML.indexOf(' '); this.fieldHTML = this.fieldHTML.substring(0, index) + ' ' + attributeName + '="' + attributeValue + '"' + this.fieldHTML.substring(index); } else { index += (attributeName + '="').length; var indexEnd = this.fieldHTML.indexOf('"', index); this.fieldHTML = this.fieldHTML.substring(0, index) + attributeValue + this.fieldHTML.substring(indexEnd); } }; Picker = function(pickerType, displayArea, pickerWidth, pickerHeight, autoHeight, alignRight, autoSize, transparentDisabled) { this.pickerType = pickerType; this.displayArea = displayArea; this.pickerWidth = (pickerWidth && pickerWidth>0 ? pickerWidth : (!this.displayArea ? 200 : this.displayArea.offsetWidth)); this.pickerHeight = (pickerHeight && pickerHeight>0 ? pickerHeight : 165); this.autoHeight = autoHeight; this.autoSize = autoSize; this.alignRight = alignRight; this.transparentDisabled = transparentDisabled; this.parentWindow = window; try { while(this.parentWindow!=window.top && this.parentWindow.frameElement) { var win = this.parentWindow.frameElement.ownerDocument.parentWindow; if(!win) { win = this.parentWindow.frameElement.ownerDocument.defaultView; } if(!win) { break; } this.parentWindow = win; } } catch(e) { } this.onPickerLoaded = function() { }; this.pickerDiv = this.parentWindow.document.getElementById("pickerDiv_" + pickerType); if(!this.pickerDiv) { this.pickerDiv = this.parentWindow.document.createElement("div"); this.pickerDiv.style.position = "absolute"; this.pickerDiv.id = "pickerDiv_" + pickerType; this.pickerDiv.style.height = 0; this.pickerDiv.style.zIndex = 1000000; this.parentWindow.document.body.insertBefore(this.pickerDiv, this.parentWindow.document.body.childNodes[0]); this.parentWindow.picker = this; this.pickerDiv.innerHTML = ''; } this.parentWindow.pickerWindow = window; this.pickerDiv.style.zIndex += 1000; this.pickerFrame = this.parentWindow.frames["pickerFrame_" + pickerType]; }; Picker.prototype.writeBody = function(pickerBodyHtml) { var doc = this.pickerFrame.document; doc.open(); doc.write('\n'); doc.write(' \n'); doc.write(' \n'); doc.write(' \n'); doc.write(' \n'); doc.write(pickerBodyHtml); doc.write(' \n'); doc.write(''); doc.close(); cloneStyle(document, doc); }; Picker.prototype.show = function(pickerLeft, pickerTop) { var left = 0, top = 0; var obj; if(this.displayArea) { obj = this.displayArea; } else { left = pickerLeft; top = pickerTop; obj = document.body; } try { while(true) { if(obj.tagName=="BODY" || obj.tagName=="HTML") { if(!(obj.ownerDocument.parentWindow ? obj.ownerDocument.parentWindow : obj.ownerDocument.defaultView).frameElement) { break; } var borderLeftWidth = 0, borderTopWidth = 0; if(document.all) { borderLeftWidth = getBorderWidth(obj, "left"); borderTopWidth = getBorderWidth(obj, "top"); } left -= obj.scrollLeft - borderLeftWidth; top -= obj.scrollTop - borderTopWidth; obj = (obj.ownerDocument.parentWindow ? obj.ownerDocument.parentWindow : obj.ownerDocument.defaultView).frameElement; } left += obj.offsetLeft; top += obj.offsetTop; obj = obj.offsetParent; } } catch(e) { } var body = this.parentWindow.document.body; var bottomSpacing = body.clientHeight - (top + (this.displayArea ? this.displayArea.offsetHeight : 0) - body.scrollTop) - 3; var topSpacing = top - body.scrollTop - 3; this.pickerDiv.style.display = ""; var width = this.pickerWidth; if(this.autoSize) { this.pickerDiv.getElementsByTagName("iframe")[0].style.width = 1; width = Math.max(this.pickerWidth, this.pickerFrame.document.body.scrollWidth); } this.pickerDiv.style.width = width; this.pickerDiv.getElementsByTagName("iframe")[0].style.width = width; var height = this.pickerHeight; if(this.autoSize) { this.pickerDiv.getElementsByTagName("iframe")[0].style.height = 1; height = this.pickerFrame.document.body.scrollHeight; } else if(this.autoHeight) { this.pickerDiv.getElementsByTagName("iframe")[0].style.height = 1; height = Math.min(Math.min(this.pickerHeight, this.pickerFrame.document.body.scrollHeight), Math.max(bottomSpacing, topSpacing)); } this.pickerDiv.style.height = height; this.pickerDiv.getElementsByTagName("iframe")[0].style.height = height; if(!this.displayArea && this.autoSize) { this.pickerDiv.style.top = Math.max(body.scrollTop, Math.min(top, body.scrollTop + body.clientHeight - height)); } else if(bottomSpacing>=height || topSpacing\n' + ' \n' + '

\n' + ''; this.picker = new Picker("listPicker", displayArea, pickerWidth, 165, true, alignRight); this.picker.writeBody(pickerBodyHtml); var listPicker = this; if(values.substring(values.length - 1)=='\0') { values = values.substring(0, values.length - 1); } values = values.split("\0"); var table = this.picker.pickerFrame.document.getElementById("listTable"); for(var i=0; i\n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += '

\n'; html += new BaseField(fieldHTML, 'calendar_' + this.id, 'text', style + ';border-style:none; height:100%; width:100%; outline:none', styleClass).fieldHTML; html += '

\n'; html += ''; if(parentElement) { parentElement.innerHTML = html; } else { document.write(html); } var datePicker = this; document.getElementById("datePicker" + this.id).onclick = function() { new CalendarPicker(document.getElementById('calendar_' + datePicker.id), document.getElementById("calendar_" + fieldName), alignLeft).show(); } }; TimePicker = function(fieldHTML, fieldName, fieldValue, secondEnabled, styleClass, style, selectButtonStyleClass, selectButtonStyle, parentElement) { this.id = fieldName + Math.random(); this.timeField = "Hour"; this.secondEnabled = secondEnabled; var hourValue = ''; var minuteValue = ''; var secondValue = ''; if(fieldValue!='') { var values = fieldValue.split(":"); hourValue = Number(values[0]); minuteValue = Number(values[1]); if(secondEnabled) { secondValue = Number(values[2]); } } if(!style || style=='null') { style = ''; } if(!selectButtonStyleClass || selectButtonStyleClass=='' || selectButtonStyleClass=='null') { selectButtonStyleClass = 'dropDownButton'; } var html = '\n'; html += new BaseField(fieldHTML, 'time_' + this.id, 'hidden', '', '').fieldHTML; html += '\n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; if(secondEnabled) { html += ' \n'; html += ' \n'; } html += ' \n'; html += ' \n'; html += '

:

:

\n'; html += ''; if(parentElement) { parentElement.innerHTML = html; } else { document.write(html); } var timePicker = this; document.getElementById(this.id + "Hour").onchange = function() { timePicker.update(); }; document.getElementById(this.id + "Hour").onfocus = function() { timePicker.timeField = 'Hour'; }; document.getElementById(this.id + "Minute").onchange = function() { timePicker.update(); }; document.getElementById(this.id + "Minute").onfocus = function() { timePicker.timeField = 'Minute'; }; if(secondEnabled) { document.getElementById(this.id + "Second").onchange = function() { timePicker.update(); }; document.getElementById(this.id + "Second").onfocus = function() { timePicker.timeField = 'Second'; }; } document.getElementById('timePicker' + this.id ).onclick = function() { timePicker.selectTimeValue(); }; }; TimePicker.prototype.selectTimeValue = function() { var values = '0'; for(var i=1; i < (this.timeField=='Hour' ? 24: 60); i++) { values += '\0' + i; } var timePicker = this; var switchField = function() { if(timePicker.timeField=="Hour") { window.setTimeout('document.getElementById("' + timePicker.id + 'Minute").focus()', 100); } else if(timePicker.timeField=="Minute" && timePicker.secondEnabled) { window.setTimeout('document.getElementById("' + timePicker.id + 'Second").focus()', 100); } }; new ListPicker(values, document.getElementById(this.id + this.timeField), null, document.getElementById("timePicker" + this.id), 43, true, switchField).show(); }; TimePicker.prototype.update = function() { var hour = new Number(document.getElementById(this.id + "Hour").value); var value = (hour<10 ? "0" : "") + hour; var minute = new Number(document.getElementById(this.id + "Minute").value); value += ":" + (minute<10 ? "0" : "") + minute; if(this.secondEnabled) { var second = new Number(document.getElementById(this.id + "Second").value); value += ":" + (second<10 ? "0" : "") + second; } document.getElementById("time_" + this.id).value = value; try { document.getElementById("time_" + this.id).onchange(); } catch(e) { } }; TimePicker.setValue = function(fieldName, timeField, timeValue) { var field = document.getElementsByName(fieldName)[0]; var fieldId = field.id.substring("time_".length); var timeField = document.getElementById(fieldId + timeField.substring(0, 1).toUpperCase() + timeField.substring(1)); timeField.value = timeValue; timeField.onchange(); }; DateTimePicker = function(fieldHTML, fieldName, fieldValue, styleClass, style, selectButtonStyleClass, selectButtonStyle, parentElement) { this.id = fieldName + Math.random(); this.timeField = "Hour"; var dateValue = ''; var hourValue = ''; var minuteValue = ''; var secondValue = ''; if(fieldValue!='') { var values = fieldValue.split(' '); dateValue = values[0]; if(values[1]) { values = values[1].split(":"); hourValue = Number(values[0]); minuteValue = Number(values[1]); secondValue = Number(values[2]); } } if(!style || style=='null') { style = ''; } if(!selectButtonStyleClass || selectButtonStyleClass=='' || selectButtonStyleClass=='null') { selectButtonStyleClass = 'dropDownButton'; } var html = '\n'; html += new BaseField(fieldHTML, 'datetime_' + this.id, 'hidden', '', '').fieldHTML; html += '\n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += '

\n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += '

\n'; html += '

\n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += '

:

:

\n'; html += '

\n'; html += ''; if(parentElement) { parentElement.innerHTML = html; } else { document.write(html); } var dateTimePicker = this; document.getElementById("datePicker" + this.id).onclick = function() { new CalendarPicker(document.getElementById(dateTimePicker.id + "Date"), document.getElementById("dateTable" + dateTimePicker.id), false).show(); } document.getElementById(this.id + "Date").onchange = function() { dateTimePicker.update(); }; document.getElementById(this.id + "Hour").onchange = function() { dateTimePicker.update(); }; document.getElementById(this.id + "Minute").onchange = function() { dateTimePicker.update(); }; document.getElementById(this.id + "Second").onchange = function() { dateTimePicker.update(); }; document.getElementById(this.id + "Hour").onfocus = function() { dateTimePicker.timeField = 'Hour'; }; document.getElementById(this.id + "Minute").onfocus = function() { dateTimePicker.timeField = 'Minute'; }; document.getElementById(this.id + "Second").onfocus = function() { dateTimePicker.timeField = 'Second'; }; document.getElementById('timePicker' + this.id ).onclick = function() { dateTimePicker.selectTimeValue(); }; }; DateTimePicker.prototype.selectTimeValue = function() { var values = '0'; for(var i=1; i < (this.timeField=='Hour' ? 24: 60); i++) { values += '\0' + i; } var picker = this; var switchField = function() { if(picker.timeField=="Hour") { window.setTimeout('document.getElementById("' + picker.id + 'Minute").focus()', 100); } else if(picker.timeField=="Minute") { window.setTimeout('document.getElementById("' + picker.id + 'Second").focus()', 100); } }; new ListPicker(values, document.getElementById(this.id + this.timeField), null, document.getElementById("timePicker" + this.id), 43, true, switchField).show(); }; DateTimePicker.prototype.update = function() { var value = document.getElementById(this.id + "Date").value; if(value!='') { value += ' ' + new Number(document.getElementById(this.id + "Hour").value); value += ':' + new Number(document.getElementById(this.id + "Minute").value); value += ':' + new Number(document.getElementById(this.id + "Second").value); } document.getElementById("datetime_" + this.id).value = value; try { document.getElementById("datetime_" + this.id).onchange(); } catch(e) { } }; DateTimePicker.setValue = function(fieldName, timeField, timeValue) { var field = document.getElementsByName(fieldName)[0]; var fieldId = field.id.substring("datetime_".length); var timeField = document.getElementById(fieldId + timeField.substring(0, 1).toUpperCase() + timeField.substring(1)); timeField.value = timeValue; timeField.onchange(); }; DropdownField = function(fieldHTML, fieldName, listValues, valueField, titleField, styleClass, style, selectButtonStyleClass, selectButtonStyle, parentElement, listPickerWidth) { this.id = fieldName + Math.random(); if(!style || style=='null') { style = ''; } if(!selectButtonStyleClass || selectButtonStyleClass=='' || selectButtonStyleClass=='null') { selectButtonStyleClass = 'dropDownButton'; } var html = '\n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += '

\n'; html += new BaseField(fieldHTML, 'dropdown_' + this.id, 'text', style + ';border-style:none; height:100%; width:100%; outline:none', styleClass).fieldHTML; html += '

\n'; html += ''; if(parentElement) { parentElement.innerHTML = html; } else { document.write(html); } var dropdownField = this; var table = document.getElementById('table' + dropdownField.id); var form = getParentElement(table, "form"); if(!form) { form = document.body; } document.getElementById('picker' + this.id ).onclick = function() { var valueInput; if(valueField!="") { valueInput = getElement(form, "input", valueField); if(!valueInput) { valueInput = document.getElementsByName(valueField)[0]; if(!valueInput) { valueInput = document.getElementById('dropdown_' + dropdownField.id); } } } var titleInput; if(titleField!="") { titleInput = getElement(form, "input", titleField); if(!titleInput) { titleInput = document.getElementsByName(titleField)[0]; if(!titleInput) { titleInput = document.getElementById('dropdown_' + dropdownField.id); } } } new ListPicker(listValues, valueInput, titleInput, table, listPickerWidth).show(); }; var doOnChange = function() { var valueInput; if(valueField!="") { valueInput = getElement(form, "input", valueField); if(!valueInput) { valueInput = document.getElementsByName(valueField)[0]; if(!valueInput) { valueInput = document.getElementById('dropdown_' + dropdownField.id); } } } var titleInput; if(titleField!="") { titleInput = getElement(form, "input", titleField); if(!titleInput) { titleInput = document.getElementsByName(titleField)[0]; if(!titleInput) { titleInput = document.getElementById('dropdown_' + dropdownField.id); } } } try { valueInput.onchange(); } catch(e) {} try { titleInput.onchange(); } catch(e) {} }; addEvent(window, "load", doOnChange); }; SelectField = function(fieldHTML, fieldName, onSelect, styleClass, style, selectButtonStyleClass, selectButtonStyle, parentElement) { this.id = fieldName + Math.random(); if(!style || style=='null') { style = ''; } if(!selectButtonStyleClass || selectButtonStyleClass=='' || selectButtonStyleClass=='null') { selectButtonStyleClass = 'selectButton'; } var html = '\n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += ' \n'; html += '

\n'; html += new BaseField(fieldHTML, 'select_' + this.id, 'text', style + ';border-style:none; height:100%; width:100%; outline:none', styleClass).fieldHTML; html += '

\n'; html += ''; if(parentElement) { parentElement.innerHTML = html; } else { document.write(html); } document.getElementById('picker' + this.id ).onclick = function() { eval(onSelect); }; };