Skip to content

Commit cd3c679

Browse files
mastermagic98mastermagic98
authored
Update +al.js
1 parent c8eec3e commit cd3c679

1 file changed

Lines changed: 38 additions & 55 deletions

File tree

‎+al.js‎

Lines changed: 38 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -65,49 +65,13 @@
6565
var rgb = getFilterRgb(mainColor);
6666
var filterValue = hasOwnFilter ? '' : 'url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22%3E%3Cfilter id=%22color%22 color-interpolation-filters=%22sRGB%22%3E%3CfeColorMatrix type=%22matrix%22 values=%220 0 0 0 ' + (rgb.r / 255) + ' 0 0 0 0 ' + (rgb.g / 255) + ' 0 0 0 0 ' + (rgb.b / 255) + ' 0 0 0 1 0%22/%3E%3C/filter%3E%3C/svg%3E#color")';
6767

68-
var newStyle =
68+
var newStyle =
6969
'body .activity__loader { display: none !important; background-image: none !important; }' +
70-
'body .activity__loader.active {' +
71-
'display: block !important;' +
72-
'position: fixed !important;' +
73-
'left: 50% !important;' +
74-
'top: 50% !important;' +
75-
'transform: translate(-50%, -50%) !important;' +
76-
'width: 108px !important;' +
77-
'height: 108px !important;' +
78-
'background-image: url(\'' + escapedUrl + '\') !important;' +
79-
'background-repeat: no-repeat !important;' +
80-
'background-position: center !important;' +
81-
'background-size: contain !important;' +
82-
'filter: ' + filterValue + ' !important;' +
83-
'z-index: 9999 !important;' +
84-
'}' +
85-
'body .player-video__loader.custom::before {' +
86-
'content: "" !important;' +
87-
'position: absolute !important;' +
88-
'left: 50% !important; top: 50% !important;' +
89-
'transform: translate(-50%, -50%) !important;' +
90-
'width: 80px !important; height: 80px !important;' +
91-
'background: url(\'' + escapedUrl + '\') center/contain no-repeat !important;' +
92-
'filter: ' + filterValue + ' !important;' +
93-
'z-index: 9999 !important;' +
94-
'pointer-events: none;' +
95-
'}' +
70+
'body .activity__loader.active { display: block !important; position: fixed !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: 108px !important; height: 108px !important; background-image: url(\'' + escapedUrl + '\') !important; background-repeat: no-repeat !important; background-position: center !important; background-size: contain !important; filter: ' + filterValue + ' !important; z-index: 9999 !important; }' +
71+
'body .player-video__loader.custom::before { content: "" !important; position: absolute !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: 80px !important; height: 80px !important; background: url(\'' + escapedUrl + '\') center/contain no-repeat !important; filter: ' + filterValue + ' !important; z-index: 9999 !important; pointer-events: none; }' +
9672
'body .player-video__loader.custom { background-image: none !important; }' +
97-
'body .lampac-balanser-loader.custom, body .loading-layer__ico.custom, body .modal-loading.custom {' +
98-
'background-image: url(\'' + escapedUrl + '\') !important;' +
99-
'background-repeat: no-repeat !important;' +
100-
'background-position: center !important;' +
101-
'background-size: contain !important;' +
102-
'background-color: transparent !important;' +
103-
'filter: ' + filterValue + ' !important;' +
104-
'}' +
105-
'body .player-video__youtube-needclick > div.custom {' +
106-
'position: absolute !important; left: 50% !important; top: 50% !important;' +
107-
'transform: translate(-50%, -50%) !important; width: 8em !important; height: 8em !important;' +
108-
'background: url(\'' + escapedUrl + '\') center/contain no-repeat !important;' +
109-
'filter: ' + filterValue + ' !important; text-indent: -9999px !important; z-index: 9999 !important;' +
110-
'}';
73+
'body .lampac-balanser-loader.custom, body .loading-layer__ico.custom, body .modal-loading.custom { background-image: url(\'' + escapedUrl + '\') !important; background-repeat: no-repeat !important; background-position: center !important; background-size: contain !important; background-color: transparent !important; filter: ' + filterValue + ' !important; }' +
74+
'body .player-video__youtube-needclick > div.custom { position: absolute !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: 8em !important; height: 8em !important; background: url(\'' + escapedUrl + '\') center/contain no-repeat !important; filter: ' + filterValue + ' !important; text-indent: -9999px !important; z-index: 9999 !important; }';
11175

11276
$('<style id="aniload-id">' + newStyle + '</style>').appendTo('head');
11377
$('.player-video__loader, .lampac-balanser-loader, .loading-layer__ico, .modal-loading, .player-video__youtube-needclick > div').addClass('custom');
@@ -139,17 +103,9 @@
139103
glassFilterValue = whiteFilter;
140104
}
141105

142-
var glassStyle = glassFilterValue ?
143-
'body.glass--style .settings-param.focus .settings-folder__icon .activity__loader_prv {' +
144-
'filter: ' + glassFilterValue + ' !important;' +
145-
'-webkit-filter: ' + glassFilterValue + ' !important;' +
146-
'}' : '';
106+
var glassStyle = glassFilterValue ? 'body.glass--style .settings-param.focus .settings-folder__icon .activity__loader_prv { filter: ' + glassFilterValue + ' !important; -webkit-filter: ' + glassFilterValue + ' !important; }' : '';
147107

