woowacourse · maywngml · Dec 15, 2020 · Dec 19, 2020 · Dec 19, 2020 · Dec 19, 2020
diff --git a/README.md b/README.md
@@ -1 +1,22 @@
-# javascript-subway-final
+# 🚇 지하철 노선도 경로 조회 미션
+- 등록된 지하철 노선도에서 경로를 조회하는 기능을 구현한다.
+
+## 🚀 구현 기능목록
+
+### 초기 설정
+- 프로그램 시작 시 역, 노선, 구간 데이터를 초기 설정한다.
+  - 거리와 소요 시간은 양의 정수이며 단위는 km와 분을 의미한다.
+
+### 경로 조회 기능
+- 출발역과 도착역을 입력받아 입력값들을 처리한다.
+  - 길찾기버튼 클릭 시 해당 기능이 실행된다.
+  - 출발역과 도착역은 2글자 이상이어야 한다.
+  - 존재하지 않는 역을 입력받았을 경우 alert창을 띄운다.
+  - 출발역과 도착역은 다르게 입력해야 한다.
+  - 입력값이 없을 경우 alert창을 띄워 다시 입력하도록 한다.
+  - 입력값들의 공백을 제거한다.
+- 입력된 출발역과 도착역을 바탕으로 경로를 조회한다.
+  - 총 거리, 총 소요 시간을 테이블에 담아 출력한다.
+  - 출발역과 도착역이 연결되어 있지 않으면 경로를 조회할 수 없다.
+  - 경로 조회 시 최단거리 또는 최소 시간 옵션을 선택할 수 있다.
+  - 기본값은 최단거리이다.
diff --git a/images/dijkstra_example.png b/images/dijkstra_example.png
diff --git a/images/path_result.gif b/images/path_result.gif
diff --git a/images/path_result.jpg b/images/path_result.jpg
diff --git a/index.html b/index.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <link rel="stylesheet" href="./src/style.css">
+    <title>🚇지하철 길찾기</title>
+</head>
+<body>
+<div id="app">
+    <h1>🚇지하철 길찾기</h4>
+    <h3>출발역</h3>
+    <input type="text" id="departure-station-name-input"/>
+    <p></p>
+    <h3>도착역</h3>
+    <input type="text" id="arrival-station-name-input"/>
+    <p></p>
+    <input type="radio" name="search-type" value="distance" checked="checked">최단거리</input>
+    <input type="radio" name="search-type" value="time">최소시간</input>
+    <p></p>
+    <button id="search-button">길 찾기</button>
+    <h1>📝결과</h4>
+</div>
+<script type="module" src="src/index.js?ver=73"></script>
+</body>
+</html>
diff --git a/src/index.js b/src/index.js
@@ -0,0 +1,34 @@
+import processStationNames from "./process-station-names.js?ver=31";
+import processSubwayDirection from "./process-subway-direction.js?ver=51";
+
+export default class Index {
+    constructor() {
+        this.processStationNames = new processStationNames();
+        this.processSubwayDirection = new processSubwayDirection();
+        this.searchButton = document.getElementById("search-button");
+        this.searchButton.addEventListener("click", () => {this.printResult()});
+    }
+
+    checkRadioButton() {
+        const radioButton = document.getElementsByName("search-type");
+        let radioValue;
+        radioButton.forEach(button => {
+            if(button.checked == true) {
+                radioValue = button.value;
+            }
+        });
+        return radioValue;
+    }
+
+    printResult() {
+        const stationNames = this.processStationNames.getStationNames();
+        const radioValue = this.checkRadioButton();
+        let result;
+        if(stationNames !== []) {
+            result = radioValue === "distance" ? this.processSubwayDirection.getMinDistance(stationNames) : this.processSubwayDirection.getMinTime(stationNames);
+        }
+        console.log(result);
+    }
+}
+
+new Index();
diff --git a/src/process-station-names.js b/src/process-station-names.js
@@ -0,0 +1,64 @@
+import {stations} from "./utils/data.js?ver=30";
+import {
+    removeWhiteSpaceValue,
+    isEmpty,
+    isRightLength
+} from "./utils/common.js?ver=30";
+
+export default class processStationNames {
+    constructor() {
+        this.stations = stations;
+    }
+
+    checkStationInData(name) {
+        return this.stations.findIndex(station => station.name === name);
+    }
+
+    getAlertText(stationName, stationType) {
+        let text = "";
+        if(isEmpty(stationName)) {
+            text = `${stationType}역을 입력해주세요`;
+        }
+        else if(!isRightLength(stationName)) {
+            text = `${stationType}역을 두글자 이상 입력해주세요`;
+        }
+        else if(this.checkStationInData(stationName) === -1){
+            text = `${stationName}역은 등록되지 않은 역입니다`;
+        }
+        return text;
+    }
+
+    setAlert(departureText, arrivalText, departureStationName, arrivalStationName) {
+        let isCorrect = false;
+        if(departureText !== "") {
+            alert(departureText);
+        }
+        else if(arrivalText !== "") {
+            alert(arrivalText);
+        }
+        else if(departureStationName === arrivalStationName){
+            alert("출발역과 도착역을 다르게 입력해주세요");
+        }
+        else {
+            isCorrect = true;
+        }
+        return isCorrect;
+    }
+
+    checkStationNames(departureStationName, arrivalStationName) {
+        const departureText = this.getAlertText(departureStationName, "출발");
+        const arrivalText = this.getAlertText(arrivalStationName, "도착");
+        return this.setAlert(departureText, arrivalText, departureStationName, arrivalStationName);
+    }
+
+    getStationNames() {
+        const departureStationName = removeWhiteSpaceValue(document.getElementById("departure-station-name-input").value);
+        const arrivalStationName = removeWhiteSpaceValue(document.getElementById("arrival-station-name-input").value);
+        const isCorrect = this.checkStationNames(departureStationName, arrivalStationName);
+        let stationNames = [];
+        if(isCorrect) {
+            stationNames = [departureStationName, arrivalStationName];
+        }
+        return stationNames;
+    }
+}
diff --git a/src/process-subway-direction.js b/src/process-subway-direction.js
@@ -0,0 +1,46 @@
+import {lines} from "./utils/data.js?ver=30";
+
+export default class processSubwayDirection {
+    constructor() {
+        this.lines = lines;
+        this.directions = [];
+    }
+
+    getLinesInStation(stationName) {
+        const linesInStation = this.lines.filter(line => line.station.includes(stationName));
+        return linesInStation;
+    }
+
+    checkNextStation(station, index) {
+        return station.length - 1 ? null : station[index + 1];
+    }
+
+    recordDirection(stationList) {
+        const lineList = this.getLinesInStation(stationList[-1]);
+        lineList.forEach(line => {
+            const station = line.station;
+            this.checkNextStation(station, station.indexOf(stationList[-1]));
+        })
+    }
+
+    getDirection(startLine, stationName) {
+        const startStation = startLine.station;
+        const startIndex = startStation.indexOf(stationName);
+        const nextStation = this.checkNextStation(startStation, startIndex);
+        if(nextStation !== null) {
+            this.recordDirection([startStation, nextStation]);
+        }
+    }
+
+    getMinDistance(stationNames) {
+        const startLineList = this.getLinesInStation(stationNames[0]);
+        startLineList.forEach(line => {
+            this.getDirection(line, stationNames[0]);
+        })
+
+    }
+
+    getMinTime(stationNames) {
+
+    }
+}
diff --git a/src/style.css b/src/style.css
@@ -0,0 +1,4 @@
+h3 {
+    display: inline;
+}
+