Поиск в Гугле в нескольких колонках

difabor · №1

Этот скрипт является форком расширения Mozilla 2-Column Google Results 2.7.0
Этот скрипт улучшает некоторые вещи в оригинальных результатах Google Mozilla с 2 столбцами, и он может быть легко перенастроен пользователем в коде скрипта.
Он также улучшает аналогичное расширение в Google Chrome - 2-Column Google Results 1.0
1. Этот скрипт легко настраивается:
по умолчанию он представляет результаты Google в 4 столбцах для "новости" и "видео"и в 3 столбцах для "все".
Но пользователь может настроить эти цифры под себя-отдельно для "новостей", "видео" и "всего".
Он также может изменить цвет выпрыгивающей панели.
2. Расширение Mozilla 2-Column Google Results 2.7.0 не представляло "Новости" в 2 столбцах,
а расширение Chromes 2-Column Google Results 1.0 имеет проблемы с представлением изображений.
Здесь эти обе проблемы решены.
4. Кроме того скрипт учитывает актуальную ширину экрана - если юзер не в полноразмерном режиме, или имеется сплит и ширина меньше, число колонок уменьшается в соответствии с актуальной шириной
3. Скрипт сравнительно небольшой: меньше 9 КБ

скрытый текст

Google search in several columns

Выделить код

Код:

// ==UserScript==
// @name         Google search in several columns
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Google search results in 4 columns (Video and News) and 3 columns for All. Fork of Mozilla's 2-Column Google Results 2.7.0
// @author       difabor
// @include      http*://www.google.*/*
// @include      http*://www.google.*.*/*
// @include      http*://ipv6.google.*/*
// @include      http*://encrypted.google.*/*
// @include      http*://*start.me/search/google*
// @grant        none
// ==/UserScript==
var urloc = location;
var switch_news = /tbm=nws/.test(urloc)? '' : '.bkWMgd > div:not(.knavi)';
var FullScreenWidth = 1920;
var col4type = /tbm=nws/.test(urloc)? 4 : /tbm=vid/.test(urloc)? 4 : 3;
var col_num = Math.round(col4type*innerWidth/FullScreenWidth+0.1);
var spring_color = '#8ff';
var css = 'body:not(.no-two-col) {\n'+
'  max-width: 100vw !important;\n'+
'  overflow-x: hidden !important;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) img {\n'+
'  max-width: 100%;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) #center_col {\n'+
'  margin-left: 0 !important;\n'+
'  margin-right: 0 !important;\n'+
'  overflow-x: visible !important;\n'+
'  width: 100vw !important;\n'+
'  padding-left: 10px !important;'+
'}\n'+
'\n'+
'body:not(.no-two-col) #res {\n'+
'  box-sizing: border-box;\n'+
'  width: 100% !important;\n'+
'}\n'+
'\n'+
'/* body:not(.no-two-col) #res .bkWMgd {\n'+
'  vertical-align: top;\n'+
'} */\n'+
'\n'+
'/*\n'+
' * .knavi is for calculator. ref: #9\n'+
' * */\n'+
'/*.knavi*/\n'+
'body:not(.no-two-col) #res '+ switch_news +' {\n'+
'  column-count: '+col_num+' !important;\n'+
'  column-gap: 10px !important;\n'+
'  column-rule: 1px solid silver !important;\n'+
'  /*background-color: #fda !important;*/\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) #res .bkWMgd > div:not(.knavi) > div {\n'+
'  box-sizing: border-box;\n'+
'  margin: 0 3% 10px;\n'+
'  min-height: 100px;\n'+
'  vertical-align: bottom;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) #res .bkWMgd > div.knavi > div {\n'+
'  width: 25%;\n'+
'  margin: auto;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) #res .bkWMgd g-section-with-header {\n'+
'  margin-left: 2.5%;\n'+
'  clear: both;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) #res .bkWMgd g-scrolling-carousel {\n'+
'  margin: 0;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) #iur {\n'+
'  width: 100% !important;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) .big .mw {\n'+
'  max-width: 100% !important;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) #rhs {\n'+
'  background-color: '+ spring_color +' !important;\n'+
'  box-shadow: 0 0 10px 0 rgba(0,0,0,0.5);\n'+
'  margin-right: 0 !important;\n'+
'  margin-left: 0 !important;\n'+
'  overflow: hidden !important;\n'+
'  padding: 0 !important;\n'+
'  position: absolute !important;\n'+
'  transition: .3s right;\n'+
'  top: -40px !important;\n'+
'  right: -440px !important;\n'+
'  width: 460px !important;\n'+
'  z-index: 1000 !important;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) #rhs:hover {\n'+
'  right: 0px !important;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) #rhs img {\n'+
'  width: 100%;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) #rhs #rhs_block,\n'+
'body:not(.no-two-col) #rhs #rhs_block .g.rhsvw.mnr-c.g-blk,\n'+
'body:not(.no-two-col) #rhs #rhs_block .g.rhsvw.mnr-c.g-blk .kp-blk {\n'+
'  padding-left: 0 !important;\n'+
'  padding-right: 0 !important;\n'+
'  margin: 2.5 !important;\n'+
'  width: 90%;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) #taw, #extrares {\n'+
'  clear: both;\n'+
'  margin-left: 30px;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) #rc {\n'+
'  width: 40vw;\n'+
'}\n'+
'\n'+
'body:not(.no-two-col) .rc table.ts td { /* for SearchPreview */\n'+
'  min-width: 130px;\n'+
'}\n'+
'\n'+
'/* also work for startpage.com */\n'+
'\n'+
'.startpage .web_regular_results > li {\n'+
'  box-sizing: border-box;\n'+
'  float: left;\n'+
'  min-height: 125px;\n'+
'  vertical-align: top;\n'+
'  width: 50%;\n'+
'}\n';

