<!DOCTYPE html>
<!--
    Licensed to the Apache Software Foundation (ASF) under one
    or more contributor license agreements.  See the NOTICE file
    distributed with this work for additional information
    regarding copyright ownership.  The ASF licenses this file
    to you under the Apache License, Version 2.0 (the
    "License"); you may not use this file except in compliance
    with the License.  You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

    Unless required by applicable law or agreed to in writing,
    software distributed under the License is distributed on an
    "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
     KIND, either express or implied.  See the License for the
    specific language governing permissions and limitations
    under the License.
-->
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, viewport-fit=cover">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta name="theme-color" content="#007aff">
    <meta http-equiv="Content-Security-Policy" content="default-src * 'self' 'unsafe-inline' 'unsafe-eval' data: cdvfile: file: gap:; img-src * 'self' data: cdvfile: filesystem:">
    <title>Tiger TDSC</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css">
    <link rel="stylesheet" href="css/framework7-bundle.min.css">
    <link rel="stylesheet" href="css/app.css">
    <link rel="stylesheet" href="css/index.css">
    <link rel="apple-touch-icon" href="img/f7-icon-square.png">
    <link rel="icon" href="img/f7-icon.png">
</head> 

<body class="color-theme-darkblue">
    <div id="app">
        <div class="panel panel-left panel-cover panel-resizable panel-init">
            <div class="page bg-content" style="background:linear-gradient(180deg, rgba(24,30,74,1) 0%, rgba(24,30,74,1) 35%, rgba(14,95,174,1) 100%)">
                <div class="page-content" style="color:white">
                    <div class="block">
                        <p style="text-align:center;"><img src="https://tiger-tdscapps.com/img/tiger_logo_new_150.png" width="120px"/></p>
                        <h1 class="heading text-color-white" style="text-align:center;margin-top: 20px;margin-bottom:50px;font-size:1.5rem;"><img src="https://tiger-tdscapps.com/img/tdsc_text.png" width="100px"/></h1>
                    </div>
                    <div class="block-title" style="color:white;margin-top:50px">Menu</div>
                    <div class="list links-list">
                        <ul style="background:transparent">

                            <li><a href="/leaderboard/" class="panel-close" data-transition="f7-cover">Leaderboard</a></li>
                            <!--<li><a href="/quiz_periode/" class="panel-close">Quiz <span class="side_quiz" id=""></span></a></li>-->
                            <li><a href="/profile/" class="panel-close" data-transition="f7-cover">Profile</a></li>
                            <li><a href="/points/" class="panel-close" data-transition="f7-cover">Points History</a></li>
                            <li><a href="/feedback/" class="panel-close" data-transition="f7-cover">Feedback</a></li>
                        </ul>
                    </div>
                    <div class="block">
                        <p style="text-align:center">Copyright 2024</p>
                        <p style="text-align:center">Tiger Dream Store College</p>
                        <p style="text-align:center;color:white">V.1.1.6</p>
                    </div>
                </div>
            </div>
        </div>

        <div class="view view-main">
            <div class="page" data-name="home">
                <div class="navbar">
                    <div class="navbar-bg" style="background:linear-gradient(360deg, rgba(24,30,74,1) 0%, rgba(24,30,74,1) 75%, rgba(14,95,174,1) 100%)">
                    </div>
                    <div class="navbar-inner">
                        <div class="left">
                            <a href="#" class="link icon-only panel-open" data-panel="left" style="color:white">
                                <i class="icon f7-icons if-not-md">menu</i>
                                <i class="icon material-icons md-only">menu <span class="menu_notif"></span></i>
                            </a>
                        </div>
                        <div class="title sliding" style="color:white"><small>TDSC Mobile Apps</div>
					</div>
				</div>
         
				<div class="page-content  ptr-content">
				<div class="ptr-preloader">
				  <div class="preloader"></div>
				  <div class="ptr-arrow"></div>
				</div>

				<h1 class="heading greetings">Selamat Datang</h1>
				<div class="name-card block card elevation-1 skeleton-text skeleton-effect-wave bg_darkblue">
					<div class="row" style="padding: 8px 0px 8px 0px">
						<div class="col-30 img-profile-new" style="width:70px;height:70px;border-radius:50%"></div>
						<div class="col-70">
							<h2 class="name-profile2" style="color:white;margin-top:7px"></h2>
							<p class="division-profile2" style="color:white;margin-top: -10px;"></p>
							<div class="item-after" style="float:right;margin-top: -45px">
								<i class="material-icons" style="margin-left:-20px;color:#fccb0a;font-size:18px;margin-top:0px">star</i>
								<div style="margin-top:-23px"> 
								<span style="font-size:15px;color:white" class="countup">0</span>
								</div>
							</div>
						</div>
					</div>
				</div>
				
				<p class="head_text">Leaderboard</p>
				<div class="toolbar tabbar toolbar-top" style="margin-top:-44px;background-color: white;">
                    <div class="toolbar-inner">
                      <a href="#tab1" class="tab-link tab-link-active" style="color:rgba(63,61,108,1);">MONTHLY</a>
                      <a href="#tab2" class="tab-link">ACCUMULATED</a>
                      <a href="#tab3" class="tab-link">REGION</a>
                    </div>
                  </div>
                  <div class="" style="margin-top:60px;box-shadow:var(--f7-card-box-shadow)" @ptr:refresh=${loadMore}>
                    <div class="tabs">
                      <div id="tab1" class="page-content tab tab-active">
                          <div style="margin-top:-115px">
                              <div class="list lead-list">
                                  <ul class="monthly-lead-list"></ul>
                              </div>
                              <div class="list">
                                  <ul id="current_position"></ul>
                              </div>
                              <button id="get_current_button" class="col button button-fill" style="border-radius:0px;margin-top: -26px;background:#181E4A">Check Your Position</button>
                          </div>
                      </div>
                      <div id="tab2" class="page-content tab">
                          <div style="margin-top:-115px;margin-bottom:0px">
                              <!--<p class="lead-head">ACCUMULATED LEADERBOARD</p>-->
                              <div class="list lead-list">
                                  <ul class="acc-lead-list"></ul>
                                  
                              </div>
                              <div class="list">
                                  <ul id="current_position_acc"></ul>
                              </div>
                              <button id="get_current_button_acc" class="col button button-fill" style="border-radius:0px;margin-top: -26px;background:#181E4A">Check Your Position</button>
                          </div>
                      </div>
                      <div id="tab3" class="page-content tab">
                          <div style="margin-top:-115px">
                              <!--<p class="lead-head">REGIONAL LEADERBOARD</p>-->
                              <div class="list lead-list">
                                  <ul class="region-lead-list"></ul>
                                  
                              </div>
                          </div>
                      </div>
                    </div>
                  </div> 
				
				<!--QUIZ-->
                <p class="head_text">Instant Quiz</p>
				<div class="quiz-wrapper"></div>
				<!--QUIZ-->
				
				<p class="block-title" style="margin-top:50px;font-size:12px;">Sebelum Anda Memulai</p>
				<div class="list media-list">
					<ul>
						<li>
							<a href="/activity-detail/6/0/" class="item-link item-content" data-transition="f7-cover">
							  <div class="item-media">
							  <img src="https://simply-mind.com/tiger_dashboard/img/aturan_main3.png" width="80" /></div>
							  <div class="item-inner">
								<div class="item-title-row">
									<div class="item-title heading_brush" style="font-size:20px;color:rgba(63,61,108,1)">Aturan Main</div>
								</div>
								<div class="item-text">Sebelum memulai module TDSC ada baiknya Anda membaca aturan main terlebih dahulu</div>
							  </div>
							</a>
						</li>
						<li>
							<a href="/activity-detail/7/0/" class="item-link item-content" data-transition="f7-cover">
							  <div class="item-media"><img src="https://simply-mind.com/tiger_dashboard/img/5_hadi2.png"
								  width="80" /></div>
							  <div class="item-inner">
								<div class="item-title-row">
									<div class="item-title heading_brush" style="font-weight:300;font-size:20px;color:rgba(63,61,108,1)">5 Manfaat</div>
								</div>
								<div class="item-text">5 Manfaat dalam mempelajari semua module TDSC</div>
							  </div>
							</a>
						</li>
					</ul>
				</div>
				<p class="block-title" style="margin-top: 50px;font-size:12px;"> Modul Pembelajaran</p>
				<div class="list media-list module-list">
					<ul></ul>
				</div>
			</div>
		</div> 
		</div>
		<div class="login-screen" id="my-login-screen"> 
            <div class="view">
                <div class="page">
                    <div class="page-content login-screen-content">
                        <div style="text-align:center;margin-top: 0px">
                            <img src="https://tiger-tdscapps.com/img/tiger_logo_new_small.png" width="180px" style="margin-top: 10%">
                        </div>
                        <div class="login-screen-title">
                            <div class="heading">LOGIN</div>
						</div>
                        <div style="padding: 0px 10px" class="signin-wrapper">
                            <div class="list" style="background:white;padding: 20px 5px">
                                <ul>
                                    <li class="item-content item-input">
                                        <div class="item-inner">
                                            <div class="item-title item-label">Email</div>
                                            <div class="item-input-wrap">
                                                <input type="text" name="email" placeholder="Your Email">
                                            </div>
                                        </div>
                                    </li>
                                    <li class="item-content item-input">
                                        <div class="item-inner">
                                            <div class="item-title item-label">Password</div>
                                            <div class="item-input-wrap">
                                                <input type="password" name="password" placeholder="Your password" style="color: #B1072C">
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="" style="padding: 0px 20px;margin-top: 20px;">
                                            <button class="button button-fill login-button" >Masuk</button>
                                        </div>
                                    </li>

                                </ul>
                            </div>
                        </div>
						<div style="padding: 0px 10px;display:none" class="signup-wrapper">
                            <div class="list" style="background:white;box-shadow: 0px 1px 8px -5px rgba(0,0,0,0.75);padding: 20px 5px">
                                <ul>
                                    <li class="item-content item-input">
                                        <div class="item-inner">
                                            <div class="item-title item-label">Email</div>
                                            <div class="item-input-wrap">
                                                <input type="text" name="email_signup" placeholder="Your Email" id="email_signup">
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="" style="padding: 0px 20px;margin-top: 20px;">
                                            <button class="button daftar-button" >Daftar</button>
                                        </div>
                                    </li>

                                </ul>
                            </div>
                        </div>
                        <div class="list">
                            <ul class="signup-text">
								<li><p style="text-align:center;margin-top:-20px;"> Belum punya akun? <a href="#" id="signup-button">Daftar Disini</a></p></li>
                            </ul>
							<ul class="signin-text" style="display:none">
								<li><p style="text-align:center"> Sudah punya akun? <a href="#" id="signin-button">Masuk Disini</a></p></li>
                            </ul>
                            <div class="block-footer color-orange">2024 Copyrighted</div>
                            <div class="block-footer color-orange">1.1.6</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
		
    </div>


    <script type="text/javascript" src="cordova.js"></script>
    <!--<script type="text/javascript" src="http://hammerjs.github.io/dist/hammer.min.js"></script>-->
    <script type="text/javascript" src="js/framework7-bundle.min.js"></script>
    <script type="text/javascript" src="js/routes.js"></script>
    <script type="text/javascript" src="js/app.js"></script>
    <script type="text/javascript" src="js/login.js"></script>
	<!--<script type="text/javascript" src="js/index.js"></script>-->
	
</body>

</html>