/haPages

HaPages (in Russian) is hosting of userscripts and userstyles and its descriptions. Common purpose is better presentation of pages and data in sites (habrahabr.ru is high usable).

Primary LanguageJavaScript

HaPages - это юзерскрипты, юзерстили для сайтов и их описания, многие из которых сделаны для habrahabr.ru

<tr>
	<td rowspan=2 align=center valign=top>&#10103; Стили<br>
		<big><b><a href=http://spmbt.github.io/haPages/doc/habrAjax/zenComment.htm>ZenComment</a></b></big><br>
		для сайтов:<br>
		<a href=http://habrahabr.ru>Habrahabr</a>,<br>
		<a href=http://geektimes.ru>Geektimes</a>,<br>
    	<a href=http://megamozg.ru>megaMozg</a>,<br>
		<a href=http://webcache.googleusercontent.com/search?q=cache:http://habrahabr.ru title="(для недавно удалённых статей)">кеш Гугла</a>,<br>
		локальный сайт<br>
        <i>(Fx3+, Chr, Op12)</i>
		<table><tr><td>
			<img border=6 borderColor="gray" style="border:6px solid #bbb; border-radius: 3px" src="doc/img/zenComment20150102-004402.png"/>
		</td></tr></table>
		<table><tr><td>
			<a href="doc/img/zenCommentWide.png" target=_blank><img border=6 borderColor="gray" style="border:6px solid #bbb; border-radius: 3px" src="doc/img/zenCommentWidePre.png"/></a>
		</td></tr></table>
	</td>
	<td colspan=2 rowspan=2>Переоформление сайта для <ul>
			<li><b>лучшей компактности</b> статей и блоков (<i>"читать, а не скроллить"</i>),</li>
			<li><b>лучшей сжимаемости</b> окна (до 320px),</li>
			<li>исправления ошибок сайта (баг малой высоты окна, нерасширение полей ввода, близкостоящие кнопки и др.).</li>
		</ul>
		Основное:
		<ul>
			<li><b>незаметное Geektimes</b>-меню: показ по&nbsp;наведению</li>
			<li><b>меню по углам</b> вместо левой кнопочной панели</li>
			<li><b>уменьшены</b>: заголовки, межстрочный интервал, поля, зазоры, сайдбар, футер</li>
			<li>Постоянно видимые подменю для широких страниц <i>(> 1520px)</i></li>
			<li><b>невидимые</b> аватары, кнопки отправки ответов и деакцентирование малозначимых полей</li>
			<li><b>нумерация страниц</b> (пагинатор) фиксирована внизу окна</li>
			<li><b>интегрированы</b> со скриптами <a href=http://spmbt.github.io/haPages/doc/habrAjax/>HabrAjax</a></li>
		</ul>
	</td>
	<td>
		<i><b>Документация</b>:</i>
		<ul>
			<li><a href=http://spmbt.github.io/haPages/doc/habrAjax/zenComment.htm>Github-doc</a></li>
			<li><a href=http://userstyles.org/styles/36690/>Userstyles</a></li>
			<li>Статья <a href="http://habrahabr.ru/post/223555/">ZenComment и преодоление «бешеной плитки»</a></li>
		</ul>
	</td>
</tr>
<tr>
	<td>
		<i><b>Код</b>:<br>
		(> 1000 строк)</i>
		<ul>
			<li><a href=>Github</a><br>
			Установить:</li>
			<li><a href=>Raw</a></li>
			<li><a href=https://userstyles.org/styles/36690/>Userstyles</a></li>
		</ul>Лучше включать через аддон <i>Stylish</i> (<a href="https://addons.mozilla.org/ru/firefox/addon/stylish/">для Firefox</a> или <a href="https://chrome.google.com/webstore/detail/stylish/fjnbnpbmkenffdnngjfgmeleoegfcffe?hl=ru">Chrome</a> или без него для Старой Оперы), а не из HabrAjax.
	</td>
</tr>


