Advertisement
Guest User

golos.io/@vik

a guest
Feb 4th, 2017
240
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 12.57 KB | None | 0 0
  1. <html>
  2. <head><title>Voice Explorer</title>
  3. <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"><style>svg#Layer_1 { width: 50px; height: 50px; position: fixed; top: 10px; left: 10px; }#sila,.myJson,.myJson span{border-radius:3px}#nicedata #item,#nicedata #item.anim,.myJson,body{transition:1s all ease}#witness a,.myJson a{text-decoration:none;font-weight:700}#blockexplr,#sila,.alert,.static,h1,header{text-align:center}#sila,#witness a,.myJson a,.myJson span,button{font-weight:700}body{max-width:100%;overflow-x:hidden;font-family:Arial,Helvetica,sans-serif;margin:0;padding:0;background:url(https://upload.wikimedia.org/wikipedia/commons/thumb/f/fe/Procaterol.svg/200px-Procaterol.svg.png) center fixed #2b2b2b}body:hover{background-position:left}.scrl::-webkit-scrollbar,body::-webkit-scrollbar{width:7px;height:9px}#nicedata,#result{position:relative;width:100%}.scrl::-webkit-scrollbar-track,body::-webkit-scrollbar-track{background:#053363}.scrl::-webkit-scrollbar-thumb,body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.4)}h1{color:#fff;text-transform:uppercase;margin:10px 0 0;font-size:5em;text-shadow:1px 3px 40px #22035a}#blockexplr{font-size:2rem;color:#ffd121;text-shadow:1px 1px 6px #000}#sila{display:block;color:#fff;padding:10px}#nicedata #item{transform:translate3d(0,-100px,0);position:absolute;opacity:0}#nicedata #item.anim{transform:translate3d(0,0,0);opacity:1;position:relative}header{background:url(https://s27.postimg.org/kj0ro3zcz/d941c938a01d450288d87fdba4e66af176f62c50_m.gif) center no-repeat #0d0d0d;color:#fff;margin:0;padding:15px;box-shadow:0 0 20px #000}#result{font-size:10pt;margin:55px auto}.static{margin-bottom:25px}#result #item{background:#000;color:#fff;padding:5px;line-height:1;margin:10px 5px 0}.myJson span{background:#315d9e;color:#fff;padding:1px 8px}.myJson{background:#fff;padding:15px;word-break:break-word;color:#636363;margin:40px 15px 0;box-shadow:0 0 15px #000}#witness a{color:#fff;padding:4px 10px;border-radius:10px}.alert,.myJson a,.textpost{border-radius:3px;color:#fff}#nicedata{float:left;max-width:960px;margin:25px auto}.myJson a{background:#18d47e;padding:5px 10px;box-shadow:0 0 10px -5px #000;text-transform:capitalize;vertical-align:middle}.textpost{background:rgba(0,0,0,.42);padding:4px 15px;margin:2px 15px 0;max-height:100px;font-size:.8rem;overflow:auto}.textpost h4{margin:0 0 3px}.alert{background:#ff4343;padding:20px;margin:15px;box-shadow:0 0 20px #000;font-size:16px}input[type=number]{border:0;font-size:1.3rem;height:45px;min-width:200px;border-radius:3px;box-shadow:inset 0 0 5px 0 #000;background:rgba(130,130,130,.48);color:#fff;padding:0 15px}button{background:#1ba77b;box-shadow:0 0 10px #000;border:0;height:45px;color:#fff;padding:10px;border-radius:3px;font-size:1.3rem}@media screen and (max-width:700px){h1{font-size:2em}#blockexplr{font-size:1.5em}#nicedata,#result{width:100%!important;float:none!important}button{display:block;margin:10px auto}}</style></head><body><header><h1>ws.golos.io</h1></header>
  4. <div id="filterdata"></div>
  5. <div id="result"></div>
  6. <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 158 171.8" style="enable-background:new 0 0 158 171.8;" xml:space="preserve"><style type="text/css"> .st0{fill:url(#XMLID_33_);} .st1{fill:url(#XMLID_34_);} .st2{fill:#FFFFFF;} </style><g id="XMLID_16_"><linearGradient id="XMLID_33_" gradientUnits="userSpaceOnUse" x1="17.9143" y1="36.2467" x2="91.7842" y2="36.2467"><stop offset="0" style="stop-color:#FF3F3F"></stop><stop offset="1" style="stop-color:#EB0000"></stop></linearGradient><path id="XMLID_3_" class="st0" d="M70.8,66L70.8,66c12.3-5.1,20.9-17.4,20.9-31.7C91.8,15.4,76.6,0,58,0 C39.3,0,24.1,15.4,24.1,34.3c0,10.3,4.5,19.5,11.6,25.8L17.9,72C17.9,72,53.6,75.1,70.8,66z"></path><linearGradient id="XMLID_34_" gradientUnits="userSpaceOnUse" x1="2.400511e-06" y1="89.2769" x2="157.8291" y2="89.2769"><stop offset="0" style="stop-color:#2482C5"></stop><stop offset="1" style="stop-color:#285FAC"></stop></linearGradient><path id="XMLID_11_" class="st1" d="M143.1,103.5c-17-6.1-40.7,5.7-40.7,5.7s18.3-24.5,17.9-60.7C120.1,22,110.7,13.4,103.5,7 c0.6,3.6,0.9,7.3,0.9,11c0,38.4-23.8,64.2-62.1,64.2c-15.9,0-30.5-0.1-42.2-9c0.2,0.6,1.9,7.9,8.7,15.5c3,3.4,7.1,6.8,12.4,9.7 c17.2,9.3,30.4,10.4,31.7,10.5c0.1,0.1,0.1,0.3,0.2,0.4c0,19.1-13.4,46.4-32.4,46.4c-2.9,0-5.7-0.4-8.4-1c-7.4-1.5-12-5.3-12-5.3 s2.6,19.9,24,21.9c23.5,2.2,34.3-2.9,57.6-17.1c24.9-15.2,43.8-31.3,58.3-27.3c11,3,12.8,20.5,12.8,20.5s3.3-6.9,4.3-13 C158.3,128,160.1,109.6,143.1,103.5z"></path></g><g id="XMLID_14_"><path id="XMLID_12_" class="st2" d="M57.2,11.1c7.1,0,13.5,3.2,17.8,8.2l2.7-2.3c-5-5.7-12.4-9.4-20.5-9.4c-5.7,0-11,1.8-15.4,4.8 l2,2.9C47.6,12.7,52.2,11.1,57.2,11.1z"></path></g></svg>
  7. <script>
  8. /* Страница, которая покажет нам активность на golos.io! https://golos.io/@vik */
  9.  
  10. // Объявляем переменные
  11. var socket = new WebSocket('wss://ws.golos.io'),
  12. lastblock, startblock;
  13. // Открываем сокет
  14. function connectGolos() {
  15. socket.onopen = function(event) {
  16. // Выставляем интервал в 3000 ms
  17.        setInterval(function() {
  18.        socket.send(JSON.stringify({ // Отправляем запрос
  19.             id: 1,
  20.             method: 'get_dynamic_global_properties', // Запрашиваем конкретно эти данные
  21.             'params': []
  22.         }));
  23.         lastblock++;  // Увеличиваем на 1 значение данной переменной при каждом выполнении функции (каждые 3 секунды)                        
  24.         }, 3000);                              
  25. }};
  26. fixblock = true; // Устанавливаем для переменной булево значение - ВКЛ
  27. socket.onmessage = function(event) {
  28.         data = JSON.parse(event.data); // Полученные данные парсим в формат JSON
  29.         merkle = data.result.transaction_merkle_root;
  30.      if (fixblock) { // Выполнять если fixblock = true (мы указали это за пределами onmessage)
  31.             startblock = data.result.last_irreversible_block_num; // Получаем номер блока и записываем в переменную
  32.             lastblock = startblock; // записываем в переменную номер начального блока
  33.             fixblock = false; //теперь переводим условие в false, и мы больше не сможем менять номер начального блока
  34.         }
  35.      if (data.id === 1  ) { // Если ответ на наш socket.send id 1
  36.             socket.send(JSON.stringify({ // Отправляем запрос на получение аккаунта
  37.                     id: 2,
  38.                     method: 'get_accounts',
  39.                     params: [
  40.                         ['vik'] // запрашиваем данные на ник (не обязательно пока, понадобится в другой ситуации)
  41.                     ]
  42.                 }));
  43.                 socket.send(JSON.stringify({
  44.                     id: 3,
  45.                     method: 'get_block',
  46.                     'params': [lastblock]// Отправляем запрос на получение текущего блока
  47.                 }));
  48.                
  49.                 }
  50.      if (data.id === 3 && merkle !== "0000000000000000000000000000000000000000"){   // Если данные ответа на запрос с id = 3      
  51.         tx = data.result.transactions[0].operations[0][1]; // Сокращенный путь до данные> транзакции> операции>
  52.         trigger = data.result.transactions[0].operations[0][0]; // Тригер. Определяем коммент, голос, подписку и другое
  53.         $voter = tx.voter; // Переменная с именем голосующего
  54.         $power = tx.weight; // Переменная с силой голоса при голосе
  55.         $author = tx.author; // Автор. Одна переменная на многие виды операций
  56.         $permlink = tx.permlink; // Ссылка. Так же есть в многих операциях
  57.         $parent = tx.parent_author; // Автор - родитель поста. Учавствует в комментах
  58.         $body = tx.body; // Тело коммента или поста
  59.         $title = tx.title; // Заголовок поста, в комментах пуст
  60.             if (trigger == 'vote'){ // Если триггер голос
  61.                 votehtml = '<div id="item" class="myJson"><b>'+$voter+'</b> голосует за <span>'+$author+'</span>. Сила '+$power+' </div>'
  62.                 document.getElementById('filterdata').insertAdjacentHTML('afterbegin',votehtml); // Вставляем данные на страницу
  63.             }
  64.             if (trigger == 'comment'){ // Если триггер коммент
  65.                 if ($parent !== ""){ // Если родитель поста не пустое место :)
  66.                       commthtml = '<div id="item" class="myJson">'+$author+' комментирует '+$parent+': '+$body+' </div>'
  67.                       document.getElementById('filterdata').insertAdjacentHTML('afterbegin',commthtml); // Вставляем html на страницу
  68.                 } else { // А если автор-родитель пуст, то вставим html заточенный под пост, а не комментарии.
  69.                       posthtml = '<div id="item" class="myJson">'+$author+' разместил пост <h4>'+$title+'</h4>'+$body+'</div>'
  70.                       document.getElementById('filterdata').insertAdjacentHTML('afterbegin',posthtml);
  71.                 }
  72.             }
  73.             if (trigger == 'custom_json'){ // Если триггер custom_json (обычно это фолловинг)
  74.                 var follow = JSON.parse(tx.json)[1], // Получаем данные свойства json внутри custom_json
  75.                      $follower = follow.follower, // Находим имя фолловера
  76.                      $followin = follow.following; // Находим имя, на кого подписался фолловер
  77.                 // Придумываем оформление вывода фолловинга
  78.                     follhtml = '<div id="item" class="myJson"><span>'+$follower+'</span> подписка на <b>'+$followin+'</b></div>'
  79.                     document.getElementById('filterdata').insertAdjacentHTML('afterbegin',follhtml);
  80.             }
  81.             if (trigger == 'transfer'){ // Если триггер трансфер
  82.                 var $amount = tx.amount,
  83.                     $from = tx.from,
  84.                     $memo = tx.memo,
  85.                     $to = tx.to;
  86.                     transfhtml = '<div id="item" class="myJson"><b>'+$from+'</b> отправил '+$amount+' <span>'+$to+'</span>\
  87.                     <p><i>'+$memo+'</i></p></div>'
  88.                     document.getElementById('filterdata').insertAdjacentHTML('afterbegin',transfhtml);
  89.                    
  90.             }
  91.            
  92.             if (trigger == 'feed_publish'){
  93.                      var $publisher = tx.publisher,
  94.                       $base = tx.exchange_rate.base,
  95.                       $quote = tx.exchange_rate.quote;
  96.                       feedhtml = '<div id="item" class="myJson">Прайс фид от <span>'+$publisher+'</span>: '+$base+' = <b>'+$quote+'</b> </div>';
  97.                       document.getElementById('filterdata').insertAdjacentHTML('afterbegin',feedhtml);
  98.                      }
  99.             if (trigger == 'account_create'){
  100.                
  101.                 var $newbie = tx.new_account_name,
  102.                     $creator = tx.creator;
  103.                      newbiehtml = '<div id="item" class="myJson">Новый пользователь <span>'+$newbie+'</span> ('+$creator+') </div>';
  104.                      document.getElementById('filterdata').insertAdjacentHTML('afterbegin',newbiehtml);
  105.                              
  106.                      }
  107.                      
  108.             if (trigger == 'account_update'){
  109.                      // Обновление аккаунтов
  110.                      }       
  111.                      
  112.             if (trigger == 'account_witness_vote'){
  113.                 var $acc = tx.account,
  114.                     $wit = tx.witness;
  115.                      votewhtml = '<div id="item" class="myJson">'+$acc+' голосует за делегата <span>'+$wit+'</span></div>';
  116.                      document.getElementById('filterdata').insertAdjacentHTML('afterbegin',votewhtml);
  117.                        
  118.                      }
  119.             }
  120.     };
  121.     connectGolos();
  122.     socket.onerror = function(event) {
  123.             document.getElementById('filterdata').insertAdjacentHTML('afterbegin', '<div class="alert">На сервере ноды произошла ошибка 502. Переподключение...</div>');
  124.             setTimeout(location.reload(), 1000); // На голосе часто ошибка 502 - в нашем случае перезагрузим страницу, если встретим такую ошибку.
  125.             connectGolos();
  126.         };
  127. </script>
  128. </body>
  129. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement