' . t('The jCarousel module provides the ability to create carousel-style lists such as those included on this page. The jCarousel module includes integrations with other Drupal modules, but may also be used manually within your own theme or custom modules. It does not include any site-wide settings page or options, each carousel is separately configured.') . '
'; $output .= ''; $output .= t('Most configuration options for the jCarousel module are provided through Views module.'); if (module_exists('views_ui')) { $output .= ' ' . t('You may configure a new view through the Views module interface. After adding a new view, change its "Display style" to "jCarousel" and configure the remaining options there. When using the jCarousel display style with Views, you can construct any of the examples on this page as well as dynamically loaded carousels through AJAX requests.', array('!views-url' => url('admin/structure/views'))); } else { $output .= ' ' . t('This site not have Views (or the Views UI module) installed currently. You may be able to turn on this module under your site\'s module page, or you may have to download Views module and install it.', array('!modules-url' => url('admin/build/modules'))); } $output .= '
'; $output .= '' . t('The following are demonstrations of jCarousel module when used directly by another module or your theme. Most users do not need to manually code carousels (building carousels using Views is the most common approach), but these demonstrations provide good examples of jCarousel\'s abilities.') . '
'; // Construct the jCarousel list. $list = '
' . t('This example uses jcarousel_add() directly with no options to create the default horizontal carousel.') . '
' . check_plain($list_html) . '
' . t('jCarousel can accept a variety of configuration options via the second argument to jcarousel_add(). In this example, we created a vertical carousel.') . '
' . check_plain($list_html) . '
' . t('The "skin" of a carousel can be changed by setting the $options[\'skin\'] property. This skin must match one of the skins either provided by a module or matching a skin included in your theme\'s style.css file. Skins are simply a class given to the HTML list with the name "jcarousel-skin-[skin-name]". A custom skin path may be specified in $options[\'skin path\'], or you can use one of these module-based skins:') . theme('item_list', array('items' => array_keys(jcarousel_skins()))) . t('Note that with skins you will often need to override certain CSS styles in your theme\'s style.css file. Certain properties (like the height and width of individual items and the carousel itself) must be manually specified directly in CSS. Not using a skin at all by specifying $options[\'skin\'] = NULL and then styling the entire carousel in style.css is also a good approach.') . '
' . check_plain($list_html) . '
' . t('The theme(\'jcarousel\') function allows you to easily create the markup and add all the JavaScript to the page in one function call. Like jcarousel_add() the theme function approach can also take options. In this example we create the carousel with the button next event being called when the mouse rolls over the buttons.') . '
',
'',
'',
'',
'',
'',
'',
'',
'',
'',
);
$options = array(
'buttonNextEvent' => 'mouseover',
'buttonPrevEvent' => 'mouseover',
);
$fieldset['#description'] = t('The following PHP code may be placed in a template file or a module to create a carousel.');
$sample = $fieldset;
$sample['#children'] = highlight_string(" \$items, 'options' => \$options));\n?>", TRUE);
$output .= drupal_render($sample);
$output .= theme('jcarousel', array('items' => $items, 'options' => $options));
// Provide a circular wrap element.
$output .= '' . t('This example puts the carousel into a circular wrap.') . '
'; $options = array( 'wrap' => 'circular', ); $sample = $fieldset; $sample['#children'] = highlight_string(" \$items, 'options' => \$options));\n?>", TRUE); $output .= drupal_render($sample); $output .= theme('jcarousel', array('items' => $items, 'options' => $options)); return $output; } } /** * Implements hook_menu(). */ function jcarousel_menu() { $items['jcarousel/ajax/views'] = array( 'page callback' => 'jcarousel_views_ajax', 'access callback' => TRUE, 'file' => 'includes/jcarousel.views.inc', 'type' => MENU_CALLBACK, ); return $items; } /** * Implementation of hook_init(). */ function jcarousel_init() { // Global JS settings required for all carousels. drupal_add_js(array('jcarousel' => array('ajaxPath' => url('jcarousel/ajax/views'))), 'setting'); } /** * Implements hook_theme(). */ function jcarousel_theme() { return array( 'jcarousel' => array( 'variables' => array('items' => NULL, 'options' => NULL, 'identifier' => NULL), ), ); } /** * Implements hook_views_api(). */ function jcarousel_views_api() { return array( 'api' => 2.0, 'path' => drupal_get_path('module', 'jcarousel') . '/includes', ); } /** * Implements hook_jcarousel_skin_info(). */ function jcarousel_jcarousel_skin_info() { $skins = array(); $skins['default'] = array( 'title' => t('Default'), 'file' => 'skins/default/jcarousel-default.css', ); $skins['tango'] = array( 'title' => t('Tango'), 'file' => 'skins/tango/jcarousel-tango.css', ); return $skins; } /** * Adds all the necessary CSS and JS necessary for building a carousel. * * @param $class_name * (optional) The class on the UL list to identify this carousel. If ommitted, * only the jCarousel library will be added to the page. * @param $options * (optional) A list of settings to be passed to jCarousel. * @param $add * Whether to add the JavaScript and CSS to the page with drupal_add_js(). * @return * An array of JS and CSS files, suitable for inclusion as an #attached array. */ function jcarousel_add($class_name = NULL, $options = array(), $add = TRUE) { static $library_added; // Add the jCarousel library and any global settings. $attachments = array( // TODO: Change this to 'library' in Drupal 7. 'js' => array( drupal_get_path('module', 'jcarousel') . '/js/jquery.jcarousel.min.js', drupal_get_path('module', 'jcarousel') . '/js/jcarousel.js', ), ); if (isset($class_name)) { // Set default options. $options += array( 'skin' => 'default', 'selector' => '.' . $class_name, ); // Allow other modules to modify these settings. drupal_alter('jcarousel_options', $options, $class_name); // Add settings for this individual carousel. if (!isset($library_added[$class_name]) || !$add) { $library_added[$class_name] = TRUE; // Add the JavaScript settings for this carousel. $js_settings = array( 'jcarousel' => array( 'carousels' => array( $class_name => $options, ), ), ); $attachments['js'][] = array( 'type' => 'setting', 'data' => $js_settings, ); } } // Add the skin for this carousel. if (!empty($options['skin'])) { // A custom skin path is possible but generally discouraged because it's // difficult to give it a human-readable name or reference the CSS file. if (isset($options['skin path'])) { $attachments['css'][] = $options['skin path']; } // The more common situation is to use a skin defined by another module // in hook_jcarousel_skin_info(). elseif (($skins = jcarousel_skins()) && isset($skins[$options['skin']])) { $skin = $skins[$options['skin']]; $attachments['css'][] = $skin['file path'] . '/' . $skin['file']; } } // If adding directly to the page, loop through our attachments and add them. if ($add) { foreach ($attachments as $type => $type_list) { $drupal_add_type = 'drupal_add_' . $type; foreach ($type_list as $attachment) { if (is_array($attachment)) { $drupal_add_type($attachment['data'], $attachment['type']); } else { $drupal_add_type($attachment); } } } } return $attachments; } /** * Retrieves a list of all available Carousel skins. */ function jcarousel_skins() { static $skins; // Don't rebuild if we already have a list of skins. if (isset($skins)) { return $skins; } // Build a list of skins from other modules. $skins = array(); foreach (module_implements('jcarousel_skin_info') as $module) { $function = $module . '_jcarousel_skin_info'; $module_skins = $function(); foreach ($module_skins as $key => $skin) { $skin['module'] = $module; $skin['file path'] = isset($skin['file path']) ? $skin['file path'] : drupal_get_path('module', $module); $skin['title'] = isset($skin['title']) ? $skin['title'] : $key; $skins[$key] = $skin; } } ksort($skins); return $skins; } /** * Creates a jCarousel element on the page. * * @param $items * The items to appear in the carousel. * @param $options * The arguments to apply to the selected element when creating the jCarousel. * The arguments are passed through as an associative array using the * jCarousel configuration options: * http://sorgalla.com/projects/jcarousel/#Configuration * * The special option "skin" may also be specified to use any skin provided * by jcarousel_skins() and hook_jcarousel_skin_info(). * @param $id * An ID for this carousel. If not provided, one will be generated * automatically. Note that this is not the "id" attribute on the HTML list, * instead it is one of the classes added to the UL tag. */ function theme_jcarousel($variables) { $items = $variables['items']; $options = $variables['options']; $identifier = $variables['identifier']; static $unique; if (!isset($identifier)) { $unique = isset($unique) ? $unique + 1 : 1; $identifier = 'jcarousel-id-' . $unique; } $options['skin'] = array_key_exists('skin', $options) ? $options['skin'] : 'default'; jcarousel_add($identifier, $options); $classes = 'jcarousel ' . $identifier; if (!empty($options['skin'])) { $classes .= ' jcarousel-skin-' . $options['skin']; } $output = '