PictureFlow4 HTML and JavaScript generator v1.0

Static publishing

Description

Embed Flash content and alternative content using standards compliant markup, and use unobtrusive JavaScript to resolve the issues that markup alone cannot solve.

Pros

The embedding of Flash content does not rely on JavaScript and the actual authoring of standards compliant markup is promoted.

Cons

Does not solve 'click-to-activate' mechanisms in Internet Explorer 6+ and Opera 9+ and is harder to author (without using this generator).

Dynamic publishing

Description

Create alternative content using standards compliant markup and embed Flash content with unobtrusive JavaScript.

Pros

Avoids 'click-to-activate' mechanisms in Internet Explorer 6+ and Opera 9+ and is easy to author (even without using this generator).

Cons

The embedding of Flash content relies on JavaScript, so if you have the Flash plug-in installed, but have JavaScript disabled or use a browser that doesn't support JavaScript, you will not be able to see your Flash content, however you will see alternative content instead. Flash content will also not be shown on a device like Sony PSP, which has very poor JavaScript support, and automated tools like RSS readers are not able to pick up Flash content.

The FlashVars allow you to customize your PictureFlow with your own parameters without complicated Flash authoring and Flash or Flex development tools. It's quite simple, you choose a FlashVar name in the list and you set your value. Click "Add" to add an other line of FlashVar and repeat the same operation till your PictureFlow is completly tweaked ;)

Here below, the exhaustive list of PictureFlow tweaks: name(Type of Value | Default value)

Data settings

• xmlfeed (String | feed.xml): The path to your XML file or PHP script (relative to the html page)
• iShow (int | 4): The picture id you want to be shown at start
• ajaxMode (Boolean | false): Turn on the Ajax functions to drive PF and disable the XML feed
• flickr (Boolean | false): Allow flickr© hosted photo loading (Load all flickr© crossdomain policies)
• crossdomain (String | ""): URL to load specific crossdomain policy XML to allow loading datas on other domain

Stage settings

• dynamicStage (Boolean | true): Enable/disable mouse driven 3D scene rotation
• stageTeta (int | 0): Initial scene rotation on X (degrees)
• subdesc (Boolean | true): Description under main picture
• Shadowbox (Boolean | true): Shadowbox or Simple Link combined with "Target" Tag in the XML ("_self" = same browser window, "_blank" = new)
• UFlow (Boolean | true): Pictures run in a U or linear run
• flipMain (Boolean | true): Flip the main picture when click (Since 4.1.3)
• nPhotoAnim (int | 10): Number of pictures near center to be animated (for CPU optimization)
• easeTime (Float | 1): Easing time transition (seconds)
• xOffset (int | 30): Main picture gap on X axe (both sides),(pixels)
• xStep (int | 200): Stack picture pitch on X axe (both sides),(pixels)
• zOffset (int | 200): Main picture gap on Z axe (both sides),(pixels)
• zStep (int | 200): Stack picture pitch on Z axe (both sides),(pixels)
• yFlow (int | -70): Y Flow Position / Center (pixels)
• yScroll (int | 80): Y ScrollBar Position / Center (pixels)
• ySub (int | 100): Y Desc text Position / Center (pixels)
• persistantStageW (int | 900): IE lost of Stage dimensions bug hack (pixels)(Since 4.1.0)
• persistantStageH (int | 400): IE lost of Stage dimensions bug hack (pixels)(Since 4.1.0)
• Blur (Boolean | false): Dynamic blur effect (Since 4.2.1)
• myDelay (int | void): SlideShow delay in ms (1000 = 1 sec)(if blank, no slideshow) (Since 4.2.1)

Picture settings

• TooltipOn (Boolean | true): With or Without tooltips
• superGlass (Boolean | true): Transparent reflection style (Advised with custom image background)
• myBckgrnd (Hex | 0xFFFFFF): Reflection style Color (Hex Number: Don't Forget "0x"before!)
• upMaskRatio (float | 1): Up reflection rate (0->1)
• downMaskRatio (float | 0): Down reflection rate (0->1)
• picHeight (int | 180): Rendered picture height for Post Processing(pixels)
• picRatio (float | 1.33): Rendered stack picture size ratio (W/H) for Post Processing. (Note: Doesn't concern main picture which keeps its native ratio) (pixels)
• flowTeta (int | 60): Stack Picture Rotation on Y (Note: Doesn't concern main picture always at 0°)(degrees)
• CornerRadius (int | 10): Picture corner radius (pixels)
• myThickness (int | 3): Border line thickness (pixels)

Font

• myPolice (String | Verdana): Font name
• myTitleSize (int | 25): Subdesc title size (pt)

Colors

• myColor (Hex | 0x000000): Border line color (Hex Number: Don't Forget "0x"before!)
• myDefaultColor (Hex | 0xFFFFFF): Default fake picture color when not loaded (Hex Number: Don't Forget "0x"before!)
• myTipColor (Hex | 0x767467): Loader and Tooltips color (Hex Number: Don't Forget "0x"before!)
• myTextColor (Hex | 0xFFFFFF): Loader and Tooltips text color (Hex Number: Don't Forget "0x"before!)
• mySubTextColor (Hex | 0xFFFFFF): Subtext text color (Hex Number: Don't Forget "0x"before!)
• myScrollColor (Hex | 0x767467): Scroolbar main color (Hex Number: Don't Forget "0x"before!)
• myArrowColor (Hex | 0xFFFFFF): Scroolbar arrow color (Hex Number: Don't Forget "0x"before!)
• myLoadBarColor (Hex | 0x0099FF): Load bar color (Hex Number: Don't Forget "0x"before!)
• upBgColor (Hex | 0xFFFFFF): Up background gradient color (Hex Number: Don't Forget "0x"before!)
• downBgColor (Hex | 0xFFFFFF): Down background gradient color (Hex Number: Don't Forget "0x"before!)

Transparency

• myAlpha (float | 1): Border line alpha channel (0->1)
• myAlphaScroll (float | 1): Scroolbar alpha channel (0->1)
• myAlphaTool (float | 0.5): Tooltips and loader alpha channel (0->1)
• myAlphaBg (float | 1): Background alpha channel (0->1)

The object element allows you to nest alternative content inside of it, which will be displayed if Flash is not installed or supported. This content will also be picked up by search engines, making it a great tool for creating search-engine-friendly content.

Summarized, you should use alternative content for the following:

• When you like to create content that is accessible for people who browse the Web without plugins
• When you like to create search-engine-friendly content
• To tell visitors that they can have a richer user experience by downloading the Flash plugin