2013-12-04 3 views
1

Я пробовал дни, поэтому, наконец, я подумал, что должен спросить. Ниже я опубликую то, что у меня есть, любые прямые решения будут замечательными. Я постараюсь быть максимально подробным.Тип аукциона Обратный отсчет

Что мне нужно создать?

Обратный отсчет типа аукциона с взаимодействием с MySQL для извлечения конечного времени рассматриваемого предмета. Я также буду использовать Javascript для создания живой анимации обратного отсчета. Он должен использовать время сервера, а не время пользователя на своем компьютере, которое, похоже, не работает.

Типы файлов Используется

PHP, Javascript, MySQL

Особые примечания

Я должен также гарантировать, что время от сервера, а не на целевом компьютере. Если есть лучший способ сделать то, что я пытаюсь, дайте мне знать. Я провел много исследований и до сих пор не могу заставить это работать.

Имена файлов

index.php   - Main File 
db.php    - Connection to DB   - within "system" folder 
functions.php  - Contains all functions. - within "system" folder 

DataBase информация

Table Name: time 
Fields : id, name, end_time 

Примечание по базе данных: "end_time" является TIMESTAMP

index.php

<? 
    // Calls the DB for Connection 
    include("system/db.php"); 
    // Calls all Functions 
    include("system/functions.php"); 
?> 

<!-- Loads the actual Countdown --> 
    <div id="countdowncontainer"></div> 
<br /> 

<? 
// This Part loads the "end_date" so the countdown can stop. 
//////////////////////////////////////////////////////////// 
    $id_num = "1"; 
    $result = mysql_query("SELECT * FROM item WHERE id = '$id_num'"); 
    while($row = mysql_fetch_array($result)) 
    { 
     $end_time = $row['end_date']; // 2013-12-11 00:00:00 
     $end_time = $end_time ; 
    } 
?> 


    <!-- The script below loads the data from the server in this format : 
    2013-12-11 00:00:00 --> 
    <script type="text/javascript"> 

     var futuredate=new cdtime("countdowncontainer", "<? echo $end_time; ?>") 
     futuredate.displaycountdown("days", formatresults) 

    </script> 

Следующий файл является файлом функции. Здесь я предполагаю, что мне нужно изменить или сделать что-то, чтобы оно могло загружать время сервера, а не местное время.

functions.php

<script type="text/javascript"> 
    function cdtime(container, targetdate) { 
     if (!document.getElementById || !document.getElementById(container)) return 
     this.container = document.getElementById(container) 
     this.currentTime = new Date() 
     this.targetdate = new Date(targetdate) 
     this.timesup = false 
     this.updateTime() 
    } 

    cdtime.prototype.updateTime = function() { 
     var thisobj = this 
     this.currentTime.setSeconds(this.currentTime.getSeconds() + 1) 
     setTimeout(function() { 
      thisobj.updateTime() 
     }, 1000) //update time every second 
    } 

    cdtime.prototype.displaycountdown = function (baseunit, functionref) { 
     this.baseunit = baseunit 
     this.formatresults = functionref 
     this.showresults() 
    } 

    cdtime.prototype.showresults = function() { 
     var thisobj = this 


     var timediff = (this.targetdate - this.currentTime)/1000 //difference btw target date and                 current date, in seconds 
     if (timediff < 0) { //if time is up 
      this.timesup = true 
      this.container.innerHTML = this.formatresults() 
      return 
     } 
     var oneMinute = 60 //minute unit in seconds 
     var oneHour = 60 * 60 //hour unit in seconds 
     var oneDay = 60 * 60 * 24 //day unit in seconds 
     var dayfield = Math.floor(timediff/oneDay) 
     var hourfield = Math.floor((timediff - dayfield * oneDay)/oneHour) 
     var minutefield = Math.floor((timediff - dayfield * oneDay - hourfield * oneHour)/oneMinute) 
     var secondfield = Math.floor((timediff - dayfield * oneDay - hourfield * oneHour - minutefield * oneMinute)) 
     if (this.baseunit == "hours") { //if base unit is hours, set "hourfield" to be topmost level 
      hourfield = dayfield * 24 + hourfield 
      dayfield = "n/a" 
     } else if (this.baseunit == "minutes") { //if base unit is minutes, set "minutefield" to be topmost level 
      minutefield = dayfield * 24 * 60 + hourfield * 60 + minutefield 
      dayfield = hourfield = "n/a" 
     } else if (this.baseunit == "seconds") { //if base unit is seconds, set "secondfield" to be topmost level 
      var secondfield = timediff 
      dayfield = hourfield = minutefield = "n/a" 
     } 
     this.container.innerHTML = this.formatresults(dayfield, hourfield, minutefield, secondfield) 
     setTimeout(function() { 
      thisobj.showresults() 
     }, 1000) //update results every second 
    } 




    function formatresults() { 
     if (this.timesup == false) { //if target date/time not yet met 
      var displaystring = arguments[0] + " days " + arguments[1] + " hours " + arguments[2] + " minutes  " + arguments[3] + " seconds <b>left until Target Date </b>" 
     } else { //else if target date/time met 
      var displaystring = "<? $test2 = " 
      Test Is a Success ";?><b><? echo $test2; ?></b>" 
     } 
     return displaystring 
    } 
