Versions

Protaculous_carousel_1.3.7_.zip (2013-01-30) (Downloaded 426 times)

Contains:

  • Protaculous (page-action) - v. 0.7.3
  • Protaculous (action) - v. 0.7.3
  • Observer (item-action) - v. 0.3.3
  • Carousel (item-action) - v. 1.3.7
  • Carousel Pane (item-action) - v. 1.3.6
  • Carousel Button (item-action) - v. 1.3.6
  • Carousel Text Tab (action) - v. 1.3.6
  • Carousel Tab (item-action) - v. 1.3.6

Compatible: Pro 4, Pro 5, Pro 5.5, and Pro 6

Protaculous.fwactionb.zip (2012-08-24) (Downloaded 25 times)

Contains:

  • Protaculous (page-action) - v. 0.7.3
  • Protaculous (action) - v. 0.7.3
  • Observer (item-action) - v. 0.3.3
  • Carousel (item-action) - v. 1.3.6
  • Carousel Pane (item-action) - v. 1.3.6
  • Carousel Button (item-action) - v. 1.3.6
  • Carousel Text Tab (action) - v. 1.3.6
  • Carousel Tab (item-action) - v. 1.3.6

Compatible: Pro 4, Pro 5, and Pro 5.5

Protaculous.fwactionb.zip (2012-05-15) (Downloaded 6 times)

Contains:

  • Protaculous (page-action) - v. 0.7.3
  • Protaculous (action) - v. 0.7.3
  • Observer (item-action) - v. 0.3.3
  • Carousel (item-action) - v. 1.3.5
  • Carousel Pane (item-action) - v. 1.3.5
  • Carousel Button (item-action) - v. 1.3.5
  • Carousel Text Tab (action) - v. 1.3.5
  • Carousel Tab (item-action) - v. 1.3.5

Compatible: Pro 4, Pro 5, and Pro 5.5

Protaculous.fwactionb.zip (2012-05-08) (Downloaded 0 times)

Contains:

  • Protaculous (page-action) - v. 0.7.2
  • Protaculous (action) - v. 0.7.2
  • Observer (item-action) - v. 0.3.2
  • Carousel (item-action) - v. 1.3.4
  • Carousel Pane (item-action) - v. 1.3.4
  • Carousel Button (item-action) - v. 1.3.4
  • Carousel Text Tab (action) - v. 1.3.4
  • Carousel Tab (item-action) - v. 1.3.4

Compatible: Pro 4, Pro 5, and Pro 5.5

Protaculous.fwactionb.zip (2012-05-05) (Downloaded 1 time)

Contains:

  • Protaculous (page-action) - v. 0.7.1
  • Protaculous (action) - v. 0.7.1
  • Observer (item-action) - v. 0.3.1
  • Carousel (item-action) - v. 1.3.3
  • Carousel Pane (item-action) - v. 0.4.1
  • Carousel Button (item-action) - v. 1.0.1
  • Carousel Text Tab (action) - v. 0.3.1
  • Carousel Tab (item-action) - v. 0.8.1

Compatible: Pro 4, Pro 5, and Pro 5.5

Protaculous.fwactionb.zip (2012-04-30) (Downloaded 1 time)

Contains:

  • Protaculous (page-action) - v. 0.7
  • Protaculous (action) - v. 0.7
  • Observer (item-action) - v. 0.3
  • Carousel (item-action) - v. 1.3.2
  • Carousel Pane (item-action) - v. 0.4
  • Carousel Button (item-action) - v. 1.0
  • Carousel Text Tab (action) - v. 0.3
  • Carousel Tab (item-action) - v. 0.8

Compatible: Pro 4, Pro 5, and Pro 5.5

Protaculous.fwactionb.zip (2012-04-27) (Downloaded 0 times)

