From f7ded426d8672fdad2289d88cb846c22bfc1a94e Mon Sep 17 00:00:00 2001
From: "Lee, Kyutae" <gorisanson@gmail.com>
Date: Wed, 17 Jun 2020 07:57:17 +0900
Subject: [PATCH 1/4] Create html checkbox element for auto-save-replay

and fix auto-fast-speed-checkbox label.
---
 src/en/index.html |  9 ++++++++-
 src/ko/index.html | 15 +++++++++++----
 2 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/src/en/index.html b/src/en/index.html
index 752caedc..dfd0642d 100644
--- a/src/en/index.html
+++ b/src/en/index.html
@@ -179,13 +179,20 @@ <h1>Pikachu Volleyball <span class="no-wrap">P2P Online</span></h1>
           </p>
           <div>
             <input id="auto-fast-speed-checkbox" type="checkbox" />
-            <label for="auto-fast-speed"
+            <label for="auto-fast-speed-checkbox"
               >Automatically ask each peer about changing speed options to
               "fast". (If you and the peer both check this option, the game
               speed will be changed to "fast" without any additional
               message.)</label
             >
           </div>
+          <div>
+            <input id="auto-save-replay-checkbox" type="checkbox" />
+            <label for="auto-save-replay-checkbox"
+              >Automatically save replay file when each connection with a peer
+              ends.</label
+            >
+          </div>
         </div>
       </div>
       <div class="margin-top grid-1-1">
diff --git a/src/ko/index.html b/src/ko/index.html
index 7cf85a11..c9c50fd8 100644
--- a/src/ko/index.html
+++ b/src/ko/index.html
@@ -179,10 +179,17 @@ <h1>피카츄 배구 <span class="no-wrap">P2P 온라인</span></h1>
           </p>
           <div>
             <input id="auto-fast-speed-checkbox" type="checkbox" />
-            <label for="auto-fast-speed"
-              >게임 속도 "빠르게" 변경하기를 상대방에게 매번 자동으로
-              신청합니다. (양측 모두 이 설정에 체크 표시한 경우, 별다른 메시지
-              없이 게임 속도가 "빠르게"로 변경됩니다.)</label
+            <label for="auto-fast-speed-checkbox"
+              >게임 속도 "빠르게" 변경하기를 상대방에게 자동으로 신청하기 (양측
+              모두 이 설정에 체크 표시한 경우, 별다른 메시지 없이 게임 속도가
+              "빠르게"로 변경됩니다.)</label
+            >
+          </div>
+          <div>
+            <input id="auto-save-replay-checkbox" type="checkbox" />
+            <label for="auto-save-replay-checkbox"
+              >리플레이 자동 저장 (상대방과의 연결을 마칠 때마다 리플레이 파일을
+              자동으로 저장합니다.)</label
             >
           </div>
         </div>

From 5b7ad5ed1e9b8387f79eb1c5903df9559e7d1731 Mon Sep 17 00:00:00 2001
From: "Lee, Kyutae" <gorisanson@gmail.com>
Date: Wed, 17 Jun 2020 08:00:37 +0900
Subject: [PATCH 2/4] Add margin top a little to the auto-save-replay..

checkbox.
---
 src/en/index.html       | 2 +-
 src/ko/index.html       | 2 +-
 src/resources/style.css | 3 +++
 3 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/en/index.html b/src/en/index.html
index dfd0642d..424a35fb 100644
--- a/src/en/index.html
+++ b/src/en/index.html
@@ -186,7 +186,7 @@ <h1>Pikachu Volleyball <span class="no-wrap">P2P Online</span></h1>
               message.)</label
             >
           </div>
-          <div>
+          <div class="margin-top-a-little">
             <input id="auto-save-replay-checkbox" type="checkbox" />
             <label for="auto-save-replay-checkbox"
               >Automatically save replay file when each connection with a peer
diff --git a/src/ko/index.html b/src/ko/index.html
index c9c50fd8..9860709c 100644
--- a/src/ko/index.html
+++ b/src/ko/index.html
@@ -185,7 +185,7 @@ <h1>피카츄 배구 <span class="no-wrap">P2P 온라인</span></h1>
               "빠르게"로 변경됩니다.)</label
             >
           </div>
