 
<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Kamerton</title>

    <meta charset="UTF-8" />
    
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
    <meta name="description" content="" />
    <meta name="keywords" content="" />
    <meta name="team" content="" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, maximum-scale=1" 
    />
    <link rel="stylesheet" href="/like/css/font-awesome.min.css">
    <link rel="stylesheet" href="/like/css/main.css?202002261325" />
    
  </head>
  <body onload="onPageLoad()">
    
<div class="like-block">
    <a id="like" onclick="like()" href="javascript:void(0)" >
        <svg height="27" viewbox="0 0 500 500" width="40" xmlns="http://www.w3.org/2000/svg">
            <path d="M104 224H24c-13.255 0-24 10.745-24 24v240c0 13.255 10.745 24 24 24h80c13.255 0 24-10.745 24-24V248c0-13.255-10.745-24-24-24zM64 472c-13.255 0-24-10.745-24-24s10.745-24 24-24 24 10.745 24 24-10.745 24-24 24zM384 81.452c0 42.416-25.97 66.208-33.277 94.548h101.723c33.397 0 59.397 27.746 59.553 58.098.084 17.938-7.546 37.249-19.439 49.197l-.11.11c9.836 23.337 8.237 56.037-9.308 79.469 8.681 25.895-.069 57.704-16.382 74.757 4.298 17.598 2.244 32.575-6.148 44.632C440.202 511.587 389.616 512 346.839 512l-2.845-.001c-48.287-.017-87.806-17.598-119.56-31.725-15.957-7.099-36.821-15.887-52.651-16.178-6.54-.12-11.783-5.457-11.783-11.998v-213.77c0-3.2 1.282-6.271 3.558-8.521 39.614-39.144 56.648-80.587 89.117-113.111 14.804-14.832 20.188-37.236 25.393-58.902C282.515 39.293 291.817 0 312 0c24 0 72 8 72 81.452z"> </path> </svg>
        <span class="like-count" id="like-count">0</span>
        <span class="like-title-like">Нравится</span>
    </a>

    <a  id="trust" onclick="trust()" href="javascript:void(0)">
        <svg height="34" viewbox="0 0 500 500" width="34" xmlns="http://www.w3.org/2000/svg">
          <path d="M208.14 321.96L339.12 190.98L316.14 168L208.14 275.235L166.005 233.1L143.025 256.08L208.14 321.96ZM241.065 60L388.125 125.88V223.92C388.125 314.31 325.32 399.33 241.065 420C156.81 399.315 94.005 314.295 94.005 223.92V125.88L241.065 60.015V60Z"></path>
        </svg>
          <span class="like-count" id="trust-count">0</span>
        <span class="like-title-trust">Верю</span>
    </a>

    <a id="doubt" onclick="doubt()" href="javascript:void(0)" >
        <svg height="34" viewbox="0 0 500 500" width="34" xmlns="http://www.w3.org/2000/svg">
          <path d="M388.125 125.88L241.065 60V60.015L94.005 125.88V223.92C94.005 314.295 156.81 399.315 241.065 420C325.32 399.33 388.125 314.31 388.125 223.92V125.88ZM237.853 152.348C255.836 152.348 270.778 156.641 282.676 165.222C294.57 173.804 300.522 186.518 300.522 203.359C300.522 213.69 296.899 222.39 291.74 229.457C288.724 233.75 281.883 239.232 273.312 245.908L263.814 252.463C259.213 256.04 255.112 260.208 253.603 264.979C252.808 267.504 252.315 269.735 252.127 274.113C252.09 274.971 251.535 276.956 248.874 276.956H222.042C219.051 276.956 218.723 275.19 218.753 274.337C219.172 262.322 219.6 253.951 224.365 248.356C232.577 238.719 251.286 226.719 251.286 226.719C254.143 224.575 256.443 222.234 258.188 219.688C261.358 215.318 263.992 210.511 263.992 205.267C263.992 199.231 262.226 193.728 258.693 188.759C255.164 183.796 248.711 181.313 239.345 181.313C230.133 181.313 223.603 184.368 219.75 190.487C215.902 196.61 213.978 202.965 213.978 209.555H179.478C180.432 186.912 188.348 170.861 203.234 161.405C212.621 155.372 224.164 152.348 237.853 152.348ZM215.222 318.403C215.597 305.505 225.408 297.281 237.297 297.635C249.713 298.003 258.774 306.783 258.403 319.68C258.031 332.571 248.486 340.531 236.07 340.161C224.181 339.811 214.85 331.296 215.222 318.403Z"> </path>
        </svg>
        <span class="like-count" id="doubt-count">0</span>
        <span class="like-title-doubt">Сомневаюсь</span>
    </a>


    <a href="javascript:void(0)" >
        <svg height="27" viewbox="0 -40 550 500" width="40" xmlns="http://www.w3.org/2000/svg">
            <path d="M572.52 241.4C518.29 135.59 410.93 64 288 64S57.68 135.64 3.48 241.41a32.35 32.35 0 0 0 0 29.19C57.71 376.41 165.07 448 288 448s230.32-71.64 284.52-177.41a32.35 32.35 0 0 0 0-29.19zM288 400a144 144 0 1 1 144-144 143.93 143.93 0 0 1-144 144zm0-240a95.31 95.31 0 0 0-25.31 3.79 47.85 47.85 0 0 1-66.9 66.9A95.78 95.78 0 1 0 288 160z"> </path> </svg>
        <span class="like-count" id="view-count">0</span>
        <span class="like-title-count">Просмотров</span>
    </a>
