Виджет "Таблица картинок"

Виджет для InstantCMS 2.x

 
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1164
Всем привет!

В дополнении к серии своих постов дополнений для InstantCMS 2.x ( тут и тут) спешу поделиться следующим виджетом - "Таблица картинок".

К сожалению, выложить пример его работы на демосайт у меня пока нет возможности, поэтому постараюсь объяснить "на пальцах"...

Из названия понятно, что виджет выводит ряд картинок в виде таблицы. Картинки динамически меняются с различными анимационными эффектами. Клик по одной из картинок ведет на страницу ее просмотра (photos/view/{id-картинки}) с комментариями и голосованием. Варианты эффектов смены картинок настраиваются в разделе "Опции" виджета. Там же выбирается из какого альбома показывать картинки, а также несколько других параметров.

Установка производится стандартным способом: Панель администрирования → Компоненты → Установить пакет дополнения, затем выбираем заранее скачанный пакет с виджетом и следуем инструкциям по установке. Тут написано немного подробнее.

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

Если у кого есть предложения и пожелания буду рад их выслушать.
Редактировалось: 2 раз (Последний: 18 августа 2014 в 22:57)
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1164
Судя по количеству просмотров и ответов тема либо неинтересна либо непонятно раскрыта.

Я немного обновил стили к виджету: фон картинок не черный, а прозрачный (так ближе к шаблону получается IMHO), но если кто хочет может раскомментировать строку /* background: #000; */. Также добавил обработку hover, чтобы картинки видней подсвечивались, так сказать обратная связь пользователю)) И исправил большой отступ снизу в стандартной обертке виджета.
Файл установки перезалил.

Что из себя представляют рабочие картинки можно посмотреть на видео:
http://www.youtube.com/watch?v=B9U1PkgqjkA
P.S. жду фидбека от потенциальных пользователей =)
Прикрепленные файлы:
imagegridWidgetinstall_4e29a.zip | 29.77 Кб | Скачали: 386
Редактировалось: 3 раз (Последний: 18 августа 2014 в 23:00)
Реклама
cms
Посетитель
small user social cms
Сообщений: 31
Установил на локальный комп. Работают оба варианта. Эффекты показываются, переходы на просмотр фото осуществляются. Всё неплохо.
Осталось непонятным как настраивается вывод количества картинок. При установке виджета в тело страницы а потом в сайдбар, показывается разное их количество. Хотя в опциях ничего не менялось.

Упс... Сейчас добавил фото в альбом, количество отображаемых картинок увеличилось, эффекты работают, но переходы на просмотр картинок не осуществляются. Странно...
После перезапуска сервера и очистки кеша браузера работа виджета было восстановилась. Однако при перемещении виджета в сайдбар опять таже беда - при клике на картинку переход на просмотр фото не происходит. Странно...

И всё же, как настраивается количество выводимых картинок?
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1164
Click:
Осталось непонятным как настраивается вывод количества картинок. При установке виджета в тело страницы а потом в сайдбар, показывается разное их количество. Хотя в опциях ничего не менялось.
По дефолту в теле страницы выводится 21 картинка (3 строки по 7 штук в каждой), а для сайдбара 8 картинок (2 строки по 4 шт). Это для виджета без стандартной обертки, т.е. без заголовка и тела виджета. При этом если картинок в альбоме меньше чем требуется для показа, то количество выводимых уменьшится на требуемое количество строк. Если же картинок очень мало, что даже и одну строку не получается заполнить, то выводится половина строки, но это не совсем красиво смотрится.

