Comments

by alexeilavrov

HTML

<script src="https://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic,700italic&amp;subset=latin,cyrillic,latin-ext"></script>
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<div class="container my-3">

<div id="hypercomments_mix"></div>

<ul class="article-list">
    <li>
        <a href="https://www.metrtv.ru/articles/second_estate/11658" target="_blank" class="article-link">Купить квартиру и заработать на сдаче в аренду – расчеты доходности и таблица по районам Екатеринбурга</a>
        <ul class="attr">
            <li class="date">15 марта 2018</li>
        </ul>
    </li>
    <li>
        <a href="https://www.metrtv.ru/articles/second_estate/11640" target="_blank" class="article-link">Парадоксальный рост цен и другие тренды вторичного рынка жилья Екатеринбурга</a>
        <ul class="attr">
            <li class="date">6 марта 2018</li>
        </ul>
    </li>
    <li>
        <a href="https://www.metrtv.ru/articles/second_estate/11617" target="_blank" class="article-link">Шумит, заливает, ломает, мусорит. Как воздействовать на соседа, которого не воспитали родители</a>
        <ul class="attr">
            <li class="date">27 февраля 2018</li>
        </ul>
    </li>
    <li>
        <a href="https://www.metrtv.ru/articles/second_estate/11561" target="_blank" class="article-link">Кто и почему может оспорить сделку купли-продажи квартиры. И как защититься покупателю</a>
        <ul class="attr">
            <li class="date">6 февраля 2018</li>
        </ul>
    </li>
    <li>
        <a...

CSS

body    {font-family: 'PT Sans', sans-serif; font-size:16px; }

ul.article-list {list-style: none;}
ul.article-list li {margin-bottom: 10px;}

ul.attr {list-style: none; display: inline-block; margin: 0; padding: 0;}
ul.attr li  {display: inline-block; margin: 0 0 0 10px;}
/* ul.attr li.comments-counter {display: none;} */
ul.attr li.comments-counter {color: #5aae4a; }
ul.attr li.comments-counter:before {font-family: FontAwesome; content: "\f075"; margin-right: 5px; font-style: normal; font-weight: normal; text-decoration: inherit ;}

JavaScript

function getSumComments(url) {

    var tempSignature;
    var sum = 0;

    return $.ajax({
        type: 'GET',
        url: 'https://www.metrtv.ru/util_scripts/al-delete-sha1.php',
        data: {
        url: url
        },
        success: function(response) {
            tempSignature = response;
        }
        }).then(function(){
        //console.log(url, tempSignature)
        $.ajax({
            type: 'POST',
            url: 'https://c1api.hypercomments.com/1.0/streams/get',
            jsonpCallback: 'callbackFun', 
            dataType: 'jsonp',
            cache: false,
            crossDomain: true,
            data: {
            body: '{"widget_id":11070,"link":"' + url + '"}',
            signature: tempSignature
            }, 
            success: function(responseHC) {
                sum = responseHC.data[0].cm2;
                return sum;
                /*
                sum = responseHC.data[0].cm2;
                console.log(sum);
                return(sum);
                */
            }
            });
      });
};


var sumComments = getSumComments('https://www.metrtv.ru/articles/second_estate/11617');
console.log(sumComments);