<tr>
	<td rowspan=2 align=center valign=top>&#10104; Стили<br>
		<big><b><a href=http://spmbt.github.io/haPages/doc/habraDarkAge/>HabraDarkAge</a></b></big><br>
		для сайтов:<br>
		<a href=http://habrahabr.ru>Habr</a>,<a href=http://m.habrahabr.ru>m.Habr</a>,<br>
		<a href=http://geektimes.ru>Geektimes</a>,<br>
		<a href=http://megamozg.ru>megaMozg</a>,<br>
		<a href=http://tmfeed.ru>TMfeed</a>,<br>
		<a href=http://webcache.googleusercontent.com/search?q=cache:http://habrahabr.ru title="(для недавно удалённых статей)">кеш Гугла</a>,<br>
		локальный сайт<br>
        <i>(Fx30+, Chr35+)</i>
		<table><tr><td>
			<a href="doc/habraDarkAge/habrDarkAgeSearchLowHeight.png"><img border=6 borderColor="gray" style="border:6px solid #bbb; border-radius: 3px" src="doc/img/habraDarkAge20150102-034308.png"/></a>
		</td></tr></table>
	</td>
	<td colspan=2 rowspan=2>Тёмная тема Хабрахабра. Дизайн, в&nbsp;основном, исходный, кроме тонов.
		<ul>
			<li><b>Приглушенные цвета</b> картинок, блоков сайдбара и&nbsp;элементов<br>
			<li>незаметное Geektimes-меню</li>
			<li><b>Кнопки левой панели совмещены</b> с&nbsp;навигацией страниц</li>
			<li>Поддержка страниц "<b>мобильной версии</b>"</li>
			<li>Постоянно видимые подменю для широких страниц</li>
			<li>Исправление ошибок сайта</li>
			<li><b>Рост иконок вдвое</b> по наведению мыши на&nbsp;заголовок ответа</li>
			<li>Некоторые аналогии с ZenComment: компактный футер, деакцентирование элементов в&nbsp;комментариях</li>
		</ul>
	</td>
	<td>
		<i><b>Документация</b>:</i>
		<ul>
			<li><a href=http://spmbt.github.io/haPages/doc/habraDarkAge/>Github</a>+фото</li>
			<li><a href=https://userstyles.org/styles/101697/>Userstyles</a></li>
			<li>Статья <a href=http://habrahabr.ru/post/242189/>Наступают тёмные времена</a></li>
		</ul>
	</td>
</tr>
<tr>
	<td>
		<i><b>Код</b>:<br>
		(> 1000 строк)</i>
		<ul>
			<li><a href=https://github.com/spmbt/haPages/tree/gh-pages/userscript/habraDarkAge>Github</a><br>
			Установить:</li>
			<li><a href=http://spmbt.github.io/haPages/userscript/habraDarkAge/habraDarkAge.user.css>Raw</a></li>
			<li><big><a href=https://userstyles.org/styles/101697/>Userstyles</a></big></li>
		</ul>
	</td>
</tr>


<tr>
	<td align=center valign=top>&#10105; <big><b><a href=https://greasyfork.org/ru/scripts/1966-habr-percentage-ring>HabrPercentageRing</a></b></big><br>
		для сайтов:<br>
		<a href=http://habrahabr.ru>Habrahabr</a>,<br>
		<a href=http://geektimes.ru>Geektimes</a>,<br>
		<a href=http://megamozg.ru>megaMozg</a>,<br>
		<a href=http://webcache.googleusercontent.com/search?q=cache:http://habrahabr.ru title="(для недавно удалённых статей)">кеш Гугла</a>,<br>
		локальный сайт<br>
		<i>(Fx3+, Chr, Op10+)</i>
		<table><tr><td>
			<img border=6 borderColor="gray" style="border:6px solid #bbb; border-radius: 3px" src="doc/img/habrPercentageRing20150102-011029.png"/>
		</td></tr></table>
	</td>
	<td>Показывает соотношение положительных и&nbsp;отрицательных оценок к&nbsp;комментарию или статье кольцевой диаграммой вокруг суммарной оценки.<br>
	<br>
	<i>Слушает событие 'chgDom' (от&nbsp;HabrAjax, например), чтобы выполниться в&nbsp;подгруженном блоке от другого скрипта.</i>
	</td>
	<td>
		<ul>
			<li><big><a href=https://greasyfork.org/ru/scripts/1966-habr-percentage-ring>Greasyfork</a></big></li>
			<li>Старое описание <a href=http://userscripts-mirror.org/scripts/show/129371>userscripts -mirror.org</a> <i>(не&nbsp;устанавли-<br>вать оттуда)</i></li>
			<li>Статья <a href=http://habrahabr.ru/post/131818/>Диаграмма процентовки «за и против» на canvas</a></li>
		</ul>
	</td>
	<td>
		<i>(100 строк)</i>
		<ul>
			<li><a href=https://github.com/spmbt/haPages/tree/gh-pages/userscript/habrPercentageRing>Github</a><br>
			<li><a href=https://greasyfork.org/ru/scripts/1966-habr-percentage-ring/code>Greasyfork</a><br>
			Установить:</li>
			<li><a href=http://spmbt.github.io/haPages/userscript/habrPercentageRing/habrPercentageRing.user.js>Raw</a></li>
			<li><a href=https://greasyfork.org/scripts/1966-habr-percentage-ring/code/Habr%20Percentage%20Ring.user.js>Greasyfork</a></li>
		</ul>
	</td>
