diff options
author | wei <> | 2006-04-25 01:00:08 +0000 |
---|---|---|
committer | wei <> | 2006-04-25 01:00:08 +0000 |
commit | c84f3e19b54cf54f525f4b2d158696ae32d1bf60 (patch) | |
tree | 60720fba29ef72175db47dd3cd4b74d8bbed605b /framework/Web/Javascripts/js | |
parent | 09edc6590523e26fffbf32f7b0e7958c166f7537 (diff) |
Add TListControlValidator. Update client-side validators, datepicker.js, colorpicker.js.
Diffstat (limited to 'framework/Web/Javascripts/js')
-rw-r--r-- | framework/Web/Javascripts/js/colorpicker.js | 36 | ||||
-rw-r--r-- | framework/Web/Javascripts/js/datepicker.js | 86 | ||||
-rw-r--r-- | framework/Web/Javascripts/js/prado.js | 5 | ||||
-rw-r--r-- | framework/Web/Javascripts/js/validator.js | 237 |
4 files changed, 278 insertions, 86 deletions
diff --git a/framework/Web/Javascripts/js/colorpicker.js b/framework/Web/Javascripts/js/colorpicker.js index 27e180b0..b926dc93 100644 --- a/framework/Web/Javascripts/js/colorpicker.js +++ b/framework/Web/Javascripts/js/colorpicker.js @@ -257,7 +257,7 @@ this.input.parentNode.appendChild(this.iePopUp); if(mode == "Full") this.initializeFullPicker(); } -this.show(); +this.show(mode); }, show : function(type) { @@ -276,6 +276,7 @@ Event.observe(document,"keydown", this._documentKeyDownEvent); this.showing = true; if(type == "Full") { +this.observeMouseMovement(); var color = Rico.Color.createFromHex(this.input.value); this.inputs.oldColor.style.backgroundColor = color.asHex(); this.setColor(color,true); @@ -292,6 +293,11 @@ this.element.style.display = "none"; this.showing = false; Event.stopObserving(document.body, "click", this._documentClickEvent); Event.stopObserving(document,"keydown", this._documentKeyDownEvent); +if(this._observingMouseMove) +{ +Event.stopObserving(document.body, "mousemove", this._onMouseMove); +this._observingMouseMove = false; +} } }, keyPressed : function(event,type) @@ -367,7 +373,7 @@ updateColor : function(color) { this.input.value = color.toString().toUpperCase(); this.button.style.backgroundColor = color.toString(); -if(isFunction(this.onChange)) +if(typeof(this.onChange) == "function") this.onChange(color); }, getFullPickerContainer : function(pickerID) @@ -394,7 +400,7 @@ TD({className:'currentcolor',colSpan:2}, this.inputs['currentColor'], this.inputs['oldColor'])), TR(null, TD(null,'H:'), -TD(null,this.inputs['H'], '°')), +TD(null,this.inputs['H'], '??')), TR(null, TD(null,'S:'), TD(null,this.inputs['S'], '%')), @@ -463,26 +469,39 @@ this._onHueMouseDown = this.onHueMouseDown.bind(this); this._onMouseUp = this.onMouseUp.bind(this); this._onMouseMove = this.onMouseMove.bind(this); Event.observe(this.inputs.background, "mousedown", this._onColorMouseDown); +Event.observe(this.inputs.selector, "mousedown", this._onColorMouseDown); Event.observe(this.inputs.hue, "mousedown", this._onHueMouseDown); +Event.observe(this.inputs.slider, "mousedown", this._onHueMouseDown); Event.observe(document.body, "mouseup", this._onMouseUp); -Event.observe(document.body, "mousemove", this._onMouseMove); +this.observeMouseMovement(); Event.observe(this.buttons.Cancel, "click", this.hide.bindEvent(this,this.options['Mode'])); Event.observe(this.buttons.OK, "click", this.onOKClicked.bind(this)); }, +observeMouseMovement : function() +{ +if(!this._observingMouseMove) +{ +Event.observe(document.body, "mousemove", this._onMouseMove); +this._observingMouseMove = true; +} +}, onColorMouseDown : function(ev) { this.isMouseDownOnColor = true; this.onMouseMove(ev); +Event.stop(ev); }, onHueMouseDown : function(ev) { this.isMouseDownOnHue = true; this.onMouseMove(ev); +Event.stop(ev); }, onMouseUp : function(ev) { this.isMouseDownOnColor = false; this.isMouseDownOnHue = false; +Event.stop(ev); }, onMouseMove : function(ev) { @@ -490,6 +509,7 @@ if(this.isMouseDownOnColor) this.changeSV(ev); if(this.isMouseDownOnHue) this.changeH(ev); +Event.stop(ev); }, changeSV : function(ev) { @@ -498,9 +518,12 @@ var py = Event.pointerY(ev); var pos = Position.cumulativeOffset(this.inputs.background); var x = this.truncate(px - pos[0],0,255); var y = this.truncate(py - pos[1],0,255); -var h = this.truncate(this.inputs.H.value,0,360)/360; var s = x/255; var b = (255-y)/255; +var current_s = parseInt(this.inputs.S.value); +var current_b = parseInt(this.inputs.V.value); +if(current_s == parseInt(s*100) && current_b == parseInt(b*100)) return; +var h = this.truncate(this.inputs.H.value,0,360)/360; var color = new Rico.Color(); color.rgb = Rico.Color.HSBtoRGB(h,s,b); this.inputs.selector.style.left = x+"px"; @@ -514,6 +537,9 @@ var py = Event.pointerY(ev); var pos = Position.cumulativeOffset(this.inputs.background); var y = this.truncate(py - pos[1],0,255); var h = (255-y)/255; +var current_h = this.truncate(this.inputs.H.value,0,360); +current_h = current_h == 0 ? 360 : current_h; +if(current_h == parseInt(h*360)) return; var s = parseInt(this.inputs.S.value)/100; var b = parseInt(this.inputs.V.value)/100; var color = new Rico.Color(); diff --git a/framework/Web/Javascripts/js/datepicker.js b/framework/Web/Javascripts/js/datepicker.js index e82507ea..19d39bbe 100644 --- a/framework/Web/Javascripts/js/datepicker.js +++ b/framework/Web/Javascripts/js/datepicker.js @@ -1,10 +1,41 @@ Prado.WebUI.TDatePicker = Class.create(); +Object.extend(Prado.WebUI.TDatePicker, +{ +getDropDownDate : function(control) +{ +var now=new Date(); +var year=now.getFullYear(); +var month=now.getMonth(); +var day=1; +var month_list = this.getMonthListControl(control); + var day_list = this.getDayListControl(control); + var year_list = this.getYearListControl(control); +var day = day_list ? $F(day_list) : 1; +var month = month_list ? $F(month_list) : now.getMonth(); +var year = year_list ? $F(year_list) : now.getFullYear(); +return new Date(year,month,day, 0, 0, 0); +}, +getYearListControl : function(control) +{ +return $(control.id+"_year"); +}, +getMonthListControl : function(control) +{ +return $(control.id+"_month"); +}, +getDayListControl : function(control) +{ +return $(control.id+"_day"); +} +}); Prado.WebUI.TDatePicker.prototype = { MonthNames : ["January","February","March","April", "May","June","July","August", "September","October","November","December" ], +AbbreviatedMonthNames : ["Jan", "Feb", "Mar", "Apr", "May", +"Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], ShortWeekDayNames : ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat" ], Format : "yyyy-MM-dd", FirstDayOfWeek : 1, @@ -138,7 +169,7 @@ this._calDiv.appendChild(div); var todayButton = document.createElement("button"); todayButton.className = "todayButton"; var today = this.newDate(); -var buttonText = today.SimpleFormat(this.Format); +var buttonText = today.SimpleFormat(this.Format,this); todayButton.appendChild(document.createTextNode(buttonText)); div.appendChild(todayButton); if(Prado.Browser().ie) @@ -292,20 +323,27 @@ var m = d.getMonth() + n; this.setMonth(m); return false; }, -onchange : function() +onChange : function() { if(this.options.InputMode == "TextBox") +{ this.control.value = this.formatDate(); +Event.fireEvent(this.control, "change"); +} else { -var day = $(this.options.ID+"_day"); -var month = $(this.options.ID+"_month"); -var year = $(this.options.ID+"_year"); +var day = Prado.WebUI.TDatePicker.getDayListControl(this.control); +var month = Prado.WebUI.TDatePicker.getMonthListControl(this.control); +var year = Prado.WebUI.TDatePicker.getYearListControl(this.control); var date = this.selectedDate; if(day) +{ day.selectedIndex = date.getDate()-1; +} if(month) +{ month.selectedIndex = date.getMonth(); +} if(year) { var years = year.options; @@ -313,17 +351,18 @@ var currentYear = date.getFullYear(); for(var i = 0; i < years.length; i++) years[i].selected = years[i].value.toInteger() == currentYear; } +Event.fireEvent(day || month || year, "change"); } }, formatDate : function() { -return this.selectedDate ? this.selectedDate.SimpleFormat(this.Format) : ''; +return this.selectedDate ? this.selectedDate.SimpleFormat(this.Format,this) : ''; }, newDate : function(date) { if(!date) date = new Date(); -if(isString(date)|| isNumber(date)) +if(typeof(date) == "string" || typeof(date) == "number") date = new Date(date); return new Date(date.getFullYear(), date.getMonth(), date.getDate(), 0,0,0); }, @@ -334,8 +373,8 @@ return; this.selectedDate = this.newDate(date); this.updateHeader(); this.update(); -if (isFunction(this.onchange)) -this.onchange(); +if (typeof(this.onChange) == "function") +this.onChange(); }, getElement : function() { @@ -343,7 +382,7 @@ return this._calDiv; }, getSelectedDate : function () { -return isNull(this.selectedDate) ? null : this.newDate(this.selectedDate); +return this.selectedDate == null ? null : this.newDate(this.selectedDate); }, setYear : function(year) { @@ -374,8 +413,9 @@ if(this.options.InputMode == "TextBox") pos[1] += this.control.offsetHeight; else { -if($(this.options.ID+"_day")) -pos[1] += $(this.options.ID+"_day").offsetHeight-1; +var dayList = Prado.WebUI.TDatePicker.getDayListControl(this.control); +if(dayList) +pos[1] += dayList.offsetHeight-1; } this._calDiv.style.display = "block"; this._calDiv.style.top = (pos[1]-1) + "px"; @@ -385,7 +425,7 @@ this.documentClickEvent = this.hideOnClick.bindEvent(this); this.documentKeyDownEvent = this.keyPressed.bindEvent(this); Event.observe(document.body, "click", this.documentClickEvent); var date = this.getDateFromInput(); -if(!isNull(date)) +if(date) { this.selectedDate = date; this.setSelectedDate(date); @@ -399,20 +439,7 @@ getDateFromInput : function() if(this.options.InputMode == "TextBox") return Date.SimpleParse($F(this.control), this.Format); else -{ -var now=new Date(); -var year=now.getFullYear(); -var month=now.getMonth(); -var date=1; -if($(this.options.ID+"_day")) -day = $F(this.options.ID+"_day"); -if($(this.options.ID+"_month")) -month = $F(this.options.ID+"_month"); -if($(this.options.ID+"_year")) -year = $F(this.options.ID+"_year"); -var newdate=new Date(year,month,day, 0, 0, 0); -return newdate; -} +return Prado.WebUI.TDatePicker.getDropDownDate(this.control); }, hideOnClick : function(ev) { @@ -484,7 +511,10 @@ this.dateSlot[index].data.parentNode.className = "empty"; }, hover : function(ev) { -Element.condClassName(Event.element(ev), "hover", ev.type=="mouseover"); +if(ev.type == "mouseover") +Event.element(ev).addClassName("hover"); +else +Event.element(ev).removeClassName("hover"); }, updateHeader : function () { var options = this._monthSelect.options; diff --git a/framework/Web/Javascripts/js/prado.js b/framework/Web/Javascripts/js/prado.js index 6737d4ce..c7145188 100644 --- a/framework/Web/Javascripts/js/prado.js +++ b/framework/Web/Javascripts/js/prado.js @@ -1299,9 +1299,10 @@ element.dispatchEvent(event); else if(element.fireEvent) { element.fireEvent('on'+type); +if(element[type]) element[type](); } -else +else if(element[type]) element[type](); } }); @@ -1868,9 +1869,9 @@ lastFocus.value = options['EventTarget']; } $('PRADO_POSTBACK_TARGET').value = options['EventTarget']; $('PRADO_POSTBACK_PARAMETER').value = options['EventParameter']; -Event.fireEvent(form,"submit"); if(options['StopEvent']) Event.stop(event); +Event.fireEvent(form,"submit"); } Prado.Element = { diff --git a/framework/Web/Javascripts/js/validator.js b/framework/Web/Javascripts/js/validator.js index 7d343d87..38d8a2a4 100644 --- a/framework/Web/Javascripts/js/validator.js +++ b/framework/Web/Javascripts/js/validator.js @@ -26,6 +26,7 @@ if(this.managers[formID]) this.managers[formID].addValidator(validator); else throw new Error("A validation manager for form '"+formID+"' needs to be created first."); +return this.managers[formID]; }, addSummary : function(formID, validator) { @@ -33,9 +34,11 @@ if(this.managers[formID]) this.managers[formID].addSummary(validator); else throw new Error("A validation manager for form '"+formID+"' needs to be created first."); +return this.managers[formID]; } }); -Prado.Validation.prototype = +Prado.ValidationManager = Class.create(); +Prado.ValidationManager.prototype = { validators : [], summaries : [], @@ -56,13 +59,12 @@ return this._validateNonGroup(); _validateGroup: function(groupID) { var valid = true; -var manager = this; if(this.groups.include(groupID)) { this.validators.each(function(validator) { if(validator.group == groupID) -valid = valid & validator.validate(manager); +valid = valid & validator.validate(); else validator.hide(); }); @@ -73,11 +75,10 @@ return valid; _validateNonGroup : function() { var valid = true; -var manager = this; this.validators.each(function(validator) { if(!validator.group) -valid = valid & validator.validate(manager); +valid = valid & validator.validate(); else validator.hide(); }); @@ -271,8 +272,9 @@ enabled : true, visible : false, isValid : true, options : {}, -_isObserving : false, +_isObserving : {}, group : null, +manager : null, initialize : function(options) { options.OnValidate = options.OnValidate || Prototype.emptyFunction; @@ -282,7 +284,7 @@ this.options = options; this.control = $(options.ControlToValidate); this.message = $(options.ID); this.group = options.ValidationGroup; -Prado.Validation.addValidator(options.FormID, this); +this.manager = Prado.Validation.addValidator(options.FormID, this); }, getErrorMessage : function() { @@ -296,6 +298,7 @@ if(this.options.Display == "Dynamic") this.isValid ? this.message.hide() : this.message.show(); this.message.style.visibility = this.isValid ? "hidden" : "visible"; } +if(this.control) this.updateControlCssClass(this.control, this.isValid); if(this.options.FocusOnError && !this.isValid) Prado.Element.focus(this.options.FocusElementID); @@ -318,33 +321,36 @@ this.isValid = true; this.updateControl(); this.visible = false; }, -validate : function(manager) +validate : function() { if(this.enabled) -this.isValid = this.evaluateIsValid(manager); -this.options.OnValidate(this, manager); +this.isValid = this.evaluateIsValid(); +this.options.OnValidate(this); this.updateControl(); if(this.isValid) -this.options.OnSuccess(this, manager); +this.options.OnSuccess(this); else -this.options.OnError(this, manager); -this.observeChanges(manager); +this.options.OnError(this); +this.observeChanges(this.control); return this.isValid; }, -observeChanges : function(manager) +observeChanges : function(control) { -if(this.options.ObserveChanges != false && !this._isObserving) +if(!control) return; +var canObserveChanges = this.options.ObserveChanges != false; +var currentlyObserving = this._isObserving[control.id+this.options.ID]; +if(canObserveChanges && !currentlyObserving) { var validator = this; -Event.observe(this.control, 'change', function() +Event.observe(control, 'change', function() { if(validator.visible) { -validator.validate(manager); -manager.updateSummary(validator.group); +validator.validate(); +validator.manager.updateSummary(validator.group); } }); -this._isObserving = true; +this._isObserving[control.id+this.options.ID] = true; } }, trim : function(value) @@ -354,7 +360,7 @@ return typeof(value) == "string" ? value.trim() : ""; convert : function(dataType, value) { if(typeof(value) == "undefined") -value = $F(this.control); +value = this.getValidationValue(); var string = new String(value); switch(dataType) { @@ -363,18 +369,116 @@ return string.toInteger(); case "Double" : case "Float" : return string.toDouble(this.options.DecimalChar); -case "Currency" : -return string.toCurrency(this.options.GroupChar, this.options.Digits, this.options.DecimalChar); case "Date": +if(typeof(value) != "string") +return value; +else +{ var value = string.toDate(this.options.DateFormat); if(value && typeof(value.getTime) == "function") return value.getTime(); else return null; +} case "String": return string.toString(); } return value; +}, +getValidationValue : function(control) + { + if(!control) + control = this.control + switch(this.options.ControlType) + { + case 'TDatePicker': + if(control.type == "text") + return this.trim($F(control)); + else + { + this.observeDatePickerChanges(); +return Prado.WebUI.TDatePicker.getDropDownDate(control).getTime(); + } + default: + if(this.isListControlType()) + return this.getFirstSelectedListValue(); + else + return this.trim($F(control)); + } + }, +observeDatePickerChanges : function() + { + if(Prado.Browser().ie) + { + var DatePicker = Prado.WebUI.TDatePicker; + this.observeChanges(DatePicker.getDayListControl(this.control)); +this.observeChanges(DatePicker.getMonthListControl(this.control)); +this.observeChanges(DatePicker.getYearListControl(this.control)); + } + }, +getSelectedValuesAndChecks : function(elements, initialValue) +{ +var checked = 0; +var values = []; +var isSelected = this.isCheckBoxType(elements[0]) ? 'checked' : 'selected'; +elements.each(function(element) +{ +if(element[isSelected] && element.value != initialValue) +{ +checked++; +values.push(element.value); +} +}); +return {'checks' : checked, 'values' : values}; +}, +getListElements : function() +{ +switch(this.options.ControlType) +{ +case 'TCheckBoxList': case 'TRadioButtonList': +var elements = []; +for(var i = 0; i < this.options.TotalItems; i++) +{ +var element = $(this.options.ControlToValidate+"_"+i); +if(this.isCheckBoxType(element)) +elements.push(element); +} +return elements; +case 'TListBox': +var elements = []; +var element = $(this.options.ControlToValidate); +if(element && (type = element.type.toLowerCase())) +{ +if(type == "select-one" || type == "select-multiple") +elements = $A(element.options); +} +return elements; +default: +return []; +} +}, +isCheckBoxType : function(element) +{ +if(element && element.type) +{ +var type = element.type.toLowerCase(); +return type == "checkbox" || type == "radio"; +} +return false; +}, +isListControlType : function() +{ +var list = ['TCheckBoxList', 'TRadioButtonList', 'TListBox']; +return list.include(this.options.ControlType); +}, +getFirstSelectedListValue : function() +{ +var initial = ""; +if(typeof(this.options.InitialValue) != "undefined") +initial = this.options.InitialValue; +var elements = this.getListElements(); +var selection = this.getSelectedValuesAndChecks(elements, initial); +return selection.values.length > 0 ? selection.values[0] : initial; } } Prado.WebUI.TRequiredFieldValidator = Class.extend(Prado.WebUI.TBaseValidator, @@ -388,7 +492,7 @@ return true; } else { -var a = this.trim($F(this.control)); +var a = this.getValidationValue(); var b = this.trim(this.options.InitialValue); return(a != b); } @@ -396,41 +500,24 @@ return(a != b); }); Prado.WebUI.TCompareValidator = Class.extend(Prado.WebUI.TBaseValidator, { -_observingComparee : false, -evaluateIsValid : function(manager) +evaluateIsValid : function() { -var value = this.trim($F(this.control)); +var value = this.getValidationValue(); if (value.length <= 0) return true; var comparee = $(this.options.ControlToCompare); if(comparee) -var compareTo = this.trim($F(comparee)); +var compareTo = this.getValidationValue(comparee); else var compareTo = this.options.ValueToCompare || ""; var isValid =this.compare(value, compareTo); if(comparee) { this.updateControlCssClass(comparee, isValid); -this.observeComparee(comparee, manager); +this.observeChanges(comparee); } return isValid; }, -observeComparee : function(comparee, manager) -{ -if(this.options.ObserveChanges != false && !this._observingComparee) -{ -var validator = this; -Event.observe(comparee, "change", function() -{ -if(validator.visible) -{ -validator.validate(manager); -manager.updateSummary(validator.group); -} -}); -this._observingComparee = true; -} -}, compare : function(operand1, operand2) { var op1, op2; @@ -457,9 +544,9 @@ return (op1 == op2); }); Prado.WebUI.TCustomValidator = Class.extend(Prado.WebUI.TBaseValidator, { -evaluateIsValid : function(manager) +evaluateIsValid : function() { -var value = $F(this.control); +var value = this.getValidationValue(); var clientFunction = this.options.ClientValidationFunction; if(typeof(clientFunction) == "string" && clientFunction.length > 0) { @@ -471,9 +558,9 @@ return true; }); Prado.WebUI.TRangeValidator = Class.extend(Prado.WebUI.TBaseValidator, { -evaluateIsValid : function(manager) +evaluateIsValid : function() { -var value = this.trim($F(this.control)); +var value = this.getValidationValue(); if(value.length <= 0) return true; if(typeof(this.options.DataType) == "undefined") @@ -481,7 +568,6 @@ this.options.DataType = "String"; var min = this.convert(this.options.DataType, this.options.MinValue || null); var max = this.convert(this.options.DataType, this.options.MaxValue || null); value = this.convert(this.options.DataType, value); -Logger.warn(min+" <= "+value+" <= "+max); if(value == null) return false; var valid = true; @@ -494,9 +580,9 @@ return valid; }); Prado.WebUI.TRegularExpressionValidator = Class.extend(Prado.WebUI.TBaseValidator, { -evaluateIsValid : function(master) +evaluateIsValid : function() { -var value = this.trim($F(this.control)); +var value = this.getValidationValue(); if (value.length <= 0) return true; var rx = new RegExp(this.options.ValidationExpression); @@ -505,3 +591,52 @@ return (matches != null && value == matches[0]); } }); Prado.WebUI.TEmailAddressValidator = Prado.WebUI.TRegularExpressionValidator; +Prado.WebUI.TListControlValidator = Class.extend(Prado.WebUI.TBaseValidator, +{ +evaluateIsValid : function() +{ +var elements = this.getListElements(); +if(elements && elements.length <= 0) +return true; +this.observeListElements(elements); +var selection = this.getSelectedValuesAndChecks(elements); +return this.isValidList(selection.checks, selection.values); +}, +observeListElements : function(elements) + { +if(Prado.Browser().ie && this.isCheckBoxType(elements[0])) +{ +var validator = this; +elements.each(function(element) +{ +validator.observeChanges(element); +}); +} + }, +isValidList : function(checked, values) +{ +var exists = true; +var required = this.getRequiredValues(); +if(required.length > 0) +{ +if(values.length < required.length) +return false; +required.each(function(requiredValue) +{ +exists = exists && values.include(requiredValue); +}); +} +var min = typeof(this.options.Min) == "undefined" ? +Number.NEGATIVE_INFINITY : this.options.Min; +var max = typeof(this.options.Max) == "undefined" ? +Number.POSITIVE_INFINITY : this.options.Max; +return exists && checked >= min && checked <= max; +}, +getRequiredValues : function() +{ +var required = []; +if(this.options.Required && this.options.Required.length > 0) +required = this.options.Required.split(/,\s*/); +return required; +} +}); |