Карусель новых пользователей на jquery

1530
Для одного из моих проектов, ссылку к сожалению пока дать не могу)), необходим был модуль последних зарегистрированных пользователей, которые бы при помощи jquery пролистывались бы в виде карусели.

В результате моих усилий и изучении новых (первых!) азов программирования получился модуль.
В принципе то что мне нужно было сделать я сделал. Вот пример с минимальной версткой http://sasovo.net/sitemap

модуль также выводит город и возраст. Посмотреть можете на примере пользователя kkkkk.
Модуль работает как на 1.8 так и на 1.9

Настроек из админки модуль не имеет, да мне они и не нужны были.

Инструкция по установке (она есть в архиве в файле README)

Внимание, инструкция для шаблона по умолчанию _default_, для другого шаблона необходимо исправить пути к скриптам

Для начала скачиваем и распаковываем архив.

1. Из файла SQL.txt копируем текст и выполняем запрос к базе данных.


2. Папки modules и templates целиком копируем в корень сайта.


3. В файле template.php вашего шаблона перед тегом </head> вставляем следующий код.


Код PHP:
<link href="/templates/_default_/skins/tango/skin.css" rel="stylesheet" type="text/css" />
	
	
<script src="/templates/_default_/lib/jquery-1.4.2.min.js" type="text/javascript"></script>
	
<script src="/templates/_default_/lib/jquery.jcarousel.min.js" type="text/javascript"></script>
	
	

<script type="text/javascript">



function mycarousel_initCallback(carousel)
{
    
// Disable autoscrolling if the user clicks the prev or next button.
    

carousel.buttonNext.bind('click', function() {
        
carousel.startAuto(0);
    
});

    

carousel.buttonPrev.bind('click', function() {
        
carousel.startAuto(0);
    
});

    

// Pause autoscrolling if the user moves with the cursor over the clip.
    

carousel.clip.hover(function() {
        
carousel.stopAuto();
    }, 
function() {
        
carousel.startAuto();
    
});

};



jQuery(document).ready(function() {
    
jQuery('#mycarousel').jcarousel({
        
auto: 2,
       
wrap: 'circular',
        
initCallback: mycarousel_initCallback
    
});

});



</script>

4. Заходим в админку, находим модуль Новые регистрации и отображаем его там, где нужно.


Собственно сам архив - СКАЧАТЬ
Модуль аккардион статей
Комментарии (32)
Rossoman 23 ноября 2011 в 22:42 +7
Я думаю через несколько дней наверное еще пару модулей появятся. Может пригодятся кому. А вообще в планах разработка компонента голосований, не модуль как есть, а именно компонент.
lezginka.ru 23 ноября 2011 в 23:26 +3
+
Rossoman ,а может компонент "викторины" ;)
Rossoman 23 ноября 2011 в 23:27 +4
Ну я примерно это и имел ввиду)
lezginka.ru 24 ноября 2011 в 01:12 +2
я готов даже готов купить , если цена не кусается :)
Алексей Тимофеев 24 ноября 2011 в 01:41 -1
я тоже готов купить...
Rossoman 24 ноября 2011 в 01:44 +3
Может тогда есть смысл ТЗ сформировать?
lezginka.ru 24 ноября 2011 в 01:45 +2
готов по-участвовать в тз
lezginka.ru 24 ноября 2011 в 01:49 +2
может на обсуждение вынести ТЗ ?
Алексей Тимофеев 24 ноября 2011 в 08:23 -1
Выноси я поддержу и народ подтянется
lezginka.ru 24 ноября 2011 в 10:09 +1
BilarИuss , я в личку скинул
energy74 29 ноября 2011 в 19:39 0
Поставил, работает все отлично, но почему-то разворотило модуль рейтинг пользователей. увеличились аватары, текст уехал вправо. подскажите как можно это исправит
Rossoman 30 ноября 2011 в 09:11 0
У меня все нормально http://sasovo.net/sitemap
Дайте ссылку посмотреть
lezginka.ru 23 ноября 2011 в 23:26 +2
не увидел стрелок слева-справа
Rossoman 23 ноября 2011 в 23:37 +2
Стрелки были, но я их удалил за ненадобностью в моем проекте. Если очень нужно, то впринципе можно их вернуть.
Rossoman 23 ноября 2011 в 23:49 +2
Стрелки вернул. Осталось их только отверстать под свои нужды. Чтобы отображались стрелки, нужно в файле skin.css в папке /skins/tango (в этой же папке и картинки стрелок) в самый конец добавить эти стили
Код PHP:
/**
 *  Horizontal Buttons
 */
