1/*----------------------------------------------- 2 * Scroll Navigaiton [ç¾å¨å°ã®é ç®ãããã²ã¼ã·ã§ã³ã«ã«ã¬ã³ããããã¤] 3-------------------------------------------------*/ 4const NAV_ACTIVE_CLASSNAME = 'is-active'; 5const navlists = document.querySelectorAll('.js-navlink'); 6const nav_option = { 7 threshold: 0, 8 rootMargin: '-10px 0px -65%', 9} 10 11// navlists.forEach(navlist => { 12// const nav_target = document.querySelector(navlist.getAttribute('data-nav')); 13// const nav_observer = new IntersectionObserver(([{ isIntersecting }]) => { 14// if (isIntersecting) { 15// navlists.forEach(el => el.classList.remove(NAV_ACTIVE_CLASSNAME)); 16// navlist.classList.add(NAV_ACTIVE_CLASSNAME); 17// } 18// }, nav_option); 19// nav_observer.observe(nav_target); 20// }) 21 22/*----------------------------------------------- 23 * kv 24-------------------------------------------------*/ 25$(function () { 26 var ww = window.innerWidth; 27 $(window).on('load resize', function () { 28 if (ww > 768) { 29 var topMainW = $(".js-mouseOver").innerWidth(); 30 var topMainH = $(".js-mouseOver").innerHeight(); 31 $(".js-mouseOver").on('mousemove', function (e) { 32 var mouseAreaX = e.offsetX; 33 var mouseAreaY = e.offsetY; 34 var mXp1 = mouseAreaX / topMainW; 35 var mYp1 = mouseAreaY / topMainH; 36 var mXp1 = mXp1 * 100; 37 var mXp1 = mXp1 * 1.05; 38 var mXp1 = Math.round(mXp1); 39 var mYp1 = mYp1 * 100; 40 var mYp1 = mYp1 * 1.05; 41 var mYp1 = Math.round(mYp1); 42 if (mXp1 > 100) 43 mXp1 = 100; 44 if (mYp1 > 100) 45 mYp1 = 100; 46 $(".kvWrap-img").css("background-position-y", mYp1 + "%"); 47 $(".kvWrap-img").css("background-position-x", mXp1 + "%"); 48 }); 49 } 50 }); 51 $(window).on('load', function () { 52 var sp_visualW = $(".kvWrapIn-box").width() / 2 - ww / 2; 53 $(".js-sp_scroll").animate({ scrollLeft: sp_visualW }, 4000, 'easeOutQuart'); 54 }); 55}); 56 57/*----------------------------------------------- 58 * episodes 59-------------------------------------------------*/ 60var episodesSwiper = new Swiper('.episodesSwiper', { 61 slidesPerView: 'auto', 62 centeredSlides: true, 63 speed: 3000, 64 slideToClickedSlide: true, 65 speed: 1000, 66 67 pagination: { 68 el: '.episodes-pagination', 69 clickable: true, 70 }, 71}); 72episodesSwiper.slideTo(0); 73 74/*----------------------------------------------- 75 * character 76-------------------------------------------------*/ 77var characterSwiper = new Swiper('.characterSwiper', { 78 slidesPerView: 'auto', 79 initialSlide: 9, // ãã£ã©æ° 80 centeredSlides: true, 81 speed: 3000, 82 slideToClickedSlide: true, 83 speed: 1000, 84 85 pagination: { 86 el: '.character-pagination', 87 clickable: true, 88 }, 89}); 90characterSwiper.slideTo(4); 91 92 93/*----------------------------------------------- 94 * movie 95-------------------------------------------------*/ 96(function() { 97 let speed = 7000; 98 99 var movieSwiper = new Swiper('.movie__content', { 100 slidesPerView: 'auto', 101 loop: true, 102 speed: 7000, 103 centeredSlides: true, 104 autoplay: { 105 delay: 0, 106 }, 107 }); 108 109 let getTranslate_movie; 110 111 document.querySelectorAll('.movie__content').forEach(function(e){ 112 113 e.addEventListener('mouseover', function () { 114 getTranslate_movie = movieSwiper.getTranslate(); 115 movieSwiper.setTranslate(getTranslate_movie); 116 movieSwiper.setTransition(0); 117 }); 118 119 e.addEventListener('mouseout', function () { 120 getTranslate_movie = movieSwiper.getTranslate(); 121 122 let getSlideWidthMgLeft = document.querySelector('.swiper-slide-active').style.marginLeft; 123 if (getSlideWidthMgLeft) { 124 getSlideWidthMgLeft = parseFloat(getSlideWidthMgLeft); 125 } else { 126 getSlideWidthMgLeft = 0; 127 } 128 129 let getSlideWidthMgRight = document.querySelector('.swiper-slide-active').style.marginRight; 130 if (getSlideWidthMgRight) { 131 getSlideWidthMgRight = parseFloat(getSlideWidthMgRight); 132 } else { 133 getSlideWidthMgRight = 0; 134 } 135 136 let getSlideWidth = $('.movie__contentList-item.swiper-slide-active').innerWidth(); 137 138 let getTotalSlideWidth = getSlideWidthMgLeft + getSlideWidthMgRight + getSlideWidth; 139 let diff_movie = - getTotalSlideWidth - (getTranslate_movie % getTotalSlideWidth);
140 let diffTime_movie = diff_movie / -getSlideWidth; 141 movieSwiper.setTranslate(getTranslate_movie + diff_movie); 142 movieSwiper.setTransition(speed * diffTime_movie); 143 }); 144 }); 145 })(); 146 147// YouTube Iframe äºéåçé²æ¢ [movie1ã¤ã®ã¿] 148$(document).on('click', '.js-playstop', function () { 149 $('#youtubeModal').fadeIn(500); 150 $('.modalBox').fadeIn(500); 151 $('body').css({ 'overflow': 'hidden' }); 152 var ytID = $(this).data('ytid'); 153 var ytURL = 'https://www.youtube.com/embed/' + ytID + '?autoplay=1&rel=0'; 154 setTimeout(function () { 155 $('.js-youtubeIframe').attr('src', ytURL); 156 }, 100); 157 $('.movieSlide').addClass('is-play'); 158 $(".js-modalBox").addClass('js-modalplayClose'); 159}); 160 161$(document).on('click', '.js-modalplayClose a.js-modalClose', function () { 162 $('.movieSlide').removeClass('is-play'); 163 $(".modalBox").removeClass('js-modalplayClose'); 164}); 165 166$(document).on('click', '.js-modalplayClose .js-oneModalIn', function (e) { 167 $('.movieSlide').removeClass('is-play'); 168 $(".modalBox").removeClass('js-modalplayClose'); 169}); 170 171/*----------------------------------------------- 172 * music 173-------------------------------------------------*/ 174(function() { 175 let speed = 7000; 176 var musicSwiper = new Swiper('.music__content', { 177 slidesPerView: 'auto', 178 loop: true, 179 speed: 7000, 180 centeredSlides: true, 181 autoplay: { 182 delay: 0, 183 disableOnInteraction: false, 184 }, 185 }); 186 187 let getTranslate_music; 188 189 document.querySelectorAll('.music__content').forEach(function(e){ 190 191 e.addEventListener('mouseover', function () { 192 getTranslate_music = musicSwiper.getTranslate(); 193 musicSwiper.setTranslate(getTranslate_music); 194 musicSwiper.setTransition(0); 195 }); 196 197 e.addEventListener('mouseout', function () { 198 getTranslate_music = musicSwiper.getTranslate(); 199 200 let getSlideWidthMgLeft = document.querySelector('.swiper-slide-active').style.marginLeft; 201 if (getSlideWidthMgLeft) { 202 getSlideWidthMgLeft = parseFloat(getSlideWidthMgLeft); 203 console.log(getSlideWidthMgLeft); 204 } else { 205 getSlideWidthMgLeft = 0; 206 } 207 208 let getSlideWidthMgRight = document.querySelector('.swiper-slide-active').style.marginRight; 209 if (getSlideWidthMgRight) { 210 getSlideWidthMgRight = parseFloat(getSlideWidthMgRight); 211 } else { 212 getSlideWidthMgRight = 0; 213 } 214 215 let getSlideWidth = $('.music__contentLists-item.swiper-slide-active').innerWidth(); 216 217 let getTotalSlideWidth = getSlideWidthMgLeft + getSlideWidthMgRight + getSlideWidth; 218 let diff_music = - getTotalSlideWidth - (getTranslate_music % getTotalSlideWidth); 219 let diffTime_music = diff_music / -getSlideWidth; 220 musicSwiper.setTranslate(getTranslate_music + diff_music); 221 musicSwiper.setTransition(speed * diffTime_music); 222 }); 223 }); 224})(); 225 226/*----------------------------------------------- 227 * character Modal 228-------------------------------------------------*/ 229function charaModal(cid) { 230 var chara_url = './_character/' + cid + '.html'; 231 $('.charaModalCont').load(chara_url, function () { 232 $('#charaModal').fadeIn(500); 233 $(".modalBox").fadeIn(500,'linear',function(){ 234 $("body").css({ 'overflow': 'hidden' }); 235 }); 236 }); 237} 238 239/*----------------------------------------------- 240 * comment Modal 241-------------------------------------------------*/ 242function commentModal(cid) { 243 var comment_url = './_comment/' + cid + '.html'; 244 $('.commentModalCont').load(comment_url, function () { 245 $(".modalBox").show(); 246 $(".modalBox").animate({'scrollTop':0},10,"linear",function(){ 247 $('#commentModal').fadeIn(500); 248 $("body").css({ 'overflow': 'hidden' }); 249 }); 250 }); 251} 252 253/*----------------------------------------------- 254 * special Modal 255-------------------------------------------------*/ 256function special(_img) { 257 $(".js-specialModalCont_img").attr("src", _img); 258 $('#specialModal').fadeIn(500); 259 $('.modalBox').fadeIn(500); 260 $('body').css({ 'overflow': 'hidden' }); 261} 262$('.js-specialModalCont').on('click touchend', function (e) { 263 $('.modalBox, .oneModal').fadeOut(500); 264 $('body').css({ 'overflow': '' }); 265}); 266 267 268/*----------------------------------------------- 269 * Navigation Scroll Active[js.screvent ver] 270-------------------------------------------------*/ 271$(function(){ 272 var scrT = ''; 273 var $navlink = $(".js-navlink"); 274 var $n_news = $(".js-nav-news"); 275 var $n_onair = $(".js-nav-onair"); 276 var $n_introduction = $(".js-nav-introduction"); 277 var $n_story = $(".js-nav-story"); 278 var $n_episodes = $(".js-nav-episodes"); 279 var $n_character = $(".js-nav-character"); 280 var $n_staffcast = $(".js-nav-staffcast"); 281 var $n_movie = $(".js-nav-movie"); 282 var $n_music = $(".js-nav-music"); 283 var $n_special = $(".js-nav-special"); 284 var $n_comics = $(".js-nav-comics"); 285 var $n_community = $(".js-nav-community"); 286 287 $(window).on('load scroll',function(){ 288 $(".js-navlink").removeClass('is-active'); 289 scrT = $(window).scrollTop(); 290 var whh = window.innerHeight / 2; 291 var $news = $("#news").offset().top - whh; 292 var $onair = $("#onair").offset().top - whh; 293 var $introduction = $("#introduction").offset().top - whh; 294 var $story = $("#story").offset().top - whh; 295 var $episodes = $("#episodes").offset().top - whh; 296 var $character = $("#character").offset().top - whh; 297 var $staffcast = $("#staffcast").offset().top - whh; 298 var $movie = $("#movie").offset().top - whh; 299 var $music = $("#music").offset().top - whh; 300 var $special = $("#special").offset().top - whh; 301 var $comics = $("#comics").offset().top - whh; 302 var $community = $("#community").offset().top - whh; 303 var $footer = $(".footer").offset().top - whh; 304 305 if($footer < scrT){ 306 $navlink.removeClass('is-active'); 307 }else if($community < scrT){ 308 $navlink.removeClass('is-active'); 309 $n_community.addClass('is-active'); 310 }else if($comics < scrT){ 311 $navlink.removeClass('is-active'); 312 $n_comics.addClass('is-active'); 313 }else if($special < scrT){ 314 $navlink.removeClass('is-active'); 315 $n_special.addClass('is-active'); 316 }else if($music < scrT){ 317 $navlink.removeClass('is-active'); 318 $n_music.addClass('is-active'); 319 }else if($movie < scrT){ 320 $navlink.removeClass('is-active'); 321 $n_movie.addClass('is-active'); 322 }else if($staffcast < scrT){ 323 $navlink.removeClass('is-active'); 324 $n_staffcast.addClass('is-active'); 325 }else if($character < scrT){ 326 $navlink.removeClass('is-active'); 327 $n_character.addClass('is-active'); 328 }else if($episodes < scrT){ 329 $navlink.removeClass('is-active'); 330 $n_episodes.addClass('is-active'); 331 }else if($story < scrT){ 332 $navlink.removeClass('is-active'); 333 $n_story.addClass('is-active'); 334 }else if($introduction < scrT){ 335 $navlink.removeClass('is-active'); 336 $n_introduction.addClass('is-active'); 337 }else if($onair < scrT){ 338 $navlink.removeClass('is-active'); 339 $n_onair.addClass('is-active'); 340 }else if($news < scrT){ 341 $navlink.removeClass('is-active'); 342 $n_news.addClass('is-active'); 343 } 344 }); 345}); 346 347/*----------------------------------------------- 348 * loading 349-------------------------------------------------*/ 350$(window).on('load', function () { 351 var hs = location.hash; 352 if(hs && $(hs)[0]) { 353 var position = $(hs).offset().top; 354 $('body,html').animate({scrollTop:position}, 100, 'easeOutQuart'); 355 }else{ 356 $('html,body').animate({ scrollTop: 0 }, '1'); 357 } 358 animatebubble('bubble01'); 359 animatebubble('bubble02'); 360 animatebubble('bubble03'); 361 animatebubble('bubble04'); 362 animatebubble('bubble05'); 363 setTimeout(function () { 364 $("body").addClass('--is-load'); 365 setTimeout(function () {
366 $("#loading").fadeOut(1400); 367 setTimeout(function () { 368 $("body").addClass('--is-loaded'); 369 $("body").css({ 'overflow': '' }); 370 $(this).remove(); 371 }, 200); 372 }, 1400); 373 }, 1000); 374}); 375 376 377const container = document.querySelector('.bubble'); 378 379function createbubble(className) { 380 for (let i = 1; i <= 15; i++) { 381 const icon = document.createElement('i'); 382 icon.classList.add(className); 383 icon.classList.add('bubble-items'); 384 container.append(icon); 385 } 386} 387createbubble('bubble01'); 388createbubble('bubble02'); 389createbubble('bubble03'); 390createbubble('bubble04'); 391createbubble('bubble05'); 392 393function animatebubble(className) { 394 anime({ 395 targets: `.${className}`, 396 duration: 5000, 397 delay: anime.stagger(40), 398 easing: 'easeOutCirc', 399 translateX: function () { 400 return anime.random(-800, 800); 401 }, 402 translateY: function () { 403 return anime.random(-500, 500); 404 }, 405 scale: function () { 406 return anime.random(1, 3); 407 }, 408 }); 409} 410 411 412 413
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.