<!--
AgileGallery Source Code
Author: Tony Landis
Link: http://www.agilegallery.com
Link: http://www.tonylandis.com
License: GPL
Restrictions: Free for personal/commerical use, the link/credit must remain intact and visible
-->
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE canvas SYSTEM "C:\Program Files\OpenLaszlo Server 3.2\Server\lps-3.2\tools\lzx.dtd">
<canvas bgcolor="#000000">
<!-- RESOURCES -->
<font name="san" src="helmetr.ttf" />
<!-- check for picasa php parser url -->
<script>
if (typeof(xmlURL) == 'undefined') xmlURL=false;
</script>
<!-- load the parsed XML data -->
<dataset name="picasaImages" request="true" type="http" src="${xmlURL}" />
<datapointer id="pager" xpath="picasaImages:/gallery/images/img[1]" />
<!-- BASE CLASS -->
<class name="basestuff">
<attribute name="baseURL" value="" type="string" />
<attribute name="galleryName" value="" type="string" />
<attribute name="galleryCount" value="0" type="number" />
<attribute name="firstImageUrl" value="" type="string" />
<attribute name="firstImageCaption" value="" type="string" />
<datapointer xpath="picasaImages:/gallery" ondata="processData()">
<method name="processData">
parent.setAttribute("baseURL", this.xpathQuery('url/text()'));
parent.setAttribute("galleryName", this.xpathQuery('name/text()'));
parent.setAttribute("galleryCount", this.xpathQuery('count/text()'));
</method>
</datapointer>
<handler name="oninit">
var cm = new LzContextMenu();
canvas.setDefaultContextMenu(cm);
var item1 = cm.makeMenuItem('About AgileGallery', new LzDelegate(this, "aboutagilegallery"));
cm.addItem(item1);
</handler>
<method name="aboutagilegallery">
LzBrowser.loadURL('http://www.agilegallery.com/', '_blank')
</method>
<!-- animation to hide current photo -->
<method name="showImagePre" args="url,captiontxt">
animate('opacity', 1, 300, false);
captionborder.animate('opacity', 0, 0, false);
caption.animate('opacity', 0, 0, false);
fullsized.animate('opacity', 0, 0, false);
fullsized.setAttribute('src', baseURL + url);
caption.setText(captiontxt);
//copyright.animate('opacity', 0, 0, false);
</method>
<!-- animation reveal current photo -->
<method name="showImagePost">
fullsized.animate('opacity', 1, 300, false);
captionborder.animate('opacity', .4, 600, false);
caption.animate('opacity', 1, 500, false);
//copyright.animate('opacity', .25, 600, false);
</method>
</class>
<!-- GALLERY CLASS -->
<class name="agilegallery" extends="basestuff">
<attribute name="imgId" value="1" type="string"/>
<attribute name="activeImg" value="" type="string"/>
<attribute name="timerDelay" value="3500" type="number"/>
<datapointer id="initxml" xpath="picasaImages:/gallery/images/img[1]" />
<handler name="oninit">
header.animate('y', 0, 1700, false);
results.animate('x', 0, 1900, false);
footer.animate('opacity' , .8, 1900, false);
</handler>
<handler name="ondata" args="d">
if(pager.selectNext()) showImage();
</handler>
<!-- set new photo -->
<method name="showImage">
showImagePre();
var url = baseURL + pager.p.getAttr("photo");
fullsized.setAttribute('src', url);
caption.setText(pager.getNodeText());
this.setAttribute('activeImg',pager.p.getAttr("photo"));
showImagePost();
</method>
<method name="setDelay" args="delay">
if(delay == 0) {
this.delayedView();
return;
}
this.slideDeligate = new LzDelegate( this, 'delayedView' );
LzTimer.addTimer( this.slideDeligate, this.timerDelay);
</method>
<method name="delayedView">
if (pager.selectNext()) {
this.showImage();
this.setDelay();
} else {
buttonPrev.animate('opacity', 1, 300);
buttonNext.animate('opacity', 1, 300);
}
</method>
<method name="stopSlideShow">
LzTimer.removeTimer( this.slideDeligate );
</method>
<!-- HEADER -->
<view id="header" width="100%" height="50" bgcolor="#999999" y="-50">
<view width="99.9%" height="95%" bgcolor="#CCCCCC" align="center" valign="middle">
<view x="150" y="150" />
<simplelayout axis="x" spacing="10"/>
<button id="buttonPrev" y="10" opacity=".3" font="san" fontsize="12"> Previous
<handler name="onclick">
buttonNext.animate('opacity', 1, 300);
if (pager.selectPrev())
parent.parent.parent.showImage();
else
this.animate('opacity', .3, 300);
</handler>
</button>
<button id="buttonNext" y="10" font="san" fontsize="12"> Next
<handler name="onclick">
buttonPrev.animate('opacity', 1, 300);
if (pager.selectNext())
parent.parent.parent.showImage();
else
this.animate('opacity', .3, 300);
</handler>
</button>
<button id="buttonSlideShow" y="10" font="san" fontsize="12"> Start Slideshow
<handler name="onclick">
buttonPrev.animate('opacity', 0, 0);
buttonNext.animate('opacity', 0, 0);
parent.parent.parent.setDelay(0);
buttonSlideShow.animate('opacity', 0, 0);
buttonSlideShowStop.animate('opacity', 1, 300);
results.animate('x', "-130", 300);
photo.animate('x', "10", 400);
</handler>
</button>
<button id="buttonSlideShowStop" y="10" opacity="0" font="san" fontsize="12"> Stop Slideshow
<handler name="onclick">
buttonPrev.animate('opacity', 1, 0);
buttonNext.animate('opacity', 1, 0);
buttonSlideShow.animate('opacity', 1, 0);
buttonSlideShowStop.animate('opacity', 0, 0);
parent.parent.parent.stopSlideShow();
results.animate('x', "0", 400);
photo.animate('x', "130", 300);
</handler>
</button>
<!-- show gallery name -->
<text y="10" width="400" font="san" fontsize="20" clip="false" fgcolor="#666666" text="${parent.parent.parent.galleryName}" />
</view>
</view>
<!-- THUMBS -->
<view id="results" width="130" height="${canvas.height-70}" clip="true" y="50" x="-130" bgcolor="#ffffff">
<view name="results" x="15" y="15" width="85%" align="center">
<wrappinglayout axis="x" spacing="5" />
<thumbs datapath="picasaImages:/gallery[1]/images[1]/*" />
</view>
<scrollbar axis="y" />
</view>
<!-- PHOTO -->
<view id="photo" x="130" y="50" bgcolor="#000000" width="100%" height="100%">
<image id="fullsized" x="20" y="20"/>
<view id="captionborder" x="30" y="30" height="20" width="${fullsized.width-20}" bgcolor="#CCCCCC" opacity="0">
<text id="caption" y="1" height="18" width="100%" opacity="0" font="san" fontsize="12" bgcolor="#FFFFFF" multiline="true"></text>
</view>
<!--
<text id="copyright" x="30" y="${fullsized.height-10}" height="20" width="${fullsized.width-20}" opacity="0" bgcolor="#FFFFFF" multiline="true">
<font color="#333333">
<b>Copyright ???. All Rights Reserved.</b>
</font>
</text>
-->
</view>
<!-- FOOTER -->
<view id="footer" x="0" y="${canvas.height-20}" width="100%" height="25" bgcolor="#999999" opacity="0">
<view y="1" width="100%" height="24" bgcolor="#CCCCCC" align="center" valign="middle">
<text x="5" y="3" width="400" font="san" fontsize="11" clip="false" fgcolor="#003399"
text="Powered by AgileGallery. Copyright 2006. All Rights Reserved."
onclick="parent.parent.parent.aboutagilegallery()" />
</view>
</view>
</class>
<!-- THUMBNAIL CLASS -->
<class name="thumbs" extends="basestuff">
<attribute name="activeImg" value="" type="string"/>
<handler name="oninit">
setAttribute('opacity', .6);
</handler>
<handler name="ondata" args="d">
var url = baseURL + datapath.p.getAttr('thumbnail');
this.setSource(url);
this.setAttribute('id', datapath.p.getAttr("photo"));
</handler>
<method event="onclick">
showImagePre();
var url = baseURL + datapath.p.getAttr("photo");
fullsized.setAttribute('src', url);
caption.setText(datapath.getNodeText());
showImagePost();
this.setAttribute('activeImg', datapath.p.getAttr("photo"));
pager.setFromPointer(datapath);
buttonPrev.animate('opacity', 1, 300);
</method>
<method event="onmouseover">
animate('opacity', 1, 300, false);
</method>
<method event="onmouseout">
if(this.activeImg != datapath.p.getAttr("photo")) animate('opacity', .7, 300, false);
</method>
</class>
<agilegallery width="100%" height="100%" datapath="picasaImages:/gallery/images/img[1]" />
<!-- VIEW Initial Photo -->
<view>
<datapointer xpath="picasaImages:/gallery" ondata="processData()">
<method name="processData">
var URL = this.xpathQuery('url/text()');
this.setXPath("images/img[1]");
var PHOTO = this.p.getAttr("photo");
var CAPTION = this.getNodeText();
fullsized.setAttribute('src', URL + PHOTO);
caption.setText(CAPTION);
fullsized.animate('opacity', 1, 600, false);
captionborder.animate('opacity', .4, 600, false);
caption.animate('opacity', 1, 500, false);
</method>
</datapointer>
</view>
</canvas>
) is private.
