Merge pull request #30 from Seol-JY/feature/imporve-calc-speed

feat: 공백 및 개행 오타에 패널티 부과

Author: Seol-JY

client/src/components/Debug.jsx

@@ -7,6 +7,7 @@ function Debug({
   filestate,
   Correctchr,
   Wrongchr,
+  Spacechr,
   fileLength,
   setFinishTrigger,
 }) {
@@ -43,7 +44,7 @@ function Debug({
   useInterval(() => {
     // useInterval custom Hook
     setCount(count + 0.05); //0.05씩 UPDATE
-    setCpm(String(speed(count, Correctchr)).padStart(4, "0"));
+    setCpm(String(speed(count, Correctchr, Spacechr)).padStart(4, "0"));
   }, terval); // Hook 실행조건, terval은 밀리초단위
 
   return (
@@ -62,6 +63,7 @@ const mapStateToProps = (state) => {
   return {
     Correctchr: state.correct.Correctchr,
     Wrongchr: state.wrong.Wrongchr,
+    Spacechr: state.space.Spacechr,
   };
 };
 

client/src/components/Editor.jsx

@@ -46,7 +46,6 @@ export default function Editor({
 
   const userInputTabHandler = (event) => {
     // todo: 조건식 최적화
-    //tab을 공백4칸으로
     if (event.key === "Escape") {
       setUseAutoComplete(false);
     } else if (
@@ -93,12 +92,20 @@ export default function Editor({
     }
   };
 
+  // const containsNonEnglish = (text) => /[^\x00-\x7F]/.test(text);
+
   const userInputHandler = (event) => {
     //input창 내용을 userinput에 반영
+    const newValue = event.currentTarget.value;
+    // if (containsNonEnglish(newValue)) {
+    //   alert("영문만 입력 가능합니다.");
+    //   return;
+    // }
+
     const previousValue = userInput; // 직전 값 저장
-    setUserInput(event.currentTarget.value); // replace(/[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/g,'')
-    if (event.currentTarget.value.length - previousValue.length > 2) {
-      alert("Careful. This might not do what you think, 잘못된 접근입니다.");
+    setUserInput(newValue);
+    if (newValue.length - previousValue.length > 2) {
+      alert("잘못된 접근입니다.");
       window.location.reload();
     }
   };

client/src/components/Text.jsx

@@ -2,6 +2,7 @@ import { useEffect, useState } from "react";
 import { connect } from "react-redux";
 import { setCorrectchr } from "../redux/correct/actions";
 import { setWrongchr } from "../redux/wrong/actions";
+import { setSpacechr } from "../redux/space/actions";
 import getFilecontents from "../utils/filecontents";
 import AutoCompletion from "./AutoCompletion";
 
@@ -10,7 +11,8 @@ function Text(props) {
   const [textSplit, setTextSplit] = useState([]);
   const [themeColor, setThemeColor] = useState("");
   let wrong = 0,
-    correct = 0;
+    correct = 0,
+    space = 0;
   const user = props.userInput;
   const userSplit = user.split("");
 
@@ -32,6 +34,7 @@ function Text(props) {
   useEffect(() => {
     props.setCorrectchr(correct);
     props.setWrongchr(wrong);
+    props.setSpacechr(space);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   });
 
@@ -56,6 +59,10 @@ function Text(props) {
             color = "#ff5c5c";
             colortxt = "white";
             wrong++;
+            if (userSplit[i] === " " || userSplit[i] === "\n") {
+              // 공백이나 개행으로 틀린 경우 속도 패널티 부여
+              space++;
+            }
           }
         }
 
@@ -111,13 +118,15 @@ const mapStateToProps = (state) => {
   return {
     Correctchr: state.correct.Correctchr,
     Wrongchr: state.wrong.Wrongchr,
+    Spacechr: state.space.Spacechr,
   };
 };
 
 const mapDispatchToProps = (dispatch) => {
   return {
     setCorrectchr: (cor) => dispatch(setCorrectchr(cor)),
     setWrongchr: (wr) => dispatch(setWrongchr(wr)),
+    setSpacechr: (sp) => dispatch(setSpacechr(sp)),
   };
 };
 

client/src/redux/space/actions.js

@@ -0,0 +1,7 @@
+import { SET_SPACECHR } from "./types";
+export const setSpacechr = (val) => {
+  return {
+    type: SET_SPACECHR,
+    value: val,
+  };
+};

client/src/redux/space/reducer.js

@@ -0,0 +1,19 @@
+import { SET_SPACECHR } from "./types";
+
+const setSpacechrState = {
+  Spacechr: 10,
+};
+
+const setSpacechrReducer = (state = setSpacechrState, action) => {
+  switch (action.type) {
+    case SET_SPACECHR:
+      return {
+        ...state,
+        Spacechr: action.value,
+      };
+    default:
+      return state;
+  }
+};
+
+export default setSpacechrReducer;

client/src/redux/space/types.js

@@ -0,0 +1 @@
+export const SET_SPACECHR = "SET_SPACECHR";

client/src/redux/store.js

@@ -3,10 +3,12 @@ import { combineReducers } from "redux";
 import { legacy_createStore as createStore } from "redux";
 import setCorrectchrReducer from "./correct/reducer";
 import setWrongchrReducer from "./wrong/reducer";
+import setSpacechrReducer from "./space/reducer";
 
 const rootReducer = combineReducers({
   correct: setCorrectchrReducer,
   wrong: setWrongchrReducer,
+  space: setSpacechrReducer,
 });
 
 const store = createStore(rootReducer);

client/src/utils/speed.js

@@ -1,8 +1,12 @@
-export default function speed(count, Correctchr) {
+export default function speed(count, Correctchr, Spacechr) {
   // 타자속도 지정함수
-  let sp = Math.floor((60 / count) * Correctchr);
+  let sp = Math.floor((60 / count) * (Correctchr - Spacechr));
   if (sp === Infinity || isNaN(sp)) {
     return 0;
   }
+
+  if (sp < 0) {
+    sp = 0;
+  }
   return sp;
 }