Bendy - A responsive featured content rotating banner (D7) [#1608886]

Overview

Bendy is a fully responsive featured content rotating banner, slider, carousel etc...(whatever you kids are calling it these days).

Bendy is a feature module that creates a turn-key featured content rotating banner using the Views Slideshow module, Client-side Adaptive Image module and some CSS sorcery. The Views Slideshow module is not responsive out of the box and it takes a bit of work to do it. This module does it for you.

Features

Fully responsive (Works well with the Omega - Responsive HTML5 Base Theme)
Fluid resizing for smaller devices (smart phones, iphone) *No more display:none.
Serves images appropriate for device viewport. No more sending large images to small devices.
Images defined by viewport size that can be easily customized to your own specified device breakpoints in the UI. By default it is set the the breakpoints used in the Omega Base Theme.
Support for many transition effects: blindX, blindY, blindZ, cover, curtainX, curtainY, fade, fadeZoom, growX, growY, none, scrollUp, scrollDown, scrollLeft, scrollRight, scrollHorz, scrollVert, shuffle, slideX, slideY, toss, turnUp, turnDown, turnLeft, turnRight, uncover, wipe and zoom.
Minimalist design, so you can easily apply your own css without having to override a ton of $%!@
Powered by jQuery. No Flash. (i.e. Works in iOS devices.)
Works well in IE 6+
Many settings easily customizable in the UI. (transitions, timing, add/remove fields etc..). No coding required.

Requirements

Modules:
Features
Views
Views Slideshow
Client-side adaptive image
Chaos tools
Libraries API

Libraries:
jQuery cycle plugin
json2.js

Installation

Download all required modules and place them in your modules folder
(usually /sites/all/modules).
Download the jQuery cycle plugin (Use Full plugin with all the transition effects. Do not use the jquery.cycle.all.min.js) and place it in a folder called jquery.cycle at sites/all/libraries
(should look like /sites/all/libraries/jquery.cycle/jquery.cycle.all.js
Download json2.js, rename the folder to json2 and place it in sites/all/libraries
(should look like /sites/all/libraries/json2).
Enable module dependencies and Bendy at admin/modules.
Optional: Enable Views UI. This will be required to customize your view.

Motivation

The Views Slideshow module can create a slideshow of pretty much anything. However it doesn't come with anything ready out of the box. To create a Featured content rotating banner, slider, carousel from scratch can be very time-consuming and challenging for new to moderate level users. See http://www.brightwebsitedesign.com/how-to-install-views-slideshow-module...

Goals

To provide a turn-key, fully-responsive featured content rotating banner, slideshow, rotor, carousel for Drupal- An under-supported, but often sought after feature.
To utilize the most flexible tools currently available in Drupal.
To create a highly customizable featured content rotating banner that is completely configurable in the User Interface.

Review of Existing Projects

See wiki: Comparison of Rotator / Slider modules

Why another one? The is a feature that just packages up config and settings of existing modules so one can just plug and play.

Current state

This feature package is currently pretty solid. It is in production use on several sites (that have helped in identifying bugs or feature enhancements). It has been thoroughly tested on Omega, but could probably use some more testing by the community using other responsive base themes. It just needs to be promoted to a full project so others can feel confident in taking it for a test drive.

Project page
Try out a demonstration
git clone --recursive --branch 7.x-1.x http://git.drupal.org/sandbox/nicoz/1538528.git bendy

Comments

Comment #0.0

pixelsweatshop CreditAttribution: pixelsweatshop commented 30 May 2012 at 19:15

Issue summary:

View changes

typos

Comment #0.1

pixelsweatshop CreditAttribution: pixelsweatshop commented 30 May 2012 at 19:16

Issue summary:

View changes

fixed html

Comment #0.2

pixelsweatshop CreditAttribution: pixelsweatshop commented 30 May 2012 at 19:16

Issue summary:

View changes

more html

Comment #1

pixelsweatshop CreditAttribution: pixelsweatshop commented 31 May 2012 at 19:30

Status:

Active

» Needs review

Comment #2

ANDiTKO CreditAttribution: ANDiTKO commented 1 June 2012 at 07:40

Hello nicoz! Great module.

First off the automated tools found some issues with your code. Most of them are very minor but in order to share your module with the Drupal community you will have to follow the Drupal Coding Standards. Check this page to see what are the errors found on your code.

Manual Review:

I have to say that this module is great and it has great potential. Im testing it on my custom omega theme and it works "out of the box". I think you achieved your 3 goals (turn-key solution, flexible and highly customizable). But you can add some tips on customizing the module. (for example tweak the view block fields, change the views slideshow settings, how to add a custom themplate etc...)

Reading your module's code i see that you add the css by "function bendy_init()". As its pointed out here, you better declare the css from the .info file to reduce the server load. When the css compress is enabled from the performance settings, your stylesheet will add few bytes that will have zero impact on the client page loading times. Its better than calling it later and adding a new file request to the browser.

I also want to point out that the responsive images work perfectly. Only the required image is loaded on page request. Some other "responsive" image slieshows load few image sizes at once and then display the required image size. But your module dose it the right way. That saves bandwith and pageloading times by keeping the images requests to the minimum.

So to wrap it up:
1) Fix the coding issues detected by the automated tools
2) Add some more info about customizing the module. (keep in mind that you are providing a turn-key solution and most of the users wont have experience with views slideshow module etc...)
3) Declare your css from the module's ".info" file for better performance.

