From 974096bc56595d3b9571144b00748a95ad893762 Mon Sep 17 00:00:00 2001
From: Arkadiusz Wieczorek <kontakt@arkadiusz-wieczorek.pl>
Date: Sun, 22 May 2022 17:29:10 +0200
Subject: [PATCH] Stick to one window

---
 .../report-window/screenshot-generator.tsx    | 24 ++++++++++++++++++-
 components/sidebar/sidebar.tsx                |  8 +------
 components/toolbar/toolbar.tsx                |  9 ++-----
 3 files changed, 26 insertions(+), 15 deletions(-)

diff --git a/components/report-window/screenshot-generator.tsx b/components/report-window/screenshot-generator.tsx
index af0142d..f225446 100644
--- a/components/report-window/screenshot-generator.tsx
+++ b/components/report-window/screenshot-generator.tsx
@@ -59,6 +59,19 @@ export default function ScreenshotGenerator({
         return response as screenshotTask;
     }
 
+    function downloadFiles() {
+        const urls = images.map((el) => `http://65.108.60.135:3000/static/${taskId}/${el}`);
+
+        for (const url of urls) {
+            let a = document.createElement('a');
+            a.setAttribute('href', url);
+            a.setAttribute('download', '');
+            a.setAttribute('target', '_blank');
+            a.click();
+        }
+        setReportWindowMode('preview');
+    }
+
     return (
         <div className="generator-container">
             {mode === 'idle' ? (
@@ -103,11 +116,18 @@ export default function ScreenshotGenerator({
             {mode === 'in_progress' || mode === 'finished' ? (
                 <Fragment>
                     <h1>Przygotowujemy zrzuty ekranów</h1>
+                    <p>
+                        Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolore sint
+                        laudantium blanditiis aperiam quos expedita voluptatem iure, nam aliquam vel
+                        minus aliquid incidunt consequatur illo velit dolorem error exercitationem
+                        tempora?
+                    </p>
 
                     <div className="images">
                         {images.map((filename: string) => {
                             return (
                                 <div
+                                    key={`${taskId}_${filename}`}
                                     className="browser browser--filled"
                                     style={{
                                         backgroundImage: `url(http://65.108.60.135:3000/static/${taskId}/${filename})`,
@@ -135,7 +155,9 @@ export default function ScreenshotGenerator({
                         ) : null}
                     </div>
                     {mode === 'finished' ? (
-                        <button className="sv_next_btn">Pobierz zrzuty ekranów</button>
+                        <button className="sv_next_btn" onClick={() => downloadFiles()}>
+                            Pobierz zrzuty ekranów
+                        </button>
                     ) : null}
                 </Fragment>
             ) : null}
diff --git a/components/sidebar/sidebar.tsx b/components/sidebar/sidebar.tsx
index 57e15f7..e53d848 100644
--- a/components/sidebar/sidebar.tsx
+++ b/components/sidebar/sidebar.tsx
@@ -79,15 +79,9 @@ const Sidebar = () => {
                 <button
                     className="button button--report"
                     onClick={() => {
-                        const params = [
-                            'height=' + screen.height,
-                            'width=' + screen.width,
-                            'fullscreen=yes',
-                        ].join(',');
                         window.open(
                             `/components/report-window/report-window.html?origin=${origin}`,
-                            'new_window',
-                            params
+                            'new_tab'
                         );
                     }}
                 >
diff --git a/components/toolbar/toolbar.tsx b/components/toolbar/toolbar.tsx
index 37a59cb..583ed8d 100644
--- a/components/toolbar/toolbar.tsx
+++ b/components/toolbar/toolbar.tsx
@@ -217,17 +217,12 @@ const Toolbar = () => {
                         <button
                             className="button button--report"
                             onClick={() => {
-                                const params = [
-                                    'height=' + screen.height,
-                                    'width=' + screen.width,
-                                    'fullscreen=yes',
-                                ].join(',');
                                 autoMark();
                                 window.open(
                                     `/components/sidebar/sidebar.html?origin=${origin}`,
-                                    'new_window',
-                                    params
+                                    'new_tab'
                                 );
+                                window.close(); // close toolbar popup
                             }}
                         >
                             Generuj raport