</tr>


<tr>
	<td align=center valign=top>&#10106; Стили и скрипт <big><b><a href=http://habrahabr.ru/post/213615/>UfoCorrect</a></b></big><br>
		для сайтов:<br>
		<a href=http://habrahabr.ru>Habrahabr</a>,<br>
		<a href=http://habrastorage.org">habrastorage.org</a>,<br>
		<a href=http://freelansim.ru">freelansim.ru</a>,<br>
		<a href=http://toster.ru">toster.ru</a>,<br>
		<a href=http://tmtm.ru">tmtm.ru</a>,<br>
		<i>(Fx3+, Chr, Op10+)</i>
	</td>
	<td>Исправляет длинные тени у нескольких рисунков для приведения дизайна к единому реалистичному стилю.
	</td>
	<td>
		<ul>
			<li><a href=https://userstyles.org/styles/102581/>userstyles.org</a></li>
			<li>Статья <a href=http://habrahabr.ru/post/213615/>Избавление нашего мира от длинных теней</a></li>
		</ul>
	</td>
	<td>
		<ul>
			<li><a href=https://github.com/spmbt/haPages/tree/gh-pages/userscript/ufocorrect>Github</a><br>
			<li><a href=https://userstyles.org/styles/102581/>userstyles (CSS)</a></li>
			Установить:</li>
			<li><a href=http://spmbt.github.io/haPages/userscript/ufocorrect/ufocorrect.user.js>Raw js</a></li>
			<li><a href=https://greasyfork.org/ru/scripts/1962-ufocorrect>Greasyfork</a></li>
		</ul>
	</td>
</tr>
<tr>
	<td colspan=4>
Для загрузки скрипта в Хром как распакованного расширения полезно иметь файл манифеста. Для других скриптов - пишутся аналогичные или другим способом достигается разрешение скриптов в Хроме.
<tr>
	<td align=center valign=top>&#10107; <big><b><a href=https://greasyfork.org/ru/scripts/1964-habractivity>HabrActivity</a></b></big><br>
		для сайтов:<br>
		<a href=http://habrahabr.ru>Habrahabr</a>,<br>
		<a href=http://geektimes.ru">Geektimes.ru</a>,<br>
		<i>(Fx30+, Chr35+, Op12+)</i>
		<table><tr><td>
			<img border=6 borderColor="gray" style="border:6px solid #bbb; border-radius: 3px" src="doc/img/habrActivity20150101-111047.png"/>
		</td></tr></table>
	</td>
	<td>Снятие со страниц комментариев данных об активности выбранного пользователя и&nbsp;представление их в&nbsp;виде диаграммы, подобной диаграмме активности "Contributions" на&nbsp;Github. <a href=http://spmbt.github.io/haPages/doc/habractivity03.jpg>Скриншот</a>.
	</td>
	<td>
		<ul>
			<li><a href=https://greasyfork.org/ru/scripts/1964-habractivity>greasyfork</a></li>
			<li>Старое (подробное) описание <a href=http://userscripts-mirror.org/scripts/show/162360>userscripts -mirror.org</a> <i>(не&nbsp;устанавли-<br>вать оттуда)</i></li>
			<li>описание имеется и в коде самой программы, просматривается после установки по нажатию "Подробности".</li>
		</ul>
	</td>
	<td>
		<i>(400 строк)</i>
		<ul>
			<li><a href=https://github.com/spmbt/haPages/tree/gh-pages/userscript/habrActivity>Github</a><br>
			Установить:</li>
			<li><a href=https://github.com/spmbt/haPages/tree/gh-pages/userscript/habrActivity/habractivity.user.js>Raw</a></li>
			<li><a href=https://greasyfork.org/scripts/1964-habractivity/code/habrActivity.user.js>Greasyfork</a></li>
		</ul>
	</td>
</tr>


