منتدى فيجوال بيسك لكل العرب | منتدى المبرمجين العرب - اريد كودجافا نافذه تخرج بوقت بدون تحديث الصفحه

الصفحات : 1 2

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

عليكم السلام و رحمة الله و بركاته
انا افترضت توقيت زمني لمدة خمس ثواني لانبثاق النافذة
ايضاً وضعت لك تضمين في نفس الكود ان اردت تكرار ظهور نفس النافذة
يمكنك تعديل الكود بما شئت .

PHP كود :
<!DOCTYPE html>
<html lang="ar">
<head>
<meta charset="UTF-8">
<title>Popup</title>

<style>
#overlay {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    top: 0;
    left: 0;
}

#popup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    text-align: center;
}
</style>
</head>

<body>

<div id="overlay"></div>

<div id="popup">
    <h3>تنبيه</h3>
    <p>اهلا و سهلا بك</p>
    <button onclick="closePopup()">إغلاق</button>
</div>

<script>

//  يعمل مرة واحدة بعد 5 ثواني
setTimeout(function () {
    document.getElementById("popup").style.display = "block";
    document.getElementById("overlay").style.display = "block";
}, 5000);


//  الكود الاحتياطي (مكرر كل 5 ثواني)
// let popupInterval = setInterval(function () {
//     document.getElementById("popup").style.display = "block";
//     document.getElementById("overlay").style.display = "block";
// }, 5000);


// إغلاق النافذة
function closePopup() {
    document.getElementById("popup").style.display = "none";
    document.getElementById("overlay").style.display = "none";
}

</script>

</body>
</html></html> 

لو فهمت قصدي
اريد كود تنبيه اوقات الصلاه بدون تحديث الصفحه

(28-03-26, 11:37 PM)nnnjk كتب : [ -> ]لو فهمت قصدي
اريد كود تنبيه اوقات الصلاه بدون تحديث الصفحه

عذراً ,
لم تتضح الصورة بعد
ماذا تقصد بدون تحديث الصفحه
هل تريد جميع مواقيت الصلوات المفروضة
ام تريد اظهار تنبيه فقط بتوقيت ما .

اجعله على سبيل المثال وقت صلاة الفجر فقط

يبدوا بحاجة كود php يقوم بتحويل وقت معين مثلا 03:15 الى عدد ثواني

(29-03-26, 12:05 AM)nnnjk كتب : [ -> ]اجعله على سبيل المثال وقت صلاة الفجر فقط

يبدوا بحاجة كود php يقوم بتحويل وقت معين مثلا 03:15 الى عدد ثواني

لا لا ليس هذاا المقصد
يمكن بالفعل اظهار التنبيه بوقت معين
لكن سؤالي حتى اللحظة هل تقصد بدون تحديث الصفحه
تريد تنفيذ التنبيه دون تشغيل المتصفح ؟
ام انك تقصد عدم تحديث الصفحة بكل ثانيه ضمن نفس التوقيت

PHP كود :
<!DOCTYPE html>
<html lang="ar">
<head>
<meta charset="UTF-8">
<title>تنبيه بمواقيت الصلاة</title>
<style>
#overlay {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    top: 0;
    left: 0;
}
#popup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    text-align: center;
}
#countdown {
    font-size: 18px;
    margin-top: 20px;
    text-align: center;
}
button {
    margin-top: 10px;
}
</style>
</head>
<body>

<div id="overlay"></div>

<div id="popup">
    <h3>تنبيه صلاة الفجر</h3>
    <p>حان الآن موعد الصلاة</p>
    <button onclick="closePopup()">إغلاق</button>
</div>

<div id="countdown"></div>

<script>
const fajrTime = "03:15";
let shown = false;

function updateCountdown() {
    let now = new Date();
    let [hour, minute] = fajrTime.split(":");
    let fajrDate = new Date();
    fajrDate.setHours(parseInt(hour));
    fajrDate.setMinutes(parseInt(minute));
    fajrDate.setSeconds(0);
    if (now > fajrDate) {
        fajrDate.setDate(fajrDate.getDate() + 1);
    }
    let diff = fajrDate - now;
    let hours = Math.floor(diff / 1000 / 60 / 60);
    let minutes = Math.floor((diff / 1000 / 60) % 60);
    document.getElementById("countdown").textContent =
        `الوقت المتبقي لصلاة الفجر: ${hours} ساعة، ${minutes} دقيقة`;
}

function checkFajr() {
    let now = new Date();
    let currentTime =
        now.getHours().toString().padStart(2,'0') + ":" +
        now.getMinutes().toString().padStart(2,'0');
    if (currentTime === fajrTime && !shown) {
        document.getElementById("popup").style.display = "block";
        document.getElementById("overlay").style.display = "block";
        shown = true;
    }
}

function closePopup() {
    document.getElementById("popup").style.display = "none";
    document.getElementById("overlay").style.display = "none";
}

updateCountdown();
setInterval(() => {
    updateCountdown();
    checkFajr();
}, 60000);

</script>
</body>
</html> 

اقصد اظهار التنبيه بدون تحديث الصفحة يعني مثلا التنبيه الساعه 03:15 دخل الزائر الصفحة الساعه 03:12 بعد 3 دقائق من دخوله الصفحه يخرج التنبيه بدون ان يحدث الصفحه

لم يعمل الكود بارك الله فيك

(29-03-26, 01:24 AM)nnnjk كتب : [ -> ]اقصد اظهار التنبيه بدون تحديث الصفحة يعني مثلا التنبيه الساعه 03:15 دخل الزائر الصفحة الساعه 03:12 بعد 3 دقائق من دخوله الصفحه يخرج التنبيه بدون ان يحدث الصفحه