</script> 

Теперь это работает отлично до точки. Однако, если я изменю свое местное время, я могу обмануть его, а не время сервера, так как это не может быть изменено.

Что мне не хватает?

+0

'this.currentTime = new Date()' использовать локальную дату, потому что она выполняется на стороне клиента. Вы должны получить текущую временную метку в PHP и передать ее функции 'cdtime': тогда локальная дата никогда не будет использоваться. ** РЕДАКТИРОВАТЬ **: Почему в вашем коде нет ';'? – OlivierH

+0

Возможно, было бы лучше получить, как долго (в секундах) осталось до отсчета времени, а затем передайте это на Javascript и установите время, основанное на том, как долго осталось. Это делает его локальным для пользователя и имеет больше смысла. – Nunners

+1

Извините, вы потеряли меня в mysql_ – vascowhite

ответ

0

Проблема здесь:

this.currentTime=new Date() 

Вы используете локальную дату клиента в качестве «текущего» даты. Вместо этого вы должны передавать его так же, как и с заданной датой.

E.g. Как это

(php) 
    $current_time = date('Y-m-d H:i:s'); 

    (javascript) 
    var futuredate = new cdtime("countdowncontainer", "<? echo $current_time; ?>", "<? echo $end_time; ?>") 

и

function cdtime(container, currentdate, targetdate) { 
    ... 
    this.currentdate=new Date(currentdate) 

Сделав это вы можете иметь часы тикать с функциями тайм-аута.

Однако это заставит время немного ползти (обратите внимание, как это происходит на eBay иногда).

Спокойный круг, который время от времени запрашивает сервер снова. и сбросить 'currentTime'. Вы можете сделать это, внедряя простой сервис с PHP, который возвращает время - возможно, как JSON, а затем вызывает его с помощью AJAX.

+0

Как мне передать его, как я сделал в назначенный день? Идея-х? – user3063070

+0

Да, точно так же, просто используя вывод 'date' - ответ обновленный –

0

Было бы намного лучше подобрать длину счетчика в миллисекундах (или секундах), а затем передать это функции javascript для создания targetdate. Таким образом, обратный отсчет относится к пользователю. Например:

  1. Пользователь живет в часовом поясе +5 часов с сервера
  2. Ваш Обратный отсчет закончится в 17:00 04/12/2013 скажем (для сервера)
  3. Для фактический пользователь, обратный отсчет закончится в 22:00 04/12/2013.

(Если вы не держите его локальным для пользователя, тайминги будет неправильным и может легко начать, чтобы запутать пользователей.)

Пример добавления миллисекунды к дате (Это добавляет 5 часов дате Javascript):

var targetdate=new Date(currentTime.getTime() + 18000000); 

Пример для получения разницы во времени (с помощью Javascript):

// PHP 
//Get current date 
$currdate = date('Y-m-d H:i:s'); 
$end_time = $row['end_date']; // 2013-12-11 00:00:00 
$end_time = $end_time; 

// Javascript 
//Pass current date to the Javascript function 
var futuredate=new cdtime("countdowncontainer", "<? echo $currdate; ?>", "<? echo $end_time; ?>") 

function cdtime(container, currentdate, targetdate) { 
    if (!document.getElementById || !document.getElementById(container)) return 
    this.container = document.getElementById(container) 
    this.currentTime = new Date() 
    //Creates temp date variables 
    var curDate = new Date(currentdate); 
    var endDate = new Date(targetdate); 
    //Gets time Difference in Milliseconds 
    var diff = endDate.getTime() - curDate.getTime(); 
    //Sets targetdate to be the current date + the difference 
    this.targetdate = new Date(currentTime.getTime() + diff) 
    this.timesup = false 
    this.updateTime() 
} 
+0

Любовь эта Идея, теперь просто нужно выяснить, как это сделать. :/ – user3063070

+0

@ user3063070 - См. Мой обновленный ответ для примера этого в Javascript. Я получаю текущую дату от PHP и передаю ее функции javascript, чтобы получить разницу в миллисекундах. (Вы можете сделать это на PHP, а затем передать миллисекунды, но примеры, которые я нашел, были довольно большими) – Nunners

Смежные вопросы