<tr>
	<td align=center valign=top>&#10108; <big><b><a href=https://greasyfork.org/ru/scripts/1965-habrakarmaview>HabraKarmaView</a></b></big><br>
		для сайтов:<br>
		<a href=http://habrahabr.ru>Habrahabr</a>,<br>
		<a href=http://geektimes.ru">Geektimes</a>,<br>
		<a href=http://megamozg.ru">Megamozg</a>,<br>
		<i>(Fx30+, Chr35+, Op12+)</i>
		<table><tr><td>
			<img border=6 borderColor="gray" style="border:6px solid #bbb; border-radius: 3px" src="doc/img/habraKarmaView20141231-052826.png"/>
		</td></tr></table>
	</td>
	<td>Подсказка кармы и&nbsp;рейтинга по&nbsp;наведению на&nbsp;любой ник на&nbsp;странице, кроссбраузерно.<br>
	<br>
	<i>Интегрирован с HabrAjax - работает в его подгруженных статьях (с помощью Custom Event).</i>
	</td>
	<td>
		<ul>
			<li><a href=https://greasyfork.org/ru/scripts/1965-habrakarmaview>Greasyfork</a></li>
			<li>Старое описание <a href=http://userscripts-mirror.org/scripts/show/132273.html>userscripts -mirror.org</a> <i>(не&nbsp;устанавли-<br>вать оттуда)</i></li>
		</ul>
	</td>
	<td>
		<i>(150 строк)</i>
		<ul>
			<li><a href=https://github.com/spmbt/haPages/tree/gh-pages/userscript/habraKarmaView>Github</a><br>
			Установить:</li>
			<li><a href=http://spmbt.github.io/haPages/userscript/habraKarmaView/habraKarmaView.user.js>Raw</a></li>
			<li><big><a href=https://greasyfork.org/scripts/1965-habrakarmaview/code/HabraKarmaView.user.js>Greasyfork</a></big></li>
		</ul>
	</td>
</tr>


<!--tr>
	<td align=center valign=top>&#10102; &#10131; &#9451; <a href=></a>
	</td>
	<td>
	</td>
	<td>
		<ul>
			<li><a href=></a></li>
			<li><a href=></a></li>
			<li><a href=></a></li>
		</ul>
	</td>
	<td>
		<ul>
			<li><a href=></a><br>
			Установить:</li>
			<li><a href=></a></li>
			<li><a href=></a></li>
		</ul>
	</td>
</tr-->
<tr>
	<td colspan=4>
Внимание, ссылки на установку со страниц описаний скриптов на userscripts-mirror.org — УСТАРЕВШИЕ и не могут быть там обновлены. Даны исключительно для документации и просмотра истории. Устанавливать — с Github или greasyfork.org.
<tr>
	<td align=center valign=top>&#10109; <big><b><a href=https://greasyfork.org/ru/scripts/5915-feedly-partial-refresh-by-r-in-any-keyboard-layout>FeedlyCtrlF5</a></b></big><br>
		для сайта<br>
		<a href=http://feedly.com>feedly.com</a><br>
		<i>(Fx30+, Chr35+, Op12?)</i>
	</td>
	<td>Оформление висячих заголовков и&nbsp;обновление по&nbsp;клавише "R" в&nbsp;любом национальном регистре клавиатуры.
	</td>
	<td>
		<ul>
			<li><a href=https://greasyfork.org/ru/scripts/5915-feedly-partial-refresh-by-r-in-any-keyboard-layout>Greasyfork</a></li>
		</ul>
		<a href="doc/img/feedlyCtrlF5_20150102-035234.png">(скриншот)</a>
	</td>
	<td>
		<i>(100 строк)</i>
		<ul>
			<li><a href=https://github.com/spmbt/haPages/tree/gh-pages/userscript/feedlyCtrlF5>Github</a><br>
			Установить:</li>
			<li><a href=http://spmbt.github.io/haPages/userscript/feedlyCtrlF5/feedlyCtrlF5.user.js>Raw</a></li>
			<li><a href=https://greasyfork.org/scripts/5915-feedly-partial-refresh-by-r-in-any-keyboard-layout/code/Feedly:%20partial%20refresh%20by%20R%20in%20any%20keyboard%20layout.user.js>Greasyfork</a></li>
		</ul>
	</td>
</tr>