let styleNode = document.createElement("style");
  styleNode.appendChild(document.createTextNode(css));
  (document.querySelector("head") || document.documentElement).appendChild(styleNode);// ==UserScript==

Настройка числа колонок задаётся переменной col4type. По умолчанию в скрипте так:
var col4type = /tbm=nws/.test(urloc)? 4 : /tbm=vid/.test(urloc)? 4 : 3;
Эта строка говорит, что для новостей 4 колонки, видео - тоже 4 колонки, а для остального (то есть для "Всё") - 3 колонки.
Картинки исключаются из колоночного представления, чем решается проблема Google Chrome - 2-Column Google Results 1.0. - там картинки были только в одной колонке, а вторая была пустая.
Кроме того в скрипте задаётся ширина полноэкранного режима. По умолчанию это 1920:
var FullScreenWidth = 1920;
Если у юзера она другая - он должен в коде скрипта задать другое число.
Также, если он хочет другое число колонок, он должен изменить строку
var col4type = /tbm=nws/.test(urloc)? 4 : /tbm=vid/.test(urloc)? 4 : 3; подставив другие значения числа колонок
Обе этих переменных (col4type и FullScreenWidth) задаются практически в самом начале скрипта - 3-я и 4-я строки после шапки скрипта.

Отредактировано difabor (12-01-2020 01:16:45)

_zt · №2

difabor
В 68 esr ломает гуглокапчу.

difabor · №3

А что такое гуглокапча?

vending_machine · №4

А что такое гуглокапча?

CAPTCHA ~> reCAPTCHA ~> NoCAPTCHA ~> гУгЛоКаПчА

difabor · №5

vending_machine пишет

А что такое гуглокапча?
CAPTCHA ~> reCAPTCHA ~> NoCAPTCHA ~> гУгЛоКаПчА

Спасибо, понял. А когда в ней возникает необходимость при поиске?

vending_machine · №6

difabor пишет

vending_machine пишет
А что такое гуглокапча?
CAPTCHA ~> reCAPTCHA ~> NoCAPTCHA ~> гУгЛоКаПчА
Спасибо, понял. А когда в ней возникает необходимость при поиске?

Видимо, когда гугл попросит её пройти.

_zt · №7

difabor

А когда в ней возникает необходимость при поиске?

