Fix/Improved: Slider mobile (#4416)

* add close button, add content slider div

* add &ajax=1#slider to the links

* CSS

* fix showPW functionality

* open slider after received Ajax

* do not show empty slider

* RTL CSS

* fixed code smell

* improved: links prep via JS

* Redirect anchor

* enable #anchors in printuri()

* enable #slider when config was saved

* Active sliding via JS

Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr>

1 files changed, 9 insertions, 5 deletions

diff --git a/p/scripts/extra.js b/p/scripts/extra.js
index 7be235aa4..4ae0bcdf0 100644
--- a/p/scripts/extra.js
+++ b/p/scripts/extra.js
@@ -148,16 +148,20 @@ function open_slider_listener(ev) {
 	const a = ev.target.closest('.open-slider');
 	if (a) {
 		if (!context.ajax_loading) {
-			location.href = '#slider'; // close menu/dropdown
 			context.ajax_loading = true;
-
+			const slider = document.getElementById('slider');
+			const slider_content = document.getElementById('slider-content');
 			const req = new XMLHttpRequest();
-			req.open('GET', a.href + '&ajax=1', true);
+			slider_content.innerHTML = '';
+			slider.classList.add('sliding');
+			const ahref = a.href + '&ajax=1#slider';
+			req.open('GET', ahref, true);
 			req.responseType = 'document';
 			req.onload = function (e) {
-				const slider = document.getElementById('slider');
+				location.href = '#slider'; // close menu/dropdown
+				slider.classList.add('active');
 				slider.scrollTop = 0;
-				slider.innerHTML = this.response.body.innerHTML;
+				slider_content.innerHTML = this.response.body.innerHTML;
 				context.ajax_loading = false;
 				slider.dispatchEvent(freshrssSliderLoadEvent);
 			};