Предполагалось, что никому не захочется менять количество выводимых картинок вручную. Функционал заложен, осталось реализовать опции. Если же есть желание, то на данный момент это можно сделать правкой шаблона (файл templates\default\controllers\content\widgets\imagegrid\imagegrid.tpl.php)
внизу в тело скрипта добавляем следующее:
Код PHP:
  1.  
  2. <script type="text/javascript">
  3. $(function() {
  4. $( '#ri-grid' ).gridrotator({
  5.  
  6. w768 : { // в теле страницы
  7. rows : 3, // <- количество строк
  8. columns : 7 // <- количество столбцов (картинок в строке)
  9. },
  10.  
  11. w320 : { // для сайдбара
  12. rows : 2,
  13. columns : 4
  14. },
  15.  
  16. step : <?php echo $step ?>,
  17. maxStep : <?php echo $max_step ?>,
  18. preventClick : true,
  19. animType : <?php echo $animation_type ?>,
  20. animSpeed : <?php echo $animation_speed ?>,
  21. interval : <?php echo $interval ?>,
  22. slideshow : true,
  23. onhover : false,
  24. nochange : []
  25. });
  26.  
  27. });
  28. </script>
  29.  
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1164
Click:
Однако при перемещении виджета в сайдбар опять таже беда - при клике на картинку переход на просмотр фото не происходит. Странно...
Честно говоря очень странно! Выводимые картинки это ссылки на компонент photos/view/<id_картинки>, это можно посмотреть в шаблоне виджета.
Варианта 2: либо неверные ссылки, тогда должен выводить ошибку 404, либо конфликтует компонент фотографий, в этом случае даже не знаю что делать, нужно детально смотреть что и как в вашей системе.
Посетитель
small user social cms
Медаль
Сообщений: 434
еслиб это управление было бы вынесено в меню виджета было бы супер, и было бы воще мега если б из админки также можно было бы задавать размер фоток
http://aksucity.net
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1164
SE7EN, на выходные вынесу в меню опций виджета. А вот с размером картинок не получится. Размер автоматически подстраивается под отведенное пространство по ширине. Т.е. чтобы увеличить размер нужно задать меньшее количество картинок в строке, например не 7 а 6 или 5.
Виджет, как и шаблон инстанта, адаптированный - подстраивается под разрешение экрана =)
Посетитель
small user social cms
Медаль
Сообщений: 278
Val:
Судя по количеству просмотров и ответов тема либо неинтересна либо непонятно раскрыта
Уважемый Val, тема очень интересна и я бы даже купил - но не под вторую ветку...
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1164
ALreD, я присоединился к сообществу не задолго до выхода двойки, решил для себя что буду делать свой проект на ней. Поэтому изучаю что к чему и параллельно выкладываю наработки.
Конечно "движок" еще очень молодой, но довольно перспективный. А с появлением магазина и выходом все новых и новых компонентов и виджетов, он быстро достигнет функционала первой ветки.
Посетитель
small user social cms
Медаль
Сообщений: 278
Val, Ваше решение более чем уважаемо! Но смею заметить, что категорическое большинство реально работающих проектов базируется на первой ветке. И столь интереные решения как Ваше представленное тут, поимело бы интерес намного более широкий, будь оно в двух вариантах. Это просто мысли в слух без попытки навязать Вам мое мнение)
Редактировалось: 1 раз (Последний: 19 августа 2014 в 21:26)
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1164
smile ALreD, как появится достаточно свободного времени обязательно реализую!
Посетитель
small user social cms
Медаль
Сообщений: 238
Val спасибо, красивая и полезная штука!
Поставил на дефолтный шаблон. Обнаружил следующие проблемы:
1. При установке виджета в тело страницы, показывается 2 картинки из альбома, где лежит 4.
При этом страница с картинкой открывается после 5 - 10 кликов.
2. При одновременной установке виджета в тело страницы и сайдбар, в теле страницы отображается 1 картинка (из того же альбома с 4-мя картинками). В сайдбаре виджет вообще не показывается.
3. При удалении виджета из тела страницы, виджет в сайдбаре начинает отображаться, но при этом не работают эффекты,
и при клике на картинку переход на страницу с альбомом не происходит.
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1164
Alexprofi, спасибо за обнаруженные недостатки ))

1. Я уже отвечал в 4 посте, что при малом количестве картинок (а по умолчанию требуется 22 картинки) выводятся не все строки, а только количество строк которые полностью могут быть заполненными картинками. Или же, если картинок очень мало (как раз случай из 4 приведенных вами картинок), то выводится только половина из них (в нашем примере 2 штуки). Это необходимо для того чтобы обеспечить динамичность картинок, они должны менять друг друга. А если вывести все картинки, то менять их будет нечем, они уже все на экране )). Это как раз и получается в приведенной вами 3 проблеме. На экране показываются все картинки, которые нечем менять, и, как-бы, не работают эффекты.
Другое дело, что по логике, как я писал, должно было показываться 2 картинки а не 4! Буду разбираться =)

Почему переход происходит только после 5-10 кликов - не знаю, также нужно будет смотреть и исправлять!
А вот со вторым пунктом, сходу, не все так просто... протестирую дома и посмотрю в чем может быть причина и как это можно допилить...
Посетитель
small user social cms
Сообщений: 31
Val, спасибо за разработку и за подробные объяснения. С настройкой вывода количества картинок всё стало понятно. И по мне так всё прекрасно было бы даже и без управления количеством и размером фоток из админки, хотя по фэн-шую, конечно, лучше с ней.
Однако, главная проблема при тестировании у меня не устраняется - переход на просмотр фото при клике на картинку у меня по-прежнему не происходит. После нескольких удалений и установок виджета заново, виджет сначала работает без проблем, а потом (после добавления картинок либо после переноса в сайдбар или, наоборот, в тело страницы) эта проблема появляется вновь. Переход только иногда происходит при клике на картинку, но по какому-то случайному принципу, после многочисленных кликов на виджет, на разные фотки. Закономерность выявить не удалось.
Alexprofi тоже описал похожую ошибку.

Ссылки в виджете рабочие. Если на картинку кликнуть правой кнопкой и выбрать "Открыть в новом окне", то страница с фото открывается без проблем. Но вот на клик левой кнопой - не реагирует сразу. Иногда только срабатывает сразу, если угадаешь на какое фото нажать. Как в игре в напёрстки )))
Уточню, что виджет тестировался на локальном компе с OpenServer. Чистая установка ICMS 2.1.1 с дефолтным шаблоном. Ни в систему, ни в шаблон никаких правок не вносилось. Других компонентов не устанавливалось.
Задумка виджета хорошая. Очень украшает сайт.
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1164
Виджет доработан в соответствии с пожеланиями. Ошибки исправлены, остался правда косячёк с выводом более 2-х виджетов на одной странице zst Нужно разбираться.
Тема перенесена сюда.
В начало страницы
Предыдущая темаСледующая тема Перейти на форум: