-
29 Apr 2009 5:46 AM #1
difficulties with the carousel ext.
difficulties with the carousel ext.
Hey,
I just discovered the carousel extension http://extjs.com/playpen/ext-core-latest/examples/carousel/ and tried to integrate it into my website. Unfortunately I was only partly successful.
I am already using ext 2.2. I additionally included the ext-core-debug.js of 3.0 and carousel.js, but it told me ext.ux.carousel is not a constructor.
Then I tried to use it only with the ext-all.js of 2.2 and the carousel.js and deleted the 3.0 core stuff.
It partly works.
autoPlay works, but there is no navigation bar dropping down of the header.
Is it a javascript problem or is it a css problem? I mean, should I use 3.0 and 2.2 together btw would it make sense to do that anyway?Code:new Ext.ux.Carousel('simple-example', { itemSelector: 'img', interval: 3, autoPlay: true, showPlayButton: true, pauseOnNavigate: true, freezeOnHover: true, transitionType: 'easeIn', navigationOnHover: true }) };
Another thing i discovered is, the images get listed below each other like this:At my site, the javascript comes, lets say, a second delayed after the html. So the user can see the images ordered below each other at first and then javascript comes, puts the images into the gallery box and the whole look of the page gets altered.Code:<img> <img> <img>
How would u solve it? set all images to display none and switch it to block, after the gallery is rendered?
thx for help in advance
tobi
-
29 Apr 2009 5:49 AM #2Sencha - Community Support Team
- Join Date
- Mar 2007
- Location
- Frederick MD, NYC, DC
- Posts
- 16,170
- Vote Rating
- 33
3.0 and 2.2? What?
no!
There can only be one Ext namespace.
do you have a public example?
Ext 3.0 Core is not Ext JS 3.0!
Jay Garcia @ModusJesus || Modus Create co-founder
Ext JS in Action author
Sencha Touch in Action author
Get in touch for Ext JS & Sencha Touch Touch Training
We are also working on Video-based Sencha Touch training: Check it out here.
-
29 Apr 2009 5:59 AM #3
tobi
do you include the carousel.css file?Javier Rincón aka SysCobra
-
29 Apr 2009 6:09 AM #4
There is only ext-base.js at the moment, no 3.0 core.
the carousel.css is copied in my local stylesheet.
it works, but there is no navigation bar on top. the slideshow works
-
29 Apr 2009 9:39 AM #5Sencha - Community Support Team
- Join Date
- Mar 2007
- Location
- Frederick MD, NYC, DC
- Posts
- 16,170
- Vote Rating
- 33
OK, what would you expect? it was built using Ext3-core.
i don't understand why this is an issue?
Jay Garcia @ModusJesus || Modus Create co-founder
Ext JS in Action author
Sencha Touch in Action author
Get in touch for Ext JS & Sencha Touch Touch Training
We are also working on Video-based Sencha Touch training: Check it out here.
-
29 Apr 2009 11:53 AM #6
Hello,
Respectfully, I have this same issue.
Basically, I would like to use the Ext Core 3 beta carousel on an exsting ExtJS2.2 page.
Specifically, within a Ext.TabPanel and Ext.Viewport Borderlayout.
Unfortunately, what it sounds like is that this is not possible because:
1. Core 3 beta - because not all widgets are included in Core. Or, in...
2. ExtJS2.2.1 - because the carousel was built on core3.
Is there a best-case solution for either...
A. backward-compatability?
B. forward-compatability?
Thanks.
-
29 Apr 2009 2:10 PM #7
You seem to be missing the point of what Ext Core is.
It's not an add-on that you can mix-match with 2.x code. It's a subset of the full Ext 3.0 API, that's not intended to have any widgets. Almost all the code in Ext Core exists in Ext 2.x, although refactored somewhat to be standalone and have a smaller footprint.
Carousel is just a little demo of using some of core functionality - it's not intended to be a fullblown widget. I highly doubt that it's going to be backported to 2.x by Ext staff.
The upgrade path from 2.x is not Ext Core, it's Ext 3.0. Ext Core is intended for use on a site where you don't need the weight of the entire Ext 3.0 package.Tim Ryan
Read BEFORE posting a question / BEFORE posting a Bug
Use Google to Search - API / Forum
API Doc (4.x | 3.x | 2.x | 1.x) / FAQ / 1.x->2.x Migration Guide / 2.x->3.x Migration Guide
-
29 Apr 2009 8:39 PM #8
OK just checked and it doesn't work because Ext 2.2 doesn't have the events 'mouseenter' and 'mouseleaves'. This is to get the underlaying components of the container including the navigation panel. If you change them to the 'mouseover' and 'mouseout' (the ones that Ext 2.2 has) then you cant click the panel because when the mouse go to the navigation the container receives the 'mouseout' event and the navigation panel hides.
This only happens if you put freezeOnHover or navigationOnHover to true. Guess you can use it with the always show the navigation panel and without freezing the animation on enter. As in the other examples. (people can always click on stop and go one by one as they like and click play again to start playing).Javier Rincón aka SysCobra
-
29 Apr 2009 10:55 PM #9
That means, that if I wait for the Ext JS 3.0 final release, I will be able to use everything that I used of 2.2 and additionally the 3.0 core, because 3.0 core is already part of Ext JS 3.0?!It's a subset of the full Ext 3.0 API, that's not intended to have any widgets.
-
30 Apr 2009 2:49 AM #10Sencha - Community Support Team
- Join Date
- Mar 2007
- Location
- Frederick MD, NYC, DC
- Posts
- 16,170
- Vote Rating
- 33
yes.

Jay Garcia @ModusJesus || Modus Create co-founder
Ext JS in Action author
Sencha Touch in Action author
Get in touch for Ext JS & Sencha Touch Touch Training
We are also working on Video-based Sencha Touch training: Check it out here.


Reply With Quote