Contains:

  • Protaculous (page-action) - v. 0.7
  • Protaculous (action) - v. 0.7
  • Observer (item-action) - v. 0.3
  • Carousel (item-action) - v. 1.3.1
  • Carousel Pane (item-action) - v. 0.4
  • Carousel Button (item-action) - v. 1.0
  • Carousel Text Tab (action) - v. 0.3
  • Carousel Tab (item-action) - v. 0.8

Compatible: Pro 4, Pro 5, and Pro 5.5

Protaculous.fwactionb.zip (2011-12-12) (Downloaded 1 time)

Contains:

  • Protaculous (page-action) - v. 0.7
  • Protaculous (action) - v. 0.7
  • Observer (item-action) - v. 0.3
  • Carousel (item-action) - v. 1.3
  • Carousel Pane (item-action) - v. 0.4
  • Carousel Button (item-action) - v. 1.0
  • Carousel Text Tab (action) - v. 0.3
  • Carousel Tab (item-action) - v. 0.8

Compatible: Pro 4, Pro 5, and Pro 5.5

Protaculous.fwactionb.zip (2011-03-29) (Downloaded 0 times)

Contains:

  • Protaculous (page-action) - v. 0.6.9
  • Protaculous (action) - v. 0.6.9
  • Observer (item-action) - v. 0.2.9
  • Carousel (item-action) - v. 1.2.16
  • Carousel Pane (item-action) - v. 0.3.10
  • Carousel Button (item-action) - v. 0.9.11
  • Carousel Text Tab (action) - v. 0.2.11
  • Carousel Tab (item-action) - v. 0.7.9

Compatible: Pro 4 and Pro 5

Protaculous.fwactionb.zip (2010-11-30) (Downloaded 3 times)

Contains:

  • Protaculous (page-action) - v. 0.6.9
  • Protaculous (action) - v. 0.6.9
  • Observer (item-action) - v. 0.2.9
  • Carousel (item-action) - v. 1.2.15
  • Carousel Pane (item-action) - v. 0.3.10
  • Carousel Button (item-action) - v. 0.9.10
  • Carousel Text Tab (action) - v. 0.2.11
  • Carousel Tab (item-action) - v. 0.7.9

Compatible: Pro 4 and Pro 5

Author: Walter Davis

developer javascript effects coda animation

This Action allows you to create the effect popularized on the Coda Web site. Clicking on a control causes a portion of the page to “slide” either horizontally or vertically to reveal a new part of the layout.

The effect can be controlled by a timer, a pair of “previous/next” buttons, or a set of tabs to create direct links to specific panes.

Demo

35 Comments

It works! Thank you so much!

it works well… thanks :-)

thank you@@

Hi Walter

I love the Action, but I upgraded and both the slideshows on my site no longer work. I can send toy a screenshot of the error message, but basically the action expects to find resources in the applicationsupport/freeway5/actions/general/protraculous.fwactionb/contents/resources/actions folder and they are not there. I looked and they are actually in the applicationsupport/freeway5/actions/general/protraculous.fwactionb/contents/resources/actions/support folder. If I move them the action then gives me a series of messages that I have Overflowed Text on several panes. I don't understand. Both my slideshows are online at my website and they work fine now. Do you have any ideas.

John

You're going to have to un-build the effect, remove all the actions from your page, then publish, then re-apply the Actions. I just went through this with one of my sites. It takes about ten minutes per page, but then the problem is solved for good.

Walter- Thanks for such a great action. However, I am having difficulty with it in my particular instance. I am using Freeway 5.5 Pro, and built my first website using one of the Freeway templates. What is happening is that the pages in the template are created as a HTML 'container', so the HTML item created for the Carousel is nested in the page HTML container. I created a graphic child inside the Carousel HTML item and imported a JPEG image into the graphic box. When I try to duplicate the Carousel/Graphic box child group and drag it off onto the pasteboard, the HTML container seem to restrict it from being dragged off onto the pasteboard. Because of this, I then created Carousel/Graphic box combos on the pasteboard and import other JPEGs into the graphic boxes, add all the actions (Carousel Pane/Buttons/Tabs), publish and what is happening is the panes on the pasteboard are offset in the Carousel box on the page. I am wondering if it is because I have created my site using these HTML containers around the whole page, and the Carousel nested HTML is affected. Also, I noted that there is no CSS checkbox in the Inspector when the HTML Carousel item is selected (this is present in your example Carousel webpage), but the CSS button in the top menu is active (blue) and all the Carousel items, including panes, are checked for layer. Am I missing something when nesting a Carousel HTML action inside another HTML item? Any suggestions? I have successfully created a Carousel using strictly graphics boxes (no HTML boxes) and applying the actions to them, however it was a challenge to get those lined up and rotating without any offset of the graphic inside the Carousel box on the page (www.fitonfire.com/training). Your instructions and examples show using HTML items with the action applied with graphics boxes nested inside them and they work fine, but the page you are using is not a HTML container nor does it have any other HTML items on the page. Thanks and look forward to your insight.

This problem would be happening even if you weren't using the Action. A child element cannot escape its parent boundaries in the normal Freeway interface. I'm also not entirely sure that the Carousel can work with an inline layout – at least the parent Carousel element can't be inline, if I recall correctly.

But the panes all get hoovered up and inserted inline into the parent Carousel element by the Action, so it doesn't matter where they are in the page layout anyway – they disappear before the page is done publishing.

Thanks Walter, for the info. I have gotten two Carousels to work on my site (www.fitonfire.com) by creating all Carousel items strictly as graphic items within the HTML page container and applying the various Carousel actions to the graphic items. The only problem is that the JPEG images used in the graphics items all have to be exactly the same size or they do not line up correctly in the parent Carousel window (I accomplished this using Photoshop). Also, there is considerable adjustments of the Carousel panes created on the pasteboard to get them to line up correctly in the parent Carousel window. A bit too high and the top is cut off, a bit too low and the bottom is cut off. There is probably some inflow item setting that I could make that would help in this, but regardless got it to work using graphics boxes/items. Thanks again.

Hello

UI have just installed the action on Freeway Pro 5 and keep getting Javascript errors on the carousel and the pane actions

can anyone help?

Thank you Eyal.

Hello

UI have just installed the action on Freeway Pro 5 and keep getting Javascript errors on the carousel and the pane actions

can anyone help?

Thank you Eyal.

Hello

UI have just installed the action on Freeway Pro 5 and keep getting Javascript errors on the carousel and the pane actions

can anyone help?

Thank you Eyal.

Hello

UI have just installed the action on Freeway Pro 5 and keep getting Javascript errors on the carousel and the pane actions

can anyone help?

Thank you Eyal.

Hi again

Sorry about the multiple posts (wacom error) I got it working thank you for the wonderfull action

Eyal

Hi again

Sorry about the multiple posts (wacom error) I got it working thank you for the wonderfull action

Eyal

Hi again

Sorry about the multiple posts (wacom error) I got it working thank you for the wonderfull action

Eyal

Hi again

Sorry about the multiple posts (wacom error) I got it working thank you for the wonderfull action

Eyal

can you make the panes loop in auto mode instead of scrolling back to the first one?

That could be a super feature

Thanks

Eyal

That's been a recurring question. The short answer is not right now. The long answer is that the JavaScript library that drives the Action (which I've modified, but didn't write) would need to be fundamentally overhauled to permit this. I have plans percolating for a new version of this Action, but for now, if you want to animate through a collection of elements in an endless manner, I recommend you try the ScriptyFader Action.

This looks like a great action! I tried it on my page but it seems it doesn't work in combination with the Relative Page Layout action. Is that correct, or am I doing something wrong?

Marco

You have to apply the Remove from RPL Action to the Carousel element and all associated Carousel Pane elements. This keeps them from being snarfled up into the relative layout.

Walter

Excellent Walter, thanks! I'll try that.

