https://www.sharp.co.jp/support/js/a11y/global.js

1;(function($) {
2	// ブレイクポイント設定
3	var isSp = '(max-width: 767px)';
4
5	/* 共通ファイルパス設定 */
6	var globalHeaderPath =  '/support/products/common/include/head-global.html'; // グローバルヘッダーファイルパス
7
8	/*
9	 * DOMロード時処理
10	 */
11	$(function() {
12
13		/*
14		 * ローカル変数定義
15		 */
16		var globalHeader = $('#globalHeader .global-header-container');
17		var globalHeaderNaviContainer = $('#globalHeaderNaviContainer');
18
19		var globalHeaderNaviWrapper = $('.global-header-navi-wrapper');
20		if(!globalHeaderNaviWrapper.length){
21			globalHeaderNaviWrapper = $('#globalHeaderNaviContainer ul.list-global-header-navi')
22		}
23
24		var globalHeaderNaviSearch = $('#globalHeaderNaviContainer .global-search-form');
25		var globalHeaderNaviMenu = $('#globalHeaderMenuBtn .btn-menu');
26		var globalHeaderNaviClose = $('#globalHeaderMenuBtn .btn-close');
27		var globalSearchBarContainer = $('#globalSearchBar');
28		var globalSearchBtn = $('#globalHeaderSearchBtn');
29
30    var globalHeaderAccordionBtn = $('#globalHeader a[data-acod-target]');
31		var globalHeaderAccordion = null;
32
33		/*
34		 * 関数定義
35		 */
36		// グローバルナビメニュー
37		function globalHeaderNaviOpen(open, scrollPrevent, time) {
38			open = open ? true : false;
39			time = !isNaN(time) ? time : 400;
40			if(open) {
41				globalHeaderNaviContainer.stop().fadeIn(time);
42				settingNaviContainer();
43				if(scrollPrevent) {
44					// グローバルナビメニューが出ている間はページスクロールしない
45					$('html').removeClass('scroll-prevent').addClass('scroll-prevent');
46				}
47				globalHeaderNaviMenu.fadeOut(time);
48				globalHeaderNaviClose.fadeIn(time);
49			} else {
50				globalHeaderNaviContainer.css('height','');
51				globalHeaderNaviContainer.stop().fadeOut(time);
52				if(scrollPrevent) {
53				// ページスクロールOFF解除
54					$('html').removeClass('scroll-prevent');
55				}
56				globalHeaderNaviClose.fadeOut(time);
57				globalHeaderNaviMenu.fadeIn(time);
58			}
59		}
60
61		// グローバルナビアコーディオン
62function globalHeaderAccordionOpen(self, time) {
63  time = !isNaN(time) ? time : 400;
64
65  var target = self.data('acod-target');
66  var $panel = $('.global-header-navi-accordion[data-acod="' + target + '"]');
67
68  if (!$panel.length) {
69    return;
70  }
71
72  var willOpen = !$panel.is(':visible');
73
74  self.toggleClass('accordion-open', willOpen);
75  self.attr('aria-expanded', willOpen ? 'true' : 'false');
76  $panel.attr('aria-hidden', willOpen ? 'false' : 'true');
77
78  $panel.stop(true, true).slideToggle(time, settingNaviContainer);
79}
80
81
82		// ナビゲーションコンテナの高さ調整
83		function settingNaviContainer() {
84			// 画面よりグローバルナビメニューの高さが高い場合スクロールする
85			var windowH = $(window).height();
86			var gNavH = globalHeaderNaviWrapper.outerHeight();
87			var headerH = globalHeader.outerHeight();
88			var gNavHSearch = globalHeaderNaviSearch.outerHeight();
89			if(windowH < headerH + gNavHSearch + gNavH){
90				globalHeaderNaviContainer.css('height', windowH - headerH  + 'px');
91			} else {
92				globalHeaderNaviContainer.css('height','');
93			}
94		}
95
96		/*
97		 * 初期化
98		 */
99		function init() {
100			// イベントOFF
101			globalHeaderNaviMenu.off('click.globalHeaderNaviSp');
102			globalHeaderNaviClose.off('click.globalHeaderNaviSp');
103			globalHeaderNaviContainer.off('click.globalHeaderNaviSp');
104			globalHeaderNaviSearch.off('click.globalHeaderNaviSp');
105			globalHeaderAccordionBtn.off('click.globalHeaderNaviSp');
106
107			if (window.matchMedia(isSp).matches) {
108				// スマートフォン
109				globalSearchBarContainer.fadeOut();
110				globalHeaderNaviOpen(false, true, 0);
111
112				// グローバルナビメニューボタンクリック
113				globalHeaderNaviMenu.on("click.globalHeaderNaviSp",function(){
114					globalHeaderNaviOpen(true, true);
115				});
116
117				// グローバルナビクローズボタンクリック
118				globalHeaderNaviClose.on("click.globalHeaderNaviSp",function(){

119					globalHeaderNaviOpen(false, true);
120				});
121
122				// グローバルナビコンテナークリック
123				globalHeaderNaviContainer.on("click.globalHeaderNaviSp",function(){
124					globalHeaderNaviOpen(false, true);
125				});
126
127				// グローバルナビクリック時、コンテナーにクリックイベントを伝搬させない
128				globalHeaderNaviSearch.on("click.globalHeaderNaviSp",function(e){
129					e.stopPropagation();
130				});
131
132				// グローバルアコーディオンボタンクリック
133				globalHeaderAccordionBtn.on("click.globalHeaderNaviSp",function(){
134					globalHeaderAccordionOpen($(this));
135					return false;
136				});
137			} else {
138				// PC＆タブレット
139				globalHeaderNaviOpen(true, false);
140			}
141		}
142
143		/*
144		 * セットアップ
145		 */
146		function setup() {
147			// マウスオーバー
148			var hoverTarget = '.hover a, a.hover, .hover-fade a, a.hover-fade, #pageTop.default a';
149			$(document).on('mouseenter touchstart', hoverTarget, function(){
150			     $(this).addClass('hovering');
151			}).on('mouseleave touchend', hoverTarget, function(){
152			     $(this).removeClass('hovering');
153			});
154
155			// サイト内検索・開閉ボタン
156			globalSearchBtn.on('click', function(){
157				globalSearchBarContainer.slideToggle();
158				return false;
159			});
160		}
161
162		/*
163		 * 実行
164		 */
165		$.when(
166				$('a[data-accordion-target="individual"]').allBasics('loadSelector', '[data-accordion="individual"]', globalHeaderPath, 'after'),
167				$('.global-header-navi-wrapper').allBasics('loadSelector', '.global-header-navi-footer', globalHeaderPath, 'append')
168		).always(function() {
169
170			globalHeaderAccordion = $('.global-header-navi-accordion');
171
172			// 初期化実行
173			window.matchMedia(isSp).addListener(init);
174			init();
175			setup();
176
177		});
178
179	});
180})(jQuery);