index.html

---
layout: index-vue
title: Home
---

<style>
.inner-app-hide{
    display: none;
}

.live-hide{
    display: none;
}

.blue-visit:visited{
    color: #2a7ae2;
}
.blue-visit{
  font-size: 16px;
}

.top-4-hide{
    display: none;
}
.bottom-10px{
  margin-bottom: 45px;
}

.index-live a:visited{
    color: #3e1004;
}
</style>

{% raw %}
<p style="font-size: 1.25em; font-weight: bold;" class="live-hide">Live
<div class="index-live latest-app-top-4 top-4-hide bottom-10px">

    <div v-for="link in top_4" class="" >
        <ul v-bind:class="is_ds(link.I)">
        <li>
            <p class="added-hostname" v-if="link.N !== undefined">
                <a class="externalLink" target="_blank" rel="nofollow noopener" v-bind:href="link.U">{{ is_pkg(link.U) }}{{ link.T }} <span class="spantext">{{ get_host(link.U) }}</span></a>  - {{ link.N }} <span  style="color:#999;" class="tooltiptext">(&nbsp;{{ get_host(link.U) }}&nbsp;)&nbsp;</span>
            </p>
            <p  class="added-hostname" v-else>
                <a  class="externalLink" target="_blank"   rel="nofollow noopener" v-bind:href="link.U">{{ is_pkg(link.U) }}{{ link.T }} <span class="spantext">{{ get_host(link.U) }}</span></a><span style="color:#999;" class="tooltiptext">(&nbsp;{{ get_host(link.U) }}&nbsp;)&nbsp;</span>
            </p>
        </li>
        </ul>
        <p v-bind:class="is_ds(link.I)" v-if="link.P !== undefined">
            <img v-bind:src="link.P" v-bind:alt="link.T"/>
        </p>
    </div>
    <a class="live-more blue-visit" style="color:#2a7ae2;" href="#">More</a></p>
</div>

<div class="index-live latest-app inner-app-hide bottom-10px">

  <div class="like-table" v-for="item in post_date.obj">
    <p style="font-size: 1.2em; font-weight: bold;" v-bind:id="item.date">{{ item.date }}</p>
    <div v-for="link in item.links" class="" >
        <ul v-bind:class="is_ds(link.I)">
        <li>
            <p class="added-hostname" v-if="link.N !== undefined">
                <a class="externalLink" target="_blank" rel="nofollow noopener" v-bind:href="link.U">{{ is_pkg(link.U) }}{{ link.T }} <span class="spantext">{{ get_host(link.U) }}</span></a>  - {{ link.N }} <span  style="color:#999;" class="tooltiptext"><br/>(&nbsp;{{ get_host(link.U) }}&nbsp;)&nbsp;</span>
            </p>
            <p  class="added-hostname" v-else>
                <a  class="externalLink" target="_blank"   rel="nofollow noopener" v-bind:href="link.U">{{ is_pkg(link.U) }}{{ link.T }} <span class="spantext">{{ get_host(link.U) }}</span></a><span style="color:#999;" class="tooltiptext"><br/>(&nbsp;{{ get_host(link.U) }}&nbsp;)&nbsp;</span>
            </p>
        </li>
        </ul>
        <p v-bind:class="is_ds(link.I)" v-if="link.P !== undefined">
            <img v-bind:src="link.P" v-bind:alt="link.T"/>
        </p>
    </div>
  </div>
</div>
{% endraw %}

<div id="posts-content" class="posts">
  {% for post in paginator.posts %}
  <article class="post post-detail-{{ post.id | replace: '/', '' }}">
    <h1 class="post-title">
      <a href="{{ site.baseurl }}{{ post.url }}">
        {{ post.title }}
      </a>
    </h1>

