GOLOS VIK

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

目前為 2017-01-25 提交的版本,檢視 最新版本

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

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

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 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 и сейчас вы смотрите консоль :) ');