148-
var newStyle = '.settings-param[data-name="select_ani_mation"] .activity__loader_prv {' +
149-
'display: inline-block; width: 23px; height: 24px; margin-right: 10px; vertical-align: middle;' +
150-
'background: url(\'' + escapedUrl + '\') no-repeat 50% 50%; background-size: contain; background-color: transparent !important;' +
151-
'filter: ' + prvFilterValue + ' !important; -webkit-filter: ' + prvFilterValue + ' !important;' +
152-
'}' + glassStyle;
108+
var newStyle = '.settings-param[data-name="select_ani_mation"] .activity__loader_prv { display: inline-block; width: 23px; height: 24px; margin-right: 10px; vertical-align: middle; background: url(\'' + escapedUrl + '\') no-repeat 50% 50%; background-size: contain; background-color: transparent !important; filter: ' + prvFilterValue + ' !important; -webkit-filter: ' + prvFilterValue + ' !important; }' + glassStyle;
153109

154110
$('<style id="aniload-id-prv">' + newStyle + '</style>').appendTo('head');
155111
}
@@ -227,19 +183,28 @@
227183
},
228184
onChange: function () {
229185
if (!window.svg_loaders || window.svg_loaders.length === 0) return;
186+
230187
create_ani_modal();
188+
231189
var groupedLoaders = [];
232-
for (var i = 0; i < window.svg_loaders.length; i += 6) groupedLoaders.push(window.svg_loaders.slice(i, i + 6));
190+
for (var i = 0; i < window.svg_loaders.length; i += 6) {
191+
groupedLoaders.push(window.svg_loaders.slice(i, i + 6));
192+
}
193+
233194
var svgContent = groupedLoaders.map(function(group, groupIndex) {
234195
return '<div class="ani_loader_row">' + group.map(function(loader, index) {
235196
return '<div class="ani_loader_square selector" tabindex="0" title="Loader ' + (groupIndex * 6 + index + 1) + '"><img src="' + loader + '"></div>';
236197
}).join('') + '</div>';
237198
}).join('');
199+
238200
var defaultLoader = applyDefaultLoaderColor();
239201
var defaultButton = '<div class="ani_loader_square selector default" tabindex="0" title="' + Lampa.Lang.translate('default_loader') + '"><img src="' + defaultLoader.src + '"></div>';
202+
240203
var svgValue = Lampa.Storage.get('ani_load_custom_svg', '') || 'Наприклад https://example.com/loader.svg';
241204
var inputHtml = '<div class="ani_loader_square selector svg_input" tabindex="0" style="width: 252px;"><div class="label">' + Lampa.Lang.translate('custom_svg_input') + '</div><div class="value">' + svgValue + '</div></div>';
205+
242206
var topRowHtml = '<div style="display: flex; gap: 20px; padding: 0; justify-content: center; margin-bottom: 25px;">' + defaultButton + inputHtml + '</div>';
207+
243208
var modalHtml = $('<div>' + topRowHtml + '<div class="ani_picker_container">' + svgContent + '</div></div>');
244209

245210
Lampa.Modal.open({
@@ -252,9 +217,11 @@
252217
Lampa.Controller.toggle('settings_component');
253218
Lampa.Controller.enable('menu');
254219
},
255-
onSelect: function (element) {
256-
if (!element.length || !(element[0] instanceof HTMLElement)) return;
257-
var selected = element[0];
220+
onSelect: function (elements) {
221+
if (!elements || elements.length === 0) return;
222+
223+
var selected = elements[0];
224+
258225
if (selected.classList.contains('svg_input')) {
259226
Lampa.Noty.show(Lampa.Lang.translate('svg_input_hint'));
260227
Lampa.Modal.close();
@@ -274,16 +241,32 @@
274241
Lampa.Storage.set('ani_load_custom_svg', value);
275242
Lampa.Storage.set('ani_load', value);
276243
applyCurrentLoader();
244+
Lampa.Controller.toggle('settings_component');
245+
Lampa.Controller.enable('menu');
277246
});
278247
return;
279248
}
249+
280250
if (selected.classList.contains('default')) {
281251
Lampa.Storage.set('ani_load', '');
282252
} else {
283253
var img = selected.querySelector('img');
284254
Lampa.Storage.set('ani_load', img ? img.src : '');
285255
}
256+
286257
applyCurrentLoader();
258+
259+
// Флеш для підтвердження вибору
260+
var flashElement = document.querySelector('.activity__loader');
261+
if (flashElement) {
262+
flashElement.classList.add('active');
263+
flashElement.style.display = 'block';
264+
setTimeout(function () {
265+
flashElement.classList.remove('active');
266+
flashElement.style.display = 'none';
267+
}, 500);
268+
}
269+
287270
Lampa.Modal.close();
288271
Lampa.Controller.toggle('settings_component');
289272
Lampa.Controller.enable('menu');

0 commit comments

Comments
 (0)