<?php
define('_INDEX_', true);
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가

if (G5_IS_MOBILE) {
    include_once(G5_THEME_MOBILE_PATH.'/index.php');
    return;
}

include_once(G5_THEME_PATH.'/head.php');
?>

<h2 class="sound_only">최신글</h2>

<div class="latest_wr">
<!-- 최신글 시작 { -->

    <?php
    //  최신글
    $sql = " select bo_table
                from `{$g5['board_table']}` a left join `{$g5['group_table']}` b on (a.gr_id=b.gr_id)
                where a.bo_device <> 'mobile' ";
    if(!$is_admin)
        $sql .= " and a.bo_use_cert = '' ";
    $sql .= " and a.bo_table not in ('notice', 'gallery') ";     //공지사항과 갤러리 게시판은 제외
    $sql .= " order by b.gr_order, a.bo_order ";
    $result = sql_query($sql);
    for ($i=0; $row=sql_fetch_array($result); $i++) {
        if ($i%2==1) $lt_style = "margin-left:2%";
        else $lt_style = "";
    ?>
    <div style="float:left;<?php echo $lt_style ?>" class="lt_wr">
        <?php
        // 이 함수가 바로 최신글을 추출하는 역할을 합니다.
        // 사용방법 : latest(스킨, 게시판아이디, 출력라인, 글자수);
        // 테마의 스킨을 사용하려면 theme/basic 과 같이 지정
        echo latest('theme/basic', $row['bo_table'], 6, 24);
        ?>
    </div>
    <?php
    }
    ?>
    <!-- } 최신글 끝 -->

</div>

<div class="latest_wr">
    <!--  사진 최신글2 { -->
    <?php
    // 이 함수가 바로 최신글을 추출하는 역할을 합니다.
    // 사용방법 : latest(스킨, 게시판아이디, 출력라인, 글자수);
    // 테마의 스킨을 사용하려면 theme/basic 과 같이 지정
    echo latest('theme/pic_basic', 'gallery', 5, 23);
    ?>
    <!-- } 사진 최신글2 끝 -->
</div>






<?php
$today = date("Y-m-d");
$todays = explode('-',$today);

$year = $todays[0]; //년도
$month = $todays[1];//달
$day = $todays[2];//일

$ch = curl_init();
$url = 'http://apis.data.go.kr/B090041/openapi/service/SpcdeInfoService/getRestDeInfo'; /*URL*/
$queryParams = '?' . urlencode('ServiceKey') . '= API KEY를 넣어주세요'; /*Service Key*/
$queryParams .= '&' . urlencode('solYear') . '=' . urlencode($year); /*연*/
$queryParams .= '&' . urlencode('solMonth') . '=' . urlencode($month); /*월*/

curl_setopt($ch, CURLOPT_URL, $url . $queryParams);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, TRUE);
curl_setopt($ch, CURLOPT_HEADER, FALSE);
curl_setopt($ch, CURLOPT_CUSTOMREQUEST, 'GET');
$response = curl_exec($ch);
curl_close($ch);

$xml = simplexml_load_string($response);
?>
<style>
.format{
  width:150px;
  text-align:center;
}
</style>
<br><br><br>

<!-- Wrap all page content in a page container (optional, but recommended for screen readers and iOS*) -->
  <div id="page"  style="display:flex; justify-content:center;">
    <header></header>
    <main>
      <!-- Add a button to open the popup (optional) -->
      <button class="JPO_open">이번달 공휴일 목록</button>
    </main>
    <footer></footer>
  </div>


  <!-- Add content to the popup -->
  <div id="JPO">
    <?php
        $display  = '<table>';
        $display .= '<th class="format">Name</th>';
        $display .= '<th class="format">Date </th></tr>';
        foreach ($xml->body->items->item as $item)
        {
            $display .= '<tr>';

            $display .='<td class="format">'.$item->dateName.'</td>';
            $display .='<td class="format">'.$item->locdate.'</td>';
            $display .= '</tr>';
        }
        $display .= '</table>';

       echo $display;
    ?>
    <!-- Add a button to close the popup (optional) -->
    <button class="JPO_close" style="margin-left:270px;">Close</button>
  </div>

  <!-- Include jQuery -->
  <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>

  <!-- Include jQuery Popup Overlay -->
  <script src="https://cdn.jsdelivr.net/gh/vast-engineering/jquery-popup-overlay@2/jquery.popupoverlay.min.js">
  </script>

  <script>
    $(document).ready(function() {
      // Initialize the plugin
      $('#JPO').popup();
      // Set default `pagecontainer` for all popups (optional, but recommended for screen readers and iOS*)
      $.fn.popup.defaults.pagecontainer = '#page'
    });
  </script>

  <style>
  #JPO {
  margin: 10px;
  padding: 0 10px;
  max-width: 60%;
  border: 2px solid #444;
  background: white;
}
  </style>

