https://tl-academy.com/publish/js/ams.publish.js?_=20220329

1// Publish
2
3(function($, window, document, undefined){
4
5	if(!("AMS" in window)) window.AMS = {};
6
7	/** Vars
8	------------------------------ **/
9	var apps = null;
10
11	//data
12	var DATA_PREFIX	= "data-ams";
13
14	//$objects
15	var _w	= $(window);
16	var _d	= $(document);
17	var _h	= new Object();
18	var _b	= new Object();
19	var _hb	= new Object();
20
21	/** Functions
22	------------------------------ **/
23	var init = function()
24	{
25		_h	= $("html");
26		_b	= $("body");
27		_hb	= $("html,body");
28
29		var $mainImage		= $("#mainImage:eq(0), .mainImage:eq(0)");
30		var $formPopup		= $("#formPopup");
31		var $pageTop		= $(".pageTop");
32		var $headerFixed	= $(".headerFixed");
33		var $datePickers	= $(".datePicker");
34		var $toggleTrigger	= $("#topMenu #toggle, .topMenu .toggle, .header .toggle");
35		var $imgAutoReload	= $("img.imgAutoReload");
36
37		//main image
38		if(!!$mainImage.length) new MainImage($mainImage);
39		//form popup
40		if(!!$formPopup.length) new FormPopup($formPopup);
41		//page top
42		if(!!$pageTop.length) new PageTop($pageTop);
43		//feader fixed
44		if(!!$headerFixed.length) new HeaderFixed($headerFixed);
45
46		//$ui.datepicker
47		$datePickers.each(function()
48		{
49			$(this).datepicker({
50				dateFormat			: "yy/mm/dd",
51				showOtherMonths		: true,
52				selectOtherMonths	: true,
53				minDate				: "0d"
54			});
55		});
56		//Shadowbox
57		if(!!window.Shadowbox) Popups.initShadowbox();
58		//PhotoSwipe
59		if(!!window.PhotoSwipe) Popups.initPhotoSwipe();
60
61		//toggle menu
62		if(!!$toggleTrigger.length)
63		{
64			$toggleTrigger.on("click", function(e)
65			{
66				_b[_b.hasClass("active") ? "removeClass" : "addClass"]("active");
67			});
68		}
69
70		//img auto reload
71		$imgAutoReload.each(function()
72		{
73			new ImgAutoReload($(this));
74		});
75
76		// after window load inits
77		if(window.loaded) initAfterLoadWindow();
78		else _w.on("load", function(){ initAfterLoadWindow() });
79	}
80	var initAfterLoadWindow = function()
81	{
82		// if(MainImage.active) MainImage.resize();
83	}
84	//editalble fix
85	var editableFix = function()
86	{
87		if(!!window.AMS && AMS.Build && AMS.Build.Editable) AMS.Build.Editable.layoutAll();
88		else return false;
89	}
90
91	var Popups =
92	{
93		initShadowbox : function()
94		{
95			Shadowbox.init();
96		},
97		initPhotoSwipe : function()
98		{
99			photoSwipeMethods.init();
100		}
101	}
102
103	/** PhotoSwipe methods
104	------------------------------ **/
105	var photoSwipeMethods = (function()
106	{
107		var BASENAME	= "photoswipe";
108
109		var photoSwipeMethods =
110		{
111			base : null, // base element
112			items : [], // photo items
113			instance : null, // PhotoSwipe instance
114			//
115			init : function()
116			{
117				this.addElements();
118				this.initItems();
119			},
120			initItems : function()
121			{
122				var _self = this;
123
124				$("a[rel=photoswipe]").each(function(i, a)
125				{
126					var $this = $(this);
127
128					var $dummyDiv	= $("<div>").css({
129						position	: "absolute",
130						overflow	: "hidden",
131						width		: 0,
132						height		: 0
133					}).appendTo(_b);
134
135					var $dummyImg	= $("<img>").attr("src", $this.attr("href")).appendTo($dummyDiv);
136
137					if($dummyImg[0].complete)
138					{
139						_self.afterLoadImg($this, $dummyImg);
140						$dummyDiv.remove();
141					}
142					else
143					{
144						$dummyImg.one("load." + BASENAME, function(e)
145						{
146							_self.afterLoadImg($this, $dummyImg);
147							$dummyDiv.remove();
148						});
149					}
150				});
151			},
152			afterLoadImg : function($a, $dummyImg)
153			{
154				var _self = this;
155
156				_self.items.push({
157					src : $dummyImg.attr("src"),
158					title : $a.attr("title"),
159					w : $dummyImg.width(),
160					h : $dummyImg.height()
161				});
162
163				var index = _self.items.length-1;
164
165				$a.on("click." + BASENAME, function(e)
166				{
167					_self.open(index);
168					return false;
169				});
170			},
171			open : function(index)
172			{
173				this.instance = new PhotoSwipe(this.base, PhotoSwipeUI_Default, this.items, {index : (index || 0)});
174				this.instance.init();
175			},
176			addElements : function()
177			{
178				this.base = $('<div class="pswp" tabindex="-1" role="dialog" aria-hidden="true"><div class="pswp__bg"></div><div class="pswp__scroll-wrap"><div class="pswp__container"><div class="pswp__item"></div><div class="pswp__item"></div><div class="pswp__item"></div></div><div class="pswp__ui pswp__ui--hidden"><div class="pswp__top-bar"><div class="pswp__counter"></div><button class="pswp__button pswp__button--close" title="Close (Esc)"></button><button class="pswp__button pswp__button--share" title="Share"></button><button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button><button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button><div class="pswp__preloader"><div class="pswp__preloader__icn"><div class="pswp__preloader__cut"><div class="pswp__preloader__donut"></div></div></div></div></div><div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap"><div class="pswp__share-tooltip"></div></div><button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)"></button><button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)"></button><div class="pswp__caption"><div class="pswp__caption__center"></div></div></div></div></div>')[0];
179				_b.append(this.base);
180			}
181		}
182
183		return photoSwipeMethods;
184	})();
185
186
187	/** Class - HeaderFixed
188	------------------------------ **/
189	// メニュー固定・下スクロールで非表示
190	var HeaderFixed = (function()
191	{
192		var BASENAME = "headerFixed";
193
194		var HeaderFixed = function($base)
195		{
196			this.$base = $base;
197
198			this.headerHeight	= this.$base.outerHeight(),
199			this.startPos		= 0;
200
201			this.init();
202		}
203		HeaderFixed.prototype = 
204		{
205			init : function()
206			{
207				var _self = this;
208
209				_w.on('load scroll', function()
210				{
211					var value = $(this).scrollTop();
212
213					if(value > _self.startPos && value > _self.headerHeight)	_self.$base.css('top', '-' + _self.headerHeight + 'px');
214					else														_self.$base.css('top', '0');
215
216					_self.startPos = value;
217				});
218			}
219		}
220		// 
221		return HeaderFixed;
222	})();
223
224
225	/** Class - PageTop
226	------------------------------ **/
227	var PageTop = (function()
228	{
229		var BASENAME = "pageTop";
230
231		var PageTop = function($base)
232		{
233			this.$base = $base;
234
235			this.init();
236		}
237		PageTop.prototype = 
238		{
239			init : function()
240			{
241				var _self = this;
242
243				_self.$base.hide();
244
245				_w.on("scroll." + BASENAME, function ()
246				{
247					if($(this).scrollTop() > 300)	_self.$base.fadeIn();
248					else							_self.$base.fadeOut();
249				});
250
251				_self.$base.click(function()
252				{
253					_hb.animate({
254						scrollTop : 0
255					}, 500);
256					return false;
257				});
258			}
259		}
260		// 
261		return PageTop;
262	})();
263
264
265	/** Class - MainImage
266	------------------------------ **/
267	var MainImage = (function()
268	{
269		var BASENAME	= "mainImage";
270
271		var CLASS_INITIALIZED = BASENAME + "-initialized";
272
273		var ID_SLIDER	= "slider";
274
275		var DATA_MAINIMAGE_OPTIONS	= DATA_PREFIX + "-" + BASENAME + "-options";
276
277		// default options
278		var defaultOptions =
279		{
280			mainImage : // slick options
281			{
282				// fade  : true,
283				// vertical  : true,
284				autoplay : true,
285				autoplaySpeed : 2000,
286				arrows : false,
287				centerMode : true,
288				centerPadding: 0,
289				dots : false,
290				slidesToShow : 1,
291				slidesToScroll : 1
292			}
293		}
294
295		var MainImage = function($base, options)
296		{
297			this.$base			= $base;
298			this.$slider		= $base.find("#" + ID_SLIDER);
299			this.$items			= this.$slider.find("li");
300			this.$images		= this.$slider.find("img");
301			this.options		= $.extend({}, defaultOptions.mainImage, options, $.parseJSON($base.attr(DATA_MAINIMAGE_OPTIONS) || "{}"));
302			// for vertical
303			this.loadedImageCount = 0;
304
305			this.init();
306		}
307		MainImage.prototype =
308		{
309			init : function()
310			{
311				if(!!this.$slider.length)
312				{
313					if(this.$items.length == 1)	this.$slider.addClass(CLASS_INITIALIZED);
314					else						this.loadImages();
315				}
316			},
317			loadImages : function()
318			{
319				var _self = this;
320
321				_self.$images.each(function()
322				{
323					if(this.complete)	_self.afterLoadImg();
324					else				this.onload = function(){ _self.afterLoadImg() };
325				});
326			},
327			afterLoadImg : function()
328			{
329				this.loadedImageCount++;
330
331				if(this.loadedImageCount >= this.$images.length)
332				{
333					this.setVerticalHeights();

334					this.initSlick();
335				}
336			},
337			initSlick : function()
338			{
339				var _self = this;
340				// slick
341				_self.$slider.on("init", function(e, slick){
342					_self.slickInstance = slick;
343					_self.setVerticalAligns();
344					_self.$slider.addClass(CLASS_INITIALIZED);
345					editableFix();
346				});
347				_self.$slider.on("afterChange", function(e, slick, currentSlide){
348					editableFix();
349				});
350
351				_self.$slider.slick(_self.options);
352			},
353			setVerticalHeights : function()
354			{
355				var _self = this;
356
357				_self.$items.each(function()
358				{
359					var $this = $(this);
360					var height = $this.height();
361					$this.height(height + _self.getMaxHeight() - $this.find("img").height());
362				});
363			},
364			setVerticalAligns : function()
365			{
366				var _self = this;
367
368				_self.$slider.find("img").each(function()
369				{
370					var $this = $(this);
371					$this.css("margin-top", (_self.getMaxHeight() - $this.height()) / 2)
372				});
373			},
374			getMaxHeight : function()
375			{
376				return Math.max.apply(null, this.$images.map(function(){ return this.height }).get())
377			}
378		}
379		//
380		return MainImage;
381	})();
382
383
384	/** Class - FormPopup
385	------------------------------ **/
386	var FormPopup = (function()
387	{
388		/** Vars
389		------------------------------ **/
390		var BASENAME				= "formPopup";
391		//class
392		var CLASS_ACTIVE			= BASENAME + "-active";
393
394		var CLASS_WINDOW			= BASENAME + "-window";
395		var CLASS_WINDOW_BODY		= CLASS_WINDOW + "-body";
396		var CLASS_TITLE				= BASENAME + "-title";
397		var CLASS_BODY				= BASENAME + "-body";
398		var CLASS_ACTIONS			= BASENAME + "-actions";
399		var CLASS_ACTION			= BASENAME + "-action";
400		var CLASS_ACTION_CLOSE		= CLASS_ACTION + "-close";
401
402		var WINDOW_MARGIN			= 20;
403
404		/** Public
405		------------------------------ **/
406		var FormPopup = function($base)
407		{
408			var _self = this;
409
410			_self.$base			= $base;
411			_self.$window		= _self.$base.find("." + CLASS_WINDOW);
412			_self.$title		= _self.$base.find("." + CLASS_TITLE);
413			_self.$body			= _self.$base.find("." + CLASS_BODY);
414			_self.$actions		= _self.$base.find("." + CLASS_ACTIONS);
415			_self.$actionClose	= _self.$base.find("." + CLASS_ACTION_CLOSE);
416			//set events
417			_self.$actionClose.on("click." + BASENAME, function()
418			{
419				_self.hide();
420			});
421			//
422			_self.show();
423		}
424		FormPopup.prototype =
425		{
426			show : function()
427			{
428				var _self = this;
429
430				_self.$base.addClass(CLASS_ACTIVE);
431				// window resize
432				_w.on("resize." + BASENAME, function()
433				{
434					_self.layout();
435				});
436				_w.trigger("resize." + BASENAME);
437			},
438			hide : function()
439			{
440				this.$base.removeClass(CLASS_ACTIVE);
441				// window resize
442				_w.off("resize." + BASENAME);
443			},
444			layout : function()
445			{
446				var _self = this;
447
448				// 20240701 modifed by takando
449				_self.$body.css("maxHeight", _w.height() - _self.$title.outerHeight(true) - _self.$actions.outerHeight(true) - (WINDOW_MARGIN * 2));
450
451				_self.$window.css({
452					top		: (_w.height() / 2) - (_self.$window.height() / 2),
453					left	: (_w.width() / 2) - (_self.$window.width() / 2)
454				});
455			}
456		}
457		//
458		return FormPopup;
459	})();
460
461
462	/** Class - ImgAutoReload
463	------------------------------ **/
464	var ImgAutoReload = (function()
465	{
466		/** Vars
467		------------------------------ **/
468		var BASENAME				= "imgAutoReload";
469
470		//data attr
471		var DATA_INTERVAL			= DATA_PREFIX + "-" + BASENAME + "-interval";
472
473		/** Public
474		------------------------------ **/
475		var ImgAutoReload = function($img)
476		{
477			var _self = this;
478
479			_self.$img			= $img;
480			_self.interval		= _self.$img.attr(DATA_INTERVAL) || 5000;
481			_self.defaultSrc	= _self.$img.attr("src");
482
483			_self.paramConnect	= (_self.defaultSrc.indexOf("?") >= 0) ? "&" : "?";
484
485			// set interval
486			_self.timer = setInterval(function()
487			{
488				var timestamp = Date.now();
489				_self.$img.attr("src", _self.defaultSrc + _self.paramConnect + timestamp);
490			}, _self.interval);
491		}
492
493		//
494		return ImgAutoReload;
495	})();
496
497
498	/** Public
499	------------------------------ **/
500	var Publish = AMS.Publish =
501	{
502		HeaderFixed		: HeaderFixed,
503		PageTop			: PageTop,
504		Popups			: Popups,
505		MainImage		: MainImage,
506		FormPopup		: FormPopup,
507		ImgAutoReload	: ImgAutoReload
508	}
509
510	// init
511	$(window).on("load", function(){ window.loaded = true; });
512	$(function()
513	{
514		$.getJSON(AMS.config.apps.GET_PATHS, function(data)
515		{
516			apps = data;
517
518			// form submit from Ajax paths
519			$("form.ams-form-submit").each(function()
520			{
521				if (!this.dataset.grecaptcha || this.dataset.grecaptcha !== 'true') {
522					$(this).on("submit", function()
523					{
524						this.action = apps.form_submit;
525					});

526				}
527			});
528			$("form.ams-form-confirm").each(function()
529			{
530				if (!this.dataset.grecaptcha || this.dataset.grecaptcha !== 'true') {
531					$(this).on("submit", function()
532					{
533						this.action = apps.form_confirm;
534					});
535				}
536			});
537		});
538		
539		init()
540	});
541
542})(jQuery, this, this.document);