<p class="added-hostname"><time style="display: inline;margin-right: 15px;" datetime="{{ post.date | date_to_xmlschema }}" class="post-date">{{ post.date | date_to_string }}</time>
{% include social-button.html %}
</p>

    <form class="filter-box">
    <input name="query" placeholder="type to filter" class="input-box title-filter">
    </form>
    {{ post.content }}
    <!--<p><small id="page_view">&nbsp;</small></p>-->
    <div id="dialog-{{ post.id | replace: '/', '' }}" style="display:none;"></div>

    <script class="inf-detail">
      console.log("loading page {{ post.id | replace: '/', '' | replace: '-', '_' }}");

      function onHostClick{{ post.id | replace: '/', '' | replace: '-', '_' }}(evt) {
        console.log(evt.dataset.desc);
        $("#dialog-{{ post.id | replace: '/', '' }}").text(evt.dataset.desc);
        $("#dialog-{{ post.id | replace: '/', '' }}").dialog({
          width: "80%",
          maxWidth: 600,
          maxHeight: 600,
        });
      }

      setTimeout(function () {
        $.ajax({
          dataType: "json",
          url: "https://live.rweekly.org/post-{{post.id | replace: '/', ''}}.json",
          success: function (data) {
            console.log(data);
            if (typeof data === 'object') {
              $(".post-detail-{{post.id | replace: '/', ''}} .added-hostname").each(function (index, elt) {
                const href = $('a', elt).attr('href');
                if (data[href]) {
                  $('.tooltiptext', elt).attr('data-desc', data[href]);
                  $('a', elt).attr('data-desc', data[href]);
                  $('.tooltiptext', elt).attr('onclick', "onHostClick{{ post.id | replace: '/', '' | replace: '-', '_' }}(this)");

                  $('a', elt).tooltip(
                    {
                      items: '[data-desc]',
                      content: function () {
                        var element = $(this);
                        return '<div class="link-desc">' + element.attr("data-desc") + '</div>';
                      },
                      position: {
                        collision: "none",
                      }
                    }
                  );
                }
              });
            }
          }
        });
      }, 1000);
    </script>
  </article>
  {% endfor %}

  <div class="pagination">
  {% if paginator.next_page %}
    <a id="next-page" class="pagination-item older" href="{{ paginator.next_page_path | prepend: site.baseurl }}/index.html">Older</a>
  {% else %}
    <span class="pagination-item older">Older</span>
  {% endif %}
  {% if paginator.previous_page %}
    <a class="pagination-item newer" href="{{ paginator.previous_page_path | prepend: site.baseurl }}/index.html">Newer</a>
  {% else %}
    <span class="pagination-item newer">Newer</span>
  {% endif %}
  </div>
</div>


<script>
function is_ds(value){
    if(value === 1){
        return "is-ds";
    }
    return "not-ds";
}

function get_host(text){
    var aurl = document.createElement('a');
    aurl.href = text;
    return aurl.host;
}

var weekday = new Array(7);
weekday[0] =  "Sunday";
weekday[1] = "Monday";
weekday[2] = "Tuesday";
weekday[3] = "Wednesday";
weekday[4] = "Thursday";
weekday[5] = "Friday";
weekday[6] = "Saturday";

function get_date(){
    var date_var = new Date();
    return date_var.getFullYear() + '-' + (date_var.getMonth()+1) + '-' + date_var.getDate() + " " + weekday[date_var.getDay()];
}

var latest_data = {};
var top_4 = [];
// Vue.config.devtools = true;

function is_pkg(url){
    if (get_host(url) === "cran.r-project.org"){
        return "📦 ";
    }else{
        return "";
    }
}

var latest_app = new Vue({
  el: '.latest-app',
  data: {
    post_date: latest_data
  }
});

var top4_app = new Vue({
  el: '.latest-app-top-4',
  data: {
    top_4: top_4
  }
});

function load_latest(){

    var xhr = new XMLHttpRequest();

    xhr.open("GET","https://live.rweekly.org/latest.json");
    xhr.onreadystatechange = function() {
    if (xhr.readyState == 4 && xhr.status == 200) {
        try{
            localStorage.setItem("live-latest", xhr.responseText);
        }catch(err2){
            console.log(err2);
        }

        var myArr = JSON.parse(xhr.responseText);
        var max_length = myArr.obj[0].links.length;

        if(max_length>3){
          max_length = 3;
        }
        for(var ii =0; ii!=max_length; ii++){
          top_4.push(myArr.obj[0].links[ii]);
        }
        top4_app.top_4 = top_4;
        // document.querySelector('.latest-app').classList.remove('inner-app-hide');
        document.querySelector('.latest-app-top-4').classList.remove('top-4-hide');
        document.querySelector('.live-hide').classList.remove('live-hide');
        latest_app.post_date = myArr;
        // add_external_links();

        setTimeout(function(){
        twemoji.parse(document.body,
        {
            folder: 'svg',
            ext: '.svg'
        });
        }, 500);

    }
    };
    xhr.send();
}

document.addEventListener('DOMContentLoaded', function(){
    load_latest();
    var live_more_button = document.querySelector(".live-more");
    live_more_button.addEventListener("click",function(){
      _paq.push(['trackEvent', 'Read-Live', '1']);
      document.querySelector('.latest-app').classList.remove('inner-app-hide');
      document.querySelector('.latest-app-top-4').classList.add('top-4-hide');
      document.querySelector(".live-more").classList.add('top-4-hide');
    })
});

</script>