При использовании публичных Wi-Fi или сервисов прокси и VPN, при каждом запросе поиска, или в зависимости от IP провайдера. Например мой провайдер выдает один IP нескольким абонентам и, (видимо) если мы одновременно сидим в сети и что то ищем в Google, то эта капча начинает задалбывать, с формулировкой - "ваши поисковые запросы похожи на автоматические, докажите, что вы не робот". Дальше (опять же, это мои предположения), если IP несколько раз засветился в Google с "автоматическими" запросами, то он попадает во временный black-list и капча будет вылазить вообще при любом действии в Google с этого IP.

Вы счастливчик, если этого не знаете и не сталкивались.

voqabuhe · №8

_zt
В Яндексе такая же шняга происходит. Заметил, что это каптча часто выскакивает, когда несколько запросов подряд делаешь. Как-будто они ввели ограничение на кол-во запросов в единицу времени. Например один поиск в час) Так я наоборот сразу на VPN перехожу, чтоб от каптчи избавиться. А ввести её еще ни разу не удалось, чтоб приняли.

Отредактировано voqabuhe (29-02-2020 23:44:29)

_zt · №9

voqabuhe
Если скрипты неправильно блокируются, то так и будет. На время прохождения лучше разрешить их полностью, если не знаете как это сделать правильно выборочно.
Еще одно решение сразу переключатся на DDG, они такой фигней не страдают, хотя топ результатов у них формируется странно.

difabor · №10

_zt пишет

difabor
А когда в ней возникает необходимость при поиске?
При использовании публичных Wi-Fi или сервисов прокси и VPN, при каждом запросе поиска, или в зависимости от IP провайдера. Например мой провайдер выдает один IP нескольким абонентам и, (видимо) если мы одновременно сидим в сети и что то ищем в Google, то эта капча начинает задалбывать, с формулировкой - "ваши поисковые запросы похожи на автоматические, докажите, что вы не робот". Дальше (опять же, это мои предположения), если IP несколько раз засветился в Google с "автоматическими" запросами, то он попадает во временный black-list и капча будет вылазить вообще при любом действии в Google с этого IP.
Вы счастливчик, если этого не знаете и не сталкивались.

Я с этим сталкивался, но не знал, что это называется капча... У меня сейчас сильно ухудшилось зрение и даже не поломанная визуальная капча для меня проблема.
Тем не менее, с этим я сталкивался довольно редко - при логинах, когда забыл пароль и требуется его сбросить и т.д.
Но мой вопрос касательно самой поломки (у меня самого накрылся Файрфокс и пока там на 52 версии, поэтому не могу воспроизвести у себя проблему) - это связано с тем, что Стиль протаскивается через скрипт или с чем-то другим (самим стилем)?
Другие скрипты работают? А другие стили?
Спасибо

_zt · №11

difabor
Я не совсем понимаю вопрос. Есть у меня для google один стиль (тема оформления) и три скрипта (иконки, удаление мусора из ссылок и добавление строки с альтернативными поисковиками), да они без проблем работают. Ваш скрипт я проверял в том числе и на чистом профиле, так что другие скрипты и стили тут ни при чем. Проблема связана с тем, что скрипт (или стиль в нем) делает в несколько колонок, не только страницы google, но и, фрейм капчи, что и приводит к ее полной неработоспособности.

difabor · №12

_zt пишет

difabor
Я не совсем понимаю вопрос. Есть у меня для google один стиль (тема оформления) и три скрипта (иконки, удаление мусора из ссылок и добавление строки с альтернативными поисковиками), да они без проблем работают. Ваш скрипт я проверял в том числе и на чистом профиле, так что другие скрипты и стили тут ни при чем. Проблема связана с тем, что скрипт (или стиль в нем) делает в несколько колонок, не только страницы google, но и, фрейм капчи, что и приводит к ее полной неработоспособности.

