https://amagi-resort.jp/common2020/js/base.js?v=2ad6624e757c654e58ef7e1c9fe0b562

1window.requestAnimFrame = (function(callback) {
2  return window.requestAnimationFrame ||
3  window.webkitRequestAnimationFrame ||
4  window.mozRequestAnimationFrame ||
5  window.oRequestAnimationFrame ||
6  window.msRequestAnimationFrame ||
7  function(callback){
8    return window.setTimeout(callback, 1000/60);
9  };
10})();
11
12window.cancelAnimFrame = (function(_id) {
13  return window.cancelAnimationFrame ||
14  window.cancelRequestAnimationFrame ||
15  window.webkitCancelAnimationFrame ||
16  window.webkitCancelRequestAnimationFrame ||
17  window.mozCancelAnimationFrame ||
18  window.mozCancelRequestAnimationFrame ||
19  window.msCancelAnimationFrame ||
20  window.msCancelRequestAnimationFrame ||
21  window.oCancelAnimationFrame ||
22  window.oCancelRequestAnimationFrame ||
23  function(_id) { window.clearTimeout(id); };
24})();
25
26var easingEquations = {
27  easeOutSine: function (pos) {
28      return Math.sin(pos * (Math.PI / 2));
29  },
30  easeInOutSine: function (pos) {
31      return (-0.5 * (Math.cos(Math.PI * pos) - 1));
32  },
33  easeInOutQuint: function (pos) {
34      if ((pos /= 0.5) < 1) {
35          return 0.5 * Math.pow(pos, 5);
36      }
37      return 0.5 * (Math.pow((pos - 2), 5) + 2);
38  }
39};
40
41var AutoHover = function(_type) {
42  this._type = _type;
43  this._targets = document.getElementsByClassName(this._type);
44  if (!this._targets.length)	return;
45  this.init();
46};
47
48AutoHover.prototype = {
49  init : function() {
50    var _self = this;
51    var i = 0|0;
52    for (i = 0; i<this._targets.length; i=(i+1)|0) {
53      this._targets[i].addEventListener('mouseenter', function(e) {_self.onMouseOver({currentTarget:e.currentTarget, self:_self})} , false);
54      this._targets[i].addEventListener('mouseleave', function(e) {_self.onMouseOut({currentTarget:e.currentTarget, self:_self})} , false);
55    };
56  },
57  onMouseOver:function(e) {
58    if (e.self._type === 'img_ovr') {
59      e.currentTarget.setAttribute('src', e.currentTarget.getAttribute('src').replace(/_off/ig, '_on'));
60      return;
61    }
62    Velocity(e.currentTarget, 'stop');
63    Velocity(e.currentTarget, {opacity:0.7}, {duration:300, delay:0, easing:'easeOutSine'});
64  },
65  onMouseOut:function(e) {
66    if (e.self._type === 'img_ovr') {
67      e.currentTarget.setAttribute('src', e.currentTarget.getAttribute('src').replace(/_on/ig, '_off'));
68      return;
69    }
70    Velocity(e.currentTarget, 'stop');
71    Velocity(e.currentTarget, {opacity:1}, {duration:300, delay:0, easing:'easeInSine'});
72  }
73}
74
75var PageTop = (function() {
76  function PageTop() {
77    var pa = this;
78    this._target = document.querySelector('.pagetop');
79    this.flag_start = false;
80    this.stopEverything = function() {
81      pa.flag_start = false;
82    }
83    this.scrollToY = function(scrollTargetY, speed, easing) {
84      var scrollY = window.scrollY || window.pageYOffset,
85        scrollTargetY = scrollTargetY || 0,
86        speed = speed || 2000,
87        easing = easing || 'easeOutSine',
88        currentTime = 0;
89      var time = Math.max(.1, Math.min(Math.abs(scrollY - scrollTargetY) / speed, .8));
90
91      function tick() {
92        if (pa.flag_start) {
93          currentTime += 1 / 60;
94          var p = currentTime / time;
95          var t = easingEquations[easing](p);
96          if (p < 1) {
97            requestAnimFrame(tick);
98            window.scrollTo(0, scrollY + ((scrollTargetY - scrollY) * t));
99          } else {
100            window.scrollTo(0, scrollTargetY);
101          }
102        }
103      }
104      tick();
105    }
106    this.handling = function(){
107      var _top  = document.documentElement.scrollTop || document.body.scrollTop;
108      if (_top > 0) {
109        pa._target.classList.add('fixed');
110      }else{
111        pa._target.classList.remove('fixed');
112      }
113    }
114    this._target.addEventListener('click', function(e) {
115      e.preventDefault();
116      pa.flag_start = true;
117      pa.scrollToY(0, 1000, 'easeOutSine');
118    })
119    window.addEventListener('scroll',pa.handling,false);
120    document.querySelector("body").addEventListener('mousewheel', pa.stopEverything, false);
121    document.querySelector("body").addEventListener('DOMMouseScroll', pa.stopEverything, false);
122  }
123  return PageTop;
124})();
125
126// var AnchorLink = function() {
127//   this._targets = document.querySelectorAll('a[href^="#"]');
128//   if (!this._targets.length)	return;
129//   this.init();

