Carousel Action

Jeff2 · February 25, 2008, 2:42pm

Hi Walt
I really appreciate your work on this action. It’s great (in FW5 beta,
too).
Is it possible to link into a particular pane of a carousel (other
than the top one, which shows by default) from another page?
Thanks

jeff
message design

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

waltd · February 25, 2008, 2:51pm

It should just work if you use an anchor, named for the ID of the
pane you wish to see first. Note that the page will scroll to the top
of the carousel if the page is taller than the window.

I have hacked this in the past to make it possible to use a
querystring for this purpose (which gets around the page scrolling
business), but it’s a tricky thing, and not possible directly in the
Action version of the script.

Walter

On Feb 25, 2008, at 9:42 AM, Jeff wrote:

Hi Walt
I really appreciate your work on this action. It’s great (in FW5 beta,
too).
Is it possible to link into a particular pane of a carousel (other
than the top one, which shows by default) from another page?
Thanks

jeff
message design

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Jeff2 · February 26, 2008, 4:48pm

Am I doing this right? I can’t add an anchor to the pane itself (Freeway doesn’t seem to like it having other divs on top), but I can add one if I select the first few letters of the text. Then I set the link to point to this anchor on the page. This does cause the page to scroll to the carousel, but the pane I want remains hidden.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

waltd · February 26, 2008, 4:56pm

Sorry, I should have been more clear. In XHTML, an anchor may refer
to either an explicit a name=“blah” anchor, or to the ID of any
element on the page. So all you need to do is find the ID of the pane
you want to link to. (Look in the Site pane when in Page view or the
Name field of the Inspector while the pane is selected.) Then
manually create a link to yourpage.html#yourpane

Walter

On Feb 26, 2008, at 11:48 AM, jeffstewart wrote:

Am I doing this right? I can’t add an anchor to the pane itself
(Freeway doesn’t seem to like it having other divs on top), but I
can add one if I select the first few letters of the text. Then I
set the link to point to this anchor on the page. This does cause
the page to scroll to the carousel, but the pane I want remains
hidden.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Jeff2 · February 26, 2008, 6:51pm

Thanks Walt, but I tried that, too. I've gone back and tried again, linking to the pane, its container and the tab, with no success. Then again, maybe my code is wrong. The page I'm linking from is here:

http://www.message-design.co.uk/oralot/index.html

The link to the pane of the carousel is at the bottom right: stress management.

Jeff

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Jeff2 · February 26, 2008, 6:57pm

Well that’s no good is it. Thought I could use html in here.
Never mind: what I was trying to say:
Thanks Walt, but I tried that, too. I’ve gone back and tried again, linking to the pane, its container and the tab, with no success. Then again, maybe my code is wrong.
The page I’m linking from is here: http://www.message-design.co.uk/oralot/index.html The link to the pane of the carousel is at the bottom right: stress management. Jeff

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

waltd · February 26, 2008, 7:39pm

I see the correct pane content being shown, but the tab at the top
is not being selected. That’s going to take some manual fiddling, I
think.

What you need to do is (conditionally) set the initialSection
variable to the value of the anchor (if any).

Try hacking your page in a text editor to change the line that begins
“var my_glider = …” to read this way:

if(window.location.href.indexOf('#') > -1){
	var my_glider = new Glider("carousel",{
		duration:0.5,
		initialSelection: window.location.href.split('#')[1]
	};
}else{
	var my_glider = new Glider("carousel",{
		duration:0.5};
}

I’ll take a look at this later tonight if I get a chance, and see if
I can automate it. But for now, just see if this actually works.

Thanks,

Walter

On Feb 26, 2008, at 1:57 PM, jeffstewart wrote:

Well that’s no good is it. Thought I could use html in here.
Never mind: what I was trying to say:
Thanks Walt, but I tried that, too. I’ve gone back and tried again,
linking to the pane, its container and the tab, with no success.
Then again, maybe my code is wrong.
The page I’m linking from is here: http://www.message-design.co.uk/
oralot/index.html The link to the pane of the carousel is at the
bottom right: stress management. Jeff

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Jeff2 · February 26, 2008, 8:51pm

On 26 Feb. 2008, 6:39 pm, waltd wrote:

I see the correct pane content being shown, but the tab at the top
is not being selected.

Yes. I tried your code, but it doesn’t seem to work.
I don’t know anything about script, but it does look to me like there should be some closing ) after the = new Glider(
But putting them in what seemed to be the right place didn’t help either.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

waltd · February 26, 2008, 9:01pm

Sorry. You are correct about the problem:

if(window.location.href.indexOf('#') > -1){
	var my_glider = new Glider("carousel",{
		duration:0.5,
		initialSelection: window.location.href.split('#')[1]
	});
}else{
	var my_glider = new Glider("carousel",{
		duration:0.5});
}

Hope this works for you.

Walter

On Feb 26, 2008, at 3:51 PM, jeffstewart wrote:

On 26 Feb. 2008, 6:39 pm, waltd wrote:

I see the correct pane content being shown, but the tab at the top
is not being selected.

Yes. I tried your code, but it doesn’t seem to work.
I don’t know anything about script, but it does look to me like
there should be some closing ) after the = new Glider(
But putting them in what seemed to be the right place didn’t help
either.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Jeff2 · February 26, 2008, 9:38pm

Thanks Walt. But now none of the tabs show as selected. I’ve uploaded the pages here again:
http://www.message-design.co.uk/oralot/index.html

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

waltd · February 26, 2008, 10:31pm

You need to take out the var my_glider = part from the beginning of
the line. If you look inside the if statement, you’ll see that we set
it inside there.

That line should start off with the word ‘if’.

Walter

On Feb 26, 2008, at 4:01 PM, Walter Lee Davis wrote:

Sorry. You are correct about the problem:

if(window.location.href.indexOf(‘#’) > -1){
var my_glider = new Glider(“carousel”,{
duration:0.5,
initialSelection: window.location.href.split(‘#’)[1]
});
}else{
var my_glider = new Glider(“carousel”,{
duration:0.5});
}

Hope this works for you.

Walter

On Feb 26, 2008, at 3:51 PM, jeffstewart wrote:

On 26 Feb. 2008, 6:39 pm, waltd wrote:

I see the correct pane content being shown, but the tab at the top
is not being selected.

Yes. I tried your code, but it doesn’t seem to work.
I don’t know anything about script, but it does look to me like
there should be some closing ) after the = new Glider(
But putting them in what seemed to be the right place didn’t help
either.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Jeff2 · February 26, 2008, 10:40pm

Sorry for the stupid mistake. But I’ve tried again and still the tab isn’t selected:
http://www.message-design.co.uk/oralot/team.html#tad1

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

waltd · February 26, 2008, 10:48pm

Hmmm. It seems as though it’s not firing when the page loads. Try this:

if(window.location.href.indexOf('?') > -1){
	var my_glider = new Glider("carousel",{
		duration:0.5,
		initialSelection: window.location.href.split('?')[1]
	});
}else{
	var my_glider = new Glider("carousel",{
		duration:0.5});
}

And then change the # (hash mark) into a question mark, so your URL
is like this:

http://www.message-design.co.uk/oralot/team.html?tad1

If that doesn’t do it, I am fresh out of ideas for now.

Walter

On Feb 26, 2008, at 5:40 PM, jeffstewart wrote:

Sorry for the stupid mistake. But I’ve tried again and still the
tab isn’t selected:
http://www.message-design.co.uk/oralot/team.html#tad1

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Jeff2 · February 26, 2008, 11:15pm

Thanks very much for trying.
http://www.message-design.co.uk/oralot/team.html?tad1
Still not firing. Never mind.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

waltd · February 26, 2008, 11:50pm

I found the error. This should read initialSection, not
initialSelection. Then, it Just Works™.

Walter

On Feb 26, 2008, at 5:48 PM, Walter Lee Davis wrote:

initialSelection

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Jeff2 · February 27, 2008, 12:47pm

Brilliant. That does it. Thanks very much Walt.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

waltd · March 4, 2008, 3:41pm

Forgot to mention, this functionality has been rolled into the latest
release of Protaculous. You no longer need to hack this by hand. If
you add a querystring reference to the carousel pane you want to be
initially selected, then as soon as the page loads, it will scroll
into view (and without forcing the page to scroll down to the top of
your carousel element either!).

So if you have http://example.com/page.html?pane3 you will see the
page load and then pane 3 will slide into view.

Walter

On Feb 27, 2008, at 7:47 AM, jeffstewart wrote:

Brilliant. That does it. Thanks very much Walt.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Jeff2 · March 4, 2008, 3:57pm

Thanks again Walt. That’ll save me a lot of time.

Can you post the link for the Protaculous download, please?

How do you go about adding the querystring in Freeway? Is there an easier way than hacking it by hand or using source code snooper?

Jeff

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

waltd · March 4, 2008, 4:32pm

Just create a manual link, there’s no other shortcut that I know of.
Using SCS for this is a bit like hitting a fly with a sledgehammer.
Just enter the link in the Manual side of the dialog, and add the
querystring there.

Walter

http://freewaypro.com/actions/downloads/

On Mar 4, 2008, at 10:57 AM, jeffstewart wrote:

Thanks again Walt. That’ll save me a lot of time.

Can you post the link for the Protaculous download, please?

How do you go about adding the querystring in Freeway? Is there an
easier way than hacking it by hand or using source code snooper?

Jeff

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Keith_Martin · March 4, 2008, 4:37pm

Sometime around 4/3/08 (at 11:32 -0500) Walter Lee Davis said:

Using SCS for this is a bit like hitting a fly with a sledgehammer.

Kinda satisfying if you hit it, but not great with a moving target…

(My thoughts too. Source Code Snooper is amazing, but I keep it for
emergencies. And I haven’t had one of that level in… well, ever.)

k

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options