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

برمجة
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>

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

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
المزيد
- رابط مختصر

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

برمجة

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

24.9 ألف متابع

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

التعليقات

برمجة