.jcarousel-skin-tango .jcarousel-next-horizontal {
    position: absolute;
    top: 43px;
    right: 5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(next-horizontal.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-next-horizontal {
    left: 5px;
    right: auto;
    background-image: url(prev-horizontal.png);
}

.jcarousel-skin-tango .jcarousel-next-horizontal:hover {
    background-position: -32px 0;
}

.jcarousel-skin-tango .jcarousel-next-horizontal:active {
    background-position: -64px 0;
}

.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal {
    position: absolute;
    top: 43px;
    left: 5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(prev-horizontal.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-prev-horizontal {
    left: auto;
    right: 5px;
    background-image: url(next-horizontal.png);
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:hover {
    background-position: -32px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:active {
    background-position: -64px 0;
}

.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}

/**
 *  Vertical Buttons
 */
.jcarousel-skin-tango .jcarousel-next-vertical {
    position: absolute;
    bottom: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(next-vertical.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-next-vertical:hover {
    background-position: 0 -32px;
}

.jcarousel-skin-tango .jcarousel-next-vertical:active {
    background-position: 0 -64px;
}

.jcarousel-skin-tango .jcarousel-next-disabled-vertical,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}

.jcarousel-skin-tango .jcarousel-prev-vertical {
    position: absolute;
    top: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(prev-vertical.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-prev-vertical:hover {
    background-position: 0 -32px;
}

.jcarousel-skin-tango .jcarousel-prev-vertical:active {
    background-position: 0 -64px;
}

.jcarousel-skin-tango .jcarousel-prev-disabled-vertical,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}
На примере тоже обновил, стрелки сейчас есть, но только без нужного оформления и на картинки наезжает, но это уже дело в верстке...
Михаил 24 ноября 2011 в 00:16 +1
отлично то что нужно
imprint 24 ноября 2011 в 11:57 +1
Прикольная штука, но с табами в профиле конфликт...
Rossoman 24 ноября 2011 в 12:06 +1
Странно только что проверил на своем сайте, у меня нет никакого конфликта. Все нормально работает
Edik_Salonikski 24 ноября 2011 в 13:16 +1
да и у меня конфликт с табами.в профиле
Edik_Salonikski 24 ноября 2011 в 13:22 +1
не только табы но и лента в профиле слетает!!
Rossoman 24 ноября 2011 в 14:46 +1
Поставил 1.9 с нуля на девфолтном шаблоне действительно происходит конфликт с этим
<script src="/templates/_default_/lib/jquery-1.4.2.min.js" type="text/javascript"></script>

Как разберусь скажу...
Rossoman 24 ноября 2011 в 14:55 +1
Кстати попробуйте просто удалить эту строку, у меня и без нее работает!!!
Rossoman 24 ноября 2011 в 14:56 +1
И соотв. никакого конфликта не происходит
Edik_Salonikski 24 ноября 2011 в 15:09 +1
все отлично убрал строку .все отлично работает.спасибо!!!
imprint 24 ноября 2011 в 15:34 +1
вопрос....где указывать количество объектов?
Rossoman 24 ноября 2011 в 15:57 +1
Только в БД. newscount: 10
Соответственно число это количество объектов для отображения. Я делал модуль для своего проекта и мне настройки не нужны были, поэтому все просто. Может если время будет прикручу настройки к модулю, но пока я занят другим модулем интересным, который тоже на днях выложу, может даже сегодня.
imprint 24 ноября 2011 в 16:37 +1
окей....понял....спасибо....+++++
Rossoman 24 ноября 2011 в 16:40 +1
Этот вариант будет выводить больше пользователей в карусели. Но число отображаемых одновременно остается прежним. Что бы изменить число отображаемых, то для этого достаточно всего лишь изменить ширину модуля.
джин 24 ноября 2011 в 16:06 +1
+
imprint 24 ноября 2011 в 19:10 +1
а пользователь после регистрации сразу не попадает в карусель? потому что человек зарегестрировался 20 минут назад...его ещё нет в карусели....а человек который 4 часа назад зарегился...есть...
Zau4man 24 ноября 2011 в 21:39 0
Возможно включено кэширование модуля? и человек попадает в модуль после обновления кэша, что логично...
Rossoman 25 ноября 2011 в 14:26 +1
Дело было не в кешировании. Поправил файл module.php, теперь все работает, сейчас обновлю архив. Кому не хочется качать архив, ниже код. Его нужно заменить целиком на код в файле module.php
Код PHP:
<?php

    function mod_newreg($module_id){
        $inCore = cmsCore::getInstance();
        $inDB = cmsDatabase::getInstance();
        global $_LANG;

		$cfg = $inCore->loadModuleConfig($module_id);

		$sql = "SELECT u.*, p.imageurl, p.city, birthdate,(YEAR(CURRENT_DATE)-YEAR(birthdate))-(RIGHT(CURRENT_DATE,5)<RIGHT(birthdate,5))AS age 
		FROM cms_users u
		LEFT JOIN cms_user_profiles p ON p.user_id = u.id
		WHERE u.is_deleted = 0 AND u.is_locked=0
		ORDER BY u.regdate DESC
		LIMIT ".$cfg['newscount']."
		";	
		
		$result = $inDB->query($sql) ;
		

		
		$is_last_reg = false;
		
		
		
		if ($inDB->num_rows($result)){	
			
			$is_last_reg = true;
			$usrs = array();

			
			if ($cfg['view_type']=='table' || $cfg['view_type']=='hr_table'){
				if (!function_exists('usrImageNOdb')){ //if not included earlier
				include_once(PATH.'/components/users/includes/usercore.php');
				}	
				while($usr = $inDB->fetch_assoc($result)){
					$usr['avatar'] = usrImageNOdb($usr['id'], 'small', $usr['imageurl'], $usr['is_deleted']);
					$usrs[] = $usr;
					

					
				}
			}
			
			if ($cfg['view_type']=='list'){
				$total = $inDB->num_rows($result);
				while($usr = $inDB->fetch_assoc($result)){				
					$usrs[] = $usr;
				}
				$total_all = $inDB->rows_count('cms_users', 'is_deleted=0 AND is_locked=0');
				}
			}
			
		
		
		$smarty = $inCore->initSmarty('modules', 'mod_newreg.tpl');			
		$smarty->assign('usrs', $usrs);
		$smarty->assign('cfg', $cfg);
		if ($cfg['view_type']=='list'){
			$smarty->assign('total', $total);
			$smarty->assign('total_all', $total_all);
		}
		$smarty->assign('is_last_reg', $is_last_reg);
		$smarty->display('mod_newreg.tpl');	
				
		return true;
	
	}
?>