Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html>
- <head><title>Voice Explorer</title>
- <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>
- <div id="filterdata"></div>
- <div id="result"></div>
- <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>
- <script>
- /* Страница, которая покажет нам активность на golos.io! https://golos.io/@vik */
- // Объявляем переменные
- var socket = new WebSocket('wss://ws.golos.io'),
- lastblock, startblock;
- // Открываем сокет
- function connectGolos() {
- socket.onopen = function(event) {
- // Выставляем интервал в 3000 ms
- setInterval(function() {
- socket.send(JSON.stringify({ // Отправляем запрос
- id: 1,
- method: 'get_dynamic_global_properties', // Запрашиваем конкретно эти данные
- 'params': []
- }));
- lastblock++; // Увеличиваем на 1 значение данной переменной при каждом выполнении функции (каждые 3 секунды)
- }, 3000);
- }};
- fixblock = true; // Устанавливаем для переменной булево значение - ВКЛ
- socket.onmessage = function(event) {
- data = JSON.parse(event.data); // Полученные данные парсим в формат JSON
- merkle = data.result.transaction_merkle_root;
- if (fixblock) { // Выполнять если fixblock = true (мы указали это за пределами onmessage)
- startblock = data.result.last_irreversible_block_num; // Получаем номер блока и записываем в переменную
- lastblock = startblock; // записываем в переменную номер начального блока
- fixblock = false; //теперь переводим условие в false, и мы больше не сможем менять номер начального блока
- }
- if (data.id === 1 ) { // Если ответ на наш socket.send id 1
- socket.send(JSON.stringify({ // Отправляем запрос на получение аккаунта
- id: 2,
- method: 'get_accounts',
- params: [
- ['vik'] // запрашиваем данные на ник (не обязательно пока, понадобится в другой ситуации)
- ]
- }));
- socket.send(JSON.stringify({
- id: 3,
- method: 'get_block',
- 'params': [lastblock]// Отправляем запрос на получение текущего блока
- }));
- }
- if (data.id === 3 && merkle !== "0000000000000000000000000000000000000000"){ // Если данные ответа на запрос с id = 3
- tx = data.result.transactions[0].operations[0][1]; // Сокращенный путь до данные> транзакции> операции>
- trigger = data.result.transactions[0].operations[0][0]; // Тригер. Определяем коммент, голос, подписку и другое
- $voter = tx.voter; // Переменная с именем голосующего
- $power = tx.weight; // Переменная с силой голоса при голосе
- $author = tx.author; // Автор. Одна переменная на многие виды операций
- $permlink = tx.permlink; // Ссылка. Так же есть в многих операциях
- $parent = tx.parent_author; // Автор - родитель поста. Учавствует в комментах
- $body = tx.body; // Тело коммента или поста
- $title = tx.title; // Заголовок поста, в комментах пуст
- if (trigger == 'vote'){ // Если триггер голос
- votehtml = '<div id="item" class="myJson"><b>'+$voter+'</b> голосует за <span>'+$author+'</span>. Сила '+$power+' </div>'
- document.getElementById('filterdata').insertAdjacentHTML('afterbegin',votehtml); // Вставляем данные на страницу
- }
- if (trigger == 'comment'){ // Если триггер коммент
- if ($parent !== ""){ // Если родитель поста не пустое место :)
- commthtml = '<div id="item" class="myJson">'+$author+' комментирует '+$parent+': '+$body+' </div>'
- document.getElementById('filterdata').insertAdjacentHTML('afterbegin',commthtml); // Вставляем html на страницу
- } else { // А если автор-родитель пуст, то вставим html заточенный под пост, а не комментарии.
- posthtml = '<div id="item" class="myJson">'+$author+' разместил пост <h4>'+$title+'</h4>'+$body+'</div>'
- document.getElementById('filterdata').insertAdjacentHTML('afterbegin',posthtml);
- }
- }
- if (trigger == 'custom_json'){ // Если триггер custom_json (обычно это фолловинг)
- var follow = JSON.parse(tx.json)[1], // Получаем данные свойства json внутри custom_json
- $follower = follow.follower, // Находим имя фолловера
- $followin = follow.following; // Находим имя, на кого подписался фолловер
- // Придумываем оформление вывода фолловинга
- follhtml = '<div id="item" class="myJson"><span>'+$follower+'</span> подписка на <b>'+$followin+'</b></div>'
- document.getElementById('filterdata').insertAdjacentHTML('afterbegin',follhtml);
- }
- if (trigger == 'transfer'){ // Если триггер трансфер
- var $amount = tx.amount,
- $from = tx.from,
- $memo = tx.memo,
- $to = tx.to;
- transfhtml = '<div id="item" class="myJson"><b>'+$from+'</b> отправил '+$amount+' <span>'+$to+'</span>\
- <p><i>'+$memo+'</i></p></div>'
- document.getElementById('filterdata').insertAdjacentHTML('afterbegin',transfhtml);
- }
- if (trigger == 'feed_publish'){
- var $publisher = tx.publisher,
- $base = tx.exchange_rate.base,
- $quote = tx.exchange_rate.quote;
- feedhtml = '<div id="item" class="myJson">Прайс фид от <span>'+$publisher+'</span>: '+$base+' = <b>'+$quote+'</b> </div>';
- document.getElementById('filterdata').insertAdjacentHTML('afterbegin',feedhtml);
- }
- if (trigger == 'account_create'){
- var $newbie = tx.new_account_name,
- $creator = tx.creator;
- newbiehtml = '<div id="item" class="myJson">Новый пользователь <span>'+$newbie+'</span> ('+$creator+') </div>';
- document.getElementById('filterdata').insertAdjacentHTML('afterbegin',newbiehtml);
- }
- if (trigger == 'account_update'){
- // Обновление аккаунтов
- }
- if (trigger == 'account_witness_vote'){
- var $acc = tx.account,
- $wit = tx.witness;
- votewhtml = '<div id="item" class="myJson">'+$acc+' голосует за делегата <span>'+$wit+'</span></div>';
- document.getElementById('filterdata').insertAdjacentHTML('afterbegin',votewhtml);
- }
- }
- };
- connectGolos();
- socket.onerror = function(event) {
- document.getElementById('filterdata').insertAdjacentHTML('afterbegin', '<div class="alert">На сервере ноды произошла ошибка 502. Переподключение...</div>');
- setTimeout(location.reload(), 1000); // На голосе часто ошибка 502 - в нашем случае перезагрузим страницу, если встретим такую ошибку.
- connectGolos();
- };
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement