https://my.gnavi.co.jp/assets/pc/common/js/efo.js

1jQuery.noConflict();
2jQuery(document).ready(function($) {
3	//
4	//efo-1.0.3
5	//	fixed pasword area bug
6	//	add half number only check = efo:I
7	//
8	//efo-1.0.2
9	//	add $.efo.resized
10	//
11	$.efo = function() {
12		var arg = arguments[0] || {};
13		var option = {
14			A: {text: arg.A ? (arg.A.text || null) : null},
15			B: {text: arg.B ? (arg.B.text || null) : null},
16			C: {text: arg.C ? (arg.C.text || null) : null},
17			D: {text: arg.D ? (arg.D.text || null) : null},
18			E: {text: arg.E ? (arg.E.text || null) : null},
19			F: {text: arg.F ? (arg.F.text || null) : null},
20			G: {text: arg.G ? (arg.G.text || null) : null},
21			I: {text: arg.I ? (arg.I.text || null) : null}
22		};
23		var timer = {};
24		var forms = [];
25		var grayout = 'efoGrayout';
26		function makebaloon($o, obj) {
27			var $b = '<div class="efoBaloon"><div class="wrp"><ul class="clfix px12">';
28			$.each(obj, function(val, i){
29				$b += '<li class="type' + val + ' ' + (i.hasError ? 'ok' : 'bad' ) + '" style="display: none;">' + i.text + '</li>';
30			});
31			$b += '</ul><div class="hige">&nbsp;</div></div></div>';
32			var css = $o.offset();
33			css.left = css.left + $o.width() + -30;
34			css.top = css.top - 30;
35			css.position = 'absolute';
36			css.display = 'none';
37			var $targ = $('body').append($b).find('.efoBaloon:last');
38			$targ.css(css);
39			return $targ;
40		}
41		function ckr(arr, $o) {
42			var obj = {};
43			$.map(arr, function(val, i){
44				switch(val.charAt(0)){
45					case 'A':
46						obj.A = {};
47						obj.A.hasError = false;
48						obj.A.text = option.A.text || '未入力';
49						timer.A = new Number();
50						break;
51					case 'B':
52						obj.B = {};
53						obj.B.hasError = false;
54						obj.B.text = option.B.text || 'PCメールアドレスの入力に誤りがあります。';
55						timer.B = new Number();
56						break;
57					case 'C':
58						obj.C = {};
59						obj.C.hasError = false;
60						obj.C.text = option.C.text || '半角のみ';
61						timer.C = new Number();
62						break;
63					case 'D':
64						obj.D = {};
65						obj.D.hasError = false;
66						obj.D.text = option.D.text || '半角数字のみ';
67						timer.D = new Number();
68						break;
69					case 'E':
70						obj.E = {};
71						obj.E.hasError = true;
72						obj.E.text = option.E.text || '半角英数字のみ';
73						timer.E = new Number();
74						break;
75					case 'F':
76						obj.F = {};
77						obj.F.mi = Number(val.substring(1).split('-')[0]);
78						obj.F.ma = Number(val.substring(1).split('-')[1]);
79						obj.F.hasError = true;
80						obj.F.text = option.F.text || '/';
81						timer.F = new Number();
82						break;
83					case 'G':
84						obj.G = {};
85						obj.G.hasError = false;
86						obj.G.text = option.G.text || 'パスワードが上と違います';
87						obj.G.pair = val.substring(1);
88						timer.G = new Number();
89						break;
90					case 'H':
91						var addPlaceholderSupport = function ( attr ) {
92							var input = document.createElement( 'input' );
93							return attr in input;
94						};
95						if ( !addPlaceholderSupport( 'placeholder' ) ) {
96							if($o.val() == ''){
97								$o.val($o.attr('title')).addClass(grayout);
98							}
99							if($o.val() == $o.attr('title')){
100								$o.addClass(grayout);
101							}
102							$o.focus(function(){
103								var $t = $(this);
104								if($t.val() == $t.attr('title')){
105									$t.val('').removeClass(grayout);
106								}
107							}).blur(function(){
108								var $t = $(this);
109								if($t.val() == ''){
110									$o.val($o.attr('title')).addClass(grayout);
111								}
112							}).closest('form').submit(function(){
113								if($o.val() == $o.attr('title')){
114									$o.val('').removeClass(grayout);
115									$(this).submit();
116									return false;
117								}
118							});
119						}else {
120							$o.attr('placeholder', $o.attr('title'));
121						}
122						break;
123					case 'I':
124						obj.I = {};
125						obj.I.hasError = false;
126						obj.I.text = option.I.text || '半角数字のみ';
127						timer.I = new Number();
128						break;
129					default :
130						break;
131				}
132			});
133			obj.baloon = makebaloon($o, obj);
134			return obj;
135		}
136		$('[class*="efo:"]').each(function(){
137			var $t = $(this);
138			var tcls = $t.attr('class').split(' ');
139			if(tcls.length != 1) {
140				$.map(tcls, function(val, i){
141					if(val.indexOf('efo:') != -1) {
142						$t.data('err', ckr(val.substring(4).split('_'), $t));
143					}
144				})
145			} else {
146				$t.data('err', ckr(tcls[0].substring(4).split('_'), $t));
147			}
148			$t
149				.bind('focus', function(){
150					$.efo.check('focus', $(this));
151				})
152				.bind('blur', function(){
153					$.efo.check('blur', $(this));
154				});
155		});
156		$.efo.resized = function(){
157			if($('[class*="efo:"]').length != 0) {
158				$('[class*="efo:"]').each(function(){
159					var $o = $(this);
160					var css = $o.offset();
161					css.left = css.left + $o.width() + 30;
162					css.top = css.top - 30;
163					var targs = $o.data('err');
164					targs.baloon.css(css);
165				});
166			}
167		}
168		$(window).resize(function(){
169			$.efo.resized();
170		});
171		$.efo.check = function(str, obj){
172			var $t = obj;
173			var err = $t.data('err');
174			if(str == 'focus') {
175				if(err.A && err.A.hasError) err.baloon.hide().find('ul li.typeA').hide();
176				if(err.A) {
177					err.A.hasError = false;

178				}
179				if(err.B || err.C || err.D || err.E || err.F || err.G || err.I) {
180					if(err.B) {
181						if(err.B.hasError == true){
182							timer.B = setInterval(function(){
183								if(!$t.val().match(/^[\+\-_a-zA-Z0-9][a-zA-Z0-9\?\+\-\._\/]*\@(\[?)[a-zA-Z0-9\-\.]+\.([a-zA-Z]{2,6}|[0-9]{1,3})(\]?)$/)) {
184									err.baloon.find('ul .typeB').removeClass('ok').addClass('bad');
185									err.B.hasError = true;
186								}else{
187									err.baloon.find('ul .typeB').removeClass('bad').addClass('ok');
188									err.B.hasError = false;
189								}
190								$t.data('err', err);
191							}, 50);
192						}else {
193						}
194					}
195					if(err.C) {
196						if(err.C.hasError == true){
197							timer.C = setInterval(function(){
198								if($t.val().match(/[^\x01-\x7E]/)) {
199									err.baloon.find('ul .typeC').removeClass('ok').addClass('bad');
200									err.C.hasError = true;
201								}else{
202									err.baloon.find('ul .typeC').removeClass('bad').addClass('ok');
203									err.C.hasError = false;
204								}
205								$t.data('err', err);
206							}, 50);
207						}else {
208						}
209					}
210					if(err.D) {
211						if(err.D.hasError == true){
212							timer.D = setInterval(function(){
213								if(!$t.val().match(/^[0-9０-９]+$/)) {
214									err.baloon.find('ul .typeD').removeClass('ok').addClass('bad');
215									err.D.hasError = true;
216								}else{
217									err.baloon.find('ul .typeD').removeClass('bad').addClass('ok');
218									err.D.hasError = false;
219								}
220								$t.data('err', err);
221							}, 50);
222						}else {
223						}
224					}
225					if(err.E) {
226						if(err.E.hasError == true){
227							timer.E = setInterval(function(){
228								if(!$t.val().match(/^[0-9a-zA-Z]+$/)) {
229									err.baloon.find('ul .typeE').removeClass('ok').addClass('bad');
230									err.E.hasError = true;
231								}else{
232									err.baloon.find('ul .typeE').removeClass('bad').addClass('ok');
233									err.E.hasError = false;
234								}
235								$t.data('err', err);
236							}, 50);
237						}else {
238						}
239					}
240					if(err.F) {
241						err.baloon.find('ul .typeF').show();
242						timer.F = setInterval(function(){
243							var inputCnt = $t.val().length;
244							err.baloon.find('ul .typeF').text(inputCnt + err.F.text + err.F.ma);
245							if(inputCnt >= err.F.mi && inputCnt <= err.F.ma) {
246								err.baloon.find('ul .typeF').removeClass('bad').addClass('ok');
247								err.F.hasError = false;
248							}else{
249								err.baloon.find('ul .typeF').removeClass('ok').addClass('bad');
250								err.F.hasError = true;
251							}
252							$t.data('err', err);
253						}, 50);
254					}
255					if(err.G) {
256						var $pair = [];
257						$pair[0] = $('[class*="efo:"][class*="G' + err.G.pair + '"]:eq(0)');
258						$pair[1] = $('[class*="efo:"][class*="G' + err.G.pair + '"]:eq(1)');
259						$t.addClass('suzukikentaro');
260						if($pair[1].hasClass('suzukikentaro')) {
261							err.baloon.find('ul .typeG').show();
262							timer.G = setInterval(function(){
263								var inputCnt = $t.val().length;
264								if($pair[0].val() == $pair[1].val()) {
265									err.baloon.find('ul .typeG').removeClass('bad').addClass('ok');
266									err.G.hasError = false;
267								}else{
268									err.baloon.find('ul .typeG').removeClass('ok').addClass('bad');
269									err.G.hasError = true;
270								}
271								$t.data('err', err);
272							}, 50);
273						} else if($pair[0].hasClass('suzukikentaro') && $pair[1].data('err').G.hasError == true) {
274							var $tG = $pair[1];
275							var errG = $pair[1].data('err');
276							timer.G = setInterval(function(){
277								var inputCnt = $t.val().length;
278								if($pair[0].val() == $pair[1].val()) {
279									errG.baloon.find('ul .typeG').removeClass('bad').addClass('ok');
280									errG.G.hasError = false;
281								}else{
282									errG.baloon.find('ul .typeG').removeClass('ok').addClass('bad');
283									errG.G.hasError = true;
284								}
285								$tG.data('err', errG);
286							}, 50);
287						}
288						$t.removeClass('suzukikentaro');
289					}
290					if(err.I) {
291						if(err.I.hasError == true){
292							timer.I = setInterval(function(){
293								if(!$t.val().match(/^[0-9]+$/)) {
294									err.baloon.find('ul .typeI').removeClass('ok').addClass('bad');
295									err.I.hasError = true;
296								}else{
297									err.baloon.find('ul .typeI').removeClass('bad').addClass('ok');
298									err.I.hasError = false;

299								}
300								$t.data('err', err);
301							}, 50);
302						}else {
303						}
304					}
305					// show baloon
306					if(err.F && err.baloon.is(":visible") == false) {
307						err.baloon.fadeIn();
308					}
309				}
310			} else if(str == 'blur') {
311				if(err.A) { //
312					if( obj.val() == '' || obj.hasClass(grayout)) {
313						err.baloon.fadeIn().find('ul .typeA').show();
314						err.A.hasError = true;
315						for(i in err) {
316							if(i != 'A' && i != 'baloon') {
317								err[i].hasError = false;
318								err.baloon.find('ul .type'+i).hide();
319							}
320						}
321					}
322				}
323				if((!err.A || !err.A.hasError) && (err.B || err.C || err.D || err.E || err.F || err.G || err.I)) {
324					var errcnt = 0;
325					if(err.B) {
326						if(!$t.val().match(/^[\+\-_a-zA-Z0-9][a-zA-Z0-9\?\+\-\._\/]*\@(\[?)[a-zA-Z0-9\-\.]+\.([a-zA-Z]{2,6}|[0-9]{1,3})(\]?)$/)) {
327							err.baloon.find('ul .typeB').show().removeClass('ok').addClass('bad');
328							err.B.hasError = true;
329						} else {
330							err.baloon.find('ul .typeB').hide().removeClass('bad').addClass('ok');
331							err.B.hasError = false;
332						}
333					}
334					if(err.C) {
335						if($t.val().match(/[^\x01-\x7E]/)) {
336							err.baloon.find('ul .typeC').show().removeClass('ok').addClass('bad');
337							err.C.hasError = true;
338						} else {
339							err.baloon.find('ul .typeC').hide().removeClass('bad').addClass('ok');
340							err.C.hasError = false;
341						}
342					}
343					if(err.D) {
344						if(!$t.val().match(/^[0-9０-９]+$/)) {
345							err.baloon.find('ul .typeD').show().removeClass('ok').addClass('bad');
346							err.D.hasError = true;
347						} else {
348							err.baloon.find('ul .typeD').hide().removeClass('bad').addClass('ok');
349							err.D.hasError = false;
350						}
351					}
352					if(err.E) {
353						if(!$t.val().match(/^[0-9a-zA-Z]+$/)) {
354							err.baloon.find('ul .typeE').show().removeClass('ok').addClass('bad');
355							err.E.hasError = true;
356						} else {
357							err.baloon.find('ul .typeE').hide().removeClass('bad').addClass('ok');
358							err.E.hasError = false;
359						}
360					}
361					if(err.F) {
362						if(err.F.hasError == false) {
363							err.baloon.find('ul .typeF').hide();
364						} else {
365						}
366					}
367					if(err.G) {
368						if(err.G.hasError == false) {
369							err.baloon.find('ul .typeG').hide();
370							$('input[class*="G' + err.G.pair + '"]:eq(1)').data('err').baloon.hide().find('ul .typeG').hide();
371						} else {
372						}
373					}
374					if(err.I) {
375						if(!$t.val().match(/^[0-9]+$/)) {
376							err.baloon.find('ul .typeI').show().removeClass('ok').addClass('bad');
377							err.I.hasError = true;
378						} else {
379							err.baloon.find('ul .typeI').hide().removeClass('bad').addClass('ok');
380							err.I.hasError = false;
381						}
382					}
383					// show baloon
384					var hs = false;
385					for(i in err) {
386						if(err[i].hasError == true) {
387							err.baloon.fadeIn();
388							hs = true;
389						}
390					}
391					if(hs == true) {
392						err.baloon.fadeIn();
393					} else {
394						err.baloon.hide();
395					}
396				}
397				for(i in timer) {
398					clearInterval(timer[i]);
399				}
400			}
401			$t.data('err', err);
402		}
403/*
404		$.efo.hideAllBaloons = function(){
405			$('.efoBaloon').hide();
406		}
407*/
408	}
409});