API tools faq
paste
kristriel08

ORIG INSERT COIN

kristriel08
May 1st, 2019
49
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 6.45 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <title><?= $title ?></title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1">
  7. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  8. <meta charset utf="8">
  9. <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon">
  10. <link rel="icon" href="images/favicon.ico" type="image/x-icon">
  11. <link rel="stylesheet" href="css/insertcoin.css" media="screen">
  12. <link href="css/bootstrap4.min.css" rel="stylesheet" type="text/css">
  13.  
  14. <link href="css/animate.min.css" rel="stylesheet">
  15.  
  16. <link href="css/toastr.min.css" rel="stylesheet">
  17. <!--<link href="css/style.min.css" rel="stylesheet">-->
  18. <link rel="stylesheet" href="css/font-awesome.min.css">
  19.  
  20. <script src="js/jquery.min.js"></script>
  21. <script src="js/apps.min.js"></script>
  22. <style>
  23. body {
  24. background-color: #cfedfc !important;
  25. background-image: url("images/bg.jpg");
  26. background-size: cover;
  27. background-position: center center;
  28. margin:auto;
  29. text-align: center;
  30. }
  31. .vertical-form {
  32. padding-left:15px;
  33. padding-right:15px;
  34. }
  35. a {color:#428bca !important;}
  36. a:hover{
  37. text-decoration: none !important;
  38. }
  39. .button-rnd {
  40. min-width: 300px !important;
  41. max-width: 300px !important;
  42. }
  43. .button-rnd:hover{
  44. box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  45. }
  46. .footer {
  47. font-size:90%;
  48. color:#748c8a;
  49. }
  50. .footer a{
  51. margin-left:3px;
  52. }
  53. .button-animate {
  54.  
  55. -webkit-animation: glowing 1500ms infinite;
  56. -moz-animation: glowing 1500ms infinite;
  57. -o-animation: glowing 1500ms infinite;
  58. animation: glowing 1500ms infinite;
  59. }
  60. @-webkit-keyframes glowing {
  61. 0% { box-shadow: 0 0 3px #80c780; background-color: #4cae4c;}
  62. 50% { box-shadow: 0 0 40px #6ec06e; background-color: #449d44; }
  63. 100% { box-shadow: 0 0 3px #5cb85c; background-color: #4cae4c;}
  64. }
  65.  
  66. @-moz-keyframes glowing {
  67. 0% { box-shadow: 0 0 3px #80c780; background-color: #4cae4c;}
  68. 50% { box-shadow: 0 0 40px #6ec06e; background-color: #449d44; }
  69. 100% { box-shadow: 0 0 3px #5cb85c; background-color: #4cae4c;}
  70. }
  71.  
  72. @-o-keyframes glowing {
  73. 0% { box-shadow: 0 0 3px #80c780; background-color: #4cae4c;}
  74. 50% { box-shadow: 0 0 40px #6ec06e; background-color: #449d44; }
  75. 100% { box-shadow: 0 0 3px #5cb85c; background-color: #4cae4c;}
  76. }
  77.  
  78. @keyframes glowing {
  79. 0% { box-shadow: 0 0 3px #80c780; background-color: #4cae4c;}
  80. 50% { box-shadow: 0 0 40px #6ec06e; background-color: #449d44; }
  81. 100% { box-shadow: 0 0 3px #5cb85c; background-color: #4cae4c;}
  82. }
  83. .modal {
  84. z-index:99999;
  85. }
  86. .modal-dialog{
  87. overflow-y: initial !important
  88. }
  89. .modal-body{
  90. height: 250px;
  91. overflow-y: auto;
  92. }
  93. .visible {
  94. visibility: visible;
  95. }
  96. .invisible {
  97. visibility: hidden;
  98. }
  99. </style>
  100. </head>
  101.  
  102. <body class='insertcoin'>
  103.  
  104.  
  105.  
  106. <div class="vertical-form">
  107. <div style="margin:0;padding:0;display:inline"></div>
  108. <legend>
  109. <!--START animated coin slot-->
  110. <div style="background-image: url('images/coin-slot.png');width:220px;height: 220px;background-size:cover;padding:0px;margin:auto">
  111.  
  112. </div>
  113. <!--END animated coin slot-->
  114. </legend>
  115.  
  116.  
  117. <!--Toast-->
  118. <div align="center">
  119. <p> TOTAL AMOUNT :
  120. <span id="tamount">0.00 <br> </p>
  121. <p> <button type="button" class="btn btn-primary btn-sm"><i class="fa fa-clock-o"></i><span id="ttime"> --</button> <button type="button" class="btn btn-primary btn-sm"><i class="fa fa-usb"></i><span id="tcharging"> --</button> <button type="button" class="btn btn-primary btn-sm"><i class="fa fa-ticket"></i><span id="tvoucher"> --</button></p>
  122. <div class="progress progress-rounded progress-lg progress-striped active">
  123. <div id="progressBar" class="progress-bar progress-bar-danger" style="width:70%"></div>
  124. </div>
  125. <div id="progress-msg" class="text-center text-white" style="margin-top:-25px;"> </div>
  126. <div style="clear: both; height:60px;"></div>
  127. <div id="transcoins">
  128.  
  129.  
  130. </div>
  131. <div class="btn-group" role="group">
  132. <form action="<?= $done?>" method="post">
  133.  
  134. <button type="submit" name="transmode" value="coin" class="btn btn-primary btn-sm button-animate <?= (!$buytimezxc) ? 'invisible' : 'visible' ?>"><i class="fa fa-clock-o"></i>Buy Time</button>
  135. <?= ($getChargeRemaing < 0) ? '<button type="button" data-toggle="modal" data-target="#exampleModal" class="btn btn-primary btn-sm button-animate '.((!$buychargingzxc) ? 'invisible' : 'visible').'"><i class="fa fa-usb"></i>Buy Charging</button>' : ' <button type="submit" name="transmode" value="addchargetime" class="btn btn-primary btn-sm button-animate">Extend Charging</button>' ?>
  136.  
  137.  
  138. <button type="submit" name="transmode" value="voucher" class="btn btn-primary btn-sm button-animate <?= (!$buyvoucherzxc) ? 'invisible' : 'visible' ?>"><i class="fa fa-ticket"></i>Buy Voucher</button>
  139. </form>
  140. </div>
  141.  
  142.  
  143.  
  144.  
  145.  
  146. </div>
  147.  
  148. <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  149. <div class="modal-dialog modal-dialog-centered">
  150.  
  151. <div class="modal-content">
  152. <div class="modal-header">
  153. <h5 class="modal-title"><i class="fa fa-usb"></i> Select Charging Ports <i class="fa fa-usb"></i></h5>
  154.  
  155.  
  156. </div>
  157.  
  158. <form action="<?= $done?>" method="post">
  159. <div class="modal-body">
  160.  
  161. <table class="table table-striped table-bordered table-sm">
  162. <tr class="thead-dark">
  163. <th>Port
  164. </th>
  165. <th>Note
  166. </th>
  167. <th>Availability
  168. </th>
  169. </tr>
  170.  
  171. <?= selectcharging($link,$ip); ?>
  172.  
  173.  
  174. </table>
  175. </div>
  176. <div class="modal-footer">
  177. <button type="submit" name="transmode" value="port" class="btn btn-success">Select</button>
  178. </div>
  179. </form>
  180. </div>
  181.  
  182.  
  183.  
  184. </div>
  185. </div>
  186.  
  187. <script src="js/jquery-migrate-1.1.0.min.js"></script>
  188. <script src="js/jquery-ui.min.js"></script>
  189. <script src="js/bootstrap4.min.js"></script>
  190.  
  191.  
  192. <script src="js/jquery.slimscroll.min.js"></script>
  193. <script src="js/jquery.cookie.js"></script>
  194. <script type="text/javascript" src="js/soundjs.min.js"></script>
  195. <script type="text/javascript" src="js/preloadjs.min.js"></script>
  196. <script src="js/toastr.min.js"></script>
  197.  
  198.  
  199. <!--//footer-->
  200.  
  201.  
  202. </body>
  203. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!