https://tosou-tsuchiura.com/wp-content/themes/ga-store/js/main.js?ver=20201016

1document.addEventListener("DOMContentLoaded", function(){
2
3//抽出表示のアコーディオン
4jQuery(document).ready(function($){
5	jQuery(this).find("span.hidden").hide();
6	
7	jQuery("div.accordion").hide();
8	jQuery("div.accordionwrap,div.Philadelphia__accordionwrap").on("click","p.accordionbutton,p.Philadelphia__accordionbutton",function(){
9		jQuery(this).next("div").toggle();
10		jQuery(this).find("span.hidden").toggle();
11		jQuery(this).find("span.u-display-inline").toggle();
12	});
13});
14
15//下層ヘッダー用のfixjquery
16
17jQuery(document).ready(function($){
18
19	var element = $("#Watertown");
20
21	if(!element.length) return;
22	// 固定するブロックの位置
23	var elementTop = element.offset().top;
24	//スクロールするたびに実行
25	$(window).scroll(function() {
26		var windowTop = $(this).scrollTop();
27		//スクロール位置がnavの位置より下だったらクラスfixedを追加
28		if (windowTop >= elementTop) {
29			element.addClass('fixed')
30		} else if (windowTop <= elementTop) {
31			element.removeClass('fixed')
32		}
33	});
34});
35
36//----------------------------------------------------------------------
37//フィックスナビゲーションに表示の動きを追加
38
39var navHeight = 0;
40var Timer_id1 = undefined;
41var Timer_id2 = undefined;
42
43//フィックスナビゲーション
44//スクロール600でグローバルナビ
45function fixednav() {
46	var nav= document.getElementById('fixedNav');
47	if(nav == null)return;
48	var navItem = nav.getElementsByTagName('li');
49	
50	var scrollTop =
51	document.documentElement.scrollTop || // IE、Firefox、Opera
52		document.body.scrollTop;			  // Chrome、Safari
53		//スクロール位置が650～700の間でfixしたナビナビゲーションを追加
54	
55	if(scrollTop >= 650 ){
56		//display:block;にして高さ0にする
57		if(navHeight <= 0){
58			nav.style.display = "block";
59			nav.style.height = "0px";
60			for(i = 0; i < navItem.length; i++){
61				navItem[i].style.height = "0px";
62			}
63			//高さを出す関数呼び出し
64		}
65		if(navHeight == 0  ) {
66			if (Timer_id1 === undefined) {
67				Timer_id1 = setInterval(slideDown2,5);
68			}
69		}
70	}
71	
72	 //スクロール位置が550～600でfixしたナビナビゲーションを非表示にする
73	if(scrollTop <= 650){
74		if(navHeight == 63){
75			if (Timer_id2 === undefined) {
76				Timer_id2 = setInterval(slideUp2,5);
77			}
78		 }
79	}
80}
81
82//----------------------------------------------------------------------
83//pagetopボタン
84//スクロール600でグローバルナビとpagetopボタン表示
85function pageTop() {
86	var atlantabtn = document.getElementById('Atlanta');
87	if(atlantabtn == null)return;
88	var scrollTop =
89		document.documentElement.scrollTop || // IE、Firefox、Opera
90		document.body.scrollTop;			  // Chrome、Safari
91	if(scrollTop >= 650 && scrollTop <= 700){
92		atlantabtn.style.display = "block";
93	}
94	if(scrollTop < 650){
95		atlantabtn.style.display = "none";
96	}
97}
98//ページトップに戻るボタンのスムーススクロール//
99var timer_id = undefined;
100
101function smoothScrollTop(){
102	var scrollTop =
103		document.documentElement.scrollTop || // IE、Firefox、Opera
104		document.body.scrollTop;			  // Chrome、Safari
105		if(timer_id === undefined){
106			timer_id = setInterval(function(){scrollY(300)},1);
107		}
108console.log('呼び出されたタイマー' + timer_id);
109}
110
111function scrollY(num){
112	var scrollTop =
113		document.documentElement.scrollTop || // IE、Firefox、Opera
114		document.body.scrollTop;			  // Chrome、Safari
115	if( scrollTop > 0){
116		 window.scroll(0,(scrollTop -= num));
117	}
118	if(scrollTop == 0){
119console.log('破棄されるタイマー' + timer_id);
120		clearInterval(timer_id);
121		timer_id = undefined;
122	}
123console.log('処理が終わった後の' + timer_id);
124}
125
126//スクロールイベント追加
127	window.onscroll = function(){
128		fixednav();
129		pageTop();
130	}
131
132// ページの先頭に戻るイベント
133	window.onload = function() {
134		var atlantabtn = document.getElementById('Atlanta');
135		if (atlantabtn) {
136			atlantabtn.addEventListener('click', smoothScrollTop, false);
137		}
138	};
139
140// -------------------------------------------------------------------//
141
142function slideDown2() {
143	var nav= document.getElementById('fixedNav');
144	var navItem = nav.getElementsByTagName('li');
145		if (navHeight < 63 ) {
146			navHeight += 1;
147			nav.style.height = navHeight + "px";
148			if(navHeight <= 60){
149					for(i = 0; i < navItem.length; i++){
150						navItem[i].style.height = navHeight + "px";
151					}
152			}
153		}
154		clearInterval(Timer_id2);
155		if(navHeight == 63){
156		   Timer_id1 = clearInterval(Timer_id1);
157		}
158}
159
160
161
162function slideUp2() {
163	var nav= document.getElementById('fixedNav');
164	var navItem = nav.getElementsByTagName('li');
165		if (navHeight > 0) {
166			navHeight -= 1;
167			nav.style.height = navHeight + "px";
168			for(i = 0; i < navItem.length; i++){
169				navItem[i].style.height = navHeight + "px";
170			}
171		}
172		clearInterval(Timer_id1);
173		if(navHeight == 0  ) {
174			Timer_id2 = clearInterval(Timer_id2);
175		}
176}
177
178
179//マッカレンメニュー用開閉ボタンを押したときの処理を加える
180	window.addEventListener('load', mcAllen, false);
181	function mcAllen(){
182		var mcAllenCnt = document.getElementsByClassName('McAllen__head');
183		for(var i=0; i < mcAllenCnt.length; i++){
184		
185			// ボタンをクリックした時の処理
186			document.getElementById('McAllenbtn_'+i).onclick = function(){
187				this.className = this.className == 'McAllen__head' ? 'McAllen__head__open' : 'McAllen__head';
188				var btn = this.id ;
189				var boxid = this.id.replace(/McAllenbtn_/i,'McAllenbox_');
190				var box = document.getElementById(boxid);
191				// #box のコピーを作る
192				var copyBox = box.cloneNode(true);
193				// #box の親ノードに挿入
194				box.parentNode.appendChild(copyBox);
195				// ひとまずみえなくする
196				copyBox.style.cssText = "display:block; height:auto; visibility:hidden; " ;
197				// コピーの高さを調べる
198				var copyBoxH = copyBox.offsetHeight;
199				// コピーした要素を削除する
200				box.parentNode.removeChild(copyBox);
201				box = document.getElementById(boxid);
202				var boxH = box.offsetHeight;
203				
204				if(boxH < 1){
205					box.style.display = "block";
206					slideDown(box,boxH,copyBoxH);
207				} else {
208					slideUp(box,boxH,copyBoxH);
209				}
210			}
211		}
212		
213		// スライドダウンのアニメーション
214		var slideDown_timer;
215		function slideDown(box,boxH,copyBoxH){
216			if (boxH < copyBoxH) {
217				var boxH = boxH + 5;
218				box.style.height = boxH + "px";
219				slideDown_timer = setTimeout(function(){slideDown(box,boxH,copyBoxH)}, 5);
220			} else {
221				clearTimeout(slideDown_timer);
222				box.style.height = copyBoxH;
223			}
224		}
225		// スライドアップのアニメーション
226		var slideUp_timer;
227		function slideUp(box,boxH,copyBoxH){
228			if (boxH >= 1) {
229				var boxH = boxH - 5;
230				box.style.height = boxH + "px";
231				slideUp_timer = setTimeout(function(){slideUp(box,boxH,copyBoxH)}, 5);
232			} else {
233				clearTimeout(slideUp_timer);
234				box.style.height = 0;
235				box.style.display = "none";
236			}
237		}
238	}
239
240//クラスを付け加えたり消したりする関数,スマホ時の施工事例、お客様の声、現場ブログで使用
241	function invisibleDom(visibleDOM,invisibleDOM1,invisibleDOM2, _className,_className2,callback) {
242		var className = ' '+_className;
243		return function(e) {
244			
245				visibleDOM.className = visibleDOM.className.replace(className, '');
246			
247				if(!(invisibleDOM1.classList.contains(_className))){
248					invisibleDOM1.className += className;
249				}
250				if(!(invisibleDOM2.classList.contains(_className))){
251					invisibleDOM2.className += className;
252				}
253				
254			this.className = _className2;
255			document.getElementById(invisibleDOM1.id+'btn').className = '';
256			document.getElementById(invisibleDOM2.id+'btn').className = '';
257		}
258	}
259
260	 window.addEventListener('load', ElPaso, false);
261
262/* Elpaso用の処理 */
263
264	function ElPaso(){

265		if(document.getElementById('ElPaso')){
266			if(document.getElementById('Philadelphiabtn') && document.getElementById('Miami') && document.getElementById('Chicago')){
267				var galleryOn  = invisibleDom(Philadelphia,Miami,Chicago,'sp-none','ElPaso__isClick ElPaso__isClick-color'),
268				galleryBtn = document.getElementById('Philadelphiabtn');
269				galleryBtn.addEventListener('click',galleryOn,false);
270			}
271
272			if(document.getElementById('Philadelphiabtn')&&document.getElementById('Miami')&&document.getElementById('Chicago')){
273			   var blogOn	 = invisibleDom(Miami,Philadelphia,Chicago,'sp-none','ElPaso__isClick ElPaso__isClick-color'),
274				blogBtn	= document.getElementById('Miamibtn');
275				blogBtn.addEventListener('click',blogOn,false);
276			}
277
278			if(document.getElementById('Philadelphiabtn')&&document.getElementById('Miami')&&document.getElementById('Chicago')){
279				voiceOn	= invisibleDom(Chicago,Philadelphia,Miami,'sp-none','ElPaso__isClick ElPaso__isClick-color'),
280				voiceBtn   = document.getElementById('Chicagobtn');
281				voiceBtn.addEventListener('click',voiceOn,false);
282			}
283		}
284	}
285
286//クラスを付け加えたり消したりする関数,ハンバーガーボタンで使用
287	function toggle(targetDOM, _className, callback) {
288		var className = ' '+_className;
289		return function(e) {
290			if(targetDOM.className.indexOf(_className)>-1) {
291				targetDOM.className = targetDOM.className.replace(className, '');
292			} else {
293				targetDOM.className += className;
294
295				scrollTo(0,0);
296			}
297		}
298	}
299
300/* ハンバーカーメニュー */
301	window.addEventListener('load', menuToggle, false);
302
303	function menuToggle(){
304		var menuButton = document.getElementById('menu-button'),
305			wrapper = document.getElementById('wrapper'),
306			overlay = document.getElementById('overlay'),
307			toggleMenu = toggle(wrapper, 'isOpened');
308
309		if(menuButton && overlay) {
310			menuButton.addEventListener('click', toggleMenu, false);
311			overlay.addEventListener('click', toggleMenu, false);
312		}
313	};
314
315window.addEventListener("load", function(event) {
316	var touchStartX;
317	var touchStartY;
318	var touchMoveX;
319	var touchMoveY;
320
321	var scrollStartX;
322	var scrollMoveX;
323 
324	// 開始時
325	window.addEventListener("touchstart", function(event) {
326		//event.preventDefault();
327		// 座標の取得
328		touchStartX = event.touches[0].pageX;
329		touchStartY = event.touches[0].pageY;
330
331		scrollStartX = window.pageXOffset;
332	}, false);
333 
334	// 移動時
335	window.addEventListener("touchmove", function(event) {
336		//event.preventDefault();
337		// 座標の取得
338		touchMoveX = event.changedTouches[0].pageX;
339		touchMoveY = event.changedTouches[0].pageY;
340
341		scrollMoveX = window.pageXOffset;
342	}, false);
343 
344	// 終了時
345	window.addEventListener("touchend", function(event) {
346		// 移動量の判定
347		if (touchStartX > touchMoveX || scrollStartX > scrollMoveX) {
348			if ((touchStartX > (touchMoveX + 50)) || ((scrollStartX + 50) < scrollMoveX)){
349				//右から左に指が移動した場合
350				document.getElementById("wrapper").classList.remove("isOpened");
351			}
352		} else if (touchStartX < touchMoveX) {
353			if ((touchStartX + 50) < touchMoveX) {
354				//左から右に指が移動した場合
355				//document.getElementById("wrapper").classList.add("isOpened");
356			}
357		}
358	}, false);
359}, false);
360
361//地域エリアリストに関する処理
362	window.addEventListener('load', BaltimoreToggle, false);
363
364	function BaltimoreToggle(){
365
366		if(document.getElementById('BaltimoreList') == null)return;
367
368		var BaltimoreList = document.getElementById('BaltimoreList').getElementsByTagName('p');
369		for(var i=0; i < BaltimoreList.length; i++) {
370			document.getElementById('Baltimorebtn_'+i).onclick = function(){
371			//現在(this)の親(parentNode)の次のエレメント(nextElementSibling)という意味
372			//HTMLの構成がもし、div.Baltimore__ariatitleの次の兄弟要素が必ずp#menu_?なのであれば、生かして、↓2行を削除しても大丈夫
373			//var menu = this.parentNode.nextElementSibling;
374
375			//replaceは文字を置き換えてます。例えば最初のエリアをクリックすると、this.idには"btn_0"が入っています。この"btn"を"menu"に置換して"menu_0"にしています。
376				var Baltimoremenuid = this.id.replace(/Baltimorebtn/i,'Baltimoremenu');
377				var Baltimoremenu = document.getElementById(Baltimoremenuid);
378				if(Baltimoremenu.className == 'invisible'){
379					Baltimoremenu.className = 'visible';
380				}else{
381					Baltimoremenu.className = 'invisible';
382				}
383			}
384		}
385	};
386
387
388/* 画像スライダー */
389// @param {string} id - ラッパー要素のid
390// @param {object} options - itemClassName, pointClassName, extraのオプション
391function imageSlide (id, options) {
392	var resizeTimer = null,
393		extra = options.extra || 2,
394		wrapper = document.getElementById(id),
395		items =  document.getElementsByClassName(options.itemClassName||'js-sli

395de-item'),
396		points = document.getElementsByClassName(options.pointClassName||'js-slide-point'),
397		duration = options.duration || 350,
398		maxPoint = items.length+(extra),
399		flipsnap = null;
400
401	if(!wrapper || !items || !points) return;
402
403	// 要素が2つ以下の場合、インジケーターを消して処理を停止
404	if(items.length < 2) {
405		items[0].style.margin = '0 auto';
406		Array.prototype.slice.call(points).map(function(point, i) {
407			point.style.display = 'none';
408		});
409		return;
410	} else {
411		// ダミーを作成
412		var dummies =createDummy(items, extra);
413		wrapper.innerHTML='';
414		wrapper.appendChild(dummies);
415
416		init();
417
418		// リサイズされたら計算し直し
419		window.addEventListener('resize', init, false);
420	}
421
422
423	// センタリングして、再計算
424	function init () {
425		if(!resizeTimer) {
426			resizeTimer = setTimeout(function(){
427				// タイマーを戻す
428				resizeTimer = null;
429
430				// センタリングする
431				wrapper.style.position = 'relative';
432				wrapper.style.left = (window.innerWidth - items[0].clientWidth)/2+'px';
433
434				// ポインタをセット
435				activePoint(0);
436
437				// カルーセルを起動
438				flipsnap = Flipsnap(wrapper, {
439					distance: items[0].clientWidth,
440					maxPoint: maxPoint,
441					duration: duration
442				});
443				// 実際は1-3の範囲で動かすため、初期位置を移動
444				flipsnap.moveToPoint(extra,0);
445
446				// スライドが動いたら次を計算する
447				flipsnap.element.addEventListener('fspointmove', move );
448
449				// ポインタで動かせるようにする
450				Array.prototype.slice.call(points).forEach(function(point, i){
451					point.addEventListener('click', function(e){
452						console.log(i+extra);
453						flipsnap.moveToPoint(i+extra);
454					}, false)
455				})
456			}, 66);
457		}
458	}
459
460
461	// 挙動を管理する
462	function move (evt) {
463		// 右端1つ手前を動かしたら最初に戻る
464		if(flipsnap.currentPoint > flipsnap.maxPoint - 1) {
465			backTo(true);
466
467		// 左端1つ手前を動かしたら最後に戻る
468		} else if (flipsnap.currentPoint < extra) {
469			backTo();
470
471		// 通常の移動ではポインタだけを移動
472		} else {
473			activePoint(flipsnap.currentPoint-extra);
474		}
475	}
476
477	// 端の要素に来たらこっそり戻す
478	function backTo (isStart) {
479		var temp, ind;
480		if(isStart) {
481			temp=flipsnap.maxPoint; ind=extra;
482		} else {
483			temp=1; ind=flipsnap.maxPoint-1;
484		}
485		//一旦イベントを削除しておく
486		flipsnap.element.removeEventListener('fspointmove', move);
487
488		// ダミー要素に普通に動かす
489		flipsnap.moveToPoint(temp);
490
491		// ダミー要素の移動が完了しおわってから、こっそり位置を本来の要素に戻す
492		timer = setTimeout(function(){
493			flipsnap.moveToPoint(ind, 0);
494			// ポインタも移動する
495			activePoint(ind-extra);
496			flipsnap.element.addEventListener('fspointmove', move);
497			clearTimeout(timer);
498		}, duration+3);
499	}
500
501	// ダミー作成
502	function createDummy (elms, extra) {
503		var res = document.createDocumentFragment(),
504			len = elms.length,
505			arr=[];
506
507		_.range(len+(extra*2)).forEach(function(x, i){
508			var ind = (i%len+1)%len;
509			res.appendChild( elms[ind].cloneNode(true) );
510		});
511		return res;
512	}
513
514	// ポインタを動かす
515	function activePoint (ind) {
516		Array.prototype.slice.call(points).forEach(function(point, i){
517			if(i === ind && !point.className.match('isActive')) {
518				point.className += ' isActive';
519			} else if(i !== ind && point.className.match('isActive')) {
520				point.className = point.className.replace(' isActive', '');
521			}
522		})
523	}
524}
525
526jQuery(function(){
527
528        jQuery('#Shreveport__title-index_view').hide();
529        jQuery('#Shreveport__title-index_view').on('click', function() {
530                jQuery('#Shreveport__title-index_hidden').show();
531                jQuery('#Shreveport__title-index_view').hide();
532        });
533        jQuery('#Shreveport__title-index_hidden').on('click', function() {
534                jQuery('#Shreveport__title-index_view').show();
535                jQuery('#Shreveport__title-index_hidden').hide();
536        });
537        jQuery("#Shreveport__title-index_toggle").on("click", function() {
538              jQuery('#Shreveport__body').toggle();
539        });
540});
541
542
543/*
544
545// 指定コンポーザーをニー(Cincinnati)直前に移動させる
546window.addEventListener('load', transposeComposersBeforeKnee, false);
547
548function transposeComposersBeforeKnee() {
549	var elemKnee = document.getElementById('Cincinnati');
550	var pathname = location.pathname;
551//console.log(pathname);
552	// カテゴリー毎にコンポーザーの順番を指定する
553	var category = {

554		"works": ['Ashtabula', 'Morgantown', 'ElCentro'],
555		"blog":  ['Ashtabula', 'Morgantown','ElCentro']
556	};
557
558	var found = pathname.match(/^\/(.+)\/.*$/);
559	found = found ? found : pathname.match(/^\/(.+)$/);
560	var ids = category[found[1]];
561
562	if (elemKnee && ids) {
563		for (var i=0; i<ids.length; i++) {
564			var elem = document.getElementById(ids[i]);
565			if (elem) {
566				var elemClone = elem.cloneNode(true);
567				var elemParent = elem.parentNode;
568				elemParent.removeChild(elem);
569				elemParent.insertBefore(elemClone, elemKnee);
570			}
571		}
572	}
573}
574*/
575
576//年末年始の表示を上部に表示するためのjs
577jQuery(document).ready(function($){
578	var html = jQuery(".SouthBend");
579	jQuery(".Watertown").prepend(html);
580
581});
582
583}, false);