طلب كود برمجي يحتسب الوقت المتبقى فى عداد متحرك

السلام عليكم

تقصدي أن يكون وقت المتغيرين $start و $end على شكل timestamps وإن لم يكونوا بهذه الصيغة يمكن تحويلهم لها وإستخدام الكود التالي والذي سيتم إستخدام كود javaScript لعمل المطلوب وتغيير الوقت المتبقي كل ثانية سأستخدم في الكود مكتبة jQuery

الكود ببساطة يحتوي على دالة makeTime والتي تقوم بإنقاص الوقت ثانية وتغيير حقول الوقت وهي ( ثانية - دقيقة - ساعة - يوم ) وإستخدام دالة setInterval لإنقاص الوقت كل ثانية والدالة str_pad لتكوين أصفار بحيث تكون الحقول دائماً مكونة من رقمين .

يمكنكي تتبع الكود لمعرفة طريقة عمله والكود كالتالي :

<?php
    $start = 1390893903;
    $end = 1391203903;
    $timeAgo = $end - $start;
    $startAMPM = date('A',$start);
    $endAMPM = date('A',$end);
    if($startAMPM == 'AM'){
        $startAMPM = 'صباحاً';
    }else if($startAMPM == 'PM'){
        $startAMPM = 'مساءً';
    }
    if($endAMPM == 'AM'){
        $endAMPM = 'صباحاً';
    }else if($endAMPM == 'PM'){
        $endAMPM = 'مساءً';
    }
?>
<!DOCTYPE html>
<html dir="rtl">
<head>
    <meta charset="utf-8">
    <script src="js/jquery-1.9.1.min.js"></script>
    <style>
        *{padding:0;margin:0;}
        #agoTable{
            margin: auto;
        }
        #agoTable td {
            padding: 5px 20px 5px 20px;
            text-align: center;
        }
    </style>
</head>
<body>
<header>
    
</header>
<article>
    <table id="agoTable">
        <tr>
            <td>تاريخ البداية</td><td>تاريخ النهاية</td><td>الوقت المتبقي</td>
        </tr>
        <tr>
            <td>
            <?php
                echo date('Y-n-j h:i '.$startAMPM,$start);
            ?>
            </td>
            <td>
            <?php
                echo date('Y-n-j h:i '.$endAMPM,$end);
            ?>
            </td>
            <td>
                <div class="timeAgo">
                    <span class="days">00</span>:<span class="hours">00</span>:<span class="minuts">00</span>:<span class="sconds">00</span>
                </div>
            </td>
        </tr>
    </table>
</article>
<footer>
    
</footer>
<script>
    $(function(){
        var time = <?php echo isset($timeAgo)?$timeAgo:0; ?>;
        var days,hours,minuts,sconds;
        makeTime();
        
        setInterval(function(){
            makeTime();
        },1000);
        function makeTime(){
            --time;
            if(time < 0) return false;
            days = parseInt(time/(60*60*24));
            var temp = time%(60*60*24);
            hours = parseInt(temp/(60*60));
            temp = temp%(60*60);
            minuts = parseInt(temp/60);
            sconds = temp%60;
            days = str_pad(days,2);
            hours = str_pad(hours,2);
            minuts = str_pad(minuts,2);
            sconds = str_pad(sconds,2);
            $('.timeAgo .days').html(days);
            $('.timeAgo .hours').html(hours);
            $('.timeAgo .minuts').html(minuts);
            $('.timeAgo .sconds').html(sconds);
        }
        
        function str_pad(input, len){
            input += '';
            var dif = len-input.length;
            var out = '';
            if(dif > 0){
                for(i=0;i<dif;++i){
                    out += '0';
                }
                return out+input;
            }
            return input;
        }
    });
</script>
</body>
</html>

والملف كامل للتجربه

timeAgo.zip

شكرا لك اخي الفاضل قمت بتجربة الكود ولكن قمت بالتعديل عليه بما يحتاجة الاسكربت لدي شاكرة جدا ومقدرة لك اخي الفاضل

مشكلة بسيطة اخي ظهرت وهي كالتالي

السلام عليكم الكودد خاص بعداد الوقت المتبقى والمشكلة تكمن فى التالي

