https://verticalgarage.jp/assets/front/js/jquery.popup_item.js?1661144100

1$(function(){
2	var $popups = $('*[data-popup]');
3	$popups.each(function() {
4		var popup = $(this).popup();
5	});
6});
7
8(function($) {
9	var plugname = 'popup';
10
11	var $screen = null;
12	var opentime = 0;
13
14	/**
15	* コンストラクタ
16	*/
17	var Class = function(popupWindow, options) {
18		this.popupWindow = popupWindow;
19		this.options = $.extend({}, $.fn[plugname].defaults, options, this.popupWindow.data());
20		this.popupWindow.data(plugname, this);
21
22		this.popupWindow.hide().css({
23			'z-index': (this.options['zindex'] + 1),
24		}).addClass('popup-window');
25
26		var object = this;
27		$('*[data-popup_id=' + this.popupWindow.attr('id') + ']').bind('click', function (event) {
28			event.preventDefault();
29			object.open();
30			return false;
31		});
32
33		// ロード時にウィンドウをオープンするか
34		if (object.isOpenOnload()) {
35			$(window).bind('load', function() {
36				setTimeout(function() {
37					object.open();
38				}, 50 + object.options['open_onload_delay']);
39			});
40		}
41
42		// 閉じる
43		this.popupWindow.find(this.options['selector_close']).bind('click', function(event) {
44			event.preventDefault();
45			object.close();
46			return false;
47		});
48		
49		// 次回から表示しない
50		this.popupWindow.find(this.options['selector_undisplay_checkbox']).bind('change', function(event) {
51			event.preventDefault();
52			object.changeUndisplay($(this));
53			return false;
54		});
55
56		// リンク先が無いアンカーはリンクを無効にする
57		if (object.options['remove_link_if_empty_href']) {
58			this.popupWindow.find('a[href=""]').each(function() {
59				var $target = $(this);
60				$target.replaceWith($target.html());
61			});
62		}
63
64		this.popupWindow.find('a[href!=""]').each(function() {
65			var $target = $(this);
66			if ($target.attr('href') != '#') {
67				$target.bind('click', function() {
68					object.sendGaEvent('click');
69				});
70			}
71		});
72	}
73
74	Class.prototype.open = function() {
75		this.openScreen();
76
77		this.setPopupPosition();
78
79		var object = this;
80		this.popupWindow.fadeIn(this.options['speed'], function() {
81			object.setPopupPosition();
82		});
83
84		object.sendGaEvent('open');
85		opentime = (new Date()).getTime();
86
87		return this;
88	};
89
90	Class.prototype.isOpenOnload = function() {
91		if (this.options['open_onload']) {
92			var cookieValue = this.getCookie();
93			if (!('undisplay' in cookieValue) || !cookieValue['undisplay']) {
94				if (this.options['expires_type'] == 'daily') {
95					var now = getToday();
96					if (!('last_display_date' in cookieValue) || cookieValue['last_display_date'] != now) {
97						this.saveCookie($.extend(this.getCookie(), {'last_display_date': now}), this.options['cookie_expires']);
98						return true;
99					}
100				} else {
101					//this.saveCookie($.extend(this.getCookie(), {'undisplay': true}), 0);
102					return true;
103				}
104			}
105		}
106
107		return false;
108	}
109
110	Class.prototype.setPopupPosition = function() {
111	//	var windowWidth  = $(window).width(),
112	//		windowHeight = $(window).height(),
113	//		scrollTop = $(window).scrollTop(),
114	//		popupWindowWidth  = this.popupWindow.outerWidth(),
115	//		popupWindowHeight = this.popupWindow.outerHeight(),
116	//		left = Math.max(((windowWidth - popupWindowWidth) / 2), 10),
117	//		top = Math.max(((windowHeight - popupWindowHeight) / 2), 10);
118    //
119	//	//this.popupWindow.css({});
120	}
121
122	Class.prototype.openScreen = function() {
123		if (!this.options['screen']) {
124			return;
125		}
126
127		if ($screen == null) {
128			$screen = $('<div/>');
129			//$screen.hide().css({
130			//	position: 'fixed', top: 0, left: 0,
131			//	'background-color': this.options['screen_bgcolor'],
132			//	'z-index': this.options['zindex']
133			//});
134		}
135
136		$(window).bind('resize', this.setScreenSize);
137
138		var object = this;
139		$screen.bind('click', function() {
140			if (object.options['close_onclick_screen']) {
141				object.close();
142			}
143		});
144
145		this.setScreenSize();
146
147		$screen.fadeTo(this.options['screen_speed'], this.options['screen_opacity']);
148
149		return this;
150	};
151
152	Class.prototype.setScreenSize = function() {
153		var windowWidth  = $(window).width(),
154			windowHeight = $(window).height();
155		
156		$screen.css({
157			width: windowWidth + 'px',
158			height: windowHeight + 'px'
159		});
160	}
161
162	Class.prototype.close = function() {
163		this.popupWindow.fadeOut(this.options['speed']);
164
165		this.closeScreen();
166
167		this.sendGaEvent('close');
168
169		opentime = 0;
170		this.saveCookie($.extend(this.getCookie(), {'undisplay': true}), 0);
171		return this;
172	}
173
174	Class.prototype.closeScreen = function() {
175		$(window).unbind('resize', this.setScreenSize);
176		$screen.unbind('click');
177		$screen.fadeOut(this.options['screen_speed'], function() {
178			$screen.hide();
179		});
180	}
181
182	Class.prototype.changeUndisplay = function($target) {
183		var isChecked = $target.is(':checked');
184		if (isChecked) {
185			this.saveCookie($.extend(this.getCookie(), {'undisplay': true}), this.options['cookie_expires']);
186		} else {
187			this.saveCookie($.extend(this.getCookie(), {'undisplay': false}), this.options['cookie_expires']);
188		}
189		return this;
190	}
191
192	Class.prototype.getCookie = function() {

193		$.cookie.json = true;
194
195		var data = '';
196		if (typeof $.cookie(this.options['cookie']) != 'undefined') {
197			data = $.cookie(this.options['cookie']);
198		}
199
200		if (data != '' && 'last_cookie_id' in data && data['last_cookie_id'] != this.getEachCookieId()) {
201			this.removeCookie();
202			data = {};
203		}
204
205		return data != '' ? data : {};
206	}
207
208	Class.prototype.saveCookie = function(data, expires) {
209		data['last_cookie_id'] = this.getEachCookieId();
210
211		$.cookie.json = true;
212
213		var params = {path: '/'};
214		if (expires > 0) {
215			params['expires'] = expires;
216		}
217
218		$.cookie(this.options['cookie'], data, params);
219	}
220
221	Class.prototype.removeCookie = function() {
222		$.removeCookie(this.options['cookie']);
223	}
224
225	Class.prototype.getEachCookieId = function() {
226		var id = this.popupWindow.attr('id');
227		if (typeof id == 'undefined' || id == '') {
228			id = 'default';
229		}
230		return id;
231	}
232
233	Class.prototype.sendGaEvent = function(label) {
234		if (typeof ga != 'undefined' && this.options['send_ga']) {
235			var category = this.options['send_ga_category'];
236			var action   = this.options['send_ga_action'] == '' ? this.getEachCookieId() : this.options['send_ga_action'];
237			var value = opentime > 0 ? (new Date()).getTime() - opentime : 0;
238
239			if (value > 0) {
240				ga('send', 'event', category, action, label, parseInt(value));
241			} else {
242				ga('send', 'event', category, action, label);
243			}
244		}
245	}
246
247	/**
248	* 全プラグイン共通
249	*/
250	$.fn[plugname] = function(options) {
251		return new Class(this, options);
252	}
253
254	/**
255	* デフォルトパラメータ
256	*/
257	$.fn[plugname].defaults = {
258		speed          : 'normal',	// ポップアップウィンドウの開閉スピード
259		zindex         : 1000,		// スクリーンのz-index、ポップアップウィンドウはこの値＋１
260		screen         : true,		// スクリーンを表示するか？
261		screen_opacity : 0.5,		// スクリーンの透過
262		screen_speed   : 'normal',	// スクリーンの開閉スピード
263		screen_bgcolor : '#000000',	// スクリーンの背景色
264		close_onclick_screen : true,	// スクリーンクリックで閉じるか？
265
266		expires_type   : '',		// 次回表示までの有効期限　daily：１日１回
267
268		open_onload        : false,			// documentロード時にポップアップを開くか？
269		open_onload_delay  : 500,			// documentロード時にポップアップを開くときの遅延時間
270		cookie             : 'open_popup_item_list',	// documentロード時にポップアップを開くときの表示状態を保存するクッキー
271		cookie_expires     : 365,			// documentロード時にポップアップを開くときの表示状態を保存するクッキーの有効期限
272
273		selector_close     : '.close',							// 閉じるボタンのselector
274		selector_undisplay : '.undisplay',	// 「次回から表示しない」boxのselector
275		selector_undisplay_checkbox : '.undisplay input[type=checkbox]',	// 「次回から表示しない」checkboxのselector
276
277		remove_link_if_empty_href : false,	// hrefが空の場合にアンカーを削除するか？
278
279		send_ga          : true,		// Google Analyticsにイベントを送信するか？する場合、表示とクリックのイベントが通知されます。
280		send_ga_category : 'popup',		// GAに送信するイベントのカテゴリ
281		send_ga_action   : '',			// GAに送信するイベントのアクション：空の場合はBOXのIDが使われる（IDも空の場合はdefault）
282	};
283
284	function getToday() {
285		var now = new Date();
286		return now.getFullYear() +
287			("0" + (now.getMonth() + 1)).slice(-2) +
288			("0" + now.getDate()).slice(-2);
289	}
290})(jQuery);