https://www.safedriving.or.kr/resources/anyid/app/api/utility.js

1
2const relayPopup = function() {
3	return {
4		popup: null
5		, width: 200
6		, height: 300
7		, status: "toolbar=no,scrollbars=no,location=no,resizable=no,status=no,menubar=no"
8		, open: function(url, title, width, height) {
9			if(this.isOpened()) return;
10			var popupWidth = width;
11			var popupHeight = height;
12			var popupX = Math.round(window.screenX + (window.outerWidth/2) - (popupWidth/2));
13			var popupY = Math.round(window.screenY + (window.outerHeight/2) - (popupHeight/2));
14			this.status = this.status + ",width=" + width +",height=" + height + ",left=" + popupX + ", top=" + popupY;
15			this.popup = window.open(url, name, this.status);
16		}
17		, isOpened: function() {
18			if(null == this.popup) return false;
19			if(Array.isArray(this.popup)) return false;
20			return this.popup.closed;
21		}
22		, popupWindow: function(url, title, width, height, owner) {
23			var w = width;
24			var h = height;
25			var x = Math.round(window.screenX + (window.outerWidth/2) - (w/2));
26			var y = Math.round(window.screenY + (window.outerHeight/2) - (h/2));
27			this.status = this.status + ",width=" + w +",height=" + h + ",left=" + x + ", top=" + y;
28			var result = window.open(url, title, this.status);
29			if(!result && !!owner && !!owner.$emit) {
30				owner.$emit('alert', "팝업이 차단되어 있습니다.\n사파리일때는 팝업 차단을 해제하세요.\n(아이폰:설정 >> 앱 >> safari >> 팝업차단 허용\n방문 기록 및 웹사이트 데이터를 삭제)");
31				return null;
32			}
33			return result;
34		}
35		, closeWindow:function(popup) {
36			if(!!popup && !popup.closed) {
37				popup.close();
38			}
39			return (popup = null);
40		}
41	}
42};
43
44var gScript = [];
45
46const loadElement = function() {
47
48	function pad(number, length) {
49		var str = '' + number;
50		while (str.length < length) {
51			str = '0' + str;
52		}
53		return str;
54	}
55
56	return {
57		element: []
58		, script: []
59		, css: []
60		, loadCss: function(item) {
61			var linkElement = document.createElement('link');
62			linkElement.rel = "stylesheet";
63			linkElement.type = "text/css";
64			linkElement.href = item;
65			document.getElementsByTagName("head")[0].appendChild(linkElement);
66			this.css.push(linkElement);
67		}
68		, loadScript: async function(item) {
69
70			const oldItem = gScript.find(function(script){
71				return script === item;
72			});
73
74			if(!!oldItem) return;
75
76			var scriptElement = document.createElement('script');
77			scriptElement.type = "text/javascript";
78			scriptElement.src = item;
79			document.querySelector('body').appendChild(scriptElement);
80			if (document.addEventListener) {
81				scriptElement.onload = function(){alert("onload " + item)};
82				scriptElement.onerror = function(){alert("onerror" + item)}
83			} else {
84				scriptElement.onreadystatechange = function(){alert("onload" + item)}//function(){ LoadJsReady(scriptElement,callback);};
85			}
86			this.script.push(scriptElement);
87			gScript.push(item);
88		}
89		, loadScriptC: function(idx, item, loaded) {
90
91			const oldItem = gScript.find(function(script){
92				//console.log(script + '		' + item);
93				return script === item;
94			});
95
96			if(!!oldItem) {
97				loaded(idx);
98				return;
99			}
100
101			var target = this;
102			var now = new Date();
103			var yyyy = now.getFullYear().toString();
104			var MM = pad(now.getMonth() + 1,2);
105			var dd = pad(now.getDate(), 2);
106			var hh = pad(now.getHours(), 2);
107			var mm = pad(now.getMinutes(), 2)
108			var ss = pad(now.getSeconds(), 2)
109
110			var scriptElement = document.createElement('script');
111			scriptElement.type = "text/javascript";
112			scriptElement.src = item + "?time=" + yyyy +	MM + dd+	hh + mm + ss;
113			if (document.addEventListener) {
114				scriptElement.onload = function(){
115					target.script.push(scriptElement);
116					loaded(idx);
117				};
118				scriptElement.onerror = function(){
119				}
120			} else {
121				scriptElement.onreadystatechange = function(){
122					target.script.push(scriptElement);
123					loaded(idx);
124				}
125			}
126			document.querySelector('body').appendChild(scriptElement);
127			gScript.push(item);
128		}
129		, loadScriptD: function(idx, item, loaded) {
130			const oldItem = gScript.find(function(script){
131				return script === item;
132			});
133
134			if(!!oldItem) {
135				loaded(idx);
136				return;
137			}
138
139			var target = this;
140			var now = new Date();
141			var yyyy = now.getFullYear().toString();
142			var MM = pad(now.getMonth() + 1,2);
143			var dd = pad(now.getDate(), 2);
144
145			var scriptElement = document.createElement('script');
146			scriptElement.type = "text/javascript";
147			scriptElement.src = item + "?dt=" + yyyy +	MM + dd;
148			if (document.addEventListener) {
149				scriptElement.onload = function(){
150					target.script.push(scriptElement);
151					loaded(idx);
152				};
153				scriptElement.onerror = function(){
154				}
155			} else {
156				scriptElement.onreadystatechange = function(){
157					target.script.push(scriptElement);
158					loaded(idx);
159				}
160			}
161			document.querySelector('body').appendChild(scriptElement);
162			gScript.push(item);
163		}
164		, loadDiv: function(id) {
165			var divElement = document.createElement('div');
166			divElement.setAttribute("id", id)
167			document.querySelector('body').appendChild(divElement);
168			this.element.push(divElement);
169			return divElement;
170		}
171		, clear: function() {
172			this.element.forEach(function (item, index, array) {
173				document.querySelector('body').removeChild(item);
174			});
175
176			this.script.forEach(function (item, index, array) {
177				document.querySelector('body').removeChild(item);
178			});
179
180			this.css.forEach(function (item, index, array) {
181				document.getElementsByTagName("head")[0].removeChild(item);
182			});
183
184			this.element = [];
185			this.script = [];
186			this.css = [];
187		}
188	}
189}
190
191const evMgr = function() {
192	return {
193		log: function(data, opts) {
194			if(!opts.log) return;
195			opts.log(data);
196		}
197		, init:	function(data, opts) {
198			if(!opts.init) return;
199			opts.init(data);
200		}
201		, success:	function(data, opts) {
202			if(!opts.success) return;
203			try {
204				opts.success(data);
205			} finally {
206			 if(!!opts.log) {
207					try {
208						setTimeout(function(){opts.log(data);}, 0);
209					} catch(e) {
210					}
211				}
212			}
213		}
214		, fail:	function(err, opts) {
215			if(!opts.fail) return;
216			try {
217				opts.fail(err);
218			} finally {
219				if(!!opts.log) {
220					try {
221						setTimeout(function(){opts.log(err);}, 0);
222					} catch(e) {
223					}
224				}
225			}
226		}
227	}
228}
229
230const theme = function() {
231	const reg_ex = /[`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/ ]/gim;
232	
233	var result = {
234		adjust: function(attributes) {
235			// 테마버전 4.0.x
236			attributes["theme_4_0_0-2"] = (
237				!!attributes["theme_4_0_0"] 
238				|| !!attributes["theme_4_0_1"]
239				|| !!attributes["theme_4_0_2"]
240			)
241			// 테마버전 4.1.x
242			, attributes["theme_4_1_0-2"] = (
243				!!attributes["theme_4_1_0"] 
244				|| !!attributes["theme_4_1_1"]
245				|| !!attributes["theme_4_1_2"]
246			)
247			// 테마버전 4.2.x
248			, attributes["theme_4_2_0-2"] = (
249				!!attributes["theme_4_2_0"] 
250				|| !!attributes["theme_4_2_1"]
251				|| !!attributes["theme_4_2_2"]
252			)
253			// 테마버전 4.1.x, 4.2.x
254			, attributes["theme_4_1-2_0-2"] = (
255				attributes["theme_4_1_0-2"]
256				|| attributes["theme_4_2_0-2"]
257			)
258			// 테마버전 4.0.x, 4.1.x, 4.2.x
259			, attributes["theme_4_0-2_0-2"] = (
260				attributes["theme_4_0_0-2"] 
261				|| attributes["theme_4_1_0-2"]
262				|| attributes["theme_4_2_0-2"]
263			)
264			// 테마버전 4.0.개인, 4.1.개인,	4.2.개인
265			, attributes["theme_4_0-2_0-1"] = (
266				!!attributes["theme_4_0_0"]
267				|| !!attributes["theme_4_0_1"]
268				|| !!attributes["theme_4_1_0"]
269				|| !!attributes["theme_4_1_1"]
270				|| !!attributes["theme_4_2_0"]
271				|| !!attributes["theme_4_2_1"]
272			)
273			// 테마버전 4.0.2, 4.1.2, 4.2.2 
274			, attributes["theme_4_0-2_2"] = (
275				!!attributes["theme_4_0_2"]
276				|| !!attributes["theme_4_1_2"]
277				|| !!attributes["theme_4_2_2"]
278			)
279			// 테마버전 4.0.2, 4.1.2, 4.2.2 
280			, attributes["theme_4_1-2_2"] = (
281				!!attributes["theme_4_1_2"]
282				|| !!attributes["theme_4_2_2"]
283			);
284		}
285	};
286	return result;
287}
288
289const trapFocus = (element) => {
290      const focusableElements = element.querySelectorAll(

291        'a[href], button, textarea, input:not([type="hidden"]), select, [tabindex]:not([tabindex="-1"])'
292      );
293      const firstFocusable = focusableElements[0];
294      const lastFocusable = focusableElements[focusableElements.length - 1];
295
296      element.addEventListener('keydown', (e) => {
297        const actualActive = getDeepActiveElement();
298
299        if (e.key === 'Tab') {
300          if (e.shiftKey) {
301            // Shift + Tab
302            if (actualActive === firstFocusable) {
303              e.preventDefault();
304              lastFocusable.focus();
305            }
306          } else {
307            // Tab
308            if (actualActive === lastFocusable) {
309              e.preventDefault();
310              firstFocusable.focus();
311            }
312          }
313        }
314      });
315}
316
317const getDeepActiveElement = (doc = document) => {
318  let active = doc.activeElement;
319  while (active && active.shadowRoot && active.shadowRoot.activeElement) {
320    active = active.shadowRoot.activeElement;
321  }
322  return active;
323}
324
325export {
326	relayPopup
327	, loadElement
328	, evMgr
329	, theme
330    , trapFocus
331}