Blame | Last modification | View Log | RSS feed
<html><head><title>dojox.presentation - Presentation Mechanism</title><script type="text/javascript"> djConfig = { isDebug: true, parseOnLoad: true }; </script><script type="text/javascript" src="../../../dojo/dojo.js"></script><script type="text/javascript" src="../../../dijit/form/Button.js"></script><script type="text/javascript">dojo.require("dojox.presentation");dojo.require("dijit._Calendar");dojo.require("dijit.TitlePane");dojo.require("dojo.parser");dojo.require("dojo.fx");dojo.require("dojo.dnd.move");</script><style type="text/css">@import "../../../dojo/resources/dojo.css";@import "../../../dijit/themes/tundra/tundra.css";@import "../../../dijit/tests/css/dijitTests.css";@import "../resources/Show.css";</style><script type="text/javascript">var externalAnimation = null;var titleCount=0;var titles = ["Just Kidding","The Title Will keep changing","but you can click to advance","nonthing fancy","just an example of","an external function controlling a slide."];function playIt() {var node = dijit.byId('animated').slideTitle;console.debug(node);// this is the fanciest animation chain i could thing of atmtmpTitle = titles[titleCount++] || titles[0];externalAnimation = dojo.fx.chain([dojo.fadeOut({ node: node,duration: 500,onEnd: dojo.hitch(this,function(){node.innerHTML = tmpTitle;})}),dojo.animateProperty({node: node,duration: 10,properties: { letterSpacing: {end:-26.3, unit: 'em', start:3.2}}}),dojo.fadeIn({ node: node,duration:300}),dojo.animateProperty({node: node,duration: 800,properties: { letterSpacing: {end:2.8, unit: 'em' , start:-26.0}}})]);setTimeout("externalAnimation.play()",50);}function makeDraggable(node) {var tmp = new dojo.dnd.Moveable(node);}</script></head><body class="tundra"><div dojoType="dojox.presentation.Deck" id="testPresentation"><div dojoType="dojox.presentation.Slide" id="myFirstSlide" title="Introduction"><p>This is a brief overview of what this presentation widget is capable of.</p><div dojoType="dojox.presentation.Part" as="one">... it's new, and completely different, so watch close</div><input dojoType="dojox.presentation.Action" forSlide="one" toggle="fade" duration="3000"><input dojoType="dojox.presentation.Action" forSlide="one" toggle="wipe"></div><div dojoType="dojox.presentation.Slide" title="Basic Actions"><p>Click, and more text will appear</p><div dojoType="dojox.presentation.Part" as="one"><p>Lorem something something. I am text, hear me _roar_.</p></div><input dojoType="dojox.presentation.Action" forSlide="one" on="click" toggle="fade"><div dojoType="dojox.presentation.Part" as="me">I am here to make sure click-advancing is disabled on normal input type elements:<ul><li><a href="#">href</a></li><li>Input: <input type="text" name="foo"></li></ul></div><input dojoType="dojox.presentation.Action" forslide="me" toggle="slide"></div><div dojoType="dojox.presentation.Slide" title="Automatically Advance"><p dojoType="dojox.presentation.Part" as="one">First You See me ...</p><p dojoType="dojox.presentation.Part" as="two">Then you see ME ...</p><p dojoType="dojox.presentation.Part" as="three" style="padding:20px;">oh yeah!</p><input dojoType="dojox.presentation.Action" forSlide="one" on="click" toggle="fade" delay="1500"><input dojoType="dojox.presentation.Action" forSlide="two" toggle="wipe" delay="1500"><input dojoType="dojox.presentation.Action" forSlide="three" toggle="wipe" delay="1500"></div><!--<div dojoType="dojox.presentation.Slide" title="Remote Slide" href="_ext1.html"></div>--><div dojoType="dojox.presentation.Slide" title="Click Blocking" id="animated"><p>You cannot click on this page</p><p dojoType="dojox.presentation.Part" as="1">I told you that you can't click ...</p><a href="#" onClick="playIt()">click here to move the title</a><input dojoType="dojox.presentation.Action" forSlide="1" toggle="wipe"><input dojoType="dojox.presentation.Action" forSlide="2"><input dojoType="dojox.presentation.Action" forSlide="1" toggle="fade"></div><div dojoType="dojox.presentation.Slide" title="Widgets in Slide" noClick="true" id="wdijit"><p>There is a widget in this page:</p><p>clicking has been stopped on this page to demonstrate the usage ..</p><div dojoType="dojox.presentation.Part" as="foo" startVisible="true">There _should_ be a _Calendar widget here<br><div dojoType="dijit._Calendar"></div></div><div dojoType="dijit.TitlePane" title="foobar" id="newTitlePane"style="width:300px; position:absolute; right:40px; top:125px;">I am a titlepane, you can do cool things with me.<button onClick="makeDraggable('newTitlePane')">Make me Draggable!</button></div><div style="width:400px; position:absolute; right: 40px; bottom:40px;"><p>... so I'm providing a next button: <button dojoType="dijit.form.Button" value="Next" onClick="dijit.byId('testPresentation').nextSlide();">Next</button></p></div><input type="dojox.presentation.Action" forSlide="foo" toggle="slide"></div><div dojoType="dojox.presentation.Slide" title="The End"><p>Thanks for watching!</p></div></div></body></html>