130// }
131// AnchorLink.prototype = {
132//   init : function() {
133//     var i = 0|0;
134//     for (i = 0; i<this._targets.length; i=(i+1)|0) {
135//       this._targets[i].addEventListener('click', this.onClickHD , false);
136//     };
137//   },
138//   onClickHD : function(e) {
139//     var _hash = e.currentTarget.getAttribute('href').replace('#', '');
140//     Velocity(document.getElementById(_hash), 'scroll', {duration:1000, delay:0, easing:'easeInOutSine'});
141//     e.preventDefault();
142//   }
143// }
144
145var Menu = function() {
146  this.body = document.getElementsByTagName('body')[0];
147  this.html = document.getElementsByTagName('html')[0];
148
149  this.menuLogo = document.getElementsByClassName('menu')[0];
150  this.menuWrapper = document.getElementsByClassName('menu_drop_wrapper')[0];
151
152  this.subMenuTrigger = document.getElementsByClassName('subTrigger');
153  this.subMenu = document.getElementsByClassName('menu__second-level');
154
155  var that = this;
156
157  this.menuLogo.addEventListener('click',function(){
158    that.toggle();
159  },false);
160
161  for(var i=0;i<this.subMenuTrigger.length;i++){
162    var ele = this.subMenuTrigger[i];
163    var id = i;
164    ele.addEventListener('click',
165        that.toggleSub(id),false);
166  }
167
168
169}
170Menu.prototype = {
171  toggle : function() {
172    if(this.menuLogo.classList.contains('active')){
173      this.body.classList.remove('active');
174      this.html.classList.remove('active');
175
176      this.menuLogo.classList.remove('active');
177      this.menuWrapper.classList.remove('active');
178    }else{
179      this.body.classList.add('active');
180      this.html.classList.add('active');
181
182      this.menuLogo.classList.add('active');
183      this.menuWrapper.classList.add('active');
184    }
185  },
186
187  toggleSub : function(i) {
188    var that = this;
189    return function(){
190    if(that.subMenuTrigger[i].classList.contains('active')){
191      that.subMenu[i].classList.remove('active');
192      that.subMenuTrigger[i].classList.remove('active');
193    }else{
194      that.subMenu[i].classList.add('active');
195      that.subMenuTrigger[i].classList.add('active');
196    }
197  }
198  },
199
200}
201
202var WatchHeader = function() {
203  this.header = document.getElementsByTagName('header')[0];
204  var isScrolling;
205  var that = this;
206  window.addEventListener('scroll',function(){
207    if(window.innerWidth>768) return;
208    window.clearTimeout( isScrolling );
209    if(!that.header.classList.contains('hide')){
210      that.header.classList.add('hide');
211    }
212    isScrolling = setTimeout(function() {
213      that.header.classList.remove('hide');
214    }, 100);
215  },false)
216
217}
218
219var objCover = (function() {
220  function objCover() {
221    // Check Internet Explorer
222    ojb = this;
223    this.detectIE = function() {
224      if (navigator.userAgent.indexOf('MSIE') !== -1 || navigator.appVersion.indexOf('Trident/') > 0) {
225        if (window.navigator.userAgent.indexOf("Windows NT 10.0") != -1 || window.navigator.userAgent.indexOf("Windows NT 6.3") != -1) {
226          return 'ie11w10';
227        } else if (window.navigator.userAgent.indexOf("Windows NT 6.1") != -1) {
228          return 'ie11w7';
229        }
230      }
231    }
232    this.handling = function() {
233      if (ojb.detectIE()) {
234        document.querySelector('body').className += 'ie';
235        // object-fit cover ie
236        var elements = document.querySelectorAll('.obj_cv');
237        Array.prototype.forEach.call(elements, function(el, i) {
238          imgUrl = el.querySelector('img').src;
239          if (imgUrl) {
240            el.style.backgroundImage = 'url(' + imgUrl + ')';
241            el.style.backgroundSize = 'cover';
242            el.style.backgroundPosition = "center center";
243            el.getElementsByTagName('img')[0].style.display = 'none';
244          }
245        });
246      }
247    }
248    this.handling();
249  }
250  return objCover;
251})();
252
253var bnrLandSpecialClose = function() {
254  var bnrLandSpecial = document.querySelector('#bnr_landSpecial');
255  if (!bnrLandSpecial) return;
256  var closeBtn = bnrLandSpecial.querySelector('#closeBtn');
257  closeBtn.addEventListener('click', function() {
258    bnrLandSpecial.style.display = 'none';
259  })
260}
261
262var Base = function() {
263  !function Base() {
264    new AutoHover('img_ovr');
265    new AutoHover('alpha_ovr');
266    new PageTop();
267    // new AnchorLink();
268    new Menu();
269    new WatchHeader();
270    new objCover();
271    new bnrLandSpecialClose();
272  }();
273  return Base;
274};
275
276window.addEventListener('DOMContentLoaded', function() {
277  if (window.jQuery) window.Velocity = window.jQuery.fn.velocity;
278  new Base();
279});
280
281/* images pc <---> sp */
282(function () {
283  var PicturePolyfill = (function () {
284    function PicturePolyfill() {
285      var _this = this;
286      this.pictures = [];
287      this.onResize = function () {
288        var width = document.body.clientWidth;
289        for (var i = 0; i < _this.pictures.length; i = (i + 1)) {
290          _this.pictures[i].update(width);
291        };
292      };
293      if ([].includes) return;
294      var picture = Array.prototype.slice.call(document.getElementsByTagName('picture'));
295      for (var i = 0; i < picture.length; i = (i + 1)) {

296        this.pictures.push(new Picture(picture[i]));
297      };
298      window.addEventListener("resize", this.onResize, false);
299      this.onResize();
300    }
301    return PicturePolyfill;
302  }());
303  var Picture = (function () {
304    function Picture(node) {
305      var _this = this;
306      this.update = function (width) {
307        width <= _this.breakPoint ? _this.toSP() : _this.toPC();
308      };
309      this.toSP = function () {
310        if (_this.isSP) return;
311        _this.isSP = true;
312        _this.changeSrc();
313      };
314      this.toPC = function () {
315        if (!_this.isSP) return;
316        _this.isSP = false;
317        _this.changeSrc();
318      };
319      this.changeSrc = function () {
320        var toSrc = _this.isSP ? _this.srcSP : _this.srcPC;
321        _this.img.setAttribute('src', toSrc);
322      };
323      this.img = node.getElementsByTagName('img')[0];
324      this.srcPC = this.img.getAttribute('src');
325      var source = node.getElementsByTagName('source')[0];
326      this.srcSP = source.getAttribute('srcset');
327      this.breakPoint = Number(source.getAttribute('media').match(/(\d+)px/)[1]);
328      this.isSP = !document.body.clientWidth <= this.breakPoint;
329      this.update();
330    }
331    return Picture;
332  }());
333  new PicturePolyfill();
334}());