1/** 2 * top.js 3 * 4 * @requires 5 * - jquery.js 6 */ 7 8const u = new layoutUtil(); 9 10 11/** 12 * @module 13 */ 14 15/** 16* @method respondBrowser 17*/ 18function respondBrowser() { 19 // vars 20 const $body = jQuery('body'); 21 const attrName = 'data-browser'; 22 // settingï¼å±æ§è¨å® 23 if (u.isBrowser('chrome')) { $body.attr(attrName, 'chrome'); } else if (u.isBrowser('safari')) { $body.attr(attrName, 'safari'); } else if (u.isBrowser('firefox')) { $body.attr(attrName, 'firefox'); } else if (u.isBrowser('edge')) { $body.attr(attrName, 'edge'); } else if (u.isBrowser('ie11')) { $body.attr(attrName, 'ie11'); } 24} 25 26/** 27* @method topAriaControl 28*/ 29function topAriaControl(_trigger, _boolean, _callback) { 30 const expandedAttr = 'aria-expanded'; 31 const targetHiddensAttr = 'aria-hidden'; 32 const targetControlsAttr = 'aria-controls'; 33 const targetId = _trigger.attr(targetControlsAttr); 34 const $target = jQuery(`#${targetId}`); 35 if (_callback) { 36 _callback(); 37 } 38 if (_boolean) { 39 _trigger.attr(expandedAttr, 'true'); 40 $target.attr(targetHiddensAttr, 'false'); 41 $target.removeAttr('inert'); 42 } else { 43 _trigger.attr(expandedAttr, 'false'); 44 $target.attr(targetHiddensAttr, 'true'); 45 $target.attr('inert', ''); 46 } 47} 48 49/** 50* @method topAccordion 51*/ 52function topAccordion(config) { 53 // options 54 const c = jQuery.extend({ 55 factorElement: '.js-top-accordion', 56 triggerElement: '.js-top-accordion__trigger', 57 panelElement: '.js-top-accordion__panel', 58 panelDisplayType: 'allShow', // åæ表示è¨å®ï¼ãallHideãorãallShowã 59 dataPanelPc: 'data-panel-pc', 60 dataPanelSp: 'data-panel-sp', 61 slideSpeed: 500, 62 }, config); 63 // vars 64 const $elm = jQuery(c.factorElement); 65 const accWrap = c.factorElement; 66 const accTrigger = c.triggerElement; 67 const accPanel = c.panelElement; 68 const display = c.panelDisplayType; 69 const panelPc = c.dataPanelPc; 70 const panelSp = c.dataPanelSp; 71 const activeName = u.state.active; 72 const speed = c.slideSpeed; 73 // exit 74 if ($elm.length === 0) { return false; } 75 76 // settingï¼è¡¨ç¤ºè¨å® 77 $elm.each(function () { 78 const $wrap = jQuery(this); 79 let $trigger = $wrap.find(accTrigger); 80 const displayPc = jQuery(this).attr(panelPc); 81 const displaySp = jQuery(this).attr(panelSp); 82 const $panel = $wrap.find(accPanel); 83 84 // PCæã¾ãã¯SPæã«buttonã¿ã°ã«å¤æ 85 if ((u.isRangeSP() && displaySp !== 'esc') || (u.isRangePC() && displayPc !== 'esc')) { 86 if (!$trigger.is('button')) { 87 const $button = jQuery('<button>').attr({ 88 type: 'button', 89 class: $trigger.attr('class'), 90 'aria-expanded': display === 'allShow' ? 'true' : 'false', 91 'aria-controls': $panel.attr('id'), 92 }).html($trigger.html()); 93 $trigger.replaceWith($button); 94 $trigger = $button; 95 } 96 } 97 98 if (!u.isRangeSP()) { 99 if (displayPc === 'esc') { return true; } 100 } else if (displaySp === 'esc') { return true; } 101 switch (display) { 102 // å ¨é表示ã®å ´å 103 case 'allHide': 104 $trigger.removeClass(activeName); 105 topAriaControl($trigger, false); 106 break; 107 // å ¨è¡¨ç¤ºã®å ´å 108 case 'allShow': 109 $trigger.addClass(activeName); 110 topAriaControl($trigger, true); 111 break; 112 default: 113 break; 114 } 115 if (!u.isRangeSP()) { 116 switch (displayPc) { 117 // PCæé表示ã®å ´å 118 case 'close': 119 $trigger.removeClass(activeName); 120 topAriaControl($trigger, false); 121 break; 122 // PCæ表示ã®å ´å 123 case 'open': 124 $trigger.addClass(activeName); 125 topAriaControl($trigger, true); 126 break; 127 default: 128 break; 129 } 130 } else { 131 switch (displaySp) { 132 // SPæé表示ã®å ´å 133 case 'close': 134 $trigger.removeClass(activeName); 135 topAriaControl($trigger, false); 136 break; 137 // SPæ表示ã®å ´å 138 case 'open': 139 $trigger.addClass(activeName);
140 topAriaControl($trigger, true); 141 break; 142 default: 143 break; 144 } 145 } 146 if ($trigger.attr('href') === u.hash) { 147 $trigger.addClass(activeName); 148 topAriaControl($trigger, true, function(){ 149 $panel.show(); 150 }); 151 } else if ($panel.find(u.hash).length !== 0) { 152 $trigger.addClass(activeName); 153 topAriaControl($trigger, true, function(){ 154 $panel.show(); 155 }); 156 } 157 }); 158 // control 159 jQuery(accTrigger).on('click', function (e) { 160 const $trigger = jQuery(this); 161 const $wrap = $trigger.closest(accWrap); 162 const displayPc = $wrap.attr(panelPc); 163 const displaySp = $wrap.attr(panelSp); 164 const $panel = $wrap.find(accPanel); 165 if (!u.isRangeSP()) { 166 if (displayPc === 'esc') { return true; } 167 } else if (displaySp === 'esc') { return true; } 168 if ($wrap.length) { 169 e.preventDefault(); 170 if ($trigger.hasClass(activeName)) { 171 $trigger.removeClass(activeName); 172 topAriaControl($trigger, false, function(){ 173 $panel.stop().slideUp(speed); 174 }); 175 } else { 176 $trigger.addClass(activeName); 177 topAriaControl($trigger, true, function(){ 178 $panel.stop().slideDown(speed); 179 }); 180 } 181 } 182 }); 183} 184 185 186/** 187* @method topTabs 188*/ 189function topTabs(config) { 190 // options 191 const c = jQuery.extend({ 192 factorElement: '.js-top-tabs', 193 naviElement: '.js-top-tabs__navi', 194 triggerElement: '.js-top-tabs__trigger', 195 panelElement: '.js-top-tabs__panel', 196 firstDisplayTab: '', // åæ表示ã¿ãï¼ã¿ãã®idã#xxxxããæå®ï¼â»ä½ãæå®ããªããã°ä¸çªæåã®ã¿ããè¡¨ç¤ºï¼ 197 }, config); 198 // vars 199 const $elm = jQuery(c.factorElement); 200 const tabWrap = c.factorElement; 201 const tabNavi = c.naviElement; 202 const tabTrigger = c.triggerElement; 203 const tabPanel = c.panelElement; 204 const currentName = u.state.current; 205 const speed = 500; 206 // exit 207 if ($elm.length === 0) { return false; } 208 209 // settingï¼è¡¨ç¤ºè¨å® 210 $elm.each(function () { 211 const $wrap = jQuery(this); 212 const $navi = $wrap.find(tabNavi); 213 const $trigger = $wrap.find(tabTrigger); 214 const $panel = $wrap.find(tabPanel); 215 let firstPanel = c.firstDisplayTab; 216 if (firstPanel !== '') { 217 // JSå´ã§åæ表示ã¿ãã«æå®ãããå ´å 218 } else if ($navi.find('li').hasClass(currentName)) { 219 // HTMLå´ã§ç¾å¨å°ã®æå®ãããå ´å 220 firstPanel = `#${jQuery(`.${currentName}`, $navi).find(tabTrigger).attr('aria-controls')}`; 221 } else { 222 firstPanel = `#${$navi.find('li:first').find(tabTrigger).attr('aria-controls')}`; 223 } 224 $trigger.parent().removeClass(currentName); 225 $trigger.each(function() { 226 topAriaControl(jQuery(this), false, () => { 227 $panel.hide(); 228 }); 229 }); 230 $trigger.each(function () { 231 if (`#${jQuery(this).attr('aria-controls')}` === u.hash) { 232 firstPanel = u.hash; 233 } 234 }); 235 $panel.each(function () { 236 if (jQuery(this).find(u.hash).length !== 0) { 237 firstPanel = `#${jQuery(this).attr('id')}`; 238 } 239 }); 240 const $firstNav = $navi.find(`${tabTrigger}[aria-controls="${firstPanel.split('#')[1]}"]`); 241 const $firstPanel = $wrap.find(firstPanel); 242 $firstNav.parent().addClass(currentName); 243 topAriaControl($firstNav, true, () => { 244 $firstPanel.fadeIn(speed); 245 }); 246 }); 247 // control 248 jQuery(tabTrigger).on('click', function (e) { 249 e.preventDefault(); 250 const $this = jQuery(this); 251 const $wrap = $this.closest(tabWrap); 252 const $trigger = $wrap.find(tabTrigger); 253 const $panel = $wrap.find(tabPanel); 254 const $targetPanel = $wrap.find(`#${$this.attr('aria-controls')}`); 255 if ($this.parent().hasClass(currentName)) { 256 return false; 257 } 258 $trigger.parent().removeClass(currentName); 259 $trigger.each(function() { 260 topAriaControl(jQuery(this), false, () => { 261 $panel.hide(); 262 }); 263 }); 264 $this.parent().addClass(currentName);
265 topAriaControl($this, true, () => { 266 $targetPanel.fadeIn(speed); 267 }); 268 return false; 269 }); 270} 271 272 273/** 274 * @module 275 */ 276/** 277* @method topHero 278*/ 279function topHero(config) { 280 // options 281 const c = jQuery.extend({ 282 factorElement: '.js-top-hero', 283 listElement: '.js-top-hero__list', 284 controlElement: '.js-top-hero__control', 285 arrowElement: '.js-top-hero__arrow', 286 pauseElement: '.js-top-hero__pause', 287 playElement: '.js-top-hero__play', 288 numCurrentElement: '.js-top-hero__number__current', 289 numTotalElement: '.js-top-hero__number__total', 290 }, config); 291 292 // vars 293 const $elm = jQuery(c.factorElement); 294 295 // exit 296 if ($elm.length === 0) { return false; } 297 298 // vars 299 const $carousel = $elm.find(c.listElement); 300 const $control = $elm.find(c.controlElement); 301 const $pause = $elm.find(c.pauseElement); 302 const $play = $elm.find(c.playElement); 303 const $numCurrent = $elm.find(c.numCurrentElement); 304 const $numTotal = $elm.find(c.numTotalElement); 305 const carouselNum = $carousel.find(' > *').length; 306 const pcSlideNum = 1; 307 const spSlideNum = 1; 308 const bp1 = u.breakPoint1 + 1; 309 const autoplay = true; 310 const activeName = u.state.active; 311 const pauseName = 'is-pause'; 312 const indicationTimeProperties = '--top-hero-indication-time'; 313 const animationStateProperties = '--top-hero-animation-state'; 314 const indicationTime = Number(getComputedStyle($elm[0]).getPropertyValue(indicationTimeProperties).trim().split('ms')[0]); 315 let animationStartTime = 0; 316 let animationCurrentTime = 0; 317 let remainingTime = 0; 318 let timingReset = false; 319 320 $numTotal.html(carouselNum.toString().padStart(2, '0')); 321 $carousel.on('init', () => { 322 animationStartTime = Date.now(); 323 }); 324 $carousel.slick({ 325 arrows: true, 326 prevArrow: '<button type="button" class="slick-prev slick-arrow" aria-label="åã¸">åã¸</button>', 327 nextArrow: '<button type="button" class="slick-next slick-arrow" aria-label="次ã¸">次ã¸</button>', 328 dots: false, 329 infinite: true, 330 autoplay: autoplay, 331 autoplaySpeed: indicationTime, 332 speed: 500, 333 appendArrows: $elm.find(c.arrowElement), 334 slidesToShow: pcSlideNum, 335 slidesToScroll: pcSlideNum, 336 swipe: true, 337 pauseOnHover: false, 338 responsive: [ 339 { 340 breakpoint: bp1, 341 settings: { 342 slidesToShow: spSlideNum, 343 slidesToScroll: spSlideNum, 344 }, 345 }, 346 ], 347 }); 348 349 // function 350 const controlDisplay = function (_carouselNum, _pcSlideNum, _spSlideNum) { 351 const minLength = u.isRangePC() ? _pcSlideNum : _spSlideNum; 352 if (minLength >= _carouselNum) { 353 $control.hide(); 354 $play.show(); 355 } else { 356 $control.show().css('display','flex'); 357 $play.hide(); 358 } 359 if (autoplay) { 360 $play.hide(); 361 $pause.show(); 362 } else { 363 $pause.hide(); 364 $play.show(); 365 } 366 }; 367 368 if ($elm.find(c.controlElement).length !== 0) { 369 controlDisplay(carouselNum, pcSlideNum, spSlideNum); 370 let breakFlg = u.isRangeSP(); 371 u.isWindowSizeWatch(() => { 372 const checkFlg = u.isRangeSP(); 373 if (checkFlg !== breakFlg) { 374 controlDisplay(carouselNum, pcSlideNum, spSlideNum); 375 breakFlg = checkFlg; 376 } 377 }); 378 } 379 380 $elm.addClass(activeName); 381 $elm[0].style.setProperty(animationStateProperties, 'running'); 382 $numCurrent.html(($carousel.slick('slickCurrentSlide') + 1).toString().padStart(2, '0')); 383 384 $carousel.on('beforeChange', function(event, slick, currentSlide, nextSlide){ 385 $numCurrent.html((nextSlide + 1).toString().padStart(2, '0')); 386 $elm.removeClass(activeName); 387 }); 388 $carousel.on('afterChange', function(event, slick, currentSlide){ 389 animationStartTime = Date.now(); 390 timingReset = true; 391 $carousel.slick('slickSetOption', 'autoplaySpeed', indicationTime); 392 $elm.addClass(activeName); 393 }); 394 395 // control 396 $pause.on('click', function () { 397 const currentTime = Date.now(); 398 animationCurrentTime = currentTime - animationStartTime; 399 remainingTime = indicationTime - animationCurrentTime; 400 $carousel.slick('slickPause'); 401 $elm.addClass(pauseName); 402 $elm[0].style.setProperty(animationStateProperties, 'paused'); 403 $pause.hide(); 404 $play.show(); 405 timingReset = false; 406 }); 407 // control 408 $play.on('click', function () { 409 $carousel.slick('slickSetOption', 'autoplaySpeed', timingReset ? indicationTime : remainingTime); 410 $carousel.slick('slickPlay'); 411 $elm.removeClass(pauseName); 412 $elm[0].style.setProperty(animationStateProperties, 'running'); 413 $play.hide(); 414 $pause.show(); 415 }); 416} 417 418/** 419* @method topDisasterInfo 420*/
421function topDisasterInfo(config, newsData) { 422 // options 423 const c = jQuery.extend({ 424 factorElement: '.js-top-disaster-info', 425 listElement: '.js-top-disaster-info__list', 426 accTriggerElement: '.js-top-disaster-info__accordion__trigger', 427 accPanelElement: '.js-top-disaster-info__accordion__panel', 428 }, config); 429 // vars 430 const $elm = jQuery(c.factorElement); 431 const fixedName = u.state.fixed; 432 // exit 433 if ($elm.length === 0) { return false; } 434 435 const $list = $elm.find(c.listElement); 436 437 jQuery.ajax({ 438 type: "GET", 439 url: "/syougai_saigai/display_mode.json", 440 dataType: 'json' 441 }).done(function (data) { 442 const displayMode = data[0]["display_mode"]; 443 //åºå®è¡¨ç¤ºã¢ã¼ãå ´åã¯ä½ãããªã 444 //追å¾è¡¨ç¤ºã¢ã¼ãå ´åã¯ã¯ã©ã¹ã追å 445 if(displayMode === "追å¾è¡¨ç¤ºã¢ã¼ã") { 446 $elm.addClass(fixedName); 447 } 448 });; 449 450 if(newsData && newsData.length > 0) { 451 const filteredData = newsData.filter(item => 452 ["fail", "disaster", "earthquake"].includes(item.type_id) && 453 item.category.split(',').includes("kddi") 454 ); 455 if(!filteredData.length){ 456 return false; 457 } 458 filteredData.forEach(item => { 459 const {type, link, description, pubDate} = item; 460 let typeStartTag = ''; 461 let typeEndTag = ''; 462 let blankHtml = '<span class="cmn-visually-hidden">Open in a new window</span>'; 463 if(link) { 464 if (u.isPdf(link)) { 465 typeStartTag = `<a href="${link}" target="_blank" rel="noopener" class="top-disaster-info__article__type--pdf">`; 466 typeEndTag = '</a>'; 467 } else if (u.isExternal(link)) { 468 typeStartTag = `<a href="${link}" target="_blank" rel="noopener" class="top-disaster-info__article__type--blank">`; 469 typeEndTag = '</a>'; 470 } else { 471 typeStartTag = `<a href="${link}" class="top-disaster-info__article__type">`; 472 typeEndTag = '</a>'; 473 blankHtml = ''; 474 } 475 } else { 476 typeStartTag = '<div class="top-disaster-info__article__type--nolink">'; 477 typeEndTag = '</div>'; 478 blankHtml = ''; 479 } 480 const html = `<article class="top-disaster-info__article"> 481 ${typeStartTag} 482 <div class="top-disaster-info__article__category">${type}</div> 483 <time class="top-disaster-info__article__date" datetime="${u.formatDate(pubDate, 'YYYY-MM-DD')}">${u.formatDate(pubDate, 'YYYY.MM.DD')}</time> 484 <h3 class="top-disaster-info__article__title">${description}${blankHtml}</h3> 485 ${typeEndTag} 486 </article>`; 487 $list.append(html); 488 }); 489 $elm.addClass(u.state.active); 490 topAccordion({ 491 factorElement: c.factorElement, 492 triggerElement: c.accTriggerElement, 493 panelElement: c.accPanelElement, 494 panelDisplayType: 'allShow', // åæ表示è¨å®ï¼ãallHideãorãallShowã 495 }) 496 } else { 497 /* 0件æ */ 498 $elm.remove(); 499 } 500} 501 502/** 503* @method topImportantInfo 504*/ 505function topImportantInfo(config, newsData) { 506 // options 507 const c = jQuery.extend({ 508 factorElement: '.js-top-important-info', 509 listElement: '.js-top-important-info__list', 510 accTriggerElement: '.js-top-important-info__accordion__trigger', 511 accPanelElement: '.js-top-important-info__accordion__panel', 512 }, config); 513 // vars 514 const $elm = jQuery(c.factorElement); 515 // exit 516 if ($elm.length === 0) { return false; } 517 518 const $list = $elm.find(c.listElement); 519 const filteredData = newsData.filter(item => 520 item.category.split(',').includes("kddi") 521 ); 522 523 if (filteredData.length > 0) { 524 525 filteredData.forEach(item => { 526 const {type, link, description, pubDate} = item; 527 let typeStartTag = ''; 528 let typeEndTag = ''; 529 let typeClass = ''; 530 let blankHtml = '<span class="cmn-visually-hidden">Open in a new window</span>'; 531 let pdfHtml = '<span class="top-pdf-badge">PDF</span>'; 532 if(link) { 533 if (u.isPdf(link)) { 534 typeStartTag = `<a href="${link}" target="_blank" rel="noopener" class="top-important-info__article__type--pdf">`; 535 typeEndTag = '</a>'; 536 } else if (u.isExternal(link)) { 537 typeStartTag = `<a href="${link}" target="_blank" rel="noopener" class="top-important-info__article__type--blank">`; 538 typeEndTag = '</a>'; 539 pdfHtml = ''; 540 } else { 541 typeStartTag = `<a href="${link}" class="top-important-info__article__type">`; 542 typeEndTag = '</a>'; 543 blankHtml = ''; 544 pdfHtml = ''; 545 } 546 } else { 547 typeStartTag = '<div class="top-important-info__article__type--nolink">'; 548 typeEndTag = '</div>'; 549 blankHtml = ''; 550 pdfHtml = ''; 551 } 552 switch (type) { 553 case 'ç½å®³ã®å½±é¿': 554 typeClass = ' is-disaster-impact'; 555 break; 556 default: 557 break; 558 } 559 const html = `<article class="top-important-info__article"> 560 ${typeStartTag} 561 <div class="top-important-info__article__property"> 562 <time class="top-important-info__article__date" datetime="${u.formatDate(pubDate, 'YYYY-MM-DD')}">${u.formatDate(pubDate, 'YYYY.MM.DD')}</time> 563 <div class="top-important-info__article__category${typeClass}">${type}</div> 564 </div> 565 <h3 class="top-important-info__article__title">${description}${pdfHtml}${blankHtml}</h3> 566 ${typeEndTag} 567 </article>`; 568 $list.append(html); 569 });
570 $elm.addClass(u.state.active); 571 topAccordion({ 572 factorElement: c.factorElement, 573 triggerElement: c.accTriggerElement, 574 panelElement: c.accPanelElement, 575 panelDisplayType: 'allShow', // åæ表示è¨å®ï¼ãallHideãorãallShowã 576 }) 577 } else { 578 /* 0件æ */ 579 $elm.remove(); 580 } 581} 582 583/** 584 * @method topScrollAnimation 585 */ 586function topScrollAnimation(config) { 587 // options 588 const c = jQuery.extend({ 589 factorElement: '.js-top-scroll-animation', 590 childElement: '.js-top-scroll-animation__child', 591 }, config); 592 // vars 593 const $elm = jQuery(c.factorElement); 594 const showName = u.state.show; 595 const triggerRatio = 0.1; 596 const windowHeight = window.innerHeight; 597 const triggerPoint = windowHeight - windowHeight * triggerRatio; 598 const orderAttr = 'data-scroll-animation-order'; 599 // exit 600 if ($elm.length === 0) { return false; } 601 602 function scrollControl() { 603 // åè¦ç´ ã®positionãæ ¼ç´ããé åãä½æ 604 const groupByPosition = []; 605 606 $elm.each(function () { 607 const $child = jQuery(this).find(c.childElement); 608 const elementTop = this.getBoundingClientRect().top; 609 610 // è¦ç´ ã®ä½ç½®ãä¸è´ããã°ã«ã¼ããæ¢ã 611 let group = groupByPosition.find(g => g.position === elementTop); 612 613 if (!group) { 614 group = { position: elementTop, elements: [] }; 615 groupByPosition.push(group); 616 } 617 618 // $childãããå ´åã並ã³æ¿ã 619 if ($child.length > 0) { 620 // $childã並ã³æ¿ãã 621 const sortedChildren = $child.toArray().sort((a, b) => { 622 const orderA = jQuery(a).attr(orderAttr); 623 const orderB = jQuery(b).attr(orderAttr); 624 625 const isNumericA = orderA !== undefined && !isNaN(orderA); 626 const isNumericB = orderB !== undefined && !isNaN(orderB); 627 628 if (isNumericA && isNumericB) { 629 return parseInt(orderA) - parseInt(orderB); 630 } else if (isNumericA) { 631 return -1; 632 } else if (isNumericB) { 633 return 1; 634 } else { 635 return 0; 636 } 637 }); 638 639 group.elements.push(...sortedChildren); 640 } else { 641 group.elements.push(this); 642 } 643 }); 644 645 // ä¸è¾ºä½ç½®ãåãè¦ç´ ãã°ã«ã¼ãåããã°ã«ã¼ããã¨ã«é çªã«addClassãå®è¡ 646 groupByPosition.sort((a, b) => a.position - b.position); // ä¸è¾ºä½ç½®ã§ã½ã¼ã 647 648 groupByPosition.forEach((group, index) => { 649 const groupElements = group.elements; 650 if (group.position <= triggerPoint) { 651 groupElements.forEach((element, index) => { 652 setTimeout(() => { 653 jQuery(element).addClass(showName); 654 }, index * 100); 655 }); 656 } 657 }); 658 } 659 scrollControl(); 660 u.$win.on('scroll', () => { 661 scrollControl(); 662 }); 663} 664 665 666/** 667* @method topNewsTab 668*/ 669function topNewsTab(config, newsReleaseData, irNewsData) { 670 // options 671 const c = jQuery.extend({ 672 factorElement: '.js-top-news-tab', 673 naviElement: '.js-top-news-tab__navi', 674 triggerElement: '.js-top-news-tab__trigger', 675 listElement: '.js-top-news-tab__list', 676 panelElement: '.js-top-news-tab__panel', 677 scrollAnimationElement: '.js-top-news-tab__scroll-animation', 678 scrollAnimationChildElement: '.js-top-news-tab__scroll-animation__child', 679 }, config); 680 // vars 681 const $elm = jQuery(c.factorElement); 682 // exit 683 if ($elm.length === 0) { return false; } 684 685 const $navi = $elm.find(c.naviElement); 686 const $list = $elm.find(c.listElement); 687 const category = { 688 newsRelease : { 689 name: 'News Release', 690 category: 'newsrelease', 691 tabName: 'tab-news-release' 692 }, 693 topics : { 694 name: 'IR News', 695 category: 'ir', 696 tabName: 'tab-ir-news' 697 } 698 } 699 const maxLength = 4; 700 701 if((newsReleaseData && newsReleaseData.length > 0) || (irNewsData && irNewsData.length > 0)) { 702 703 const createTabPanel = function(_data,_category,displayTag) { 704 let articleHtml = '' 705 let linkHtml = '' 706 const {name, category, tabName} = _category; 707 708 _data.forEach((elm,index) => { 709 if(index >= maxLength) { return false; } 710 const {title, link, link_target, tags, pubDate} = elm; 711 let typeStartTag = ''; 712 let typeEndTag = ''; 713 let blankHtml = '<span class="cmn-visually-hidden">Open in a new window</span>'; 714 let pdfHtml = '<span class="top-pdf-badge">PDF</span>'; 715 if(link) { 716 if (u.isPdf(link)) { 717 typeStartTag = `<a href="${link}" target="_blank" rel="noopener" class="top-news-tab__article__type--pdf">`; 718 typeEndTag = '</a>'; 719 } else if (link_target === 'blank') { 720 typeStartTag = `<a href="${link}" target="_blank" rel="noopener" class="top-news-tab__article__type--blank">`; 721 typeEndTag = '</a>'; 722 pdfHtml = ''; 723 } else { 724 typeStartTag = `<a href="${link}" class="top-news-tab__article__type">`; 725 typeEndTag = '</a>'; 726 blankHtml = ''; 727 pdfHtml = ''; 728 } 729 } else { 730 typeStartTag = '<div class="top-news-tab__article__type--nolink">'; 731 typeEndTag = '</div>'; 732 blankHtml = ''; 733 pdfHtml = ''; 734 } 735 function tagHtml(_tags) { 736 let tagList = '' 737 if(displayTag && _tags.length > 0) { 738 tagList += '<ul class="top-news-tab__article__category">';
739 _tags.forEach(item => { 740 tagList += `<li>${item}</li>`; 741 }); 742 tagList += '</ul>'; 743 } else { 744 tagList = ''; 745 } 746 return tagList; 747 } 748 articleHtml += `<article class="top-news-tab__article ${c.scrollAnimationChildElement.split('.')[1]}"> 749 ${typeStartTag} 750 <h3 class="top-news-tab__article__title">${title}${pdfHtml}</h3> 751 <div class="top-news-tab__article__property"> 752 ${tagHtml(tags)} 753 <time class="top-news-tab__article__date">${pubDate}</time> 754 </div> 755 ${blankHtml} 756 ${typeEndTag} 757 </article>`; 758 }); 759 760 if (category === 'ir') { 761 linkHtml = `<div class="top-news__link js-top-news-tab__scroll-animation"> 762 <div class="top-view-all"> 763 <a href="https://newsroom.kddi.com/english/ir-news/" class="top-view-all__type" aria-label="Go to ${name}"><span class="top-view-all__label">View All</span></a> 764 </div> 765 </div> 766 <div class="top-news__rss js-top-news-tab__scroll-animation"> 767 <div class="top-rss"> 768 <a href="https://newsroom.kddi.com/english/ir-news/rss.xml" target="_blank" rel="noopener" class="top-rss__type"><span class="top-rss__label">RSS</span><span class="cmn-visually-hidden">Open in a new window</span></a> 769 </div> 770 </div>`; 771 } 772 else { 773 linkHtml = `<div class="top-news__link js-top-news-tab__scroll-animation"> 774 <div class="top-view-all"> 775 <a href="https://newsroom.kddi.com/english/news/index?category=${category}" class="top-view-all__type" aria-label="Go to ${name}"><span class="top-view-all__label">View All</span></a> 776 </div> 777 </div> 778 <div class="top-news__rss js-top-news-tab__scroll-animation"> 779 <div class="top-rss"> 780 <a href="https://newsroom.kddi.com/english/news/newsrelease.xml" target="_blank" rel="noopener" class="top-rss__type"><span class="top-rss__label">RSS</span><span class="cmn-visually-hidden">Open in a new window</span></a> 781 </div> 782 </div>`; 783 } 784 const html = `<div id="${tabName}" class="top-news-tab__panel ${c.panelElement.split('.')[1]}" aria-hidden="true" inert>${articleHtml}${linkHtml}</div>`; 785 $list.append(html); 786 }; 787 788 // --- News Release (JSONPâ ) --- 789 function formatNewsReleaseDate(date_time) { 790 try { 791 if (!date_time) return ''; 792 const d = new Date(date_time); 793 return d.toLocaleDateString('en-US', { 794 year: 'numeric', 795 month: 'long', 796 day: 'numeric' 797 }); 798 } catch (e) { 799 return ''; 800 } 801 } 802 803 if (newsReleaseData && newsReleaseData.length > 0) { 804 const mappedNewsRelease = newsReleaseData.map(item => { 805 return { 806 title: item.title, 807 link: item.link, 808 pubDate: formatNewsReleaseDate(item.pubDate), 809 link_target: item.link_target, 810 tags: item.tags || [] 811 }; 812 }); 813 814 $navi.append(`<li class="${c.scrollAnimationChildElement.split('.')[1]}"><button type="button" class="top-news-tab__button ${c.triggerElement.split('.')[1]}" aria-expanded="false" aria-controls="${category.newsRelease.tabName}">${category.newsRelease.name}</button></li>`); 815 createTabPanel(mappedNewsRelease, category.newsRelease, true); 816 } 817 818 // --- IR News (JSONPâ¡) --- 819 if ((irNewsData && irNewsData.length > 0)) { 820 // JSONPâ¡ â JSONPâ å½¢å¼ã«å¤æ 821 const mappedTopics = irNewsData.map(item => ({ 822 title: item.title, 823 link: item.url, 824 pubDate: item.date, // ãã®ã¾ã¾å©ç¨ï¼"September 4,2025"ï¼ 825 link_target: (item.link_type === '詳細ãã¼ã¸' || item.link_type === 'å é¨ãªã³ã¯' ? 'self' : 'blank'), 826 tags: item.category_label ? [item.category_label] : [] 827 })); 828 829 $navi.append(`<li class="${c.scrollAnimationChildElement.split('.')[1]}"><button type="button" class="top-news-tab__button ${c.triggerElement.split('.')[1]}" aria-expanded="false" aria-controls="${category.topics.tabName}">${category.topics.name}</button></li>`);
830 createTabPanel(mappedTopics, category.topics, true); // ã¿ã°è¡¨ç¤ºãæå¹ã« 831 } 832 833 $elm.addClass(u.state.active); 834 topTabs({ 835 factorElement: c.factorElement, 836 naviElement: c.naviElement, 837 triggerElement: c.triggerElement, 838 panelElement: c.panelElement, 839 }) 840 topScrollAnimation({ 841 factorElement: c.scrollAnimationElement, 842 childElement: c.scrollAnimationChildElement, 843 }) 844 } else { 845 /* 0件æ */ 846 $elm.remove(); 847 topScrollAnimation({ 848 factorElement: c.scrollAnimationElement, 849 childElement: c.scrollAnimationChildElement, 850 }) 851 } 852} 853 854 855 856 857/** 858* @method topNewsCarousel 859*/ 860function topNewsCarousel(config) { 861 // options 862 const c = jQuery.extend({ 863 factorElement: '.js-top-news-carousel', 864 detailElement: '.js-top-news-carousel__detail', 865 imageElement: '.js-top-news-carousel__image', 866 controlElement: '.js-top-news-carousel__control', 867 arrowElement: '.js-top-news-carousel__arrow', 868 pauseElement: '.js-top-news-carousel__pause', 869 playElement: '.js-top-news-carousel__play', 870 numCurrentElement: '.js-top-news-carousel__number__current', 871 numTotalElement: '.js-top-news-carousel__number__total', 872 }, config); 873 // vars 874 const $elm = jQuery(c.factorElement); 875 // exit 876 if ($elm.length === 0) { return false; } 877 878 // vars 879 const $carouselArea = $elm.find(`${c.detailElement}, ${c.imageElement}`); 880 const $detailCarousel = $elm.find(c.detailElement); 881 const $imageCarousel = $elm.find(c.imageElement); 882 const $control = $elm.find(c.controlElement); 883 const $pause = $elm.find(c.pauseElement); 884 const $play = $elm.find(c.playElement); 885 const $numCurrent = $elm.find(c.numCurrentElement); 886 const $numTotal = $elm.find(c.numTotalElement); 887 const carouselNum = $imageCarousel.find('.swiper-wrapper > *').length; 888 const pcSlideNum = 1; 889 const spSlideNum = 1; 890 const bp1 = u.breakPoint1 + 1; 891 const autoplay = true; 892 const activeName = u.state.active; 893 const pauseName = 'is-pause'; 894 const indicationTimePropertie = '--top-news-carousel-indication-time' 895 const animationStatePropertie = '--top-news-carousel-animation-state' 896 const indicationTime = Number(getComputedStyle($elm[0]).getPropertyValue(indicationTimePropertie).trim().split('ms')[0]); 897 const speed = 500; 898 let animationStartTime = 0; 899 let animationCurrentTime = 0; 900 let remainingTime = 0; 901 let timingReset = false; 902 let imageSwiper; 903 let detailSwiper; 904 if(carouselNum > (u.isRangePC() ? pcSlideNum : spSlideNum)) { 905 906 $numTotal.html(carouselNum.toString().padStart(2, '0')); 907 908 function swiperInit(){ 909 if(imageSwiper){ 910 $imageCarousel.addClass('is-reinit') 911 imageSwiper.destroy(true, true); 912 } 913 if(detailSwiper){ 914 detailSwiper.destroy(true, true); 915 } 916 917 // imageSwiper 918 imageSwiper = new Swiper($imageCarousel[0], { 919 slidesPerView: 'auto', 920 slidesPerGroup: 1, 921 centeredSlides: false, 922 speed: speed, 923 loop: true, 924 loopAdditionalSlides: 1, 925 spaceBetween: 24, 926 allowTouchMove: true, 927 autoplay: { 928 delay: indicationTime, 929 disableOnInteraction: false 930 }, 931 navigation: { 932 prevEl: `${c.arrowElement}.swiper-prev`, 933 nextEl: `${c.arrowElement}.swiper-next`, 934 }, 935 slideToClickedSlide: true, 936 followFinger: true, 937 breakpoints: { 938 [bp1]: { 939 centeredSlides: true, 940 spaceBetween: 40, 941 followFinger: false, 942 }, 943 }, 944 on: { 945 init: function () { 946 animationStartTime = Date.now(); 947 $elm.addClass(activeName); 948 $elm[0].style.setProperty(animationStatePropertie, 'running'); 949 $numCurrent.html((this.realIndex + 1).toString().padStart(2, '0')); 950 }, 951 afterInit: function (self) { 952 jQuery(`${c.arrowElement}.swiper-prev`).attr('aria-label', 'åã¸'); 953 jQuery(`${c.arrowElement}.swiper-next`).attr('aria-label', '次ã¸'); 954 955 jQuery(self.slides).find('[class*="__type"]').on('click', function(e){
956 if(!jQuery(this).closest('.swiper-slide').hasClass('swiper-slide-active')) { 957 e.preventDefault(); 958 } 959 }); 960 jQuery(self.$el[0]).removeClass('is-reinit'); 961 jQuery(self.$el[0]).addClass('is-afterInit'); 962 }, 963 imagesReady: function (self) { 964 jQuery(self.$el[0]).addClass('is-imagesReady'); 965 }, 966 slideChangeTransitionStart: function () { 967 const nextSlideIndex = this.realIndex + 1; 968 $numCurrent.html((nextSlideIndex).toString().padStart(2, '0')); 969 $elm.removeClass(activeName); 970 animationStartTime = Date.now(); 971 timingReset = true; 972 this.params.autoplay.delay = indicationTime; 973 $elm.addClass(activeName); 974 }, 975 }, 976 }); 977 imageSwiper.on('slideChange', function () { 978 detailSwiper.slideToLoop(imageSwiper.realIndex); 979 }); 980 981 imageSwiper.on('click', function () { 982 let clickedIndex = imageSwiper.clickedIndex % carouselNum; 983 984 imageSwiper.slideToLoop(clickedIndex); 985 if($elm.hasClass(pauseName)) { 986 detailSwiper.autoplay.stop(); 987 imageSwiper.autoplay.stop(); 988 } else { 989 detailSwiper.params.autoplay.delay = indicationTime; 990 detailSwiper.autoplay.start(); 991 imageSwiper.params.autoplay.delay = indicationTime; 992 imageSwiper.autoplay.start(); 993 } 994 }); 995 996 // detailSwiper 997 detailSwiper = new Swiper($detailCarousel[0], { 998 slidesPerView: 1, 999 slidesPerGroup: 1, 1000 speed: speed, 1001 loop: true, 1002 allowTouchMove: false, 1003 effect: "fade", 1004 fadeEffect: { 1005 crossFade: true 1006 }, 1007 autoplay: { 1008 delay: indicationTime, 1009 disableOnInteraction: false 1010 }, 1011 thumbs: { 1012 swiper: imageSwiper, 1013 }, 1014 on: { 1015 slideChangeTransitionStart: function () { 1016 this.params.autoplay.delay = indicationTime; 1017 }, 1018 }, 1019 }); 1020 detailSwiper.on('slideChange', function () { 1021 imageSwiper.slideToLoop(detailSwiper.realIndex); 1022 }); 1023 } 1024 swiperInit() 1025 1026 $carouselArea.on('mouseenter', function() { 1027 if(!$elm.hasClass(pauseName)) { 1028 const currentTime = Date.now(); 1029 animationCurrentTime = currentTime - animationStartTime; 1030 remainingTime = indicationTime - animationCurrentTime; 1031 detailSwiper.autoplay.stop(); 1032 imageSwiper.autoplay.stop(); 1033 $elm[0].style.setProperty(animationStatePropertie, 'paused'); 1034 timingReset = false; 1035 } 1036 }).on('mouseleave', function() { 1037 if(!$elm.hasClass(pauseName)) { 1038 detailSwiper.params.autoplay.delay = timingReset ? indicationTime : remainingTime + 1000; 1039 detailSwiper.autoplay.start(); 1040 imageSwiper.params.autoplay.delay = timingReset ? indicationTime : remainingTime + 1000; 1041 imageSwiper.autoplay.start(); 1042 $elm[0].style.setProperty(animationStatePropertie, 'running'); 1043 } 1044 }); 1045 1046 1047 // control 1048 $pause.on('click', function () { 1049 const currentTime = Date.now(); 1050 animationCurrentTime = currentTime - animationStartTime; 1051 remainingTime = indicationTime - animationCurrentTime; 1052 detailSwiper.autoplay.stop(); 1053 imageSwiper.autoplay.stop(); 1054 $elm.addClass(pauseName); 1055 $elm[0].style.setProperty(animationStatePropertie, 'paused'); 1056 $pause.hide(); 1057 $play.show(); 1058 timingReset = false; 1059 }); 1060 // control 1061 $play.on('click', function () { 1062 detailSwiper.params.autoplay.delay = timingReset ? indicationTime : remainingTime; 1063 detailSwiper.autoplay.start(); 1064 imageSwiper.params.autoplay.delay = timingReset ? indicationTime : remainingTime; 1065 imageSwiper.autoplay.start(); 1066 $elm.removeClass(pauseName); 1067 $elm[0].style.setProperty(animationStatePropertie, 'running'); 1068 $play.hide(); 1069 $pause.show(); 1070 });
1071 } 1072 1073 // function 1074 const controlDisplay = function (_carouselNum, _pcSlideNum, _spSlideNum) { 1075 const minLength = u.isRangePC() ? _pcSlideNum : _spSlideNum; 1076 if (minLength >= _carouselNum) { 1077 $control.hide(); 1078 $play.show(); 1079 } else { 1080 $control.show().css('display','flex'); 1081 $play.hide(); 1082 } 1083 if (autoplay) { 1084 $play.hide(); 1085 $pause.show(); 1086 } else { 1087 $pause.hide(); 1088 $play.show(); 1089 } 1090 }; 1091 1092 if ($elm.find(c.controlElement).length !== 0) { 1093 controlDisplay(carouselNum, pcSlideNum, spSlideNum); 1094 let breakFlg = u.isRangeSP(); 1095 u.isWindowSizeWatch(() => { 1096 const checkFlg = u.isRangeSP(); 1097 if(!u.isRangeSP()){ 1098 swiperInit(); 1099 } 1100 if (checkFlg !== breakFlg) { 1101 controlDisplay(carouselNum, pcSlideNum, spSlideNum); 1102 breakFlg = checkFlg; 1103 } 1104 }); 1105 } 1106} 1107 1108/** 1109* @method topTsunaguAnimation 1110*/ 1111function topTsunaguAnimation(config) { 1112 // options 1113 const c = jQuery.extend({ 1114 factorElement: '.js-top-tsunagu-animation', 1115 containerElement: '.js-top-tsunagu-animation__container', 1116 item01Element: '.js-top-tsunagu-animation__item--01', 1117 item02Element: '.js-top-tsunagu-animation__item--02', 1118 item03Element: '.js-top-tsunagu-animation__item--03', 1119 item04Element: '.js-top-tsunagu-animation__item--04', 1120 item05Element: '.js-top-tsunagu-animation__item--05', 1121 item06Element: '.js-top-tsunagu-animation__item--06', 1122 item07Element: '.js-top-tsunagu-animation__item--07', 1123 item08Element: '.js-top-tsunagu-animation__item--08', 1124 item09Element: '.js-top-tsunagu-animation__item--09', 1125 }, config); 1126 // vars 1127 const $elm = jQuery(c.factorElement); 1128 // exit 1129 if ($elm.length === 0) { return false; } 1130 1131 // vars 1132 let timeline; 1133 let breakFlg = u.isRangeSP(); 1134 let topTsunaguAnimationFlag = $.cookie('topTsunaguAnimation'); 1135 1136 function timelineInit() { 1137 if (u.isRangePC()) { 1138 if(!timeline && topTsunaguAnimationFlag == undefined) { 1139 // åæè¨å® 1140 gsap.set(c.containerElement, { 1141 width: '300vw', 1142 }); 1143 gsap.set(c.item01Element, { 1144 height: `calc(100vh - 48px)`, 1145 maxHeight: 'calc(100vh - 48px)', 1146 }); 1147 gsap.set(`${c.item01Element} > [class*="__type"]`, { 1148 width: '100%' 1149 }); 1150 gsap.set([c.item02Element, c.item03Element, c.item04Element, c.item05Element], { 1151 scale: 1.27, 1152 }); 1153 gsap.set([c.item06Element, c.item07Element, c.item08Element, c.item09Element], { 1154 y: '10vh', 1155 opacity: 0 1156 }); 1157 1158 //ã¿ã¤ã ã©ã¤ã³ 1159 timeline = gsap.timeline({ 1160 scrollTrigger: { 1161 trigger: c.factorElement, 1162 start: "top 24px", 1163 end: "bottom bottom", 1164 scrub: true, 1165 pin: true, 1166 pinSpacing: false, 1167 once: true, 1168 onUpdate: (self) => { 1169 const childHeight = Number(self.pin.children[0].clientHeight); 1170 if (self.progress === 1) { 1171 $.cookie('topTsunaguAnimation', 'done'); 1172 gsap.set(self.pin, { height: childHeight, transform: 'none' }); 1173 gsap.set(self.pin.parentNode, { height: childHeight }); 1174 // ã¹ã¯ãã¼ã«ä½ç½®ãåºå® 1175 window.scrollTo({ 1176 top: self.start, 1177 behavior: "instant", 1178 }); 1179 1180 if (u.url.indexOf('#') !== -1 && jQuery(u.hash).offset() !== undefined) { 1181 const selfOffset = jQuery(c.factorElement).offset().top; 1182 const hashOffset = jQuery(u.hash).offset().top; 1183 1184 if (hashOffset > selfOffset) { 1185 setTimeout(() => { 1186 topSmoothScroll({ target: u.hash }); 1187 }, 500); 1188 } 1189 } 1190 } 1191 }, 1192 } 1193 }) 1194 .to(`${c.item01Element} > [class*="__type"]`, { 1195 width: '55%', 1196 duration: 1 1197 }) 1198 .addLabel('phase2') 1199 .to(c.containerElement, { 1200 width: '100%', 1201 duration: 1 1202 }, 'phase2') 1203 .to(c.item01Element, { 1204 height: '44.5vw', 1205 maxHeight: '611px', 1206 duration: 1 1207 }, 'phase2') 1208 .to(`${c.item01Element} > [class*="__type"]`, { 1209 width: '100%', 1210 duration: 1 1211 }, 'phase2') 1212 .addLabel('phase3') 1213 .to(c.item02Element, { 1214 scale: 1, 1215 duration: 1 1216 }, 'phase3') 1217 .to(c.item03Element, { 1218 scale: 1, 1219 duration: 1 1220 }, 'phase3') 1221 .to(c.item04Element, { 1222 scale: 1, 1223 duration: 1 1224 }, 'phase3') 1225 .to(c.item05Element, { 1226 scale: 1, 1227 duration: 1 1228 }, 'phase3') 1229 .to([c.item06Element, c.item07Element, c.item08Element, c.item09Element], { 1230 y: 0, 1231 opacity: 1, 1232 duration: 2 1233 }, 'phase3'); 1234 } else if(topTsunaguAnimationFlag !== undefined) { 1235 $elm.addClass('is-animated'); 1236 } 1237 } else { 1238 // PC以å¤ã®å ´åãGSAPã¿ã¤ã ã©ã¤ã³ãåå¨ããã°ç ´æ£ãã 1239 if (timeline) { 1240 timeline.scrollTrigger.kill(); // ScrollTriggerã®ç ´æ£ 1241 timeline.kill(); // ã¿ã¤ã ã©ã¤ã³ã®ç ´æ£ 1242 timeline = null; // ã¿ã¤ã ã©ã¤ã³å¤æ°ãnullã«ãã 1243 1244 // styleå±æ§ãåé¤ 1245 const elementsToRemoveStyle = [ 1246 c.factorElement, 1247 c.containerElement, 1248 c.item01Element, 1249 c.item02Element, 1250 c.item03Element, 1251 c.item04Element, 1252 c.item05Element, 1253 c.item06Element, 1254 c.item07Element, 1255 c.item08Element, 1256 c.item09Element, 1257 `${c.item01Element} > [class*="__type"]` 1258 ]; 1259 1260 elementsToRemoveStyle.forEach(selector => { 1261 jQuery(selector).removeAttr('style'); 1262 }); 1263 } 1264 } 1265 } 1266 timelineInit(); 1267
1268 // 対象ã¨ãªãè¦ç´ ï¼ãã®å ´å㯠bodyï¼ 1269 const target = document.body; 1270 // ResizeObserver ãä½æ 1271 const resizeObserver = new ResizeObserver(entries => { 1272 for (let entry of entries) { 1273 const height = entry.contentRect.height; 1274 // æ¢åã®ã¢ãã¡ã¼ã·ã§ã³ãç ´æ£ 1275 if (timeline) { 1276 timeline.scrollTrigger.kill(); 1277 timeline.kill(); 1278 timeline = null; 1279 } 1280 timelineInit(); 1281 } 1282 }); 1283 resizeObserver.observe(target); 1284 1285 u.isWindowSizeWatch(() => { 1286 const checkFlg = u.isRangeSP(); 1287 if (checkFlg !== breakFlg) { 1288 timelineInit(); 1289 breakFlg = checkFlg; 1290 } 1291 }); 1292} 1293 1294/** 1295* @method topSmoothScroll 1296*/ 1297function topSmoothScroll(config) { 1298 // options 1299 const c = jQuery.extend({ 1300 factorElement: 'a[href^="#"],a[href^="/#"], a[href^="/english/#"], area[href*="#"]', 1301 escapeElement: 'a[href="#"], area[href="#"], a[href^="#acc"], a[href^="#tab"], a[href^="#modal"], a[aria-controls], .js-esc-smooth-scroll', 1302 escapeHash: /^#(acc|tab)-/, 1303 topmostElement: '#headerLogo', // ãã¼ã¸ããããªã³ã¯ã«è¨å®ããè¦ç´ ï¼hrefã®å¤ï¼ 1304 scrollSpeed: 300, 1305 easingType: 'swing', 1306 target: false, 1307 }, config); 1308 // vars 1309 const $elm = jQuery(c.factorElement).not(c.escapeElement); 1310 // exit 1311 if ($elm.length === 0) { return false; } 1312 1313 // vars 1314 const $header = jQuery(c.topmostElement); 1315 const nofixClass = 'js-smoothScroll_nofix'; 1316 const bodyNofixClass = 'is-header-nofix'; 1317 const topmost = c.topmostElement; 1318 const speed = c.scrollSpeed; 1319 const easing = c.easingType; 1320 const headerHeight = getComputedStyle(document.documentElement).getPropertyValue('--header-height'); 1321 const headerHeightNum = Number(headerHeight.replace('px', '')); 1322 let suitableGap; 1323 1324 // function 1325 const jumpMove = function (TARGET) { 1326 let position = TARGET.offset().top; 1327 let fixH; 1328 // é·ç§»ç¡å¹ 1329 if (position === undefined) { 1330 return false; 1331 } 1332 if ($header.hasClass(nofixClass) || jQuery('body').hasClass(bodyNofixClass)) { 1333 fixH = 0; 1334 } else { 1335 fixH = headerHeightNum; 1336 } 1337 if (u.isRangeSP()) { 1338 suitableGap = 10; 1339 } else { 1340 suitableGap = 10; 1341 } 1342 // ã¢ã³ã«ã¼ä½ç½®è¨å® 1343 position = position - fixH - suitableGap; 1344 if (u.hash === topmost) { 1345 position = 0; 1346 } 1347 // ã¹ã ã¼ã¹ç§»å 1348 jQuery('html, body').animate({ 1349 scrollTop: position, 1350 }, speed, easing); 1351 1352 // ã¢ã³ã«ã¼ãªã³ã¯å¾ã®tabãã©ã¼ã«ã¹å¶å¾¡ 1353 if (!u.isBrowser('safari')) { 1354 TARGET.attr('tabindex', '-1').focus().removeAttr('tabindex'); 1355 } else { 1356 TARGET.attr('tabindex', '-1').focus().removeAttr('tabindex').blur(); 1357 } 1358 }; 1359 if (!c.target) { 1360 // controlï¼ãã¼ã¸å ã¢ã³ã«ã¼ç§»åå¶å¾¡ 1361 $elm.on('click', function (e) { 1362 const self = jQuery(this); 1363 let thisHref = (self.attr('href') !== topmost) ? self.attr('href') : 'body'; 1364 if (thisHref.startsWith("/english/#")) { 1365 thisHref = thisHref.replace("/english/", ""); 1366 } 1367 const $target = jQuery(thisHref); 1368 // é·ç§»ç¡å¹ 1369 if ($target.offset() === undefined) { 1370 e.preventDefault(); 1371 return false; 1372 } 1373 jumpMove($target); 1374 // ç¡å¹å 1375 return false; 1376 }); 1377 // controlï¼ãã¼ã¸é·ç§»ï¼ã¢ã³ã«ã¼ç§»åå¶å¾¡ 1378 if (u.url.indexOf('#') !== -1 && jQuery(u.hash).offset() !== undefined) { 1379 if (!u.hash.match(c.escapeHash)) { 1380 const $target = jQuery(u.hash); 1381 setTimeout(() => { 1382 jumpMove($target); 1383 }, 500); 1384 } 1385 } 1386 } else { 1387 // controlï¼ä»JSããã®ãã¼ã¸å ã¢ã³ã«ã¼ç§»åå¶å¾¡ 1388 if (!c.target.match(c.escapeHash)) { 1389 const $target = jQuery(c.target); 1390 jumpMove($target); 1391 } 1392 // ç¡å¹å 1393 return false; 1394 } 1395} 1396 1397 1398/** 1399* @method getJsonpCommon 1400*/ 1401function getJsonpCommon() { 1402 // JSONPãkddi_important_s.jsããåå¾ 1403 jQuery.ajax({ 1404 type: "GET", 1405 url: "https://news.kddi.com/important/news/js/kddi_important_s.js", 1406 dataType: 'jsonp', 1407 jsonpCallback: 'callback' 1408 }).done(function (data) { 1409 topDisasterInfo({}, data.items); 1410 topImportantInfo({}, data.items); 1411 }).fail(function () { 1412 // JSONPãã¼ã¿ã®åå¾ã«å¤±æããå ´åã®å¦ç 1413 topDisasterInfo(); 1414 topImportantInfo(); 1415 }); 1416 1417 // JSONPã/english/news/jsonp/kddi_news_release.jsãã/english/ir-news/json/list.jsããåå¾ 1418 const getNewsRelease = jQuery.ajax({ 1419 type: "GET", 1420 url: "https://newsroom.kddi.com/english/news/jsonp/kddi_news_release.js", 1421 dataType: 'jsonp', 1422 jsonpCallback: 'callback3' 1423 }); 1424 const getIrNews = jQuery.ajax({ 1425 type: "GET", 1426 url: "https://newsroom.kddi.com/english/ir-news/json/list.js", 1427 dataType: 'jsonp', 1428 jsonpCallback: 'callbackList' 1429 }); 1430 jQuery.when( 1431 getNewsRelease, 1432 getIrNews 1433 ).done(function (data1, data2) { 1434 const dataNewsRelease = (data1 && data1[0] && data1[0].items) ? data1[0].items : []; 1435 1436 let dataIrNews = []; 1437 const irRaw = (data2 && data2[0]) ? data2[0] : null; 1438 1439 if (Array.isArray(irRaw)) { 1440 irRaw.forEach(yearObj => { 1441 if (yearObj && typeof yearObj === 'object') {
1442 Object.keys(yearObj).forEach(yearKey => { 1443 const items = yearObj[yearKey]; 1444 if (Array.isArray(items) && items.length > 0) { 1445 dataIrNews = dataIrNews.concat(items); 1446 } 1447 }); 1448 } 1449 }); 1450 } 1451 topNewsTab({}, dataNewsRelease, dataIrNews); 1452 }).fail(function () { 1453 topNewsTab(); 1454 }); 1455} 1456 1457/** 1458 * @execution 1459 */ 1460jQuery(() => { 1461 'use strict'; 1462 1463 // onReady 1464 respondBrowser(); 1465 topHero(); 1466 1467 // jsonpèªã¿è¾¼ã¿ 1468 getJsonpCommon(); 1469}); 1470u.$win.on('load', () => { 1471 'use strict'; 1472 1473 // onLoad 1474 topAccordion(); 1475 topTabs(); 1476 topScrollAnimation(); 1477 topNewsCarousel(); 1478 topTsunaguAnimation(); 1479 topSmoothScroll(); 1480});
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.