import { englishPage } from "./language"

async function handleRequest(request) {
    let endpoint = "https://api.waqi.info/feed/geo:";
    const token = "b8c8890f87ae40c7bf86de30cfb04877f476271e"; //Use a token from https://aqicn.org/api/
    let html_style = `body{padding:6em; font-family: sans-serif;} h1{color:#f6821f}`;

    let html_content = "<h1>Weather 🌦</h1>";

    const latitude = Number(request.ws.latitude)/1000000;
    const longitude = Number(request.ws.longitude)/1000000;
    endpoint += `${latitude};${longitude}/?token=${token}`;
    const init = {
      headers: {
        "content-type": "application/json;charset=UTF-8",
      },
      cdnProxy: false,
    };

    const response = await fetch(endpoint, init);
    const content = await response.json();

    // https://aqicn.org/json-api/doc/
    if (englishPage(request)) {
      html_content += `<p>This is a demonstration using CDNetworks' geolocation data</p></br>`;

      html_content += `Your location is: Latitude ${latitude}, Longitude ${longitude}</p>`;
      html_content += `<p>Sensor data is sourced from: <a href="${content.data.city.url}">${content.data.city.name}</a></p>`;
      html_content += `<p>Data release time: ${content.data.time.s} ${content.data.time.tz}</p>`;
      html_content += `<p>Provided by: <a href="${content.data.attributions[0].url}">${content.data.attributions[0].name}</a></p></br>`;

      html_content += `<p>Air Quality Index (AQI) level: ${content.data.aqi}</p>`;
      html_content += `<p>Carbon Monoxide (CO) level: ${content.data.iaqi.co?.v}</p>`;
      html_content += `<p>Nitrogen Dioxide (NO2) level: ${content.data.iaqi.no2?.v}</p>`;
      html_content += `<p>Sulfur Dioxide (SO2) level: ${content.data.iaqi.so2?.v}</p>`;
      html_content += `<p>Ozone (O3) level: ${content.data.iaqi.o3?.v}</p>`;
      html_content += `<p>Particulate Matter (PM10) level: ${content.data.iaqi.pm10?.v}</p>`;
      html_content += `<p>Temperature: ${content.data.iaqi.t?.v}°C</p>`;
      html_content += `<p>Dew Point Temperature: ${content.data.iaqi.dew?.v}°C</p>`;
      html_content += `<p>Relative Humidity: ${content.data.iaqi.h?.v}%</p>`;
      html_content += `<p>Atmospheric Pressure: ${content.data.iaqi.p?.v}hPa</p>`;
      html_content += `<p>Wind Speed: ${content.data.iaqi.w?.v}m/s</p>`;
    } else {
      html_content += `<p>这是一个使用网宿地理位置数据的演示</p></br>`;

      html_content += `你的位置是:纬度 ${latitude}, 经度 ${longitude}</p>`;
      html_content += `<p>传感器数据来自于:<a href="${content.data.city.url}">${content.data.city.name}</a></p>`;
      html_content += `<p>发布时间为:${content.data.time.s} ${content.data.time.tz}</p>`;
      html_content += `<p>提供机构:<a href="${content.data.attributions[0].url}">${content.data.attributions[0].name}</a></p></br>`;

      html_content += `<p>空气质量指数(AQI)水平为:${content.data.aqi}</p>`;
      html_content += `<p>一氧化碳(CO)水平为:${content.data.iaqi.co?.v}</p>`;
      html_content += `<p>二氧化氮(NO2)水平为:${content.data.iaqi.no2?.v}</p>`;
      html_content += `<p>二氧化硫(SO2)水平为:${content.data.iaqi.so2?.v}</p>`;
      html_content += `<p>臭氧(O3)水平为:${content.data.iaqi.o3?.v}</p>`;
      html_content += `<p>可吸入颗粒物(PM10)水平为:${content.data.iaqi.pm10?.v}</p>`;
      html_content += `<p>温度为:${content.data.iaqi.t?.v}°C</p>`;
      html_content += `<p>露点温度为:${content.data.iaqi.dew?.v}°C</p>`;
      html_content += `<p>相对湿度为:${content.data.iaqi.h?.v}%</p>`;
      html_content += `<p>大气压为:${content.data.iaqi.p?.v}hPa</p>`;
      html_content += `<p>风速为:${content.data.iaqi.w?.v}m/s</p>`;
    }

    let html = `
      <!DOCTYPE html>
      <head>
        <title>Geolocation: Weather</title>
      </head>
      <body>
        <style>${html_style}</style>
        <div id="container">
        ${html_content}
        </div>
      </body>`;

    return new Response(html, {
      headers: {
        "content-type": "text/html;charset=UTF-8",
      },
    });
}
                    
addEventListener("fetch", event => {
    return event.respondWith(handleRequest(event.request))
})