summaryrefslogtreecommitdiff
path: root/plugins/shorten_expanded/init.js
blob: deb3b639326b2f6083510b81ab45f5c6c9c7166e (plain)
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
/* global Plugins, __, require, PluginHost, App */

Plugins.Shorten_Expanded = {
	threshold: 1.5, // of window height
	debounce: (callback, wait) => {
		let timeoutId = null;
		return (...args) => {
			window.clearTimeout(timeoutId);
			timeoutId = window.setTimeout(() => {
				callback(...args);
			}, wait);
		};
	},
	observer: false,
	shorten_if_needed: function(row) {

		const content = row.querySelector(".content");
		const content_inner = row.querySelector(".content-inner");

		//console.log('shorten_expanded', row.id, content.offsetHeight, 'vs', this.threshold * window.innerHeight);

		if (content && content_inner && !row.hasAttribute('data-already-shortened') && content.offsetHeight >= this.threshold * window.innerHeight) {

			row.setAttribute('data-already-shortened', true);

			const attachments = row.querySelector(".attachments-inline"); // optional

			content_inner.innerHTML = `
				<div class="content-shrink-wrap">
					${content_inner.innerHTML}
					${attachments ? attachments.innerHTML : ''}
				</div>
				<button dojoType="dijit.form.Button" class="alt-info expand-prompt" onclick="return Plugins.Shorten_Expanded.expand('${row.id}')" href="#">
					${App.FormFields.icon('add')}
					${__("Expand article")}
				</button>`;

			if (attachments)
				attachments.innerHTML = "";

			dojo.parser.parse(content_inner);

			return true;
		}
		return false;
	},
	process_row: function(row) {

		if (this.shorten_if_needed(row))
			return;

		this.observer.observe(row);
	},
	expand: function(id) {
		const row = App.byId(id);

		if (row) {
			const link = row.querySelector('.expand-prompt');

			row.querySelector('.content-shrink-wrap')?.classList.remove('content-shrink-wrap');
			if (link) Element.hide(link);
		}

		return false;
	}
}

require(['dojo/_base/kernel', 'dojo/ready'], (dojo, ready) => {
	ready(() => {
		const self = Plugins.Shorten_Expanded;

		self.observer = new ResizeObserver(self.debounce((entries) => {
			entries.forEach((entry) => {
				const row = entry.target;

				self.shorten_if_needed(row);
			});
		}));

		PluginHost.register(PluginHost.HOOK_ARTICLE_RENDERED_CDM, function(row) {
			self.process_row(row);
			return true;
		});
	});
});