GOLOS VIK

Скрипт для golos.io меняющий оформление и добавляющий новые функции

当前为 2017-01-25 提交的版本,查看 最新版本

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name GOLOS VIK
// @namespace golos.io 
// @description Скрипт для golos.io меняющий оформление и добавляющий новые функции
// @description:ru Скрипт для golos.io меняющий оформление и добавляющий новые функции
// @grant none
// @version 1.0
// @include https://golos.io/*
// @require https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js
// ==/UserScript==

/* 
Скрипт для golos.io меняющий оформление и добавляющий новые функции
Автор скрипта https://golos.io/@vik
Скрипт меняет внешний вид ленты постов и добавляет выпадающий блок ответов на все страницы. 
*/


// Прописываем CSS и HTML
var inlinecss = "<style>body{background:url(https://pp.vk.me/c837131/v837131970/2834c/lWcExPA9pfA.jpg) fixed #ededf9}.VotesAndComments{background:#fff;padding:0 25px;border-radius:10px;position:absolute;top:45px;right:0}.PostSummary__body.entry-content{white-space:normal;margin-bottom:20px}span.Author{color:#fff;background:#3adb76;padding:2px 5px;border-radius:2px}.PostSummary__footer{position:relative}ul.Topics li{float:left;background:#fff;padding:0 5px;margin:3px;border-radius:3px}.PostSummary__content{padding:15px}.PostSummary{clear:none;padding:0;width:100%;max-width:600px;margin:0 auto 60px;box-shadow:0 5px 10px -5px rgba(0,0,0,.76);transition:.3s all ease}.PostSummary:hover{box-shadow:0 8px 15px -5px rgba(0,0,0,.8)}img.PostSummary__image{float:none;display:block;width:100%;height:auto;max-width:100%}.PostSummary.with-image .PostSummary__content,.PostSummary.with-image .PostSummary__reblogged_by{margin-left:10px}li.Topics__title{display:block;float:none!important;background:0 0!important}.PostsIndex__topics small{display:block;float:right;margin-top:30px}.Voting__button-up{transition:1s all ease;border-radius:25px;z-index:7}.PostSummary:hover .Voting__button-up{transform:scale(2)}.PostsIndex__topics.column.shrink.show-for-large{position:fixed;right:-60px;top:100px;height:600px;height:80vh;overflow:auto}#answerupdate{cursor:pointer;text-align:center;background:#3adb76;color:#fff}.answerholder{display:none;position:fixed;background:#fff;width:300px;height:600px;height:95vh;font-size:9pt;top:48px;left:0;z-index:77;overflow:hidden}.answerholder .VotesAndComments,.answerholder span.Voting{display:none}.answerholder .PostSummary{margin:0;padding:0;border-bottom:1px solid #efefef}.PostSummary__time_author_category a .Author{color:#fff}.answerholder .PostSummary__body.entry-content{margin-bottom:0}.answerholder .PostSummary__content{padding:5px}.answerholder span.Author{background:0 0;padding:0;color:#000}.answerholder .PostSummary__time_author_category a{color:inherit}.answertarget{padding:25px 0 0;overflow-x:hidden;overflow-y:auto;height:600px;height:90vh}#showanswer{cursor:pointer;position:fixed;top:98px;left:0;background:#266db6;font-size:16px;box-shadow:0 0 3px #000;z-index:78;color:#fff;padding:0 10px;border-radius:0 10px 10px 0}span.vcard>strong{font-size:8pt;word-wrap:break-word}.PostSummary__time_author_category{border:none}</style>";
var somehtml = '<div class="answerholder"><h3 id="answerupdate">Обновить ответы</h3><div class="answertarget">Загрузка...</div></div><div id="showanswer">Ответы</div>';

$(inlinecss).appendTo( "head" ); // Устанавливаем CSS стили
$(somehtml).appendTo( "body" );  // Вставляем необходимые html элементы


// Меняем в постах маленькие фото на большие: 256x128 > 640x480 



var tinyimg = new RegExp('/256x128/'),  // Берем ссылки на маленькие превью
    bigimg = new RegExp('640x480');     // Меняем в ссылка значение разрешения фотографии, обращаясь к проксификатору по ссылке https://imgp.golos.io/640x480/
    function imgtoggle(){
        $('img.PostSummary__image').each(function(){
         var image = $(this);
         image.attr('src', image.attr('src').replace(tinyimg, bigimg)); // Тут происходит ранее описанная замена 256x128 на 640x480
        });
      }  
imgtoggle(); 



// Когда инфинитискролл подгрузил новые посты, снова запускаем замену 256x128 на 640x480
$(document).on('DOMNodeInserted', function(e) { 
    imgtoggle();
});


// Загружаем блок ответов ответы
function answerupdate(){
 $('.answertarget').load('/@vik/recent-replies/ #posts_list'); 
}
// Даем возможность обновлять ответы нажатием кнопки "Обновить ответы"
$('#answerupdate').on('click', function(){ 
  answerupdate(); 
});

// Даем возможность открывать/закрывать блок ответов
var isActive = true;
$('#showanswer').on( 'click', function() {
  if ( isActive ) {
    answerupdate();
    $('.answerholder').slideDown(); 
 } else {
   $('.answerholder').slideUp();
  }
   isActive = !isActive;
  imgtoggle(); // на всякий случай еще раз меняем превьюшки на большие
});

console.log('Вы установили userscript от golos.io/@vik и сейчас вы смотрите консоль :) ');