1'use strict'; 2const documentBODY = document.querySelector('html'); 3let scrollEffect = null; 4let smoothScroll = null; 5const mqlPc = window.matchMedia('(min-width: 767px)'); 6const mqlMobile = window.matchMedia('(max-width: 768px)'); 7let cvfix = null; 8let movieModal = null; 9let modalInit = null; 10 11const keyName = 'visited'; 12const keyValue = true; 13 14// smooth scroll 15const setSmoothScroll = () => { 16 smoothScroll = new SCROLL_MODULE('[href^="#"]', { 17 duration: 1000, 18 }); 19}; 20 21// scrolleffect 22const setScrollEffect = () => { 23 scrollEffect = new SCROLL_EFFECT_MODULE({ 24 elem: '.js-animation', 25 firstElem: '.js-hero-animation', 26 displayRatio: 0.8, 27 firstDelaySteps: 0, 28 }); 29}; 30 31// modal 32const modal = () => { 33 const target = document.querySelector('[data-modal]'); 34 let modalVersion = null; 35 36 if (!target) { 37 return; 38 } 39 40 const _template_function_advanced = function (type, data, dataAll, elemOpen, elem) { 41 let _html = ''; 42 43 if (target.classList.contains('p-movie_in-panel')) { 44 modalVersion = 'movie'; 45 } else { 46 modalVersion = 'normal'; 47 } 48 49 if (modalVersion === 'movie') { 50 // åç»ãã¼ã¸ã®å ´å 51 52 _html = 53 '\n <section class="m-modal {{ defaultClassName }}" id="{{ id }}" data-modal-type>\n <div class="m-modal__bg {{ defaultClassName }}__bg"></div>\n <div class="m-modal__content {{ defaultClassName }}__content is-chara_movie swiper">\n {{ content }}\n </div>\n <div class="m-modal__close-btn {{ defaultClassName }}__close-btn" data-modal-ui-close></div>\n </section>'; 54 } else { 55 _html = 56 '\n <section class="m-modal {{ defaultClassName }}" id="{{ id }}" data-modal-type>\n <div class="m-modal__bg {{ defaultClassName }}__bg"></div>\n <div class="m-modal__content {{ defaultClassName }}__content swiper">\n {{ content }}\n </div>\n <div class="m-modal__close-btn {{ defaultClassName }}__close-btn" data-modal-ui-close></div>\n </section>'; 57 } 58 59 return _html; 60 }; 61 62 const _template = 63 '\n<section class="m-modal {{ defaultClassName }}" id="{{ id }}" data-modal-type>\n <div class="m-modal__bg {{ defaultClassName }}__bg"></div>\n <div class="m-modal__content {{ defaultClassName }}__content swiper">\n {{ content }}\n </div>\n <div class="m-modal__close-btn {{ defaultClassName }}__close-btn" data-modal-ui-close></div>\n</section>'; 64 65 modalInit = new MODAL_MODULE({ 66 // customModalHtml: _template, 67 customModalHtml: _template_function_advanced, 68 defaultClassName: 'm-wb-modal', 69 focus: false, 70 on: { 71 prepOpen: function (data, target, state, elem) { 72 documentBODY.classList.add('is-wb-fixed'); 73 }, 74 75 beforeClose: function () { 76 documentBODY.classList.remove('is-wb-fixed'); 77 }, 78 }, 79 }); 80}; 81 82// chara slide 83const charaSlider = () => { 84 let thumbSlide = null; 85 const thumbWrap = document.querySelector('.p-top_chara-pagination'); 86 87 if (thumbWrap) { 88 thumbSlide = new Swiper('.p-top_chara-pagination', { 89 speed: 500, 90 loop: false, 91 slideActiveClass: 'is-active', 92 slidePrevClass: 'is-prev', 93 slideNextClass: 'is-next', 94 slidesPerView: 6, 95 spaceBetween: 5, 96 on: {}, 97 }); 98 } 99 100 new Swiper('.p-top_chara-layout__main', { 101 speed: 0, 102 rewind: true, 103 slideActiveClass: 'is-active', 104 slidePrevClass: 'is-prev', 105 slideNextClass: 'is-next', 106 slidesPerView: 1, 107 centeredSlides: true, 108 effect: 'fade', 109 fadeEffect: { 110 crossFade: true, 111 }, 112 thumbs: { 113 swiper: thumbSlide, 114 slideThumbActiveClass: 'is-current', 115 }, 116 allowTouchMove: false, 117 autoHeight: true, 118 // pagination: { 119 // el: '.p-top_chara-pagination', 120 // bulletClass: 'p-top_chara-pagination__item', 121 // clickable: true, 122 // bulletElement: 'button', 123 // bulletActiveClass: 'is-current', 124 // }, 125 on: { 126 beforeTransitionStart: function () { 127 new Swiper(''); 128 this.el.classList.add('is-hidden'); 129 }, 130 }, 131 }); 132}; 133 134// ã ã¼ãã¼ã¹ã©ã¤ãã®ä¸èº«çæ 135const movieTemplateDist = () => { 136 const targetRoot = document.querySelector('.js-movie-slide'); 137 138 if (!targetRoot) { 139 return; 140 } 141 142 const targetItems = targetRoot.querySelectorAll('.js-movie-slide__item'); 143 const distWrap = document.querySelector('.js-movie-slide-template__wrap'); 144 const distTemplate = document.querySelector('.js-movie-slide-template__template'); 145
146 targetItems.forEach((targetItem) => { 147 console.log(targetItem); 148 149 const distTemplateClone = distTemplate.content.cloneNode(true); 150 151 distTemplateClone.querySelector('.p-movie_in-slide__item').setAttribute('data-modal', 'youtube:'.concat(targetItem.getAttribute('data-movie-id'))); 152 distWrap.appendChild(distTemplateClone); 153 }); 154}; 155 156// åç»ã¹ã©ã¤ã 157const movieModalSlide = () => { 158 const targetRoot = document.querySelector('.p-movie_in-panel'); 159 160 if (!targetRoot) { 161 return; 162 } 163 164 const modalHooks = document.querySelectorAll('.p-movie_in-panel'); 165 let currentIndexNum = 0; 166 167 const _template = 168 '\n<section class="m-modal {{ defaultClassName }}" id="{{ id }}" data-modal-type>\n <div class="m-modal__bg {{ defaultClassName }}__bg"></div>\n <div class="m-modal__content {{ defaultClassName }}__content swiper">\n {{ content }}\n </div>\n <div class="m-modal__close-btn {{ defaultClassName }}__close-btn" data-modal-ui-close></div>\n</section>'; 169 170 movieModal = new MODAL_MODULE({ 171 customModalHtml: _template, 172 defaultClassName: 'm-wb-modal', 173 on: { 174 prepOpen: function () { 175 documentBODY.classList.add('is-wb-fixed'); 176 }, 177 178 afterOpen: function () { 179 new Swiper('.js-photo-slider', { 180 initialSlide: currentIndexNum, 181 speed: 400, 182 loop: true, 183 centeredSlides: true, 184 loopAdditionalSlides: 1, 185 spaceBetween: '15%', 186 // autoHeight: true, 187 navigation: { 188 nextEl: '.p-photo-slide-control__btn--next', 189 prevEl: '.p-photo-slide-control__btn--prev', 190 }, 191 }); 192 }, 193 194 beforeClose: function () { 195 documentBODY.classList.remove('is-nsn-fixed'); 196 }, 197 }, 198 }); 199 200 modalHooks.forEach((modalHook) => { 201 modalHook.addEventListener('click', (e) => { 202 currentIndexNum = Number(modalHook.getAttribute('data-index')); 203 204 movieModal.Open('.p-movie_in-slide', document.querySelector('.js-movie_template')); 205 }); 206 }); 207}; 208 209setScrollEffect(); 210 211const opScroll = () => { 212 if (document.querySelectorAll('.js-op-visual').length > 0) { 213 setTimeout(function () { 214 smoothScroll.anime('#anc-top', 0); 215 documentBODY.classList.add('is-sp-fixed'); 216 217 setTimeout(() => { 218 const target = document.querySelector('.js-op-visual'); 219 const targetNum = Math.round(target.clientHeight - window.innerHeight / 0.65); 220 221 setTimeout(function () { 222 smoothScroll.anime(targetNum, 1000); 223 224 setTimeout(() => { 225 smoothScroll.anime('#anc-top', 0); 226 documentBODY.classList.remove('is-sp-fixed'); 227 documentBODY.classList.add('is-op-end'); 228 }, 3300); 229 }, 2300); 230 }, 10); 231 }, 0); 232 } 233}; 234 235const opSkip = () => { 236 if (!sessionStorage.getItem(keyName)) { 237 //FIRST ACCESS 238 sessionStorage.setItem(keyName, keyValue); 239 opScroll(); 240 } else { 241 $('body').addClass('is-op-skip'); 242 } 243}; 244 245window.addEventListener('load', () => { 246 'use strict'; 247 opSkip(); 248 document.querySelector('body').classList.add('is-load'); 249 setSmoothScroll(); 250 charaSlider(); 251 modal(); 252 // movieTemplateDist(); 253 // movieModalSlide(); 254}); 255 256const Menu = { 257 config: { 258 wrap: '.js-wrap', 259 btn: '.js-menu', 260 area: 'js-menu-area', 261 open: '.js-menu-open', 262 close: '.js-menu-close', 263 }, 264 param: { 265 timer: 400, 266 duration: 850, 267 }, 268 state: { 269 isDone: true, 270 open: false, 271 }, 272 timer: undefined, 273 toggle() { 274 if (!this.state.open) { 275 this.open(); 276 } else { 277 this.close(); 278 } 279 }, 280 open() { 281 if (!this.state.open) { 282 clearTimeout(this.timer); 283 this.state.open = true; 284 $('body').addClass('is-menu-show'); 285 setTimeout(() => { 286 $('body').addClass('is-menu-open'); 287 }, 10); 288 } 289 }, 290 close() { 291 this.state.open = false; 292 $('body').removeClass('is-menu-open'); 293 this.timer = setTimeout(() => { 294 $('body').removeClass('is-menu-show'); 295 }, this.param.duration); 296 }, 297 click() { 298 $('body').on('click', '.js-menu', (e) => { 299 this.toggle(); 300 }); 301 $('body').on('click keydown', '.js-menu-open', (e) => { 302 this.open(); 303 }); 304 $('body').on('click keydown', '.js-menu-close', (e) => { 305 this.close(); 306 }); 307 }, 308 init() { 309 this.click(); 310 }, 311}; 312 313 314function getRandomInt(min, max) { 315 return Math.floor(Math.random() * (max - min) + min); 316} 317var Menu2 = { 318 isOpen: false, 319 config: { 320 $toggle: $('.js-menu'), 321 $chara: $('.l-nav__bg-chara'), 322 }, 323 setRandomBg: function setRandomBg() { 324 this.config.$chara.attr('data-chara', getRandomInt(1, 7)); 325 }, 326 open: function open() { 327 this.setRandomBg(); 328 this.config.$toggle.attr('aria-expanded', true); 329 this.isOpen = true; 330 }, 331 close: function close() { 332 this.isOpen = false;
333 }, 334 attachEvent: function attachEvent() { 335 var _this = this; 336 this.config.$toggle.on('click', function (e) { 337 if (_this.isOpen) { 338 _this.close(); 339 } else { 340 _this.open(); 341 } 342 }); 343 }, 344 init: function init() { 345 if ($('.l-menu').length) { 346 this.attachEvent(); 347 } 348 }, 349}; 350Menu.init(); 351Menu2.init(); 352const Scroll = { 353 config: { 354 elem: '[data-anchor]', 355 hasClass: 'js-scroll-animation', 356 }, 357 parameter: { 358 speed: 1200, 359 easing: 'easeOutQuart', 360 }, 361 data(e) { 362 const dataScroll = typeof e === 'string' ? e : e.attr('data-anchor'); 363 const offsetData = typeof e === 'string' ? 0 : isNaN(parseFloat(e.attr('data-anchor-offset'))) ? e.attr('data-anchor-offset') : parseFloat(e.attr('data-anchor-offset')); 364 let offset = 0; 365 if (typeof offsetData === 'string') { 366 offset = $(offsetData).innerHeight(); 367 } else if (typeof offsetData === 'number') { 368 offset = offsetData; 369 } 370 let destination = dataScroll; 371 if (dataScroll === 'top') { 372 destination = 'body'; 373 } else if (dataScroll === 'pagetop') { 374 destination = 'body'; 375 } 376 if ($(destination).length > 0) { 377 const scrollHeight = $(destination).offset().top; 378 if (dataScroll === 'pagetop') { 379 $('body').addClass('is-page-top'); 380 setTimeout(() => { 381 this.scroll(scrollHeight, offset); 382 setTimeout(() => { 383 $('body').removeClass('is-page-top'); 384 }, 600); 385 }, 200); 386 } else { 387 this.scroll(scrollHeight, offset); 388 } 389 } 390 }, 391 hash(e) { 392 let href = $(e).attr('href'); 393 let target = $(href == '#' || href === '' ? 'html' : href); 394 let position = target.offset().top; 395 this.scroll(position); 396 }, 397 scroll(position, offset) { 398 $('body').addClass('is-scroll'); 399 $('html,body').animate( 400 { 401 scrollTop: position, 402 }, 403 this.parameter.speed, 404 this.parameter.easing, 405 () => { 406 $('body').removeClass('is-scroll'); 407 } 408 ); 409 }, 410 click() { 411 $('body').on('click keydown', this.config.elem, (e) => { 412 if (e.type === 'click' || e.key === 'Enter') this.data($(e.currentTarget)); 413 }); 414 }, 415 init() { 416 this.click(); 417 }, 418}; 419Scroll.init(); 420 421 422$(function () { 423 $(".Slide").slick({ 424 arrows: true, 425 dots: true, 426 autoplay: true, 427 autoplaySpeed: 6000, 428 speed: 1000, 429 slidesToScroll: 1, 430 pauseOnFocus: false, 431 pauseOnHover: false, 432 pauseOnDotsHover: false 433 }) 434}); 435 436 437// TOP MODAL 438const content = document.querySelector(".top_modal"); 439const btn = document.querySelector(".top_modal_close"); 440const bg = document.querySelector(".top_modal_bg"); 441btn.addEventListener("click", () => { 442 content.classList.add("modal_close"); 443}); 444bg.addEventListener("click", () => { 445 content.classList.add("modal_close"); 446}); 447const ytiframe = 'video'; 448const targetWindow = document.getElementById(ytiframe).contentWindow; 449const ag2ytControl = function (action, arg = null) { 450 targetWindow.postMessage('{"event":"command", "func":"' + action + '", "args":' + arg + '}', '*'); 451}; 452document.getElementById('ytstop').addEventListener('click', function (event) { 453 ag2ytControl('stopVideo'); 454}); 455document.getElementById('ytstop2').addEventListener('click', function (event) { 456 ag2ytControl('stopVideo'); 457}); 458 459 460 461/****************************************/ 462 463const shuffle = { 464 num: 10, 465 ary: [], 466 467 //é åçæ 468 create: function () { 469 for (var i = 0; this.ary.push(i) < this.num; i++); 470 }, 471 //ã·ã£ããã« 472 shuffle: function (num) { 473 474 if (num > 0) { 475 this.num = num; 476 } 477 478 this.create(); 479 480 for (i = this.ary.length - 1; i > 0; i--) { 481 j = Math.floor(Math.random() * (i + 1)); 482 rand = this.ary[i]; 483 this.ary[i] = this.ary[j]; 484 this.ary[j] = rand; 485 } 486 return this.ary; 487 }, 488} 489 490//è¦ç´ æå® 491var el = document.getElementsByTagName("li"); 492 493//è¦ç´ ã®é·ãï¼æ°ï¼ãåå¾ 494var len = el.length; 495 496//é åçæï¼è¦ç´ ã®æ°ã«å¿ãã¦çæãããä¹±æ°ãå¤ã«æãããï¼ 497var ary = shuffle.shuffle(len); 498 499//ã¤ã³ããã¯ã¹åæå 500var index = 0; 501 502window.setInterval(function () { 503 el[ary[index]].classList.add('is-play'); 504 index++; 505}, 500);
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.