Hello, i dowloaded the action but after expanding the zip file i just get a "Protaculous" file which i installed and on the actions list i just have Protaculous action and not the other ones listed. Shouldnt i have "carousel", "carousel pane", etc in the actions list? im using freeway 6 pro and im pretty new at this - am i doing something wrong? thanks in advance;)

You have to select an HTML item on your page and then look in the Item / Actions menu for Carousel or Carousel Pane. All Actions are contextual – they only appear when the current selection is something they can be applied to.

I loaded version 1.3.7 then I created two pages, one with FW5.5 and the other with the FW6. Both with the same elements and same settings. The one done with FW5.5 is working but the one done with FW6 is not!

This Action was updated for 6 by Softpress. I am not entirely sure what they did to it to get it there. I wrote a new Action called Carousel2, which is tested to work in Freeway 6 (and earlier). I recommend you try that.

Oh, many, many thanks, Carousel2 is working quite perfect in FW6. But there is one more thing. I'm trying to give different appearances to the active and inactive tabs. I followed step by step the instructions that Tim Plumb gave at a post in Freewaytalk site that I reproduce here:

"The tabs don’t use images in this version and just change colour which (I think) is the effect you are after.

The thing to remember is that the Carousel Action will apply a style of ‘active’ to the tab that is currently in use. Knowing this we can style the tabs as we want but need an active style that can be created in the Edit Styles dialog box. Since you can’t have a CSS style change the foreground image or colour of an item we need to make each of the tabs clear images (set their colours to ‘None’) and define a style that sets their default background colours to whatever colour you like (I chose a colour I called ‘Tan’).

Look in the Edit Styles dialog and you’ll see a style called ‘.tab’ which sets the background colour of the default tabs. Now all we need to do is to give each tab a class of ‘tab’ so that Freeway knows to apply this style to the tab items. Select each tab in turn and select Item > Extended and then the ‘div’ tab in the dialog. Click New and add name: class and value: tab

Finally we need to define the ‘active’ style that Carousel will apply to the active tab. Again in the Edit Styles dialog create a style called ‘.active’ and define a background colour.

Now when you preview the page the ‘tab’ style should set the default colours of all of the tabs and the ‘active’ style should define the colour of the one in use."

Again, it is working in FW5.5 with Carousel Action but in FW6 with Carousel2 Action, is not. It seems that it is not recognising when a tab is active. I still have tried, to define the style as '.tab.active' but again without success.

Can you help me?

Please re-post your question to the FreewayTalk mailing list, and be sure to include a link to your page that shows the problem. That's the quickest way to get an answer.

OK, I will do that.

Thanks for a great action! I have been using it for a few years with great success.

Is there a way to easily change the order of the images? I am using it as a news feed but the most current image will always be last.

Thanks, Mike

The order of the panes is directly related to their "stacking order" in Freeway – all but the first pane. The first pane will always be whichever pane has the Carousel Action applied to it, and all the others will be sorted by the order they appear in the left column of Freeway when you have that column in Page mode (rather than Site mode).

Have you looked at the NewsCycle Action? That may be a better solution for you, although it just cycles through the items, and doesn't provide any navigation affordance for the user.

Walter

Can anyone help? I'm using Freeway Pro and have just downloaded this action. However, when I look in my actions menu (having clicked in an html box), I am only seeing the actions Carousel Text Button and Carousel Tab. I don't see the Carousel action itself anywhere.

Am I missing something obvious, here? How do I activate the action?

All Actions are context-sensitive. You must have a page element selected on screen before the Item/Actions menu will show Carousel as an option.

I think I was looking in the wrong menu, that was it. Found it now.

Please, does Carousel 1 work with Freeway pro 7?

THX

Jacques Laloum

It's not tested, so please do and report back. I suspect that some (many?) of the assumptions made by the Action internally regarding the structure of Freeway-generated HTML may have changed. Freeway 7 is quite a different beast than Freeway 4 in terms of the code that it writes, and all of Carousel 1 was based on and heavily developed and tested in Freeway 4. It may not work at all, but if you get it to, please report back how!

Sign In or Sign Up to comment.