You're right, and basically you will have to use Javascript to do
this. I guess you could come up with something that has a server-
side program which renders "back arrow - image - right arrow" for a
given image. The back arrow link would cause just that iframe to
reload itself from the same server-side program, but with a different
parameter (say page=1) that would cause the first image to load. The
right arrow would be the same, but with the URL including page=3.
And the image would be chosen based on that page parameter (page=2
for the current page in my example), so you can go forward, then
back, to get back to the same page.
Javascript is really not that much harder. You need to allocate a
<div> on the page which will hold the content (just like an iframe).
You can even give it styles, borders, padding, fixed size, etc. like
an iframe if you want. You assign it a particular ID, and then have
your javascript do a callback to a server-side Mason thing that will
choose the next photo, like the code I wrote below.
If your pictures are numbered simply, you could do away with the
server-side Mason code I hypothesized ("choosePhoto.html") and just
have the javascript construct the new image URL directly. Likewise,
you could replace the <div> below with a simple <img> tag, and just
use javascript to swap in the SRC attribute; in that case, you would
want to change the /choosePhoto.html Mason script just to return the
URL, and you would say something like document.getElementById
('photo').src = req.responseText; .
There are also lots of ways to do this with fancier javascript
libraries with names like Dojo and Prototype.js, but this is the way
I like; it is "close to the metal" and doesn't require loading any
extra javascript libraries. The only thing I tend to have in a
separate file, for common reuse, is the "var getRequestObj" and
"function getRequestObjClosure()" functions.
--Mark
<table>
<tr><td><img src="leftarrow.gif" onclick="getPhoto(-1)"></td>
<td><div id="photo"></div></td>
<td><img src="rightarrow.gif" onclick="getPhoto(1)"></td>
</tr>
</table>
<script type="text/javascript">
var curphoto=0;
function getPhoto(direction) {
var req = getRequestObj();
curphoto += direction; // Pick the new photo to get
if (curphoto < 0) { curphoto = 9; } // I assume you have 10
photos, numbered 0 through 9
req.open("GET", '/choosePhoto.mhtml?id='+curphoto);
req.onreadystatechange = function() {
if (req.readyState == 4 && req.status == 200) {
document.getElementById('photo').innerHTML = req.responseText;
}
};
}
var getRequestObj = getRequestObjClosure();
function getRequestObjClosure() {
if (typeof XMLHttpRequest != "undefined") {
return function() {return new XMLHttpRequest();}
}
var msv= ["Msxml2.XMLHTTP.7.0", "Msxml2.XMLHTTP.6.0",
"Msxml2.XMLHTTP.5.0", "Msxml2.XMLHTTP.4.0",
"MSXML2.XMLHTTP.3.0",
"MSXML2.XMLHTTP", "Microsoft.XMLHTTP"];
for(j=0;j<=msv.length;j++) {
try {
A = new ActiveXObject(msv[j]);
if(A) {
return function() {return new ActiveXObject(msv[j]);}
}
}
catch(e) { }
}
return false;
}
</script>
On Dec 1, 2006, at 3:05 AM, Kristian Nilssen wrote:
> I think I'll go with the iframe idea - looks like the simplest to me.
> I've already got my head around apache, mod_perl, perl, mason and html
> just to make a simple website so I think I'll leave javascript for
> another day. So, the only question remains - how do I force the
> content
> of the iframe to update? If the iframe SRC attribute points to
> image.html file which contains just one image out of many in a
> sequence
> (the play, stop buttons, etc would be outside the iframe) then
> presumable I have to rewrite the image.html file and force the
> iframe to
> update somehow? Is this the way to go?
>
> ----------------------------------------------------------------------
> ---
> Take Surveys. Earn Cash. Influence the Future of IT
> Join SourceForge.net's Techsay panel and you'll get the chance to
> share your
> opinions on IT & business topics through brief surveys - and earn cash
> http://www.techsay.com/default.php?
> page=join.php&p=sourceforge&CID=DEVDEV
> _______________________________________________
> Mason-users mailing list
> Mason-users@lists.sourceforge.net
> https://lists.sourceforge.net/lists/listinfo/mason-users
-------------------------------------------------------------------------
Take Surveys. Earn Cash. Influence the Future of IT
Join SourceForge.net's Techsay panel and you'll get the chance to share your
opinions on IT & business topics through brief surveys - and earn cash
http://www.techsay.com/default.php?page=join.php&p=sourceforge&CID=DEVDEV
_______________________________________________
Mason-users mailing list
Mason-users@lists.sourceforge.net
https://lists.sourceforge.net/lists/listinfo/mason-users