Спасибо, _zt, Вы прекрасно и исчерпывающе ответили на мой вопрос - дело именно в специфике стиля - разбиение на колонки, а не в том, что стиль протягивается через скрипт и не в том, что скрипт конфликтует с капчей.
Я сейчас работаю над тем, чтобы добавить управление - нажал на кнопку - и отключил "колониализм", второй раз нажал - и включил его - где-то так. В таком скрипто-стиле не будет проблем с поломкой капчи, я думаю.
Но это возьмёт время. Я хочу насадить "колониализм" и на поиск в Яндексе, и на поиск в Бинге и на другие сайты, где "колониализм" уместен, в частности на этот сайт. А это, как Вы понимаете, большой кусок работы.
Если у Вас есть менеджер стилей то можете попробовать (просто из любопытства) стиль для этого форума.

скрытый текст

Выделить код

Код:

html, body{background-image: 
url(https://images.protopage.com/wallpaper/retina/autumn-landscape.jpg);
      background-attachment: fixed !important;
      background-size: 100% 1007px !important}
body {column-count: 2; column-gap:12px; width: 99vw; left: -20px; 
padding: 0px; position: absolute; z-index: 0; top: 3px}
.pun dd{width: auto}
body {margin-right:  -40px !important; }
.pun  {width: auto; margin-right: -50px; margin-top: -4px !important; margin-bottom: -4px !important}
.pun div {background: #eee}
.pun h2 {margin: -4px 0px -4px 0px!important}
#brdheader .box {margin-top: 3px; margin-bottom: -15px;margin-right: -5px}
#brdfooter:before{
position: fixed;
visibility: visible !important;
top: 20px !important;
right: -0px !important;
left: auto !important; bottom: auto !important;
width: 10px !important;
min-height: 15px !important;
border: 1px solid #444 !important;
border-radius: 5px 5px 5px 5px !important;
background: #8ff !important;
opacity: 1 !important; font-size: 16px;
z-index: 249500 !important;
content: "<" !important; } 
/*---------------------------------------*/
#brdfooter{position: fixed !important;
visibility: hidden !important;
top:   35px !important;
right: -2px !important; 
left: 44vw; bottom: auto !important;
min-height: 15px !important;
max-width: 20vw;
border: 1px solid #444 !important;
border-radius: 5px 5px 5px 5px !important;
background: #8ff !important; 
z-index: 249500 !important;
margin: 0 0 0 0 !important;
padding:2px !important;
width: auto !important; 
min-width: 1063px !important;
transition: visibility 0s linear 0s !important;}
/*---------------------------------------*/
#brdfooter:hover {visibility: visible !important; }