<tr>
	<td align=center valign=top>&#10110; Стили и скрипт <big><b><a href=http://spmbt.github.io/haPages/doc/overCompact/>OverCompact</a></b></big><br>
		для сайта и форума<br>
		<a href=http://overclockers.ru>overclockers.ru</a><br>
		<i>(Fx15+, Chr20+, Op11+)</i>
		<table><tr><td>
			<img border=6 borderColor="gray" style="border:6px solid #bbb; border-radius: 3px" src="doc/img/overCompact20150102-085930.png"/>
		</td></tr></table>
	</td>
	<td>Модификация вида сайта и форума стилями. Примерно 10% работы делают скрипты - то, что не&nbsp;могут сделать стили.<br>
	<br>
	Основное назначение - стилизация, компактность списков форумов, нераспирание страниц сайта (ширина страниц становится допустимой от&nbsp;600-800 пикс.).
	</td>
	<td>
		<ul>
			<li><a href=http://spmbt.github.io/haPages/doc/overCompact/>Github-doc</a></li>
			<li><a href=https://userstyles.org/styles/43834/>Userstyles (CSS)</a></li>
			<li><a href=https://greasyfork.org/ru/scripts/1963-overcompact>Greasyfork (JS)</a> (включая стили)</li>
			<li><a href=http://forums.overclockers.ru/viewtopic.php?f=14&t=396030>overclockers.ru</a></li>
			<li>Старое описание скриптов на <a href=http://userscripts-mirror.org/scripts/show/96460.html>userscripts -mirror.org</a> <i>(не&nbsp;устанавли-<br>вать оттуда)</i></li>
		</ul>
	</td>
	<td>
		<ul>
			<li><a href=https://github.com/spmbt/haPages/tree/gh-pages/userscript/overCompact>Github</a><br>
			Установить:</li>
			<li><a href=http://spmbt.github.io/haPages/userscript/overCompact/overCompact.user.css>Raw CSS</a></li>
			<li><a href=http://spmbt.github.io/haPages/userscript/overCompact/overCompact.user.js>Raw JS</a></li>
			<li><a href=https://userstyles.org/styles/43834/>Userstyles (CSS)</a></li>
			<li><a href=https://greasyfork.org/scripts/1963-overcompact/code/OverCompact.user.js>Greasyfork (JS)</a> (включая стили)</li>
		</ul>
	</td>
</tr>
(2016-01-18)

Скрипты и стили для разработки и использования

Название, сайт, браузеры Основные функции Документация Код (смотреть; установить)
Замечание для пользователей Firefox 30+ и Scriptish: нужно использовать последнюю ночную сборку от 20 ноября 2014 (и новее, если такие будут, но проект заброшен; тем не менее, после установки Scriptish с отключенной проверкой (xpinstall.signatures.required: false) - работает на Windows и Fx43 (2015-01)) для корректных результатов (иначе, проблемы - с функциями GM_*** - и не работает список настроек для Fx30, а за ним многое другое). Чем пользоваться? Сейчас c 2014 Greasemonkey снова стала обновляться, поэтому роль Scriptish можно считать выполненной и пользоваться Greasemonkey.
HabrAjax
для сайтов:
Habrahabr,
Geektimes,
megaMozg,
кеш Гугла,
локальный сайт
(Fx3+, Chr, Op12)
Автоматизация сайта (>60 функций с настройками) с подключаемыми стилями ZenComment.
  • Подгрузка статей без перезагрузки ленты
  • просмотр картинок с увеличением и перемещением
  • принудительный кат: все аннотации - не более определённой высоты
  • краткие даты, адаптивно уменьшаемые заголовки
  • фильтр по авторам и хабам
  • расцветка комментаторов по активности
  • примерные даты публикации по номеру в URL, и т.д.
(> 5000 строк) Рекомендуется использовать совместно со стилями ZenComment. Для оценки эффекта можно включить встроенные в скрипт стили ZenComment (в настройках, которые открываются по иконке скрипта вверху справа на странице сайта).
С 30 мая 2014 года новые версии HabrAjax и других скриптов, относящихся к Хабру, стали размещаться на github.com/spmbt/haPages из-за невозможности обновления версий на прежнем традиционнном хостинге.

Другие скрипты и стили

  • googleSearchExtraButtons: добавление нескольких кнопок на страницу результатов поиска Google (искать PDF; за последний день, неделю, месяц и год). Статья (2013) о причинах выставления этих кнопок.

  • Jira usable: подкраска блоков Джиры для лучшей читаемости и разделения. Просмотреть эффекты можно на каких-нибудь Atlassian-страницах и подобных. Для использования в своём проекте впишите домен проекта вместо слов "writeyourdomain".

  • Coffeescript Title Fix: смотреть coffeescript.org и его перевод без постоянно съедаемой верхушки окна - всё окно используется для просмотра кодов и статей.

  • Yandex-Remove_Ads: смотреть yandex.ru и его многочисленные разделы - без рекламы, не отключаемой в интерфейсе сайта поисковика. Описание стилей.

  • Yandex-NoFloatField: смотреть результаты поиска yandex.ru без плавающего прилипающего к верхней кромке окна поля.

  • Yandex_Extra_Buttons: скрипт (описание) добавляет несколько кнопок к поиску yandex.ru для быстрого перехода к результатам специального поиска - по интервалу дат, по сайту или по документам.


Скрипты и их функции имеют страницы описаний. Пример страницы haPages для описания функций: Перенос сообщений из "прямого эфира" в "Лучшие".