<br>






<div class="container" style=" text-align: center;}">
    <h1 style="font-size:20px; margin:5px;">숫자 맞추기</h1>
    <div id="game" style="margin:7px;">
      <br>
      <p style="font-size:15px; margin: 3px;"> <span class="min-num"></span> 에서 <span class="max-num"></span>중에 숫자를 맞춰보세요 </p>
      <br>
      <input type="number" id="guess-input" placeholder="Enter your guess..." style=" height: 29px; border-radius: 9px; width: 35%;">
      <input type="submit" value="Submit" id="guess-btn" style="border: solid 1px black;
    border-radius: 10px;
    padding: 5px 10px;
    margin: 0 auto;
    background-color: #45a049;
}">
      <p class="message" style="margin-top:7px;"></p>
    </div>
  </div>

<script type="text/javascript">

// Game values
let min = 1,
    max = 10,
    winningNum = getRandomNum(min, max),
    guessesLeft = 4;

// UI Elements
const game = document.querySelector('#game'),
      minNum = document.querySelector('.min-num'),
      maxNum = document.querySelector('.max-num'),
      guessBtn = document.querySelector('#guess-btn'),
      guessInput = document.querySelector('#guess-input'),
      message = document.querySelector('.message');

// Assign UI min and max
minNum.textContent = min;
maxNum.textContent = max;

// Play again event listener
game.addEventListener('mousedown', function(e){
  if(e.target.className === 'play-again'){
    window.location.reload();
  }
});

// Listen for guess
guessBtn.addEventListener('click', function(){
  let guess = parseInt(guessInput.value);

  // Validate
  if(isNaN(guess) || guess < min || guess > max){
    setMessage(`${min} 에서 ${max}으로 숫자를 넣어주세요`, 'red');
  }

  // Check if won
  if(guess === winningNum){
    // Game over - won
    gameOver(true, `${winningNum} 맞는 답입니다, 이겼어요!`);

  } else {
    // Wrong number
    guessesLeft -= 1;

    if(guessesLeft === 0){
      // Game over - lost
      gameOver(false, `못맞추셨어요. 맞는 답은  ${winningNum}였습니다.`);
    } else {
      // Game continues - answer wrong

      // Change border color
      guessInput.style.borderColor = 'red';

      // Clear Input
      guessInput.value = '';

      // Tell user its the wrong number
      setMessage(`${guess} 은 아니에요, ${guessesLeft} 번 남았습니다.`, 'red');
    }
  }
});

// Game over
function gameOver(won, msg){
  let color;
  won === true ? color = 'green' : color = 'red';

  // Disable input
  guessInput.disabled = true;
  // Change border color
  guessInput.style.borderColor = color;
  // Set text color
  message.style.color = color;
  // Set message
  setMessage(msg);

  // PLay Again?
  guessBtn.value = 'Play Again';
  guessBtn.className += 'play-again';
}

// Get Winning Number
function getRandomNum(min, max){
  return Math.floor(Math.random()*(max-min+1)+min);
}

// Set message
function setMessage(msg, color){
  message.style.color = color;
  message.textContent = msg;
}


</script>

<?php
include_once(G5_THEME_PATH.'/tail.php');
?>
