ROS Clock 各版本支持时间倒计时工具转

最新推荐文章于 2024-12-05 09:30:00 发布

转载最新推荐文章于 2024-12-05 09:30:00 发布 · 914 阅读

1 ·

CC 4.0 BY-SA版权

原文链接：dlu.github.io/ros_clock/index.html

文章标签：

#webview #javascript #html

该网页展示了一个ROS（Robot Operating System）不同版本的时间线，包括它们的起始和结束日期。通过JavaScript更新，页面实时显示每个版本的状态，如'future', 'active', 或 'expired'，并计算剩余或距发布的时间。这对于跟踪ROS版本的生命周期和支持状态非常有用。

网址：dlu.github.io/ros_clock/index.html

"noetic": {"start": "May 23, 2020", "end": "May 23, 2025"},

"humble": {"start": "May 23, 2022", "end": "May 23, 2027"},

效果如下：

var timing = {
    //"boxturtle":   {"start": "March 2, 2010", "end": ""},
    //"cturtle":     {"start": "August 2, 2010", "end": ""},
   // "diamondback": {"start": "March 2, 2011", "end": ""},
    //"electric":    {"start": "August 30, 2011", "end": ""},
    "fuerte":      {"start": "April 23, 2012",   "end": "Sept 4, 2013"},
    "groovy":      {"start": "Dec 31, 2012",     "end": "July 1, 2014"},
    "hydro":       {"start": "Sept 4, 2013",     "end": "May 1, 2015"},
    "indigo":      {"start": "July 22, 2014",    "end": "April 1, 2019"},
    "jade":        {"start": "May 23, 2015",     "end": "May 1, 2017"},
    "kinetic":     {"start": "May 23, 2016",     "end": "April 1, 2021"},
    "lunar":       {"start": "May 23, 2017",     "end": "May 23, 2019"},
    "melodic":     {"start": "May 23, 2018",     "end": "May 23, 2023"},
    "noetic":      {"start": "May 23, 2020",     "end": "May 23, 2025"},
    "ardent":      {"start": "Dec 8, 2017",      "end": "Dec 1, 2018"},
    "bouncy":      {"start": "July 2, 2018",     "end": "July 1, 2019"},
    "crystal":     {"start": "Dec 14, 2018",     "end": "Dec 1, 2019"},
    "dashing":     {"start": "May 31, 2019",     "end": "May 23, 2021"},
    "eloquent":    {"start": "November 22, 2019","end": "November 1, 2020"},
    "foxy":        {"start": "June 5, 2020",     "end": "May 23, 2023"},
    "galactic":    {"start": "May 23, 2021",     "end": "November 23, 2022"},
    "humble":      {"start": "May 23, 2022",     "end": "May 23, 2027"},
}

<html>
<head>
    <meta charset="utf-8" />
    <title>ROS Clock</title>
    <link href="https://fonts.googleapis.com/css?family=Press+Start+2P&display=swap" rel="stylesheet">
    <link href="terminal.css" rel="stylesheet">
    <script src="info.js"></script>
    <script src="countdown.js"></script>
</head>
<body>
    <h1>ROS Clock</h1>
    <div id="contents"></div>
    <script>
    function update()
    {
      updateDict();

      var contents = document.getElementById("contents");
      contents.innerHTML = '';

      for (key in timing)
      {
        var entry = timing[key];

        var row = document.createElement('div');
        row.setAttribute('class', "row " + entry["status"]);
        contents.appendChild(row);

        var head = document.createElement('span');
        head.setAttribute('class', 'distro')
        head.appendChild(document.createTextNode(key));
        row.appendChild(head);

        row.appendChild(document.createTextNode(entry["status"]));

        if (entry["status"] != "expired")
        {
            row.appendChild(document.createElement('br'));

            var countdown = document.createElement('span');
            countdown.setAttribute('class', 'countdown')
            countdown.appendChild(document.createTextNode('Time Remaining: '));
            countdown.appendChild(document.createTextNode(deltaToString(entry["delta"])));
            row.appendChild(countdown);

            if (entry["status"] == "future")
            {
                row.appendChild(document.createElement('br'));

                var countdown = document.createElement('span');
                countdown.setAttribute('class', 'countdown')
                countdown.appendChild(document.createTextNode('Time to Release: '));
                countdown.appendChild(document.createTextNode(deltaToString(entry["release"])));
                row.appendChild(countdown);
            }
        }
      }
    }

    setInterval(update, 1000);
    update();
    </script>
</body>
</html>