Mouseover Popup Image Viewer

Александр Колесников · №1

Mouseover Popup Image Viewer http://userscripts.org/scripts/show/109262 - показывает полноразмерную картинку или её уменьшенный вариант, если оригинал больше экрана, при наведении мыши на миниатюру. Как правило, это картинки с фотохостингов.
Аналогов в виде расширения для FF нет, т.к. они обладают избыточным функционалом типа превью вэб-страничек, а в части картинок поддерживают всего несколько крупных ресурсов типа Facebook.
Аналоги для Opera: 1)ImagePreviewer (ранее Image Preview Popup), и его UserJS-вариант image-preview-popup-4.2.0-1-1.oex.js. 2) Imagus

Просьба к знающим JS: опишите, пожалуйста, логику и синтаксис добавления правил для этого скрипта.

Kamui · №2

Тоже было бы интересно узнать как туда новые правила напихать

CuttingEdge · №3

И так... Знающих JS тут нет получается... :rolleyes:

Lex1 · №4

А тут даже не столько js нужно. Скажем в случае:

Выделить код

Код:

{r:/fastpic\.ru\/view\//, q:'#image'}

Первое (/fastpic\.ru\/view\//) это регулярка, под которую попадает адрес страницы с большой картинкой, а второе - css селектор по которому находится нужная картинка, т.е. в данном случае с id равным image.

Kamui · №5

Lex1 пишет

А тут даже не столько js нужно. Скажем в случае:
Выделить код
Код:
{r:/fastpic\.ru\/view\//, q:'#image'}
Первое (/fastpic\.ru\/view\//) это регулярка, под которую попадает адрес страницы с большой картинкой, а второе - css селектор по которому находится нужная картинка, т.е. в данном случае с id равным image.

А что означает буква r в начале?

Lex1 · №6

Это название свойства объекта, можете считать его именем переменной. В дальнейшем используется как host.r
С q аналогично, оно будет использовано в

Выделить код

Код:

downloadPage(url, q, xhr, t) {
...
var node = GM_safeHTMLParser(req.responseText).querySelector(q);

Отредактировано Lex1 (14-03-2012 20:44:24)

Kamui · №7

Можете для примера написать код для ссылок из этого? Буду благодарен
И еще вопрос, как в самом скрипте прописать исключение, чтобы на определенном сайте скрипт не работал?

Отредактировано Kamui (14-03-2012 20:50:34)

Lex1 · №8

Например:

Выделить код

Код:

{r:/itmages\.ru\/image\/view\//, q:'#image'},

Открываем страницу с большой картинкой и правой кнопкой по ней - Исследовать элемент. Видим «img#image» - первое это тэг, а второе ставим после «q».

И еще вопрос, как в самом скрипте прописать исключение

Совсем? В exclude можно, в начале:

Выделить код

Код:

// @include        http*
// @exclude http://twitter.com/*

Отредактировано Lex1 (14-03-2012 21:01:45)

Kamui · №9

Lex1
Благодарю, все отлично сработал
И еще по поводу слэшев, как их правильно ставить?

Отредактировано Kamui (14-03-2012 21:07:30)

Lex1 · №10

Это называется экранирование. Ставятся перед точкой и прямым слешем, ну и другими спецсимволами. Подробнее написано скажем на http://javascript.ru/basic/regular-expression или у Фридла.
Крайние слеши - «r:/вот эти/» трогать не нужно, они означают что перед нами регулярное выражение.

Отредактировано Lex1 (14-03-2012 22:47:38)

Kamui · №11

Lex1 пишет

Это называется экранирование. Ставятся перед точкой и прямым слешем, ну и другими спецсимволами. Подробнее написано скажем на http://javascript.ru/basic/regular-expression или у Фридла.
Крайние слеши - «rвот эти/» трогать не нужно, они означают что перед нами регулярное выражение.

Спасибо, почитаю

Kamui · №12

Немного разобрался как писать правила, но есть вопрос. Здесь например ссылка ведет на неполное изображение, а полное находится по ссылка/orig/, как это прописать?

Александр Колесников · №13

А когда надо использовать параметр "XHR" ? Я тут нагуглил

Setting it to true means you are making an asynchronous request. That means the code does not pause until the http request is complete. A synchronous call locks up the browser so nothing else runs. That can cause problems, so people prefer asynchronous.

http://stackoverflow.com/questions/6461 … pen-method
но я не программер. Можно это "на пальцах" объяснить, пожалуйста?

Ranbax · №14

Kamui обещал помочь

Вот сайт на котором скрипт не работает:
http://epidemz.net/479597-pozhirateli-i … vdrip.html

и еще один (принцип тот же): http://www.capa.me/games/pc-igry/161698 … d-ep1.html

непростая задача

Отредактировано Ranbax (28-04-2012 12:24:50)

Kamui · №15

Ranbax
Боюсь здесь не получится сделать ничего ссылка кодируется же
Думаю здесь надо скриптик, который бы заменял кодированные ссылки на оригинальные, но сам наверно не смогу написать такой скрипт.

Отредактировано Kamui (28-04-2012 23:08:05)

Ranbax · №16

Kamui жаль конечно, но есть еще то, что пока не работает:

http://market.yandex.ru/model.xml?model … &hid=90560

у меня не получается

Kamui · №17

Ranbax
На маркете используется ajax, как я понял для таких сайтов надо использовать xhr:true, но что-то все равно не получается

Kamui · №18

Ranbax
Автор скрипта помог написать правило для яндекс-маркета:

Выделить код

Код:

{"r":"mdata\\.yandex\\.net/.+.jpg$"}

Вот такое простенькое правило я только не понимаю что означает знак $ в конце, но судя по всему он и решает ситуацию в правиле.

Lexx77 · №19

Народ, подскажите как добавить Яндекс.Фотки и болгарский фотосайт Snimka.bg? Очень шибко надо

Kamui · №20

{"r":"fotki\\.yandex\\.ru/(top/)?users/.*/view/\\d*/", "q":".js-img-link > img, .img.js-areas > img"} - Яндекс.Фотки, только не уверен самая большая ли картинка появляется

{"r":"snimka\\.bg/.*", "q":"#bigImage"} - Snimka.bg как-то коряво получилось, но я не знаю как сделать лучше

Отредактировано Kamui (24-08-2012 13:44:20)

Lexx77 · №21

Ух ты, замечательно!
Только один смешной вопрос - куда всё это вставлять? В настройках Mouseover Popup Image Viewer нифигась не разобрался

Kamui · №22

На последней картинке выделено синей рамкой

Отредактировано Kamui (24-08-2012 19:53:35)

Lexx77 · №23

Ах вон оно куда...

Яндекс.Фотки, только не уверен самая большая ли картинка появляется

Если там будет самая большая картинка появляться, то никакого экрана не хватит Многие фотки там в оригинале по 3-4 мегабайта весят!

Добавлено 25-08-2012 16:41:43
Мда, на Я.Фотках половина картинок увеличивается, половина - нет А вот на Snimka всё замечательно! Огромное спасибище!

Ещё можно попросить код для добавки украинского фотосайта io.ua и я отстану

Отредактировано Lexx77 (25-08-2012 16:41:43)

Kamui · №24

Lexx77 пишет

Мда, на Я.Фотках половина картинок увеличивается, половина - нет А вот на Snimka всё замечательно! Огромное спасибище!

Скиньте ссылку на фотки которые не увеличиваются, попробую исправить.

Для io.ua попробуйте

Выделить код

Код:

{"r":"(.*\\.)?io\\.ua/[0-9]p?", "q":"#mainfoto"}

Нашел, страницу где фотки не увеличиваются, например такая http://fotki.yandex.ru/contest.xml?id=138 да? или еще вот http://fotki.yandex.ru/search.xml?group … id=4600213. Какие вам нужно?

Вот для поиска на я.фотках - {"r":"fotki\\.yandex\\.ru/search/.*type=image", "q":".js-img-link > img, .img.js-areas > img"}

Отредактировано Kamui (25-08-2012 17:27:28)

Lexx77 · №25

Kamui пишет

Нашел, страницу где фотки не увеличиваются, например такая http://fotki.yandex.ru/contest.xml?id=138 да? или еще вот http://fotki.yandex.ru/search.xml?group … id=4600213. Какие вам нужно?

Да, именно в результатах поиска ничего не увеличивается, да и в пользовательских альбомах мало что..

Вот для поиска на я.фотках - {"r":"fotki\\.yandex\\.ru/search/.*type=image", "q":".js-img-link > img, .img.js-areas > img"}

И всё равно ничего.. :sick: Может это всё-таки от того, что оригиналы фоток там дико большие?
На io.ua усё хорошо. Земной поклон

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