https://hou2touch.com/nassets/3e6171b4/js/frames/grid.js?v=1765633899

1jQuery.widget('gc.gcVideoGrid', $.gc.gcFileSelectorFolder, {
2	options: {
3		mainHash: null,
4		previewList: []
5	},
6	mapFrameHashToSrc: null,
7	currentPreview: null,
8	watermarkEnableInput: false,
9	_create: function() {
10		var $messageEl = $('<div></div>');
11		this.messageEl = $messageEl;
12		this.element.addClass("grid-content");
13        this.element.css('display', 'block');
14        this.element.append($messageEl);
15		var that = this;
16		ajaxCall('/pl/fileservice/video/info', {
17			'file-hash': this.options.mainHash,
18			'result-format': 'json'
19		}, {crossDomain: true}, function (response) {
20			if (response.videoHash !== null) {
21				that.gridEnabled = response.gridEnabled;
22				that.gridPosition = response.gridPosition;
23				that.gridSize = response.gridSize;
24				that.gridOffset = ((response.chunkPadSummator * response.chunkDuration) / 10).toFixed(0) * 10;
25				that.chunkDuration = response.chunkDuration;
26				that.chunkPadSummator = response.chunkPadSummator;
27				that.pregeneratedViewers = response.pregeneratedViewers;
28				that.viewersSize = response.viewersSize;
29				that.dataSize = response.dataSize;
30				that.viewersNumber = response.viewersNumber;
31				that.viewersSize = response.viewersSize;
32				that.isGoodQuality = response.isGoodQuality;
33				that.hasVideoStream = response.hasVideoStream;
34
35				that.element.append(that.generateHtml());
36				that.filesEl = $('');
37				that.filesEl.appendTo(that.element);
38
39				if ( that.gridSizeSelect ) {
40					var value = (that.gridSizeSelect[0].dataset['value']);
41					that.gridSizeSelect[0].value = value ? value : 'middle';
42				}
43
44				if ( that.gridOffsetSelect ) {
45					var offset = (that.gridOffsetSelect[0].dataset['value']);
46					that.gridOffsetSelect[0].value = offset ? offset : '0';
47				}
48
49				if ( that.gridPregenerateSelect ) {
50					var viewers = (that.gridPregenerateSelect[0].dataset['value']);
51					that.gridPregenerateSelect[0].value = viewers ? viewers : '0';
52				}
53
54				that.onGridEnabled();
55				that.gridStatusCheckbox[0].addEventListener('change', that.onGridEnabled.bind(that));
56
57				if ( !that.rootEl ) {
58					return;
59				}
60
61				that.submitBtn[0].addEventListener('click', that.onSubmitBtnClick.bind(that));
62				that.gridPositions[0].addEventListener('click', that.onPositionDomClick.bind(that));
63				that.angle = {
64					'left-top': false, 'center-top': false, 'right-top': false,
65					'left-middle': false, 'full-screen': false, 'right-middle': false,
66					'left-bottom': false, 'center-bottom': false, 'right-bottom': false
67				};
68
69				that.initGrid();
70				that.initSelected();
71			} else {
72				$messageEl.text(window.tt('common', 'Это видео еще не обработано'));
73			}
74		});
75	},
76	onSubmitBtnClick: function() {
77		var gridStatus = this.gridStatusCheckbox[0].checked ? 1 : 0;
78		var gridOffset = this.gridOffsetSelect[0].value;
79		var gridPregenerate = this.gridPregenerateSelect[0].value;
80		var gridSize = this.gridSizeSelect[0].value;
81		var gridPositions = this.wpsInput[0].value;
82		var that = this;
83
84		ajaxCall('/pl/fileservice/video/grid', {
85			'file-hash': this.options.mainHash,
86			'grid-status' : gridStatus,
87			'grid-size' : gridSize,
88			'grid-positions' : gridPositions,
89			'grid-offset' : parseInt((gridOffset / that.chunkDuration).toFixed(0)),
90			'grid-pregenerate' : gridPregenerate,
91			'result-format': 'json'
92		}, {}, function (response) {
93		});
94	},
95	init: function() {
96	},
97	initGrid: function() {
98		var that = this;
99		var init = /** @type {string} */ (this.rootEl[0].dataset['value']);
100		init.split(' ').forEach(function(key) {
101			if (key.trim() !== '') {
102				that.angle[key] = true;
103			}
104		});
105	},
106	generateHtml: function() {
107		var self = this;
108		var hash = self.options.mainHash;
109
110		var gridEnabled = this.gridEnabled;
111		var gridSize = this.gridSize;
112		var gridOffset = this.gridOffset;
113		var gridPosition = this.gridPosition;
114		var gridPregenerate = this.pregeneratedViewers;
115
116		$gridStatusCheckbox = $('<input id="wm_chb" type="checkbox" {gridEnabled}>'.replace('{gridEnabled}', gridEnabled ? 'checked' : ''));
117
118		$gridPregenerateSelect = $(
119			'<select id="watermark-pregenerate" class="wss-list" data-value="{gridPregenerate}">'.replace('{gridPregenerate}', gridPregenerate) +
120			'<option value="5">' + window.tt('common', '{n} зритель|{n}

120 зрителя|{n} зрителей', 5) + ' (' + window.tt('common', 'по умолчанию') + ')' +'</option>' +
121			'<option value="100">' + window.tt('common', '{n} зритель|{n} зрителя|{n} зрителей', 100) + '</option>' +
122			'<option value="500">' + window.tt('common', '{n} зритель|{n} зрителя|{n} зрителей', 500) + '</option>' +
123			'<option value="1000">' + window.tt('common', '{n} зритель|{n} зрителя|{n} зрителей', 1000) + '</option>' +
124			'</select>'
125		);
126    $gridOffsetSelect = $(
127      '<select id="watermark-offset" class="wss-list" data-value="{gridOffset}">'.replace('{gridOffset}', gridOffset) +
128      '<option value="0">' + window.tt('common', 'Сразу') + ' (' + window.tt('common', 'по умолчанию') + ')' + '</option>' +
129      '<option value="10">' + window.tt('common', 'С {n} секунды', 10) + '</option>' +
130      '<option value="20">' + window.tt('common', 'С {n} секунды', 20) + '</option>' +
131      '<option value="30">' + window.tt('common', 'С {n} секунды', 30) + '</option>' +
132      '</select>'
133    );
134		$gridSizeSelect = $(
135			'<select id="watermark-size" class="wss-list" data-value="{gridSize}">'.replace('{gridSize}', gridSize) +
136			'<option value="small">' + window.tt('common', 'Маленький') + '</option>' +
137			'<option value="middle">' + window.tt('common', 'Средний') + '</option>' +
138			'<option value="big">' + window.tt('common', 'Большой') + '</option>' +
139			'</select>'
140		);
141		$gridPositions = $(
142			'<div id="wps-video-preview" class="wps-video-preview js--wps-video-preview">' +
143				'<div class="wps-position" data-position="left-top"></div>' +
144				'<div class="wps-position" data-position="center-top"></div>' +
145				'<div class="wps-position" data-position="right-top"></div>' +
146				'<div class="wps-position" data-position="left-middle"></div>' +
147				'<div class="wps-position-without-border" data-position="full-screen">' +
148					'<span class="inside-icon fa fa-arrows-alt fa-2x" data-position="full-screen"></span></div>' +
149				'<div class="wps-position" data-position="right-middle"></div>' +
150				'<div class="wps-position" data-position="left-bottom"></div>' +
151				'<div class="wps-position" data-position="center-bottom"></div>' +
152				'<div class="wps-position" data-position="right-bottom"></div>' +
153			'</div>'
154		);
155		$wpsInput = $('<input id="wps-input-position" type="hidden" name="watermark_position">');
156
157		$rootEl = $(
158			'<div class="wps-root js--wps-root" data-value="{gridPosition}">'.replace('{gridPosition}', gridPosition) +
159			'<div class="wps-label">' +
160			window.tt('common', 'Выберите положения watermark-a. По умолчанию будет выбрана вся поверхность видео.') +
161			'</div>'
162		);
163		$rootEl.append($gridPositions);
164		$rootEl.append('</div>');
165
166		$wssSizeList = $('<div class="wss-list-text grid-size" id="wss-list-text"></div>');
167		$wssOffsetList = $('<div class="wss-list-text grid-offset" id="wss-list-text"></div>');
168		$wssPregenerateList = $('<div class="wss-list-text grid-pregenerate" id="wss-list-text"></div>');
169
170		$submitBtn = $(
171			'<div id="uploadifive-undefined" class="uploadifive-button" style="height: 30px; line-height: 30px; overflow: hidden; position: relative; text-align: center; width: 120px;">'
172			+ window.tt('common', 'Сохранить')
173			+ '<input type="submit" style="font-size: 30px; opacity: 0; position: absolute; right: -3px; top: -3px; z-index: 999;">'
174			+'</div>'
175		);
176
177		self.gridStatusCheckbox = $gridStatusCheckbox;
178		self.gridSizeSelect = $gridSizeSelect;
179		self.gridPositions = $gridPositions;
180		self.gridOffsetSelect = $gridOffsetSelect;
181		self.gridPregenerateSelect = $gridPregenerateSelect;
182		self.rootEl = $rootEl;
183
184		self.wssPregenerateList = $wssPregenerateList;
185		self.wssOffsetList = $wssOffsetList;
186		self.wssSizeList = $wssSizeList;
187
188		self.wpsInput = $wpsInput;
189		self.submitBtn = $submitBtn;
190
191		var $content = $('<div class="wdb-root">');
192		$content.append($gridStatusCheckbox);
193
194		var $usersTitle = window.tt('common', '{n} пользователь|{n} пользователя|{n} пользователей', self.viewersNumber);
195
196		var $goodQualityDisclaimer = self.isGoodQuality
197			? ''
198			: window.tt('common', 'Видеозащита применится только после полной подготовки видео, это может занять некоторое время')
199			+ '.<br/>'
200			+ window.tt('common', 'До окончания подготовки пользователи не смогут смотреть видео')
201			+ '.<br/>';
202
203		$content.append(
204			'<label for="wm_chb">&nbsp;' + window.tt('common', 'Защитить видео с помощью watermark') + '</label>' +
205			'<div class="text-muted">' +
206			'<p class="text-danger"><b>' +
207			window.tt('common', 'Включенная видеозащита увеличивает занимаемый размер видео в два раза') + '.<br/>' +
208			/*'Вы можете удалить файл либо выключить видеозащиту, чтобы освободить дисковое пространство.<br/>' +
209			'Сейчас видеозащита сгенерирована для ' +
210			self.viewersNumber + ' ' + $usersTitle + ' и занимает '+
211			self.viewersSize + ' ('+
212			self.viewersNumber * 3 +'% от исходного объема ' +
213			self.dataSize + ')<br/>' +
214			'Занятое дисковое пространство: ' + window.usedSize + ' из ' + window.totalAllowedSize + ' (' + window.usedSizePercent +')</p><br/>' +*/
215			'</p>' + $goodQualityDisclaimer +
216			'<br/>' +
217			window.tt('common', 'При включении этой опции в видео добавляется код, уникальный для каждого ученика') +
218			'.<br/>' +
219			window.tt('common', 'Подготовка такого видео к просмотру может занимать некоторое время (до 30 секунд)') +
220			'<br/><br/>' +
221			window.tt('common', 'Если материалы урока бесплатные для пользователей, то нет смысла их защищать') +
222			'.</div></div>'
223		);
224		$content.append('<div class="wss-root">');
225		$content.append($wpsInput);
226
227		if(window.params_52) {
228			$content.append(
229				'<label for="watermark-pregenerate" class="wss-label">'
230				+ window.tt('common', 'Предгенерация')
231				+ ':</label>'
232			);
233			$content.append($gridPregenerateSelect);
234			$content.append($wssPregenerateList);
235			$content.append('<p>');
236		}
237
238		if(window.params_52 || window.iCanSelectGridOffset) {
239			$content.append(
240				'<label for="watermark-offset" class="wss-label">'
241				+ window.tt('common', 'Начинать показ')
242				+ ':</label>'
243			);
244			$content.append($gridOffsetSelect);
245			$content.append($wssOffsetList);
246			$content.append('<p>');
247		}
248
249		$content.append(
250			'<label for="watermark-size" class="wss-label">'
251			+ window.tt('common', 'Размер watermark-a')
252			+ ':</label>'
253		);
254		$content.append($gridSizeSelect);
255		$content.append($wssSizeList);
256		$content.append('</div>');
257		$content.append($rootEl);
258		$content.append($submitBtn);
259
260		return $content;
261	},
262	onGridEnabled: function() {
263		if (!this.gridStatusCheckbox[0].checked) {
264			this.wssPregenerateList[0].innerText = this.gridPregenerateSelect[0].options[this.gridPregenerateSelect[0].selectedIndex].innerText
265			this.wssOffsetList[0].innerText = this.gridOffsetSelect[0].options[this.gridOffsetSelect[0].selectedIndex].innerText
266			this.wssSizeList[0].innerText = this.gridSizeSelect[0].options[this.gridSizeSelect[0].selectedIndex].innerText
267		}
268
269		this.wssPregenerateList[0].classList.toggle('wss-list-text--disabled', this.gridStatusCheckbox[0].checked);
270		this.wssOffsetList[0].classList.toggle('wss-list-text--disabled', this.gridStatusCheckbox[0].checked);
271		this.wssSizeList[0].classList.toggle('wss-list-text--disabled', this.gridStatusCheckbox[0].checked);
272
273		positionEnableClick = this.gridStatusCheckbox[0].checked;
274
275		this.gridPregenerateSelect[0].classList.toggle('wss-list--disabled', !this.gridStatusCheckbox[0].checked);
276		this.gridOffsetSelect[0].classList.toggle('wss-list--disabled', !this.gridStatusCheckbox[0].checked);
277		this.gridSizeSelect[0].classList.toggle('wss-list--disabled', !this.gridStatusCheckbox[0].checked);
278		this.gridPositions[0].classList.toggle('wps-video-preview--disabled', !this.gridStatusCheckbox[0].checked);
279	},
280	initSelected: function () {
281		var that = this;
282		var result = '';
283
284		Object.keys(this.angle).map(function (key) {
285			var elem = /** @type {HTMLElement} */ (that.rootEl[0].querySelector('[data-position="' + key + '"]'));
286			if (elem) {
287				if (that.angle[key]) {
288					result += ' ' + key;
289					if(key == 'full-screen')
290						that.gridPositions.css('background', '#ffffff');
291					else
292						elem.classList.add('wps-position--selected');
293				} else {
294					if(key == 'full-screen')
295						that.gridPositions.css('background', '#8e8e8e');
296					else
297						elem.classList.remove('wps-position--selected');
298				}
299			}
300		});
301
302		this.wpsInput[0].value = result;
303	},
304	onPositionDomClick: function (event) {
305		if (!positionEnableClick) {
306			return;
307		}
308		var elem = /** @type {HTMLElement} */ (event.target);
309		var position = elem.dataset['position'];
310		if (position === undefined) {
311			return;
312		}
313
314		this.angle[position] = !this.angle[position];
315		this.initSelected();
316	}
317} );