https://www.pbaweb.jp/manage/wp-content/plugins/confirm-plus-conta…/assets/js/scripts.js?ver=20230220_123341

1(function ($) {
2	// IEなら処理回避
3	var userAgent = window.navigator.userAgent.toLowerCase();
4	if (userAgent.indexOf('msie') != -1 || userAgent.indexOf('trident') != -1) {
5		return;
6	}
7
8
9	// 初期表示時
10	$( 'input[name=_wpcf7]' ) . each( function() {
11		$(this).after('<input type="hidden" name="_wpcf7cp" value="status_input" />');
12		return false;
13	});
14
15
16	// ボタンラベルの変更
17	$( 'input.wpcf7-submit' ) . attr( 'value', data_arr . cfm_btn );
18
19
20	// 初期値の保持
21	var resetValues = $( 'form.wpcf7-form' ) . serializeArray();
22
23
24	// フォームのリセット
25	var resetForm = function() {
26		var formObj = $( 'form.wpcf7-form' );
27		for ( var i = 0; i < resetValues . length; i++ ) {
28			formObj . find( '[name=' + resetValues[i] . name + ']' ) . val( resetValues[i] . value );
29		}
30		formObj . find( ':file' ) . val( null );
31	};
32
33
34	// サニタイズ＆改行コード変換
35	var sanitizeText = function( textVal ) {
36		return textVal.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;').replace(/`/g, '&#x60;').replace(/\r?\n/g, '<br>');
37	};
38
39
40	// テキストセットの取得
41	var getTextSet = function( inputObj ) {
42		var textSetObj = inputObj . closest( '.text-set-contactform7' );
43		if ( ! textSetObj ) {
44			return null;
45		}
46		var textSetObjClone = textSetObj . clone();
47		var inputToReplaces = textSetObjClone . find( 'input, select' );
48		for ( var i = 0; i < inputToReplaces . length; i++ ) {
49			var inputToReplace = $( inputToReplaces[i] );
50			var inputName = inputToReplace . attr( 'name' );
51			if ( inputName ) {
52				inputToReplace . replaceWith( '{%' + inputName . replace( '[]', '' ) + '%}' );
53			}
54		}
55		return textSetObjClone . text();
56	};
57
58	// 区切り文字（将来的にWP管理画面から設定可能に？）
59	var splitter = ', ';
60
61
62	// 確認ボタン押下で確認画面を表示
63	var wpcf7cp_confirm = function(unit_tag) {
64		const NEW_LINE_CODE = /\r\n|\r|\n/;	// 改行コード
65		const PATH_CODE = /[\\\/]/;			// Path区切りコード
66
67		// ステータスを入力状態から確認状態に変更
68		changeFormStatus( 'confirm' );
69
70		var textAreaList = new Array(); 			// テキストエリアのタイトル名を保持するリスト
71		var noTitleDammyStr = 'CF7CfmPlsNoTitle';	// タイトルが存在しない場合のダミー文字列
72		var noTitleOuterHTMLs = [];					// タイトルが存在しない親P要素のHTML配列
73
74		var dispList = {}; // タイトル、入力値を保持するリスト
75
76		// 対象フォーム検索
77		$( 'input[name=_wpcf7_unit_tag]' ).each(function(){
78			if($(this).val() == unit_tag) {
79				var formElm = $(this).parents("form");
80
81				// 送信完了メッセージを非表示にする
82				var responseOutput = formElm.find('div.wpcf7-response-output');
83				responseOutput.addClass("wpcf7cp-force-hide");
84
85				// 入力値取得: avoid-confirmクラス付与要素は回避
86				formElm . find( 'input, select, textarea' ) . filter( ':visible:not(.avoid-confirm)' ) . each( function() {
87					var title = null;
88					var val = null;
89					var tagName = $(this).prop("tagName");
90
91					var name = $( this )  . attr( 'name' );
92					if ( name ) name = name . replace( '[]' , '' );
93
94					if ("INPUT" == tagName) {
95						var inputType = $(this).attr("type");
96
97						switch (inputType) {
98							case "submit":
99							case "button":
100							case "hidden":
101							case "image":
102								// 処理不要
103								break;
104							case "radio":
105							case "checkbox":
106								if ( ! $(this) . is( ':checked' ) ) {
107									break;
108								}
109
110								title = wpcf7cp_get_title( $( this ) );
111
112								val = $( this ) . val();
113								if( '1' === val || 'on' === val ) {
114									val = data_arr . checked_msg;
115								}
116								break;
117
118							case "file":
119								title = wpcf7cp_get_title($(this));
120								val = $(this).val().split(PATH_CODE).pop();
121								break;
122
123							default:
124								if ( $( this ) . hasClass( 'wpcf7-quiz' ) ) {
125									// CF7の送信可否判定用クイズは確認項目としない
126									return;
127								}
128								title = wpcf7cp_get_title($(this));
129								// サニタイズ
130								val = sanitizeText( $(this).val() );
131						}
132
133					} else if ("TEXTAREA" == tagName) {
134						title = wpcf7cp_get_title($(this));
135						// サニタイズ＆改行コード変換
136						val = sanitizeText( $(this).val() );
137						textAreaList.push(title);
138
139					} else if("SELECT" == tagName) {
140						title = wpcf7cp_get_title($(this));
141						val = $(this) . val();
142					}
143
144					// 有効なタイトルのない場合はouterHTMLに基づくシステム文字列を適用
145					if ( ! title ) {
146						var outerHTML = $( this ) . parents( 'p' ) . prop( 'outerHTML' );
147						var k = $ . inArray( outerHTML, noTitleOuterHTMLs );
148						if ( k === -1 ) {
149							// 同一のouterHTMLが未格納なら新たなINPUTセットとして処理
150							noTitleOuterHTMLs . push( outerHTML );
151							k = noTitleOuterHTMLs . length - 1;
152						}
153						title = noTitleDammyStr + k;
154					}
155

156					// 入力値をリストにセット
157					if ( title !== null && val !== null ) {
158						if ( ! dispList[title] ) {
159							dispList[title] = {
160								values: {},
161								textSet: getTextSet( $( this ) )
162							};
163						}
164						if ( typeof dispList[title]['values'][name] === 'undefined' ) {
165							dispList[title]['values'][name] = '';
166						} else {
167							dispList[title]['values'][name] += splitter;
168						}
169						dispList[title]['values'][name] += ( typeof val === 'object' ? val . join( splitter ) : val );	// multiple selectならjoin()
170					}
171				});
172
173				// form全体を非表示にする
174				formElm.addClass('wpcf7cp-form-hide');
175			}
176		});
177
178		// 確認画面表示
179		$( 'div.wpcf7' ).each(function(){
180			var cfm_btn_edit = data_arr.cfm_btn_edit;				// 修正ボタン名
181			var cfm_btn_mail_send = data_arr.cfm_btn_mail_send;		// この内容で送信するボタン名
182
183			// 確認内容生成
184			var wrapperDivObj = $( '<div id="wpcf7cpcnf">' ) . appendTo( this );
185			var tableObj = $( '<table>' ) . appendTo( wrapperDivObj );
186			for (key in dispList) {
187				// タイトルが空欄の場合
188				var keyToShow = key;
189				var regexp = new RegExp( '^' + noTitleDammyStr + '[0-9]+$');
190				if ( keyToShow . match( regexp ) ) {
191					// システム文字列を除去して空タイトル表示
192					keyToShow = '';
193				}
194
195				var title = $( '<p>' ) . text( keyToShow );
196				var titleElm = $( '<th>' ) . append( title );
197				var val = '';
198				if ( ! dispList[key]['textSet'] ) {
199					for ( k in dispList[key]['values'] ) {
200						if ( val !== '' ) {
201							val += splitter;
202						}
203						val += dispList[key]['values'][k];
204					}
205					val = '<p>' + val + '</p>';
206				} else {
207					val = dispList[key]['textSet'];
208					for ( k in dispList[key]['values'] ) {
209						val = val . replace( new RegExp( '\{%' + k + '%\}', 'g' ), String( dispList[key]['values'][k] ) );
210					}
211				}
212				var valElm = $( '<td>' ) . append( val );
213				var rowElm = $( '<tr>' ) . append( titleElm ) . append( valElm );
214
215				tableObj . append( rowElm );
216			}
217
218			// 修正、送信ボタン生成
219			var btnTableElm = $( '<div class="wpcf7cp-btns">' ) . append(
220				$(
221					'<button type="button" class="wpcf7-form-control wpcf7cp-cfm-edit-btn">' + cfm_btn_edit + '</button>'
222				) . click( function() {
223					wpcf7cp_edit();
224					changeFormStatus( 'input' );
225				} )
226			) . append(
227				$(
228					'<button type="button" class="wpcf7-form-control wpcf7-submit wpcf7cp-cfm-submit-btn">' + cfm_btn_mail_send + '</button>'
229				) . click( function() {
230					wpcf7cp_mail_send();
231				} )
232			);
233			wrapperDivObj . append( btnTableElm );
234
235			// 確認画面トップまでスクロール
236			var position = $(this).offset().top;
237
238			var popupHeight = $( '#wpcf7cpcnf' ) . height();
239			var windowHeight = document.documentElement . clientHeight;
240
241			var topOffset = 50;
242			if ( popupHeight < windowHeight ) {
243				// 確認ポップアップの高さがブラウザ高さより小さければ上下中央表示
244				topOffset = Math . round( ( windowHeight - popupHeight ) / 2 );
245			}
246
247			var speed = 500;
248			$("html, body").animate({scrollTop: position - topOffset }, speed, "swing");
249		});
250	}
251
252
253	// 確認画面から「修正」ボタンで編集画面に復帰
254	var wpcf7cp_edit = function(){
255		// 確認画面の修正ボタン押下時の処理
256		// 非表示としたformを再表示する
257		$( '.wpcf7cp-form-hide' ) . each( function() {
258			$(this).removeClass("wpcf7cp-form-hide");
259		});
260
261		// 確認画面を閉じる
262		$( '#wpcf7cpcnf' ) . each( function() {
263			$(this) . remove();
264			return false;
265		});
266	}
267
268
269	// 入力フォームのステータスをinput/confirmに変更
270	var changeFormStatus = function( statusTo ) {
271		if ( -1 === $ . inArray( statusTo, ['input', 'confirm'] ) ) {
272			return;
273		}
274
275		$( 'input[name=_wpcf7cp]' ) . each( function() {
276			$( this ) . val( 'status_' + statusTo );
277			return false;
278		});
279	};
280
281
282	// 確認画面からメールを送信
283	var wpcf7cp_mail_send = function(){
284		// 確認画面の、この内容で送信するボタン押下時の処理
285		// $( '.wpcf7-form' ) . submit();
286
287		// フォーム送信と確認画面除去
288		var submitButton = $( 'input.wpcf7-submit' );
289		var forms = submitButton . parents( 'form' );
290		var responseOutput = forms . find( 'div.wpcf7-response-output' );
291		forms . one( 'submit', function() {
292			// clickイベントによるsubmitイベント発生後に実行
293			setTimeout( function() {
294				responseOutput . removeClass( 'wpcf7cp-force-hide' );
295				wpcf7cp_edit();
296			} );
297		} );
298		submitButton . click();
299
300		// プログレス表示
301		var progressContents = $( '<div class="wpcf7cp-progress-cover"></div><div class="wpcf7cp-progress-content"><p>Progress...</p></div>' ) . appendTo( forms[0] );
302		progressContents . height( progressContents . height() );	// height: 100%を絶対値に変換して送信完了メッセージ読み込み時のガタつき防止
303

304		// AJAXメッセージの反映を待ってスクロール
305		var intervalId = setInterval( function() {
306			// メッセージ反映チェック
307			if ( ! responseOutput . text() . length || ! responseOutput . is( ':visible' ) ) {
308				return;
309			}
310
311			// フォーム初期化
312			resetForm();
313			changeFormStatus( 'input' );
314
315			// プログレス表示の除去
316			progressContents . remove();
317
318			// メッセージ表示箇所までスクロール
319			var responsePosi = responseOutput . offset() . top;
320			var scrollToPosi = responsePosi - ( $( window ) . height() / 2 );
321			$( 'html, body' ) . animate( { scrollTop: scrollToPosi }, 500, 'swing' );
322
323			// 定時処理終了
324			clearInterval( intervalId );
325		}, 300 );
326	}
327
328
329	// タイトル取得
330	var wpcf7cp_get_title = function (element) {
331		var title = null;
332
333		var makeTitle = function( titleObj ) {
334			var titleObjClone = titleObj . clone();
335			titleObjClone . find( '.avoid-confirm' ) . remove();
336			return $ . trim( titleObjClone . text() );
337		};
338
339		// タイプの取得
340		var thisObj = $( element );
341		var inputType = thisObj . attr( 'type' );
342
343		// checkbox/radioの場合はlegend要素を最優先
344		if ( inputType === 'checkbox' || inputType === 'radio' ) {
345			var legend = thisObj . closest( 'fieldset' ) . find( 'legend' );
346			if ( legend . length ) {
347				// filedset/legendが適用されていればタイトルに使用
348				title = makeTitle( legend );
349			}
350		}
351
352		if ( ! title ) {
353			// name対応label要素によるタイトル取得
354			var nameVal = thisObj . attr( 'name' )  . replace(/\[\]$/, '');
355			if ( inputType !== 'radio' ) {
356				var labelObjWithForAttr = $( 'label[for="' + nameVal + '"]' );
357				if ( labelObjWithForAttr ) {
358					title = makeTitle( labelObjWithForAttr );
359				}
360
361				// 親label要素（CF7方式）でのタイトル取得
362				if ( ! title && inputType !== 'checkbox' ) {
363					var closestLabelObj = thisObj . closest( 'label' );
364					if ( closestLabelObj ) {
365						if ( 'SELECT' == thisObj . prop( 'tagName' ) ) {
366							// セレクトメニューなら複製→オプション要素を除去
367							closestLabelObjClone = closestLabelObj . clone();
368							closestLabelObjClone . find( 'option' ) . remove();
369							title = makeTitle( closestLabelObjClone );
370						} else {
371							title = makeTitle( closestLabelObj );
372						}
373					}
374				}
375			}
376
377			// クラス名による明示に対応
378			if ( ! title ) {
379				var classLabelObj = $( '.title-contactform7.for-' + ( nameVal ) );
380				if ( classLabelObj ) {
381					title = makeTitle( classLabelObj );
382				}
383			}
384
385			// テーブルの同一行に存在する.title-contactform7要素に対応
386			if ( ! title ) {
387				var closestTrObj = thisObj . closest( 'tr' );
388				if ( closestTrObj ) {
389					var labelInSameTrObj = closestTrObj . find( '.title-contactform7' );
390					if ( labelInSameTrObj ) {
391						title = makeTitle( labelInSameTrObj );
392					}
393				}
394			}
395
396			// 親label要素（CF7方式）の単独チェックボックスに対応（規約確認など）
397			if ( ! title && inputType === 'checkbox' ) {
398				var closestLabelObj = thisObj . closest( 'label' );
399				if ( closestLabelObj ) {
400					title = makeTitle( closestLabelObj );
401				}
402			}
403		}
404
405		return title;
406	};
407
408
409	// CF7のAJAXイベント
410	document . addEventListener( 'wpcf7submit', function( event ) {
411		if ( 'wpcf7cp_confirm' === event.detail.status) {
412			wpcf7cp_confirm( event.detail.unitTag );
413		}
414	}, false );
415} )( jQuery );