الحل: استخدام setTimeout ديناميكي بدلاً من setInterval
بحيث نحسب فارق التوقيت و نشغل التنبيه تلقائياً بعد هذا الفرق.

PHP كود :
<!DOCTYPE html>
<html lang="ar">
<head>
<meta charset="UTF-8">
<title>تنبيه صلاة الفجر</title>
<style>
#overlay {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    top: 0;
    left: 0;
}
#popup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    text-align: center;
}
#countdown {
    font-size: 18px;
    margin-top: 20px;
    text-align: center;
}
button {
    margin-top: 10px;
}
</style>
</head>
<body>

<div id="overlay"></div>

<div id="popup">
    <h3>تنبيه صلاة الفجر</h3>
    <p>حان الآن وقت صلاة الفجر</p>
    <button onclick="closePopup()">إغلاق</button>
</div>

<div id="countdown"></div>

<script>
const fajrTime = "05:10";

function showPopup() {
    document.getElementById("popup").style.display = "block";
    document.getElementById("overlay").style.display = "block";
}

function closePopup() {
    document.getElementById("popup").style.display = "none";
    document.getElementById("overlay").style.display = "none";
}

function updateCountdown() {
    let now = new Date();
    let [hour, minute] = fajrTime.split(":");
    let fajrDate = new Date();
    fajrDate.setHours(parseInt(hour));
    fajrDate.setMinutes(parseInt(minute));
    fajrDate.setSeconds(0);
    if (fajrDate < now) {
        fajrDate.setDate(fajrDate.getDate() + 1);
    }
    let diff = fajrDate - now;
    let hours = Math.floor(diff / 1000 / 60 / 60);
    let minutes = Math.floor((diff / 1000 / 60) % 60);
    let seconds = Math.floor((diff / 1000) % 60);
    document.getElementById("countdown").textContent =
        `الوقت المتبقي لصلاة الفجر: ${hours} ساعة، ${minutes} دقيقة، ${seconds} ثانية`;
}

function scheduleFajr() {
    let now = new Date();
    let [hour, minute] = fajrTime.split(":");
    let fajrDate = new Date();
    fajrDate.setHours(parseInt(hour));
    fajrDate.setMinutes(parseInt(minute));
    fajrDate.setSeconds(0);
    if (fajrDate < now) {
        fajrDate.setDate(fajrDate.getDate() + 1);
    }
    let diff = fajrDate - now;
    setTimeout(showPopup, diff);
}

// تحديث العد التنازلي كل ثانية
setInterval(updateCountdown, 1000);

scheduleFajr();
updateCountdown();
</script>

</body>
</html> 

عمل الكود بارك الله فيك
لاكن اريد ان يستمر التنبيه 5 دقائق مثلا

(29-03-26, 02:01 AM)nnnjk كتب : [ -> ]عمل الكود بارك الله فيك
لاكن اريد ان يستمر التنبيه 5 دقائق مثلا

PHP كود :
<!DOCTYPE html>
<html lang="ar">
<head>
<meta charset="UTF-8">
<title>تنبيه صلاة الفجر</title>
<style>
#overlay {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    top: 0;
    left: 0;
}
#popup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    text-align: center;
}
#countdown {
    font-size: 18px;
    margin-top: 20px;
    text-align: center;
}
button {
    margin-top: 10px;
}
</style>
</head>
<body>
<div id="overlay"></div>
<div id="popup">
    <h3>تنبيه صلاة الفجر</h3>
    <p>حان الآن وقت صلاة الفجر</p>
    <button onclick="closePopup()">إغلاق</button>
</div>
<div id="countdown"></div>
<script>
const fajrTime = "05:10";

// هنا يمكنك تغيير مدة استمرار التنبيه

function showPopup() {
    document.getElementById("popup").style.display = "block";
    document.getElementById("overlay").style.display = "block";
    setTimeout(closePopup, 5 * 60 * 1000);
}

function closePopup() {
    document.getElementById("popup").style.display = "none";
    document.getElementById("overlay").style.display = "none";
}
function updateCountdown() {
    let now = new Date();
    let [hour, minute] = fajrTime.split(":");
    let fajrDate = new Date();
    fajrDate.setHours(parseInt(hour));
    fajrDate.setMinutes(parseInt(minute));
    fajrDate.setSeconds(0);
    if (fajrDate < now) {
        fajrDate.setDate(fajrDate.getDate() + 1);
    }
    let diff = fajrDate - now;
    let hours = Math.floor(diff / 1000 / 60 / 60);
    let minutes = Math.floor((diff / 1000 / 60) % 60);
    let seconds = Math.floor((diff / 1000) % 60);
    document.getElementById("countdown").textContent =
        `الوقت المتبقي لصلاة الفجر: ${hours} ساعة، ${minutes} دقيقة، ${seconds} ثانية`;
}
function scheduleFajr() {
    let now = new Date();
    let [hour, minute] = fajrTime.split(":");
    let fajrDate = new Date();
    fajrDate.setHours(parseInt(hour));
    fajrDate.setMinutes(parseInt(minute));
    fajrDate.setSeconds(0);
    if (fajrDate < now) {
        fajrDate.setDate(fajrDate.getDate() + 1);
    }
    let diff = fajrDate - now;
    setTimeout(showPopup, diff);
}
setInterval(updateCountdown, 1000);
scheduleFajr();
updateCountdown();
</script>
</body>
</html> 

الصفحات : 1 2