Animating images on a xpage - xpages

I want to have a series of images slide into a section on a page. Can anyone point me to a technique of doing that?
many thanks!
clem

It sounds like you are looking for a carousel - check out these jQuery plugins
http://www.tripwiremagazine.com/2012/06/jquery-carousel.html

If you like to use Dojo that comes with XPages, check out these links:
http://davidjs.com/2011/01/fun-with-dojo-animation/
https://dojotoolkit.org/reference-guide/1.8/dojox/image/LightboxNano.html
http://ofps.oreilly.com/titles/9780596516482/animation_and_special_effects.html
http://almaer.com/blog/cleanup-of-manual-animation-via-dojo-animation
Have fun!

Check out the Dojo Effects simple actions available with 8.5.3 UP1 and extlib.
Documentation here:
http://infolib.lotus.com/resources/domino/8.5.3/doc/designer_up1/en_us/DominoDesignerXPagesExtensionLibrary.html#Simpleactions_dojoslideto

Related

AMP HTML: How do you setup 'swipe pagination'?

I would like to setup an AMP HTML web site that is paginated like a book. Naturally, in addition to having the ability to click/tap left/right arrows, I would like to offer the ability for the reader to swipe back and forth.
I considered the idea of using amp-carousel but then I would need to pre-load every single page, correct? So, what is the alternative? I discovered that in general, I could use JQuery, but how can I incorporate this within AMP HTML?
Thanks in advance!
Keith

YUI DataTable Pagination

Does YUI (3.7)'s DataTable support pagination? It's mentioned in the API docs - but only in the code example. When I try to find any in-depth documentation, I couldn't see anything.
http://yuilibrary.com/yui/docs/api/classes/DataTable.html
But this suggests that it might not be supported yet (although I understand it's referring to a slightly older version)
http://yuilibrary.com/forum/viewtopic.php?p=32211
Thanks
There are a bunch of paginator modules in the gallery, most of which work with YUI DataTable, but there is no official Y.Paginator in YUI yet.
There's a gallery module for datatable pagination: http://yuilibrary.com/gallery/show/datatable-paginator
Also you can use AlloyUI Pagination with DataTable: https://gist.github.com/zenorocha/5032360
Y.Paginator now exists. But it is very low-level and contains no UI components. see.
There's also a very un-documented Datatable.Paginator class. Which I can't figure out at all. Link.

YUI ScrollView Paging by Page numbers

I am trying to use the YUI ScrollView with paging but I do not want to use the "previous + next" button. Instead I would like a to have a container with links to each page.
Is it possible to skip to a specific page of ScrollView on a button/link click.
Something like
scrollView.pages.ScrollToPage(3);
Any help would be highly appreciated. You can find the documentation here.
As the documentation explains, there is a scrollTo method in the ScrollViewPaginator plugin: http://yuilibrary.com/yui/docs/api/classes/Plugin.ScrollViewPaginator.html#method_scrollTo.
You just need to write something like scrollview.pages.scrollTo(3, 0.6, "ease-in");.

Displaying Maya Mesh XML in browser

I have a Mesh file (XML format) created in Maya.
I would like to display it in the browser with some additional options for the user, like rotating an zooming in and out.
What should be the best and easy method to do so?
(SilverLight, HTML5/JS/Canvas, Flesh)
I would really like to try HTML5/Canvas - is there any libraries that know how to do it?
Thanks.
I would really like to try
HTML5/Canvas - is there any libraries
that know how to do it?
You can visit this site learningwebgl
There are a lot of lessons and demos. On the right side there is a list of frameworks.
But you need browser support for webgl...
If you are willing to export your file in Collada/DAE format (which is basically XML), there are some online WebGL framework demos that show that a DAE file can be displayed the way you wish.
The frameworks that I've seen this for are GLGE and SpiderGL.
(WebGL is the 3D version of HTML5/Canvas.)
you can export your maya scene with http://www.inka3d.com and then manipulate it with javascript

Best web technology for building dynamic charts

I need to build a custom designed bar chart that displays some simple data. Below are my requirements. Can anyone suggest the best web technology for my requirements.
high browser compatibility
ability to draw shapes
ability to fill shapes with gradients
ability to have onclick and onmouseover events for the different shapes (bars in the chart).
Thanks guys. I was thinking of using svg but looking for suggestions.
How about Raphaël - it's SVG/VML.
It says:
Browser compatibility:
Raphaël currently supports Firefox
3.0+, Safari 3.0+, Opera 9.5+ and Internet Explorer 6.0+.
Ability to draw shapes
circle, rect, ellipse, image, text, path
Ability to fill shapes with gradients
yes
Ability to have onclick and onmouseover events
yes:
... every graphical object you
create is also a DOM object, so you
can attach JavaScript event handlers
or modify them later.
Everything in the reference
On top of that, there's a plugin called gRaphael which makes the creation of charts easier.
Simple data - Google Charts API or Google Visualization API may suit you.
Details for all features of image charts can be found on the Chart feature list
You may also take a look at the comparison of the Charts API and the Visualization API.
Another candidate of course is JQuery SVG - if you're already familiar with jquery you may prefer this one.
There's a comparison of JQuery SVG and Raphaël on SO:
jQuery SVG vs. Raphael
I recommend using Adobe Flex. Below is an example of how easy pie chart creation can be in Flex:
<mx:Panel title="Pie Chart">
<mx:PieChart id="myChart"
dataProvider="{expenses}"
showDataTips="true"
>
<mx:series>
<mx:PieSeries
field="Amount"
nameField="Expense"
labelPosition="callout"
/>
</mx:series>
</mx:PieChart>
<mx:Legend dataProvider="{myChart}"/>
Based on your criteria:
high browser compatibility: Flex is used on more than 95% of all browsers and behaves the same in all browsers. No more need to check if your web app is running in ie, firefox, chrome, etc... because any browser that has a flash player is compatible.
ability to draw shapes: Flash's greatest strength is the ability to draw. Charts are completely customizable and skinnable to achieve the look you need.
Ability to fill shapes with gradients - done easily by setting style attributes or a custom skin.
ability to have onclick and onmouseover events for the different shapes - see this link for some easy ways to create user interactions with charts.
Hi i hope this link may help you i found it while searching for a solution similar to what you're looking for:
http://www.artetics.com/Articles/using-various-javascript-libraries-to-create-pie-chart
i'm trying gRaphael, i'm having difficulties on finding documentation though. you have to read the code and use the exploded instead of the min.js
I would like to share jquery.jqplot.js. It has lots of jQuery options, but depends on other plugins such as syntaxhighliter etc.

Resources