Merge pull request #32 from 01mokuba/js-refactor

Js refactor

css/stylesheet.css

@@ -111,7 +111,7 @@ body{
 }
 
 #filter p, #filter2 p{
-  font-size: 1.8vw;
+  font-size: 2vw;
   margin: 0 0.2vw 0 0.6vw;
 }
 
@@ -182,27 +182,26 @@ body{
 
 .contents h2{
   font-family: "GENJ-Heavy";
-  font-size: 28px;
+  font-size: 3vw;
   margin-bottom: 2vh;
 }
 
 .contents p{
   font-family: 'GENJ-Light';
-  font-size: 14px;
+  font-size: 1.2vw;
 }
 
 #cards, #cards2 {
   margin: 0 auto;
   display: flex;
   flex-wrap: wrap;
   align-content: space-around;
-  margin-left: -16px;
 }
 
 .card{
   margin: 20px;
-  height: 200px;
-  width: 240px;
+  height: 25vh;
+  width: 280px;
   box-shadow: 1px 1px 2px #999;
   border: solid 0.5px lightgray;
   padding: 3vh 2vw;
@@ -221,7 +220,7 @@ body{
 .card-title{
   display: block;
   font-family: "GENJ-Heavy";
-  font-size:  14px;
+  font-size:  1.3vw;
   height: 70%;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -231,14 +230,11 @@ body{
 
 .card-detail{
   font-family: "GENJ-Light";
+  font-size:  1.1vw;
   position: absolute;
   bottom: 3vh;
 }
 
-.card-detail .card-ministry, .card-detail .card-pdate{
-  font-size:  14px;
-}
-
 #header{
   background: #ffffff;
   height: 13vh;
@@ -285,7 +281,7 @@ body{
 
 #submit, #submit2{
   font-size: 2.5vw;
-  color: #747474;
+  color: #4285f4;
   font-size: 2.5vw;
   width: 8vw;
   padding-left: 16px;
@@ -299,6 +295,10 @@ body{
   padding-top: 16vh;
 }
 
+.result{
+  margin-bottom: 3vh;
+}
+
 .pagination-wrapper {
   width: 100%;
   text-align: center;
@@ -411,15 +411,17 @@ select.ym-select:first-child {
 
   #cards, #cards2{
     flex-direction: column;
-    margin-left: 0;
-    margin-top: 30px;
   }
 
   .card{
     width: 70vw;
     margin: 0 auto 30px;
   }
 
+  .card-title{
+    font-size: 5.0vw;
+  }
+
   #filter p, #filter2 p{
     display: none;
   }

js/clip.js

@@ -61,12 +61,12 @@ $form.submit(function(event) {
         }
     );
     // 期間絞り込み結果を取得
-    var syear = $('#syear').val();
-    var smonth = $('#smonth').val();
-    var eyear = $('#eyear').val();
-    var emonth = $('#emonth').val();
-    var gte = constructPeriod(syear, smonth);
-    var lte = constructPeriod(eyear, emonth);
+    var fromYear = $('#syear').val();
+    var fromMonth = $('#smonth').val();
+    var toYear = $('#eyear').val();
+    var toMonth = $('#emonth').val();
+    var gte = constructPeriod(fromYear, fromMonth);
+    var lte = constructPeriod(toYear, toMonth);
     setParameter(gte,lte)
 });
 
@@ -83,24 +83,28 @@ $form2.submit(function(event) {
         }
     );
     // 期間絞り込み結果を取得
-    var syear = $('#syear2').val();
-    var smonth = $('#smonth2').val();
-    var eyear = $('#eyear2').val();
-    var emonth = $('#emonth2').val();
-    var gte = constructPeriod(syear, smonth);
-    var lte = constructPeriod(eyear, emonth);
+    var fromYear = $('#syear2').val();
+    var fromMonth = $('#smonth2').val();
+    var toYear = $('#eyear2').val();
+    var toMonth = $('#emonth2').val();
+    var gte = constructPeriod(fromYear, fromMonth);
+    var lte = constructPeriod(toYear, toMonth);
     setParameter(gte,lte)
 });
 
 // 期間絞り込み変数を作成
 constructPeriod = function(year, month) {
     var today = new Date();
     var thisYear = today.getFullYear();
+    // 開始年が未指定の場合
     if (year === "0") {
         year = "2010";
-    } else if (year === "100") {
+    }
+    // 終了年が未指定の場合
+    else if (year === "100") {
         year = thisYear;
     }
+    // 月が未指定の場合
     if (month === "0") {
         if (year == thisYear) {
             month = today.getMonth() + 1
@@ -130,12 +134,13 @@ getResults = function(gte,lte) {
       return parseFloat($(this).val());
     }).get();
     var isDefaultMinistry = false;
+    // 省庁が未指定の場合
     if (ministries.length == 0) {
         ministries = [1,2,3,4,5,6,7,8,9,10,11,12,13,14]
         isDefaultMinistry = true;
     }
-    // デフォルト期間絞り込み
     var isDefaultPeriod = false;
+    // 期間が未指定の場合
     if (gte === "" && lte === "") {
         gte = constructPeriod("0","0")
         lte = constructPeriod("100","0")