Merge branch 'cal' into 'master'

Cal See merge request !11

Merge branch 'cal' into 'master'
Cal See merge request !11
Joung Jiwon
Commit 07fb527f3d278881575c0330272bc8dd84ef5e2d 07fb527f 2 parents 4c7fe1b4 b3eb4cfa
Showing 1 changed file with 88 additions and 30 deletions
project/index.html
--- a/project/index.html
View file @07fb527
+++ b/project/index.html
View file @07fb527
@@ -12,12 +12,18 @@
   <link rel="stylesheet" href="magnific-popup/magnific-popup.css">
   <link rel="stylesheet" href="css/bootstrap.min.css" />
   <link rel="stylesheet" href="css/templatemo-style.css" />
-  <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/moonspam/NanumBarunGothic@1.0/nanumbarungothicsubset.css">
+  <link rel="stylesheet" type="text/css"
+    href="https://cdn.jsdelivr.net/gh/moonspam/NanumBarunGothic@1.0/nanumbarungothicsubset.css">
   <script src="../../docs/js/jquery-1.9.1.js"></script>
   <script type="text/javascript" src="../../docs/js/examples-base.js"></script>
   <script type="text/javascript" src="../../docs/js/highlight.min.js"></script>
+<<<<<<< HEAD
+  <script type="text/javascript"
+    src="https://openapi.map.naver.com/openapi/v3/maps.js?ncpClientId=rr4owjosjy&submodules=geocoder"></script>
+=======
   <script type="text/javascript" src="https://openapi.map.naver.com/openapi/v3/maps.js?ncpClientId=rr4owjosjy&submodules=geocoder"></script>
+>>>>>>> 4c7fe1b45bf1746088a811e7fc1b8a9c7172f7cd
   <link rel="stylesheet" type="text/css" href="../../docs/css/examples-base.css" />
   <!--