الكود يحتسب الوقت طبيعى البداية والنهايه والعداد يعمل

لكن ان قمت بعمل رفرش للصفحة يرجع العداد مرة اخرى للرقم من البداية

بمعني العداد حتى لو سويت تحديث كل ثانيه للصفحة لايغير الوقت بل يحسب مرة اخرى من البداية يعنى ما يطرح العداد ثابت

<?php
$start = 1390948647;
$end = 1391553447;
$timeAgo = $end - $start;
$startAMPM = date('A',$start);
$endAMPM = date('A',$end);
if($startAMPM == 'AM'){
$startAMPM = 'صباحاً';
}else if($startAMPM == 'PM'){
$startAMPM = 'مساءً';
}
if($endAMPM == 'AM'){
$endAMPM = 'صباحاً';
}else if($endAMPM == 'PM'){
$endAMPM = 'مساءً';
}
?>
<!DOCTYPE html>
<html dir="rtl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1256"> <script src="js/jquery-1.9.1.js"></script>
<style>
*{padding:0;margin:0;}
#agoTable{
margin: auto;
}
#agoTable td {
padding: 5px 20px 5px 20px;
text-align: center;
}
</style>
</head>
<body>
<header>

</header>
<article>
<table id="agoTable">
<tr>
<td>تاريخ البداية</td><td>تاريخ النهاية</td><td>الوقت المتبقي</td>
</tr>
<tr>
<td>
<?php
echo date('Y-n-j h:i '.$startAMPM,$start);
?>
</td>
<td>
<?php
echo date('Y-n-j h:i '.$endAMPM,$end);
?>
</td>
<td>
<div class="timeAgo">
<span class="days">00</span>:<span class="hours">00</span>:<span class="minuts">00</span>:<span class="sconds">00</span>
</div>
</td>
</tr>
</table>
</article>
<footer>

</footer>
<script>
$(function(){
var time = <?php echo isset($timeAgo)?$timeAgo:0; ?>;
var days,hours,minuts,sconds;
makeTime();

setInterval(function(){
makeTime();
},1000);
function makeTime(){
--time;
if(time < 0) return false;
days = parseInt(time/(60*60*24));
var temp = time%(60*60*24);
hours = parseInt(temp/(60*60));
temp = temp%(60*60);
minuts = parseInt(temp/60);
sconds = temp%60;
days = str_pad(days,2);
hours = str_pad(hours,2);
minuts = str_pad(minuts,2);
sconds = str_pad(sconds,2);
$('.timeAgo .days').html(days);
$('.timeAgo .hours').html(hours);
$('.timeAgo .minuts').html(minuts);
$('.timeAgo .sconds').html(sconds);
}

function str_pad(input, len){
input += '';
var dif = len-input.length;
var out = '';
if(dif > 0){
for(i=0;i<dif;++i){
out += '0';
}
return out+input;
}
return input;
}
});
</script>
</body>
</html>

وعليكم السلام

بالطبع سيحدث هذا لأننا نأخذ الفرق بين وقت البداية والنهاية وهو ثابت مع مرور الوقت فكل عملية تحديث للصفحة ستعيد العملية من جديد .

لحساب الوقت المتبقي فقط على تاريخ الإنتهاء سيتم طرح الوقت الحالي من وقت الإنتهاء أي قومي بتعديل السطر الرابع إلى التالي :

$timeAgo = $end – time();

السلام عليكم

قمت بالتعديل عليها بالشكل التالى حتى تطبع ايضا تاريخ البدايه والنهايه

والان يعمل بشكل سليم

		<?php
    $start = $timee22;
    $end = $timee33;
    
    $endd = $timee33;
    $naw   =  time();
    $timeAgo = $endd - $naw;
        $startAMPM = date('A',$start);
    $endAMPM = date('A',$end);
    if($startAMPM == 'AM'){
        $startAMPM = 'صباحاً';
    }else if($startAMPM == 'PM'){
        $startAMPM = 'مساءً';
    }
    if($endAMPM == 'AM'){
        $endAMPM = 'صباحاً';
    }else if($endAMPM == 'PM'){
        $endAMPM = 'مساءً';
    }
?>