واجهة برمجة التطبيقات لتوقيتات الصلاة

برمجة
2023-11-19T02:34:08+00:00
2023-11-19T02:44:29+00:00
المزيد
- رابط مختصر

قمت بالعديد من المحاولات لتحويل تنسيق الساعة من 24 إلي 12 و لكن لم استطع الوصول إلي أي حل حتي الان

هل يوجد حل؟

<!DOCTYPE html>
<html>
<head>
    <title>Automatic Prayer Times</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        function getLocation() {
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(showPrayerTimes);
            } else {
                console.log("Geolocation is not supported by this browser.");
            }
        }

        function showPrayerTimes(position) {
            var latitude = position.coords.latitude;
            var longitude = position.coords.longitude;
            

            var url = "https://api.aladhan.com/v1/timings?latitude=" + latitude + "&longitude=" + longitude + "&method=5";

            $.ajax({
                url: url,
                method: "GET",
                success: function (data) {
                    var prayerTimes = data.data.timings;

                    document.getElementById("fajr").innerHTML = prayerTimes.Fajr;
                    document.getElementById("sunrise").innerHTML = prayerTimes.Sunrise;
                    document.getElementById("dhuhr").innerHTML = prayerTimes.Dhuhr;
                    document.getElementById("asr").innerHTML = prayerTimes.Asr;
                    document.getElementById("maghrib").innerHTML = prayerTimes.Maghrib;
                    document.getElementById("isha").innerHTML = prayerTimes.Isha;
                    document.getElementById("midnight").innerHTML = prayerTimes.Midnight;
                },
                error: function () {
                    console.log("Error retrieving prayer times.");
                }
            });
        }
      


    </script>
  
</head>
<body onload="getLocation()">
  <div class="prayer-times-1">
    <h1>أوقات الصلاة</h1>
    <h2>الفجر: <span id="fajr"></span></h2>
    <h2>الشروق: <span id="sunrise"></span></h2>
    <h2>الظهر: <span id="dhuhr"></span></h2>
    <h2>العصر: <span id="asr"></span></h2>
    <h2>المغرب: <span id="maghrib"></span></h2>
    <h2>العشاء: <span id="isha"></span></h2>
    <h2>منتصف الليل: <span id="midnight"></span></h2>
    </div>
</body>
</html>

function showPrayerTimes(position) {
  const latitude = position.coords.latitude;
  const longitude = position.coords.longitude;


  const url =
    "https://api.aladhan.com/v1/timings?latitude=" +
    latitude +
    "&longitude=" +
    longitude +
    "&method=5";


  $.ajax({
    url: url,
    method: "GET",
    success: function (data) {
      const prayerTimes = data.data.timings;


      convertTimeFormat(prayerTimes);


      document.getElementById("fajr").innerHTML = prayerTimes.Fajr;
      document.getElementById("sunrise").innerHTML = prayerTimes.Sunrise;
      document.getElementById("dhuhr").innerHTML = prayerTimes.Dhuhr;
      document.getElementById("asr").innerHTML = prayerTimes.Asr;
      document.getElementById("maghrib").innerHTML = prayerTimes.Maghrib;
      document.getElementById("isha").innerHTML = prayerTimes.Isha;
      document.getElementById("midnight").innerHTML = prayerTimes.Midnight;
    },
    error: function () {
      console.log("Error retrieving prayer times.");
    }
  });
}


function convertTimeFormat(prayerTimes) {
  for (let key in prayerTimes) {
    if (prayerTimes.hasOwnProperty(key)) {
      const time = prayerTimes[key];
      const hour = parseInt(time.substring(0, 2));


      if (hour > 12) {
        hour -= 12;
        prayerTimes[key] = hour + time.substring(2);
      } else {
        prayerTimes[key] = time + " صباحًا";
      }
    }
  }
}

لاحظ دالة convertTimeFormat التي تقوم بالتكرار على كائن أوقات الصلاة وتحويل كل وقت 24 ساعة إلى تنسيق 12 ساعة، وتستدعي دالة showPrayerTimes الرئيسية تلك الدالة قبل تحديث أوقات الصلاة على الصفحة.

حماده حماده

2023-11-19T14:28:21+00:00
المزيد
- رابط مختصر

كامل التحية و الشكر إستاذ مصطفي ❤ و لكن عندما قمت بالتجربة للأسف لم تعمل و لم يظهر التوقيت نهائياً و لا اعلم السبب صراحه لكنها عملت بالطريقة التي وضحها استاذ عبدالباسط

