From d462bb073dfa1104ccb6cfff6e93903c477721cd Mon Sep 17 00:00:00 2001
From: Eddie Wen <eddiewen.tw@gmail.com>
Date: Wed, 22 Nov 2017 16:01:00 +0800
Subject: [PATCH] feat: invert whole body after typing

---
 src/css/index.css |  5 +++--
 src/js/index.js   | 19 ++++++++++++++++---
 2 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/src/css/index.css b/src/css/index.css
index d7676df..94fb574 100644
--- a/src/css/index.css
+++ b/src/css/index.css
@@ -1,3 +1,4 @@
-.hello {
-	content: 'world';
+body.invert {
+	background-color: #000;
+	filter: invert(1);
 }
diff --git a/src/js/index.js b/src/js/index.js
index ef7791f..a4273ea 100644
--- a/src/js/index.js
+++ b/src/js/index.js
@@ -10,6 +10,8 @@ import { catTypeing } from './appConfig';
 import countdown from './countdown';
 import updateTime from './updateTime';
 
+const reversedCatTyping = [...catTypeing].reverse().join('');
+
 /**
  * first shot
  */
@@ -22,15 +24,26 @@ setInterval(() => {
 	updateTime(countdown());
 }, 1000);
 
+const comingAgain = (typeObject, inputString) => {
+	document.body.classList.add('invert');
+
+	setTimeout(() => {
+		document.body.classList.remove('invert');
+		typeObject.rewrite(inputString, () => {
+			comingAgain(typeObject, inputString === catTypeing ? reversedCatTyping : catTypeing);
+		});
+	}, 1000);
+};
+
 /**
  * init typing animation
  */
-/* eslint-disable no-new */
-new TypeWriting({
-/* eslint-enable no-new */
+const typeWriting = new TypeWriting({
 	targetElement: document.querySelector('.confused-typing'),
 	inputString: catTypeing,
 	typingInterval: 50,
 	blinkInterval: '1s',
 	cursorColor: palette.darkBlack,
+}, () => {
+	comingAgain(typeWriting, reversedCatTyping);
 });