</div>


<script src="/js/bg.js"></script>
<script>
  function LikeApp() {
      this.path = window.location.search.substr(1);
      this.likeCountEl = document.getElementById('like-count');
      this.trustCountEl = document.getElementById('trust-count');
      this.doubtCountEl = document.getElementById('doubt-count');
      this.viewCountEl = document.getElementById('view-count');

      this.likeEl = document.getElementById('like');
      this.doubtEl = document.getElementById('doubt');
      this.trustEl = document.getElementById('trust');
      this.item = {};

  }
  LikeApp.prototype.setData = function(like, trust, doubt, view) {
      this.likeCountEl.innerHTML = like;
      this.trustCountEl.innerHTML = trust;
      this.doubtCountEl.innerHTML = doubt;
      this.viewCountEl.innerHTML = view;
  }
  LikeApp.prototype.is = function(item) {
      return !!this.item[item]
  }
  LikeApp.prototype.setItem = function(item) {
      this.item[item]=1;
  }
  LikeApp.prototype.setUserData = function(item) {
      this.item = item;
      this.authorized = !!item;
      if(item.like){
          this.likeEl.className = "mark"
          this.item.like = 1
      } 
      if(item.trust){
          this.trustEl.className = "mark"
          this.item.trust = 1
      } 
      if(item.doubt){
          this.doubtEl.className = "mark"
          this.item.doubt = 1
      }
  }

  LikeApp.prototype.clearLikeCls = function() {
      this.likeEl.className = "";
  }
  LikeApp.prototype.clearDoubtCls = function() {
      this.doubtEl.className = "";
  }
  LikeApp.prototype.clearTrustCls = function() {
      this.trustEl.className = "";
  }
  LikeApp.prototype.markLike = function() {
      this.likeEl.className = "mark";
  }
  LikeApp.prototype.markDoubt = function() {
      this.doubtEl.className = "mark";
  }
  LikeApp.prototype.markTrust = function() {
      this.trustEl.className = "mark";
  }
  LikeApp.prototype.like = function(callback) {
      if(!likeApp.authorized){
          return;
      }
      if(this.is('like')){
          this.clearLikeCls();         
      }else{
          this.markLike();
      }
      this.setItem("like");
      callback()
  }

  LikeApp.prototype.doubt = function(callback) {
    if(!likeApp.authorized){
          return;
      }
      if(this.is("doubt")){
          this.clearDoubtCls()    
      }else {
          this.clearTrustCls();
          this.markDoubt();
      }
      this.setItem("doubt");
      callback()
  }

  LikeApp.prototype.trust = function(callback) {
    if(!likeApp.authorized){
          return;
      }
      if(this.is("trust")){
          this.clearTrustCls()
      }else {
          this.clearDoubtCls();
          this.markTrust();
      }
      this.setItem("trust");
      callback()
  }

  function onPageLoad(){

      likeApp = new LikeApp();

      oboe({
          'url': '/v1/views',
          'method': 'POST',
          'withCredentials': true,
          'body':{
              'post':window.location.search,
              'token':token
          }
      }).done(function(data) {
          if(data){
              likeApp.setData(data.like, data.trust, data.doubt, data.views)
          }
      })
      oboe({
          'url': '/v1/user-data',
          'method': 'POST',
          'withCredentials': true,
          'body':{
              'post':window.location.search,
              'token':token
          }
      }).done(function(data) {
          if(!data || data.success===false){
              return;
          }
        likeApp.setUserData(data)
      })
  }
  function like(){
    likeApp.authorized&&likeApp.like(function(){
          oboe({
              'url': '/v1/like',
              'method': 'POST',
              'withCredentials': true,
              'body':{
                  'post':window.location.search,
                  'token':token
              }
          }).done(function(data) {
              if(data){
                  likeApp.setData(data.like, data.trust, data.doubt, data.views)
              }
          })
      })
  }
  function doubt(){
    likeApp.authorized&&likeApp.doubt(function(){
          oboe({
              'url': '/v1/doubt',
              'method': 'POST',
              'withCredentials': true,
              'body':{
                  'post':window.location.search,
                  'token':token
              }
          }).done(function(data) {
              if(data){
                  likeApp.setData(data.like, data.trust, data.doubt, data.views)
              }
          })
      })
  }
  function trust(){
    likeApp.authorized&&likeApp.trust(function(){
          oboe({
              'url': '/v1/trust',
              'method': 'POST',
              'withCredentials': true,
              'body':{
                  'post':window.location.search,
                  'token':token
              }
          }).done(function(data) {
              if(data){
                  likeApp.setData(data.like, data.trust, data.doubt, data.views)
              }
          })
      })
  }
</script>
<script src="/like/js/oboe-browser.js"></script>
</body>
</html>
 