https://hypnosismic-anime.com/assets/2nd/js/hm.in.js

1'use strict';
2const Movie = {
3  instance: null,
4  set() {
5    let _videoid = $('#youtubePlayer').attr('data-videoid');
6    this.instance = new PLAYER_MODULE_YOUTUBE({
7      id: 'youtubePlayer',
8      videoid: _videoid,
9      responsive: true,
10      muted: true,
11      playerVars: {
12        autoplay: 1,
13        loop: 1,
14      },
15      on: {},
16    });
17  },
18  init() {
19    if ($('#youtubePlayer').length) {
20      this.set();
21    }
22  },
23};
24
25const CharaIndex = {
26  set() {
27    let $thumb = $('.p-chara__img-item');
28    let $name = $('.p-chara__name-item');
29    $thumb.on('mouseenter', function () {
30      let $parent = $(this).parent();
31      let index = $(this).index();
32      let _name = $parent.siblings('.p-chara__name').find('.p-chara__name-item').eq(index);
33      _name.addClass('is-enter');
34    });
35    $thumb.on('mouseleave', function () {
36      let $parent = $(this).parent();
37      let index = $(this).index();
38      let _name = $parent.siblings('.p-chara__name').find('.p-chara__name-item').eq(index);
39      _name.removeClass('is-enter');
40    });
41    $name.on('mouseenter', function () {
42      let $parent = $(this).parents('.p-chara__name');
43      let index = $(this).index();
44      let _thumb = $parent.siblings('.p-chara__img').find('.p-chara__img-item').eq(index);
45      _thumb.addClass('is-enter');
46    });
47    $name.on('mouseleave', function () {
48      let $parent = $(this).parents('.p-chara__name');
49      let index = $(this).index();
50      let _thumb = $parent.siblings('.p-chara__img').find('.p-chara__img-item').eq(index);
51      _thumb.removeClass('is-enter');
52    });
53  },
54  init() {
55    if (!$('.p-chara').length) return;
56    if (!Common.state.pcFlg) return;
57    this.set();
58  },
59};
60
61const CharaSlide = {
62  instance: null,
63  initialindex: 0,
64  set() {
65    CharaSlide.instance = new Swiper('.js-charaslide', {
66      speed: 400,
67      slidesPerView: 1,
68      centeredSlides: true,
69      effect: 'fade',
70      initialSlide: CharaSlide.initialindex,
71      fadeEffect: {
72        crossFade: true,
73      },
74      allowTouchMove: false,
75      autoHeight: true,
76      preloadImages: false,
77      lazy: {
78        loadPrevNext: true,
79      },
80      navigation: {
81        nextEl: '.js-charaslide-next',
82        prevEl: '.js-charaslide-prev',
83      },
84      on: {
85        afterInit() {
86          setTimeout(function () {}, 500);
87        },
88        activeIndexChange() {},
89        slideChangeTransitionEnd() {},
90      },
91    });
92  },
93  pagetop() {
94    $('.p-chara_detail__page-item').on('click', function () {
95      $('body,html').stop().animate(
96        {
97          scrollTop: 0,
98        },
99        700,
100        'easeInOutQuart'
101      );
102    });
103  },
104  getparam() {
105    let url = new URL(window.location.href);
106    let params = url.searchParams;
107    let index = params.get('id') - 1;
108    // this.instance.slideToLoop(index,500);
109    this.initialindex = index;
110  },
111  init() {
112    this.getparam();
113    this.set();
114    this.pagetop();
115  },
116};
117
118const Tab = {
119  set() {
120    let url = new URL(window.location.href);
121    let params = url.searchParams;
122    let showpage = params.get('page');
123
124    if (showpage) {
125      let $showpage = $('#'.concat(showpage));
126      if ($showpage.length) {
127        $showpage.css('display', 'block');
128        $('[data-tab-target]').removeClass('is-current');
129        $('[data-tab-target='.concat(showpage, ']')).addClass('is-current');
130      }
131    } else {
132      // パラメータがない場合
133      $('.js-tab-contents').eq(0).css('display', 'block');
134    }
135  },
136  init() {
137    if ($('.js-tab').length) {
138      this.set();
139    } else {
140      $('.js-tab-contents').css('display', 'block');
141    }
142  },
143};
144
145const MusicBg = {
146  $item: '.p-music__list-item[data-videoid]',
147  $bg: '.p-music__bg',
148  createhtml() {
149    let html = '';
150    $(this.$item).each(function (index, elem) {
151      let _id = $(elem).attr('data-videoid');
152      html += '<div class="p-music__bg-inner" data-bgid="'.concat(_id, '" style="background-image: url(http://img.youtube.com/vi/').concat(_id, '/maxresdefault.jpg);"></div>');
153    });
154    $(this.$bg).append(html);
155  },
156  hover() {
157    $(this.$item).on('mouseenter', function () {
158      $('.p-music__bg-inner').removeClass('is-show');
159      let _id = $(this).attr('data-videoid');
160      let _bg = $("[data-bgid = '".concat(_id, "']"));
161      _bg.addClass('is-show');
162    });
163
164    $(this.$item).on('mouseleave', function () {
165      $('.p-music__bg-inner').removeClass('is-show');
166    });
167  },
168  init() {
169    if (!Common.state.pcFlg) return;
170    this.createhtml();
171    this.hover();
172  },
173};
174
175document.addEventListener('DOMContentLoaded', function (event) {
176  CharaIndex.init();
177  MusicBg.init();
178});
179
180window.addEventListener('load', (event) => {
181  Movie.init();
182  CharaSlide.init();

183  Tab.init();
184});
185
186window.addEventListener('resize', () => {});