Кроме разбиения на 2 колонки, он создаёт выпрыгивающую панель - в верхнем правом углу (где-то в 5мм от самого верха Вы увидите малюсенькую "кнопочку" цианогово цвета с "<" в ней.
Если её коснуться, выскочит панель, в ней будет меню - куда перейти и кнопка "Перейти" - короче то, что было в самом низу и куда надо было скроллить, если требовалось перейти.
Вот эту часть я и переместил в выпрыгивающую панель. Это удобнее - не надо скроллить, коснулся - и выбирай. С любого места.
В режиме редактирования само поле ввода - в правой колонке, а сам редактор - в левой. Когда приходится писать большой текст, это тоже удобнее - управление всегда под рукой

Отредактировано difabor (04-03-2020 10:18:10)

_zt · №13

difabor
Я не в восторге от идеи двух колонок на форумах. Поисковик другое дело, да и избыток свободного места на страницах поисковиков прямо напрашивается на вторую колонку.

Ваш стиль у меня выглядит так:

Еще и под 1080 не влазит, оставляя горизонтальный scrollbar. И цвета я бы не трогал, макет и цветовая тема это разные вещи.

difabor · №14

_zt пишет

difabor
Я не в восторге от идеи двух колонок на форумах. Поисковик другое дело, да и избыток свободного места на страницах поисковиков прямо напрашивается на вторую колонку.
Ваш стиль у меня выглядит так:
https://b.radikal.ru/b11/2003/b5/c8bacbbc2507t.jpg
Еще и под 1080 не влазит, оставляя горизонтальный scrollbar. И цвета я бы не трогал, макет и цветовая тема это разные вещи.

Странно... У меня 1080 и у меня он выглядит так:

Скажите, у Вас размер 100% или 125%, как рекомендует Microsoft?
Я ещё не занимался масштабированием. Затем я поварьирую зумом и "поиграюсь" с неполным экраном.
В том числе и при размере 125% от Microsoft. Пока что - это только намётки.
Почему такая убийственная разница - не пойму... Наверное у Вас 125% основной размер, а не 100%

Теперь насчёт "колониализма".
Основное предназначение многоколонности - это не выигрыш в пространстве (хоть он тоже играет роль - надо меньше скроллить), а совсем другое.
При широком экране и на форуме подобном этому приходится двигать глазами почти на всю ширину экрана, т.е. вращать глазами на большой угол.
Это, хоть и незаметно, но существенно утомляет глаза.
Вы не задумывались над тем, что на очень многих сайтах весь материал подаётся в относительно узком "коридоре" при куче свободного места с обоих боков?
Например, здесь: https://javascript.ru/basic/regular-expression
Обратите внимание - скроллить приходится очень много, но тем не менее, сайт узкий. И не просто узкий, а пол экрана не используется (при 100% размере от Microsoft).
Но даже при 125% тоже не используется более трети ширины. И при том, что материала там много, очень много. К тому же у них ещё и целая колонка ссылок справа. Но они ютятся в таком узком "коридоре"
Я Вам, конечно, ничего навязывать не собираюсь. Почему у Вас такой страшный получился вид двухколонного форума - буду разбираться.
Ваше мнение для меня существенно и чем больше Вы мне дадите входных данных, тем лучше.
К сожалению, я пока не могу отлаживать на мозилле (она у меня накрылась капитально) и вожусь на Хроме и под Тampermonkey - это тоже может влиять.
Конечно Ваш скриншот меня очень расстроил, слов нет, одни междометия. Но ещё не вечер... Будем бороться...

_zt · №15

difabor
У меня не Windows 10 и масштаб 100. Тема форума сторонняя темная, но в ней нет корректировки размеров. У форума есть собственные темы, настраиваются в профиле, попробуйте у себя их попереключать, у меня активирована "Mozilla-ru", если что.

Я понимаю, что стиль будет актуален на больших экранах с большим разрешениях, просто, я вряд ли им буду пользоваться. Браузер у меня редко разворачивается на весь экран и полезная площадь обычно занята вертикальной панелью вкладок.

Добавлено:
Вот вам еще скриншот с чистого профиля и браузер во весь экран.

Ширина 1931 + скролл, который в скриншот не входит.

Отредактировано _zt (05-03-2020 04:36:18)

difabor · №16

Спасибо, _zt. Я по-видимому понял причину странного вида Вашего 1-го скриншота - наверное у Вас была включена вертикальная панель. Раньше я никак не мог понять как это у Вас так сильно сдвинулись влево кнопочки Page Positioning Buttons - я при всём желании не мог этого сделать (разве что, отредактировать Page Positioning Buttons скрипт).
Судя по Вашему первому скриншоту, у Вас тёмный стиль, а предложенный мною код - для светлого стиля. Для тёмного я могу выложить чуть другой код.
Судя по тому, что у Вас ширина 1931 без скролла, у Вас высокое разрешение - больше, чем 1080х1920.
Касательно цветов: мне их приходится трогать из-за подложки, но это может быть отключаемо.

_zt · №17

difabor
Скриншоты одинаковые, оба перекошены, если вы не заметили. О цветах и так понятно.

difabor · №18

_zt, мы с Вами обращаем внимание на разные вещи... То, что для Вас одинаково, для меня - нет. То, что для Вас перекошено, для меня - нет.
Но мне важно знать, что для Вас перекошено

_zt · №19

difabor
Заголовок раздела "Дополнения" слева, а сам раздел справа.

difabor · №20

_zt, к сожалению, "колонизация" так перекашивает - что в поисковиках, что в гугле...

Добавлено 05-03-2020 14:21:27
_zt, Вы будете смеяться, но я попробовал корневой уровень форума и уровень раздела сделать в 3 колонки - раскладывается - одно удовольствие

Отредактировано difabor (05-03-2020 14:21:27)

Полезная информация