@@ -27,7 +33,7 @@
-  <script type= "text/css">
+  <script type="text/css">
 	window.onload = function(){
 	document.getElementById('btn').onclick = function(){
 		document.getElementById('frm').submit();
@@ -81,13 +87,49 @@
         <div class="question-field question-home">어디에 사나요?</div>
         <div class="input-field input-home">
           <label for="question-input-field"></label>
-          <input type ="text" id="start"></div>
+          <input type="text" id="start"></div>
         <div class="question-field question-school">무슨 학교에 다니나요?</div>
         <div class="input-school">
           <label for="question-input-field"></label>
-          <input type ="text" id="end">
+          <input type="text" id="end">
         </div>
         <div class="question-field question-grade">몇학년인가요?</div>
+<<<<<<< HEAD
+        <div class="input-grade">
+          <div class="custom-select" style="width:208px; margin-right:40px">
+            <select id="semester">
+              <option value="0">1학년 1학기</option>
+              <option value="sem-1-1">1학년 1학기</option>
+              <option value="sem-1-2">1학년 2학기</option>
+              <option value="sem-2-1">2학년 1학기</option>
+              <option value="sem-2-2">2학년 2학기</option>
+              <option value="sem-3-1">3학년 1학기</option>
+              <option value="sem-3-2">3학년 2학기</option>
+              <option value="sem-4-1">4학년 1학기</option>
+              <option value="sem-4-2">4학년 2학기</option>
+            </select>
+          </div>
+        </div>
+      </div>
+      <a href="#result" class="text-center tm-down-arrow-link" onclick="semester();return false;">
+        <i class="fas fa-3x fa-caret-down tm-down-arrow">계산해보기</i>
+      </a>
+    </div>
+  </section>
+
+
+  <section id="result">
+    <div id="map" style="width:700px;height:300px;"></div>
+    <div class="answer-field">한번 갈 때마다 ...<br>
+      <span class="answer-highlight">n</span> 시간
+      <span class="answer-highlight">n</span> 분 <br>
+    </div>
+    <div class="row">
+      <div id="list-answer">
+        <div class="answer-field" id="answer-how-many-hours">
+          지금까지 <span class="answer-highlight" id="since">?</span>시간을 길에서 보내셨군요<br>
+          졸업까지 앞으로 <span class="answer-highlight" id="until">?</span>시간은 더 길에서 보내시면 됩니다.<br>
+=======
         <div class="input-grade"><div class="custom-select" style="width:208px; margin-right:40px">
           <select>
             <option value="0">1학년 1학기</option>
@@ -140,6 +182,22 @@
               <span id = "earth">?</span>바퀴나 돌아요<br><br><br>
             </div>
           </div>
+>>>>>>> 4c7fe1b45bf1746088a811e7fc1b8a9c7172f7cd
+        </div>
+      </div>
+    </div>
+    <div class="row">
+      <div class="answer-detail-question">
+        이 시간에 알바를 했다면? <br>
+        교통비로 국밥 <br>
+        이 거리라면 에베레스트 등반을 <br>
+        지구를
+      </div>
+      <div class="answer-detail-answer">
+        <span id="salary">?</span>원<br>
+        <span id="dish">?</span>그릇<br>
+        <span id="everest">?</span>번이나...<br>
+        <span id="earth">?</span>바퀴나 돌아요<br><br><br>
       </div>
     </div>
     <footer class="text-center small tm-footer">
@@ -179,7 +237,7 @@
         create a new DIV that will act as an option item:*/
         c = document.createElement("DIV");
         c.innerHTML = selElmnt.options[j].innerHTML;
-        c.addEventListener("click", function(e) {
+        c.addEventListener("click", function (e) {
           /*when an item is clicked, update the original select box,
           and the selected item:*/
           var y, i, k, s, h, sl, yl;
@@ -204,7 +262,7 @@
         b.appendChild(c);
       }
       x[i].appendChild(b);
-      a.addEventListener("click", function(e) {
+      a.addEventListener("click", function (e) {
         /*when the select box is clicked, close any other select boxes,
         and open/close the current select box:*/
         e.stopPropagation();
@@ -249,7 +307,7 @@
       naver.maps.Service.geocode({
         address: start
-        }, function(status, response) {
+      }, function (status, response) {
         if (status !== naver.maps.Service.Status.OK) {
           return alert('Something wrong!');
         }
@@ -261,7 +319,7 @@
         naver.maps.Service.geocode({
           address: end
-        }, function(status, response) {
+        }, function (status, response) {
           if (status !== naver.maps.Service.Status.OK) {
             return alert('Something wrong!');
           }
@@ -279,7 +337,7 @@
           var mapOptions = {
-        center: new naver.maps.LatLng(start,end),
+            center: new naver.maps.LatLng(start, end),
             zoom: 10
           };
@@ -290,12 +348,12 @@
           function searchPubTransPathAJAX() {
             var xhr = new XMLHttpRequest();
             //ODsay apiKey 입력
-        var url = "https://api.odsay.com/v1/api/searchPubTransPath?SX="+sx+"&SY="+sy+"&EX="+ex+"&EY="+ey+"&apiKey=nnsDQB1AWhpETO3HmMdDAw";
+            var url = "https://api.odsay.com/v1/api/searchPubTransPath?SX=" + sx + "&SY=" + sy + "&EX=" + ex + "&EY=" + ey + "&apiKey=nnsDQB1AWhpETO3HmMdDAw";
             xhr.open("GET", url, true);
             xhr.send();
-        xhr.onreadystatechange = function() {
+            xhr.onreadystatechange = function () {
               if (xhr.readyState == 4 && xhr.status == 200) {
-          console.log( JSON.parse(xhr.responseText) ); // <- xhr.responseText 로 결과를 가져올 수 있음
+                console.log(JSON.parse(xhr.responseText)); // <- xhr.responseText 로 결과를 가져올 수 있음
                 //노선그래픽 데이터 호출
                 callMapObjApiAJAX((JSON.parse(xhr.responseText))["result"]["path"][0].info.mapObj);
               }
@@ -305,20 +363,20 @@
           //길찾기 API 호출
           searchPubTransPathAJAX();
-      function callMapObjApiAJAX(mabObj){
+          function callMapObjApiAJAX(mabObj) {
             var xhr = new XMLHttpRequest();
             //ODsay apiKey 입력
-        var url = "https://api.odsay.com/v1/api/loadLane?mapObject=0:0@"+mabObj+"&apiKey=nnsDQB1AWhpETO3HmMdDAw";
+            var url = "https://api.odsay.com/v1/api/loadLane?mapObject=0:0@" + mabObj + "&apiKey=nnsDQB1AWhpETO3HmMdDAw";
             xhr.open("GET", url, true);
             xhr.send();
-        xhr.onreadystatechange = function() {
+            xhr.onreadystatechange = function () {
               if (xhr.readyState == 4 && xhr.status == 200) {
                 var resultJsonData = JSON.parse(xhr.responseText);
-            drawNaverMarker(sx,sy);					// 출발지 마커 표시
+                drawNaverMarker(sx, sy);					// 출발지 마커 표시
-            drawNaverMarker(ex,ey);					// 도착지 마커 표시
+                drawNaverMarker(ex, ey);					// 도착지 마커 표시
                 drawNaverPolyLine(resultJsonData);		// 노선그래픽데이터 지도위 표시
                 // boundary 데이터가 있을경우, 해당 boundary로 지도이동
-            if(resultJsonData.result.boundary){
+                if (resultJsonData.result.boundary) {
                   var boundary = new naver.maps.LatLngBounds(
                     new naver.maps.LatLng(resultJsonData.result.boundary.top, resultJsonData.result.boundary.left),
                     new naver.maps.LatLng(resultJsonData.result.boundary.bottom, resultJsonData.result.boundary.right)
@@ -330,7 +388,7 @@
           }
           // 지도위 마커 표시해주는 함수
-      function drawNaverMarker(x,y){
+          function drawNaverMarker(x, y) {
             var marker = new naver.maps.Marker({
               position: new naver.maps.LatLng(y, x),
               map: map
@@ -338,33 +396,33 @@
           }
           // 노선그래픽 데이터를 이용하여 지도위 폴리라인 그려주는 함수
-      function drawNaverPolyLine(data){
+          function drawNaverPolyLine(data) {
             var lineArray;
-        for(var i = 0 ; i < data.result.lane.length; i++){
+            for (var i = 0; i < data.result.lane.length; i++) {
-          for(var j=0 ; j <data.result.lane[i].section.length; j++){
+              for (var j = 0; j < data.result.lane[i].section.length; j++) {
                 lineArray = null;
                 lineArray = new Array();
-            for(var k=0 ; k < data.result.lane[i].section[j].graphPos.length; k++){
+                for (var k = 0; k < data.result.lane[i].section[j].graphPos.length; k++) {
                   lineArray.push(new naver.maps.LatLng(data.result.lane[i].section[j].graphPos[k].y, data.result.lane[i].section[j].graphPos[k].x));
                 }
                 //지하철결과의 경우 노선에 따른 라인색상 지정하는 부분 (1,2호선의 경우만 예로 들음)
-            if(data.result.lane[i].type == 1){
+                if (data.result.lane[i].type == 1) {
                   var polyline = new naver.maps.Polyline({
                     map: map,
                     path: lineArray,
                     strokeWeight: 3,
                     strokeColor: '#003499'
                   });
-            }else if(data.result.lane[i].type == 2){
+                } else if (data.result.lane[i].type == 2) {
                   var polyline = new naver.maps.Polyline({
                     map: map,
                     path: lineArray,
                     strokeWeight: 3,
                     strokeColor: '#37b42d'
                   });
-            }else{
+                } else {
                   var polyline = new naver.maps.Polyline({
                     map: map,
                     path: lineArray,
@@ -392,15 +450,15 @@
       // 임시값 지정
       var time = 2
       var distance = 30000
-      var costs = 100000
+      var pay = 100000
       function sum(sem) {
         since = sem * time * 150
         until = (8 - sem) * time * 150
         salary = since * 8590
-        dish = Math.floor((costs * 150) / 6000)
+        dish = Math.floor((sem * pay * 150) / 6000)
-        everest = Math.floor((distance * 2) / 8846)
+        everest = Math.floor((sem * distance * 2) / 8846)
-        earth = ((distance * 2) / 40075000).toFixed(3)
+        earth = ((sem * distance * 2) / 40075000).toFixed(3)
       }
       if (target == 'sem-1-1') {