std-js/dataHandlers.js at master · shgysk8zer0/std-js · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
/**
 * HTML API using data-* attributes
 */

export function show() {
	const target = document.querySelector(this.dataset.show);
	target.show();
}

export function showModal() {
	const target = document.querySelector(this.dataset.showModal);
	target.showModal();
}

export function close() {
	const target = document.querySelector(this.dataset.close);
	if (this.dataset.hasOwnProperty('returnValue')) {
		target.close(this.dataset.returnValue);
	} else {
		target.close();
	}
}

export function scrollTo() {
	const target = document.querySelector(this.dataset.scrollTo);
	target.scrollIntoView({
		behaviour: 'smooth',
		block: 'start'
	});
}

export function remove() {
	const targets = document.querySelectorAll(this.dataset.remove);
	targets.forEach(target => target.remove());
}

export function fullscreen() {
	document.querySelector(this.dataset.fullscreen).requestFullscreen();
}

export function changeAttrs() {
	const attrs = JSON.parse(this.dataset.attrs);
	Object.keys(attrs).forEach(sel => {
		let targets = document.querySelectorAll(sel);
		targets.forEach(target => {
			Object.keys(attrs[sel]).forEach(attr => {
				if (attrs[sel][attr] === false) {
					target.removeAttribute(attr);
				} else {
					target.setAttribute(attr, attrs[sel][attr]);
				}
			});
		});
	});
}

export function toggleHidden() {
	document.querySelectorAll(this.dataset.toggleHidden).forEach(el => {
		el.hidden = ! el.hidden;
	});
}

export function share(event) {
	event.preventDefault();
	event.stopPropagation();
	const containerEl = this.dataset.share === '' ? this : document.querySelector(this.dataset.share);
	let url = location.href, text = '', title = document.title;

	if (containerEl instanceof HTMLImageElement) {
		url = containerEl.src;
		title = containerEl.alt;
	} else if (containerEl instanceof HTMLAnchorElement) {
		url = containerEl.href;
		title = containerEl.title;
		text = containerEl.textContent;
	} else if (containerEl instanceof Element) {
		const urlEl = containerEl.closest('[itemtype]')
			.querySelector('[itemprop="url"], [itemprop="contentUrl"], [rel="canonical"]');
		const titleEl = containerEl.closest('[itemtype]')
			.querySelector('[itemprop="name"], [itemprop="headline"], title');
		const textEl = containerEl.closest('[itemtype]')
			.querySelector('[itemprop="description"], [name="description"]');

		if (urlEl instanceof Element) {
			if (urlEl.hasAttribute('content')) {
				url = urlEl.getAttribute('content');
			} else if (urlEl.hasAttribute('href')) {
				url = urlEl.href;
			} else {
				url = urlEl.textContent;
			}
		} else {
			url = location.href;
		}

		if (titleEl instanceof Element) {
			if (titleEl.hasAttribute('content')) {
				title = titleEl.getAttribute('content');
			} else {
				title = titleEl.textContent;
			}
		} else {
			title = document.title;
		}

		if (textEl instanceof Element) {
			if (textEl.hasAttribute('content')) {
				text = textEl.getAttribute('content');
			} else {
				text = textEl.textContent;
			}
		}
	}

	navigator.share({
		url: new URL(url, location.origin).toString(),
		title,
		text,
	}).catch(console.error);
}