Blame view

static/plugins/webshim-gh-pages/js-webshim/dev/shims/form-message.js 10.6 KB
831eac332   zhuzhenchao   add file
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
  webshims.register('form-message', function($, webshims, window, document, undefined, options){
  	"use strict";
  	if(options.lazyCustomMessages){
  		options.customMessages = true;
  	}
  	var validityMessages = webshims.validityMessages;
  	
  	var implementProperties = options.customMessages ? ['customValidationMessage'] : [];
  	
  	validityMessages.en = $.extend(true, {
  		typeMismatch: {
  			defaultMessage: 'Please enter a valid value.',
  			email: 'Please enter an email address.',
  			url: 'Please enter a URL.'
  		},
  		badInput: {
  			defaultMessage: 'Please enter a valid value.',
  			number: 'Please enter a number.',
  			date: 'Please enter a date.',
  			time: 'Please enter a time.',
  			range: 'Invalid input.',
  			month: 'Please enter a valid value.',
  			"datetime-local": 'Please enter a datetime.'
  		},
  		rangeUnderflow: {
  			defaultMessage: 'Value must be greater than or equal to {%min}.'
  		},
  		rangeOverflow: {
  			defaultMessage: 'Value must be less than or equal to {%max}.'
  		},
  		stepMismatch: 'Invalid input.',
  		tooLong: 'Please enter at most {%maxlength} character(s). You entered {%valueLen}.',
  		tooShort: 'Please enter at least {%minlength} character(s). You entered {%valueLen}.',
  		patternMismatch: 'Invalid input. {%title}',
  		valueMissing: {
  			defaultMessage: 'Please fill out this field.',
  			checkbox: 'Please check this box if you want to proceed.'
  		}
  	}, (validityMessages.en || validityMessages['en-US'] || {}));
  	
  	if(typeof validityMessages['en'].valueMissing == 'object'){
  		['select', 'radio'].forEach(function(type){
  			validityMessages.en.valueMissing[type] = validityMessages.en.valueMissing[type] || 'Please select an option.';
  		});
  	}
  	if(typeof validityMessages.en.rangeUnderflow == 'object'){
  		['date', 'time', 'datetime-local', 'month'].forEach(function(type){
  			validityMessages.en.rangeUnderflow[type] = validityMessages.en.rangeUnderflow[type] || 'Value must be at or after {%min}.';
  		});
  	}
  	if(typeof validityMessages.en.rangeOverflow == 'object'){
  		['date', 'time', 'datetime-local', 'month'].forEach(function(type){
  			validityMessages.en.rangeOverflow[type] = validityMessages.en.rangeOverflow[type] || 'Value must be at or before {%max}.';
  		});
  	}
  	if(!validityMessages['en-US']){
  		validityMessages['en-US'] = $.extend(true, {}, validityMessages.en);
  	}
  	if(!validityMessages['en-GB']){
  		validityMessages['en-GB'] = $.extend(true, {}, validityMessages.en);
  	}
  	if(!validityMessages['en-AU']){
  		validityMessages['en-AU'] = $.extend(true, {}, validityMessages.en);
  	}
  	validityMessages[''] = validityMessages[''] || validityMessages['en-US'];
  	
  	validityMessages.de = $.extend(true, {
  		typeMismatch: {
  			defaultMessage: '{%value} ist in diesem Feld nicht zulässig.',
  			email: '{%value} ist keine gültige E-Mail-Adresse.',
  			url: '{%value} ist kein(e) gültige(r) Webadresse/Pfad.'
  		},
  		badInput: {
  			defaultMessage: 'Geben Sie einen zulässigen Wert ein.',
  			number: 'Geben Sie eine Nummer ein.',
  			date: 'Geben Sie ein Datum ein.',
  			time: 'Geben Sie eine Uhrzeit ein.',
  			month: 'Geben Sie einen Monat mit Jahr ein.',
  			range: 'Geben Sie eine Nummer.',
  			"datetime-local": 'Geben Sie ein Datum mit Uhrzeit ein.'
  		},
  		rangeUnderflow: {
  			defaultMessage: '{%value} ist zu niedrig. {%min} ist der unterste Wert, den Sie benutzen können.'
  		},
  		rangeOverflow: {
  			defaultMessage: '{%value} ist zu hoch. {%max} ist der oberste Wert, den Sie benutzen können.'
  		},
  		stepMismatch: 'Der Wert {%value} ist in diesem Feld nicht zulässig. Hier sind nur bestimmte Werte zulässig. {%title}',
  		tooLong: 'Der eingegebene Text ist zu lang! Sie haben {%valueLen} Zeichen eingegeben, dabei sind {%maxlength} das Maximum.',
  		tooShort: 'Der eingegebene Text ist zu kurz! Sie haben {%valueLen} Zeichen eingegeben, dabei sind {%minlength} das Minimum.',
  		patternMismatch: '{%value} hat für dieses Eingabefeld ein falsches Format. {%title}',
  		valueMissing: {
  			defaultMessage: 'Bitte geben Sie einen Wert ein.',
  			checkbox: 'Bitte aktivieren Sie das Kästchen.'
  		}
  	}, (validityMessages.de || {}));
  	
  	if(typeof validityMessages.de.valueMissing == 'object'){
  		['select', 'radio'].forEach(function(type){
  			validityMessages.de.valueMissing[type] = validityMessages.de.valueMissing[type] || 'Bitte wählen Sie eine Option aus.';
  		});
  	}
  	if(typeof validityMessages.de.rangeUnderflow == 'object'){
  		['date', 'time', 'datetime-local', 'month'].forEach(function(type){
  			validityMessages.de.rangeUnderflow[type] = validityMessages.de.rangeUnderflow[type] || '{%value} ist zu früh. {%min} ist die früheste Zeit, die Sie benutzen können.';
  		});
  	}
  	if(typeof validityMessages.de.rangeOverflow == 'object'){
  		['date', 'time', 'datetime-local', 'month'].forEach(function(type){
  			validityMessages.de.rangeOverflow[type] = validityMessages.de.rangeOverflow[type] || '{%value} ist zu spät. {%max} ist die späteste Zeit, die Sie benutzen können.';
  		});
  	}
  	
  	var currentValidationMessage =  validityMessages[''];
  	var getMessageFromObj = function(message, elem){
  		if(message && typeof message !== 'string'){
  			message = message[ $.prop(elem, 'type') ] || message[ (elem.nodeName || '').toLowerCase() ] || message[ 'defaultMessage' ];
  		}
  		return message || '';
  	};
  	var lReg = /</g;
  	var gReg = />/g;
  	var valueVals = {
  		value: 1,
  		min: 1,
  		max: 1
  	};
  	var toLocale = (function(){
  		var monthFormatter;
  		var transforms = {
  			number: function(val){
  				var num = val * 1;
  				if(num.toLocaleString && !isNaN(num)){
  					val = num.toLocaleString() || val;
  				}
  				return val;
  			}
  		};
  		var _toLocale = function(val, elem, attr){
  			var type, widget;
  			if(valueVals[attr]){
  				type = $.prop(elem, 'type');
  				widget = $(elem).getShadowElement().data('wsWidget'+ type );
  				if(widget && widget.formatValue){
  					val = widget.formatValue(val, false);
  				} else if(transforms[type]){
  					val = transforms[type](val);
  				}
  			}
  			return val;
  		};
  
  		[{n: 'date', f: 'toLocaleDateString'}, {n: 'time', f: 'toLocaleTimeString'}, {n: 'datetime-local', f: 'toLocaleString'}].forEach(function(desc){
  			transforms[desc.n] = function(val){
  				var date = new Date(val);
  				if(date && date[desc.f]){
  					val = date[desc.f]() || val;
  				}
  				return val;
  			};
  		});
  
  		if(window.Intl && Intl.DateTimeFormat){
  			monthFormatter = new Intl.DateTimeFormat(navigator.browserLanguage || navigator.language, {year: "numeric", month: "2-digit"}).format(new Date());
  			if(monthFormatter && monthFormatter.format){
  				transforms.month = function(val){
  					var date = new Date(val);
  					if(date){
  						val = monthFormatter.format(date) || val;
  					}
  					return val;
  				};
  			}
  		}
  
  		webshims.format =  {};
  
  		['date', 'number', 'month', 'time', 'datetime-local'].forEach(function(name){
  			webshims.format[name] = function(val, opts){
  				if(opts && opts.nodeType){
  					return _toLocale(val, opts, name);
  				}
  				if(name == 'number' && opts && opts.toFixed ){
  					val = (val * 1);
  					if(!opts.fixOnlyFloat || val % 1){
  						val = val.toFixed(opts.toFixed);
  					}
  				}
  				if(webshims._format && webshims._format[name]){
  					return webshims._format[name](val, opts);
  				}
  				return transforms[name](val);
  			};
  		});
  
  		return _toLocale;
  	})();
  
  	webshims.replaceValidationplaceholder = function(elem, message, name){
  		var val = $.prop(elem, 'title');
  		if(message){
  			if(name == 'patternMismatch' && !val){
  				webshims.error('no title for patternMismatch provided. Always add a title attribute.');
  			}
  			if(val){
  				val = '<span class="ws-titlevalue">'+ val.replace(lReg, '&lt;').replace(gReg, '&gt;') +'</span>';
  			}
  
  			if(message.indexOf('{%title}') != -1){
  				message = message.replace('{%title}', val);
  			} else if(val) {
  				message = message+' '+val;
  			}
  		}
  
  		if(message && message.indexOf('{%') != -1){
  			['value', 'min', 'max', 'maxlength', 'minlength', 'label'].forEach(function(attr){
  				if(message.indexOf('{%'+attr) === -1){return;}
  				var val = ((attr == 'label') ? $.trim($('label[for="'+ elem.id +'"]', elem.form).text()).replace(/\*$|:$/, '') : $.prop(elem, attr) || $.attr(elem, attr) || '') || '';
  				val = ''+val;
  
  
  				val = toLocale(val, elem, attr);
  
  				message = message.replace('{%'+ attr +'}', val.replace(lReg, '&lt;').replace(gReg, '&gt;'));
  				if('value' == attr){
  					message = message.replace('{%valueLen}', val.length);
  				}
  
  			});
  		}
  		return message;
  	};
  	
  	webshims.createValidationMessage = function(elem, name){
  
  		var message = getMessageFromObj(currentValidationMessage[name], elem);
  		if(!message && name == 'badInput'){
  			message = getMessageFromObj(currentValidationMessage.typeMismatch, elem);
  		}
  		if(!message && name == 'typeMismatch'){
  			message = getMessageFromObj(currentValidationMessage.badInput, elem);
  		}
  		if(!message){
  			message = getMessageFromObj(validityMessages[''][name], elem) || ($.prop(elem, 'validationMessage') || '').replace(lReg, '&lt;').replace(gReg, '&gt;');
  			if(name != 'customError'){
  				webshims.info('could not find errormessage for: '+ name +' / '+ $.prop(elem, 'type') +'. in language: '+webshims.activeLang());
  			}
  		}
  		message = webshims.replaceValidationplaceholder(elem, message, name);
  		
  		return message || '';
  	};
  	
  	
  	if(!webshims.support.formvalidation || webshims.bugs.bustedValidity){
  		implementProperties.push('validationMessage');
  	}
  	
  	currentValidationMessage = webshims.activeLang(validityMessages);
  		
  	$(validityMessages).on('change', function(e, data){
  		currentValidationMessage = validityMessages.__active;
  	});
  	
  	implementProperties.forEach(function(messageProp){
  		
  		webshims.defineNodeNamesProperty(['fieldset', 'output', 'button'], messageProp, {
  			prop: {
  				value: '',
  				writeable: false
  			}
  		});
  		['input', 'select', 'textarea'].forEach(function(nodeName){
  			var desc = webshims.defineNodeNameProperty(nodeName, messageProp, {
  				prop: {
  					get: function(){
  						var elem = this;
  						var message = '';
  						if(!$.prop(elem, 'willValidate')){
  							return message;
  						}
  						
  						var validity = $.prop(elem, 'validity') || {valid: 1};
  						
  						if(validity.valid){return message;}
  						message = webshims.getContentValidationMessage(elem, validity);
  						
  						if(message){return message;}
  						
  						if(validity.customError && elem.nodeName){
  							message = (webshims.support.formvalidation && !webshims.bugs.bustedValidity && desc.prop._supget) ? desc.prop._supget.call(elem) : webshims.data(elem, 'customvalidationMessage');
  							if(message){return message;}
  						}
  						$.each(validity, function(name, prop){
  							if(name == 'valid' || !prop){return;}
  							
  							message = webshims.createValidationMessage(elem, name);
  							if(message){
  								return false;
  							}
  						});
  						
  						return message || '';
  					},
  					writeable: false
  				}
  			});
  		});
  		
  	});
  });