-          <div>
+          <div class="margin-top-a-little">
             <input id="auto-save-replay-checkbox" type="checkbox" />
             <label for="auto-save-replay-checkbox"
               >리플레이 자동 저장 (상대방과의 연결을 마칠 때마다 리플레이 파일을
diff --git a/src/resources/style.css b/src/resources/style.css
index b77247ef..b512ce07 100644
--- a/src/resources/style.css
+++ b/src/resources/style.css
@@ -402,6 +402,9 @@ div.margin-top,
 p.margin-top {
   margin-top: calc(2.5 * var(--font-size));
 }
+div.margin-top-a-little {
+  margin-top: var(--font-size);
+}
 ul {
   margin-top: var(--font-size);
   margin-bottom: var(--font-size);

From c01bffe4f442c7a70745582093bc5ff9453bc7bc Mon Sep 17 00:00:00 2001
From: "Lee, Kyutae" <gorisanson@gmail.com>
Date: Wed, 17 Jun 2020 08:35:29 +0900
Subject: [PATCH 3/4] Make auto saving replay work

---
 src/resources/js/ui_online.js | 39 +++++++++++++++++++++++++++++++++++
 1 file changed, 39 insertions(+)

diff --git a/src/resources/js/ui_online.js b/src/resources/js/ui_online.js
index 37667260..3ba19444 100644
--- a/src/resources/js/ui_online.js
+++ b/src/resources/js/ui_online.js
@@ -67,6 +67,7 @@ const pendingOptions = {
 };
 
 let pikaVolleyOnline = null; // it is set after loading the game assets
+let willSaveReplayAutomatically = null;
 
 const chatOpenBtnAndChatDisablingBtnContainer = document.getElementById(
   'chat-open-btn-and-chat-disabling-btn-container'
@@ -183,6 +184,7 @@ export function setUpUI() {
     }
   });
 
+  // For auto-fast-speed-checkbox
   const autoFastSpeedCheckboxElem = document.getElementById(
     'auto-fast-speed-checkbox'
   );
@@ -214,6 +216,36 @@ export function setUpUI() {
     }
   });
 
+  // For auto-save-replay-checkbox
+  const autoSaveReplayCheckbox = document.getElementById(
+    'auto-save-replay-checkbox'
+  );
+  try {
+    willSaveReplayAutomatically =
+      'true' === window.localStorage.getItem('willSaveReplayAutomatically');
+  } catch (err) {
+    console.log(err);
+  }
+  if (willSaveReplayAutomatically !== null) {
+    // @ts-ignore
+    autoSaveReplayCheckbox.checked = willSaveReplayAutomatically;
+  } else {
+    // @ts-ignore
+    willSaveReplayAutomatically = autoSaveReplayCheckbox.checked;
+  }
+  autoSaveReplayCheckbox.addEventListener('change', () => {
+    // @ts-ignore
+    willSaveReplayAutomatically = autoSaveReplayCheckbox.checked;
+    try {
+      window.localStorage.setItem(
+        'willSaveReplayAutomatically',
+        String(willSaveReplayAutomatically)
+      );
+    } catch (err) {
+      console.log(err);
+    }
+  });
+
   let bgmSetting = null;
   try {
     bgmSetting = window.localStorage.getItem('bgm');
@@ -453,8 +485,12 @@ export function setUpUI() {
   window.addEventListener('unload', closeConnection);
 
   window.addEventListener('beforeunload', function (e) {
+    // This is for exiting the window by the browser exit button while being connected with quick match server
     cleanUpFirestoreRelevants();
     if (channel.isOpen) {
+      if (willSaveReplayAutomatically) {
+        replaySaver.saveAsFile();
+      }
       // Cancel the event
       e.preventDefault(); // If you prevent default behavior in Mozilla Firefox prompt will always be shown
       // Chrome requires returnValue to be set
@@ -885,6 +921,9 @@ export function askOptionsChangeReceivedFromPeer(options) {
 }
 
 export function noticeDisconnected() {
+  if (willSaveReplayAutomatically) {
+    replaySaver.saveAsFile();
+  }
   document.getElementById('notice-disconnected').classList.remove('hidden');
 }
 

From cdcecebecb1fc96625a6b74b953e0a007b87de01 Mon Sep 17 00:00:00 2001
From: "Lee, Kyutae" <gorisanson@gmail.com>
Date: Thu, 18 Jun 2020 23:02:12 +0900
Subject: [PATCH 4/4] Edit text content in index.html's

---
 src/en/index.html | 6 ++++--
 src/ko/index.html | 6 ++++--
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/en/index.html b/src/en/index.html
index 8393c331..715bc803 100644
--- a/src/en/index.html
+++ b/src/en/index.html
@@ -171,8 +171,10 @@ <h1>Pikachu Volleyball <span class="no-wrap">P2P Online</span></h1>
           <div class="margin-top-a-little">
             <input id="auto-save-replay-checkbox" type="checkbox" />
             <label for="auto-save-replay-checkbox"
-              >Automatically save replay file when each connection with a peer
-              ends.</label
+              >Automatically save replay file when a connection with a peer
+              ends. (In Safari browser, this option malfunctions, so it is
+              recommended to be turned off. In Chrome and Firefox browser, this
+              option were checked to work properly.)</label
             >
           </div>
         </div>
diff --git a/src/ko/index.html b/src/ko/index.html
index 12732410..b65c6c6d 100644
--- a/src/ko/index.html
+++ b/src/ko/index.html
@@ -169,8 +169,10 @@ <h1>피카츄 배구 <span class="no-wrap">P2P 온라인</span></h1>
           <div class="margin-top-a-little">
             <input id="auto-save-replay-checkbox" type="checkbox" />
             <label for="auto-save-replay-checkbox"
-              >리플레이 자동 저장 (상대방과의 연결을 마칠 때마다 리플레이 파일을
-              자동으로 저장합니다.)</label
+              >리플레이 자동 저장 (상대방과의 연결을 마칠 때 리플레이 파일을
+              자동으로 저장합니다. 사파리 브라우저에서는 이 설정이 오류를
+              일으키므로 이 설정을 끄기를 권장합니다. 크롬, 파이어폭스
+              브라우저에서 정상 작동을 확인했습니다.)</label
             >
           </div>
         </div>