Mustafa Suleiman

2023-11-19T14:38:21+00:00
المزيد
- رابط مختصر

إليك مثال كامل يعمل بشكل سليم وتأكد من السماح بالوصول للموقع:

<!DOCTYPE html>
<html>
  <head>
    <title>Automatic Prayer Times</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
      function getLocation() {
        if (navigator.geolocation) {
          navigator.geolocation.getCurrentPosition(showPrayerTimes);
        } else {
          console.log('Geolocation is not supported by this browser.');
        }
      }


      function showPrayerTimes(position) {
        var latitude = position.coords.latitude;
        var longitude = position.coords.longitude;


        var url =
          'https://api.aladhan.com/v1/timings?latitude=' +
          latitude +
          '&longitude=' +
          longitude +
          '&method=5';


        $.ajax({
          url: url,
          method: 'GET',
          success: function (data) {
            var prayerTimes = data.data.timings;


            convertTimeFormat(prayerTimes);


            document.getElementById('fajr').innerHTML = prayerTimes.Fajr;
            document.getElementById('sunrise').innerHTML = prayerTimes.Sunrise;
            document.getElementById('dhuhr').innerHTML = prayerTimes.Dhuhr;
            document.getElementById('asr').innerHTML = prayerTimes.Asr;
            document.getElementById('maghrib').innerHTML = prayerTimes.Maghrib;
            document.getElementById('isha').innerHTML = prayerTimes.Isha;
            document.getElementById('midnight').innerHTML = prayerTimes.Midnight;
          },
          error: function () {
            console.log('Error retrieving prayer times.');
          },
        });
      }


      function convertTimeFormat(prayerTimes) {
        for (var key in prayerTimes) {
          if (prayerTimes.hasOwnProperty(key)) {
            var time = prayerTimes[key];
            var hour = parseInt(time.substring(0, 2));


            if (hour > 12) {
              hour -= 12;
              prayerTimes[key] = hour + time.substring(2);
            } else {
              prayerTimes[key] = time + ' AM';
            }
          }
        }
      }
    </script>
  </head>
  <body onload="getLocation()">
    <div class="prayer-times-1">
      <h1>أوقات الصلاة</h1>
      <h2>الفجر: <span id="fajr"></span></h2>
      <h2>الشروق: <span id="sunrise"></span></h2>
      <h2>الظهر: <span id="dhuhr"></span></h2>
      <h2>العصر: <span id="asr"></span></h2>
      <h2>المغرب: <span id="maghrib"></span></h2>
      <h2>العشاء: <span id="isha"></span></h2>
      <h2>منتصف الليل: <span id="midnight"></span></h2>
    </div>
  </body>
</html>

حماده حماده

2023-11-23T05:32:46+00:00
المزيد
- رابط مختصر

اصبحت تعمل يبدو اني اخطأت في شئ ما شكرا لك

عبدالباسط ابراهيم

2023-11-19T09:04:11+00:00
المزيد
- رابط مختصر

بالإضافة للحل في التعليق السابق يمكنك استخدام الدالة التالية

function convertTo12HourFormat(time24) {
            // تحويل الوقت من تنسيق 24 ساعة إلى 12 ساعة
            var time12 = "";
            var splitTime = time24.split(":");
            var hours = parseInt(splitTime[0]);
            var minutes = splitTime[1];
            var ampm = hours >= 12 ? "م" : "ص";
            
            hours = hours % 12;
            hours = hours ? hours : 12; // الساعة 12 في تنسيق 12 ساعة تعني الظهر

            time12 = hours + ":" + minutes + " " + ampm;

            return time12;
        }

ثم يم استخدام هذه الدالة بالشكل التالي

document.getElementById("fajr").innerHTML = convertTo12HourFormat(prayerTimes.Fajr);

حماده حماده

2023-11-19T14:28:57+00:00
المزيد
- رابط مختصر

شكراً جزيلاً استاذ مصطفي انها تعمل الان بشكل جيد❤😍

برمجة

مجتمع للمبرمجين من جميع المستويات لتبادل المعرفة والخبرات. ناقش لغات البرمجة المختلفة، الحلول البرمجية، والمشاريع.

24.9 ألف متابع

واجهة برمجة التطبيقات لتوقيتات الصلاة

التعليقات

اقرأ أيضًا

برمجة