Defaults to CarouselCfg
. Type of the configuration object for this widget.
Creates a new instance of this widget. Please note that you should NOT override this constructor. Instead, override the init method, which is called at the end of the constructor once the instance is created.
The widget configuration to be used for this widget
instance. This widget configuration is usually created on the server by the javax.faces.render.Renderer
for
this component.
Whether autoplay is allowed or not.
Style element with the custom CSS for the carousel.
The configuration of this widget instance. Please note that
no property is guaranteed to be present, you should always check for undefined
before accessing a property.
This is partly because the value of a property is not transmitted from the server to the client when it equals
the default.
Whether the viewport is circular or not.
The DOM element for the container of the carousel that contains items container and buttons.
The DOM element for the content of the carousel that shows the carousel.
Array of registered listeners invoked when this widget is destroyed. You should normally not use modify this directly, use addDestroyListener instead.
Callback used to listen to resize events and adjust the carousel accordingly.
The client-side ID of this widget, with all parent naming containers, such as
myForm:myWidget
. This is also the ID of the container HTML element for this widget. In case the widget needs
multiple container elements (such as Paginator), this may also be an array if IDs.
DOM elements of the LI
indicator of the carousel.
The DOM element for the indicators container of the carousel.
Timeout ID of the timer used for autoplay.
Whether autoplay is allowed or not.
Whether the circular mode is on or not.
Whether the remaining items have been added or not.
Whether the viewport is vertical or not.
The DOM elements for the carousel items.
The DOM element for the item container of the carousel.
The DOM element for the item container of the carousel.
The number of simultaneously visible items.
The jQuery instance of the container element of this widget. In case id is an array, it will contain multiple elements. Please note that some widgets have got not DOM elements at all, in this case this will be an empty jQuery instance.
A CSS selector for the container element (or elements, in case id is an array) of
this widget, This is usually an ID selector (that is properly escaped). You can select the container element or
elements like this: $(widget.jqId)
.
The DOM element for the button to switch to the previous carousel item.
Instant number of how many items will scroll when scrolled.
Instant number of items visible on the carousel viewport.
Old number of items visible on the carousel viewport.
Old number of how many items will scroll when scrolled.
The currently displayed page of carousel items.
The DOM element for the button to switch to the next carousel item.
Array of registered listeners invoked when this widget is refreshed. You should normally not use modify this directly, use addRefreshListener instead.
How many items remaining for the show.
The number of indicators currently in the viewport.
The number of how many items shifted.
The name of the widget variables of this widget. The widget variable can be used to
access a widget instance by calling PF('myWidgetVar')
.
This render method is called by this deferred widget once the widget container has become visible. You may now proceed with widget initialization.
Must be overridden, or an error will be thrown.
Adds a deferred rendering task for the given widget to the queue.
The ID of a deferred widget.
The container element that should be visible.
Callback that is invoked when the widget may possibly have become visible.
Should return true
when the widget was rendered, or false
when the widget still needs to be rendered
later.
Lets you register a listener that is called before the component is destroyed.
When an AJAX call is made and this component is updated, the DOM element is replaced with the newly rendered content. When the element is removed from the DOM by the update, the DOM element is detached from the DOM and all destroy listeners are called. This makes it possible to add listeners from outside the widget code.
If you call this method twice with the same listener, it will be registered twice and later also called twice.
Note that for this to work, you must not override the destroy
method; or if you do, call super
.
Also, after this widget was detached is done, all destroy listeners will be unregistered.
A destroy listener to be registered.
When an AJAX call is made and this component is updated, the DOM element is replaced with the newly rendered content. However, no new instance of the widget is created. Instead, after the DOM element was replaced, all refresh listeners are called. This makes it possible to add listeners from outside the widget code.
If you call this method twice with the same listener, it will be registered twice and later also called twice.
Note that for this to work, you must not override the refresh
method; or if you do, call super
.
Also, after the refresh is done, all refresh listeners will be deregistered. If you added the listeners from
within this widget, consider adding the refresh listeners not only in the init
method, but also again in
the refresh
method after calling super
.
A refresh listener to be registered.
Retrieves whether the backward button is disabled.
backward button is disabled.
Adds the resize event listener to the window.
Sets up all event listeners required by this widget.
Calculates position and visible items and the number of how many items will be scrolled when screen aspect ratio changes then updates current page of the current Carousel widget.
Each widget may have one or several behaviors attached to it. This method calls all attached behaviors for the given event name. In case no such behavior exists, this method does nothing and returns immediately.
A behavior is a way for associating client-side scripts with UI components that opens all sorts of possibilities, including client-side validation, DOM and style manipulation, keyboard handling, and more. When the behavior is triggered, the configured JavaScript gets executed.
Behaviors are often, but not necessarily, AJAX behavior. When triggered, it initiates a request the server
and processes the response once it is received. This enables several features such as updating or replacing
elements dynamically. You can add an AJAX behavior via
<p:ajax event="name" actionListener="#{...}" onstart="..." />
.
The name of an event to call.
Additional configuration that is passed to the AJAX request for the server-side callback.
Scrolls the item container based on the total number of shifted items
total number of shifted items.
Clones items if the carousel widget is circular
Creates responsive styles of the carousel container.
Cleans up deferred render tasks. When you extend this class and override this method, make sure to call
super
.
Retrieves the first index of visible items.
first index of the visible items.
Retrieves whether the forward button is disabled.
forward button is disabled.
Each widget may have one or several behaviors attached to it. This method returns the callback function for the given event.
Note: Do not call the method directly, the recommended way to invoke a behavior is via callBehavior.
A behavior is a way for associating client-side scripts with UI components that opens all sorts of possibilities, including client-side validation, DOM and style manipulation, keyboard handling, and more. When the behavior is triggered, the configured JavaScript gets executed.
Behaviors are often, but not necessarily, AJAX behavior. When triggered, it initiates a request the server
and processes the response once it is received. This enables several features such as updating or replacing
elements dynamically. You can add an AJAX behavior via
<p:ajax event="name" actionListener="#{...}" onstart="..." />
.
The name of an event for which to retrieve the behavior.
The behavior with the given name, or null
if no such behavior
exists.
Each widget has got a container element, this method returns that container. This container element is usually also the element whose ID is the client-side ID of the JSF component.
The jQuery instance representing the main HTML container element of this widget.
Gets the closest parent form for this widget.
A JQuery instance that either contains the form when found, or an empty JQuery instance when the form could not be found.
Gets the closest parent form ID for this widget lazily so it can be used in AJAX requests.
Either the form ID or undefined
if no form can be found.
Retrieves the total number of the indicators floor to 0 so it can't be negative.
total number of the indicators.
Each widget may have one or several behaviors attached to it. This method checks whether this widget has got at least one behavior associated with given event name.
A behavior is a way for associating client-side scripts with UI components that opens all sorts of possibilities, including client-side validation, DOM and style manipulation, keyboard handling, and more. When the behavior is triggered, the configured JavaScript gets executed.
Behaviors are often, but not necessarily, AJAX behavior. When triggered, it initiates a request the server
and processes the response once it is received. This enables several features such as updating or replacing
elements dynamically. You can add an AJAX behavior via
<p:ajax event="name" actionListener="#{...}" onstart="..." />
.
The name of an event to check.
true
if this widget has the given behavior, false
otherwise.
A widget class should not declare an explicit constructor, the default constructor provided by this base widget should be used. Instead, override this initialize method which is called after the widget instance was constructed. You can use this method to perform any initialization that is required. For widgets that need to create custom HTML on the client-side this is also the place where you should call your render method.
Please make sure to call the super method first before adding your own custom logic to the init method:
PrimeFaces.widget.MyWidget = PrimeFaces.widget.BaseWidget.extend({
init: function(cfg) {
this._super(cfg);
// custom initialization
}
});
The widget configuration to be used for this widget instance.
This widget configuration is usually created on the server by the javax.faces.render.Renderer
for this
component.
Initialize current page and variables.
Checks if this widget is detached, ie whether the HTML element of this widget is currently contained within the DOM (the HTML body element). A widget may become detached during an AJAX update, and it may remain detached in case the update removed this component from the component tree.
true
if this widget is currently detached, or false
otherwise.
Retrieves the last index of visible items.
last index of the visible items.
Moves this carousel to the previous page. If autoplay is active, it will stop.
Event that occurred.
0-based index of the page to display.
Moves this carousel to the next page. If autoplay is active, it will stop.
Event that occurred.
0-based index of the page to display.
It moves the current Carousel to the index of the clicked indicator on that Carousel viewport.
Event that occurred.
0-based index of the indicator.
Changes current page according to the state of the page when the transition ends.
Called after the widget has become visible and after it was rendered. May be overridden, the default implementation is a no-op.
Used in ajax updates, reloads the widget configuration.
When an AJAX call is made and this component is updated, the DOM element is replaced with the newly rendered content. However, no new instance of the widget is created. Instead, after the DOM element was replaced, this method is called with the new widget configuration from the server. This makes it possible to persist client-side state during an update, such as the currently selected tab.
Please note that instead of overriding this method, you should consider adding a refresh listener instead via addRefreshListener. This has the advantage of letting you add multiple listeners, and makes it possible to add additional listeners from code outside this widget.
By default, this method calls all refresh listeners, then reinitializes the widget by calling the init
method.
The new widget configuration from the server.
The value as returned by the init
method, which is often undefined
.
Removes the widget's script block from the DOM. Currently, the ID of this script block consists of the
client-side ID of this widget with the prefix _s
, but this is subject to change.
The client-side ID of the widget.
This render method to check whether the widget container is visible. Do not override this method, or the deferred widget functionality may not work properly anymore.
true
if the widget container is visible, false
or
undefined
otherwise.
Retrieves the indicators html of the carousel.
html of the indicators container.
Enables autoplay and starts the slideshow.
Moves this carousel to the given page.
direction of the move and takes a value of -1 or 1.
0-based index of the page to display.
Disables autoplay and stops the slideshow.
Styles visible items
Applies styles to the clones
cloned dom element of the item
index of the element
length of the clones
Render the indicators based on the current page state.
Update styles of the navigator buttons.
Updates the current page of the carousel.
Generated using TypeDoc
PrimeFaces Carousel Widget Carousel is a content slider featuring various customization options.