Hope it helps!

Comment #3

pixelsweatshop CreditAttribution: pixelsweatshop commented 1 June 2012 at 17:32

Thank you for taking the time to review ANDiTKO.

1) Fix the coding issues detected by the automated tools

***Done**

2) Add some more info about customizing the module. (keep in mind that you are providing a turn-key solution and most of the users wont have experience with views slideshow module etc...)

***Done. Added what I think some common customization requests might be in the FAQ section**

3) Declare your css from the module's ".info" file for better performance.

***Done**

Comment #4

jleiva CreditAttribution: jleiva commented 12 June 2012 at 18:52

Hi nicoz, my review so far:

Drupal Code Sniffer has found some issues with your code http://ventral.org/pareview/httpgitdrupalorgsandboxnicoz1538528git
Nice job with the Readme.txt, easy to follow and use.
Module settings works fine, and module works as described.
CSS is declared from the .info, like ANDiTKO recommend

Great module BTW!

Comment #5

pixelsweatshop CreditAttribution: pixelsweatshop commented 12 June 2012 at 19:09

Status:

Needs review

» Reviewed & tested by the community

Thank you for your review jleiva. The issue identified by Drupal Code Sniffer is not an issue with this module. It is an error generated by the features module. See #1340278: Debut Newsletter for a similar find in another project application.

nedjo's comment on that issue:

...many of the issues flagged here appear to be problems in code automatically generated by Features. While it would be good to fix these, that work should be done in the Features module and the various modules that provide exportables. Fixing them in the generated code won't help as the errors will reappear with each new export.

patrcikd's comment on that issue:

As this module contains mostly auto-generated code there was absolute no need to make it follow drupal coding standards (after you re-export it it'll be a mess again - that would be a waste of time). Just make sure your hand-written code follows standarts and everything is OK.

Comment #6

klausi

he/him||they/them

German

🇦🇹 Vienna

CreditAttribution: klausi commented 13 June 2012 at 16:07

Status:

Reviewed & tested by the community

» Needs review

Don't RTBC your own issues.

You have not listed any reviews of other project applications in your issue summary as strongly recommended in the application documentation.

Comment #7

nigelw CreditAttribution: nigelw commented 13 June 2012 at 23:42

Status:

Needs review

» Reviewed & tested by the community

Other than the small issue identified with the Drupal Code Sniffer Calling class constructors must always include parentheses (which is an issue for the features module), I do not see any other issues. It's a feature export with a some CSS tacked on. CSS is nice and clean too. This module works well and will fill a need.