PDA

View Full Version : Ext.ux.Tutorial



mitchellsimoens
10 Nov 2009, 1:28 PM
A simple extension to display different steps.

I wanted something like this instead of having a static HTML page.

UPDATE!!!!!!!!!!!!!!!!!!!!!!!
When on the first "step", instead of disabling the "Prev Step" button, it will hide it and display a "Cancel" button which can be configured to do as you want. Default is that it will just close the window. Also, when on the last "step", instead of disabling the "Next Step" button, it will hide it and display a "Finish" button which can be configured to do as you want. Default is Ext.emptyFn.

Demo is here (http://www.simoens.org/projects/Tutorial/)

mitchellsimoens
10 Nov 2009, 2:12 PM
i am not sure if it is any easier.

I have been following some tutorials on quite a bit of things and personally I'd like to see one step at a time and in a nice looking interface.

This is a personal project that took me a couple hours to get off the ground. Some polishing sure but it's working in it's current state. If others find it useful then great. If no one else uses it, ok.

coolstar
24 Jan 2010, 10:04 AM
This Extension seems to be neat! You could have it change the button of "Prev Step" to Cancel, instead of disabling it, and have a config option of what to trigger on cancel. Similarly, you could also change the button of "Next Step" to Finish, instead of disabling that too, and also have a config option of what to trigger on Finish. I might be able to make those modifications, but I will tell you if I fail.

mitchellsimoens
24 Jan 2010, 8:37 PM
@coolstar
The changes you asked for... cancel button instead of a disabled previous button and finish button instead of a disabled next button has been completed! Also, the functions for the cancel button and finish button can be configured with whatever you wish.

Check out the demo's source to see how to configure it, it's really easy!

coolstar
25 Jan 2010, 7:30 AM
This is the error it reports:
Expected identifier, string or number.

Works fine in Firefox, Chrome, Safari, and Opera.

mitchellsimoens
25 Jan 2010, 7:42 AM
Ugh... and the line numbers it gives, one is a bracket and a comma... the other is when you first initiate the component.... stupid IE!

mitchellsimoens
25 Jan 2010, 7:56 AM
It was an extra comma int he layoutConfig... it's fixed and working in IE too now!

javaman
11 Feb 2010, 10:48 PM
Well, I can't see the top of the panel, in IE and firefox 3.5

[]'s

EDIT

Is it possible to load the html content from an archive?
And is it possible to load pictures?

Please, put an archive to download the plugin.

[]'s

javaman
21 Feb 2010, 2:32 PM
bump, ideas?

mitchellsimoens
23 Feb 2010, 8:38 AM
I can't seem to replicate what you are seeing. I have taken 3 screenshots of IE, FF, and Chrome.

javaman
23 Feb 2010, 9:09 AM
I hava just open the demo on IE, Chrome and FF 3.6 and got the error in all oO

screenshot added

mitchellsimoens
23 Feb 2010, 9:55 AM
lol awesome!

Any errors from any dev console?

javaman
23 Feb 2010, 12:00 PM
man, I tried firebug and nothing appears oO

can you make a donwload file and upload to test?

[]'s

mitchellsimoens
24 Feb 2010, 8:03 AM
Here ya go.

javaman
24 Feb 2010, 8:37 AM
well, there's something strange with the width and height properties of thw window

I guess it larger than the browser can show

if I change then to 400 x 400, for example, it shows correctly

[]'s

mitchellsimoens
24 Feb 2010, 8:39 AM
So the defaults in the Ext.ux.Tutorial.js file is too large you're saying

javaman
24 Feb 2010, 8:40 AM
yeah, that's it

I changed the width and heigth there and everythings works fine :)

maybe rendering the window in a div could solve the problem too

[]'s

mitchellsimoens
24 Feb 2010, 8:41 AM
guess I'm running a lot higher of a resolution than you so I wouldn't see that. Well at least the code isn't broken, just a config option... at least so far lol

I'll change the online demo

javaman
24 Feb 2010, 8:51 AM
yeah, probaby that's it, mine is 1280 x 800 on a 13.3" screen because I'm on a laptop
I opened on a desktop and everything works fine, the problem is exactly that

and great that the code isn't broken, I will use it :)

[]'s

jsakalos
21 Sep 2010, 5:06 PM
FYI, demo at http://www.simoens.org/projects/Tutorial/ doesn't work. Error is "Cannot find variable Ext".

mitchellsimoens
21 Sep 2010, 7:13 PM
FYI, demo at http://www.simoens.org/projects/Tutorial/ doesn't work. Error is "Cannot find variable Ext".

All fixed. Not too sure what the code really looks like as it was one of my first...