Can WebBatch do a simple slideshow?

[snowsnowsnow]

Notes:

1) I've never used WebBatch - and have no real idea what it is or what it can do.  I've been using WinBatch since, well, forever, but have never done any of what the kewl people call "Web Publishing".  Do I even have WebBatch?  Is it included in the standard purchased product or is it an additional download and/or purchase?

2) I have a very simple web page with a bunch of pictures on it and some HTML that I generate with a script (written by me,  in AWK, not WinBatch).   Right now, it is just click on a picture, see it, go back to the menu, click on another picture, and repeat, but someone suggested/requested that there be a "click to see next/previous picture" functionality.

So, I did a web search for "simple HTML slideshow" and got some useful looking hits - but nothing that was obvious and easy enough for me to implement.  So, I thought about WebBatch and decided to post here.

Any ideas?

[Deana]

1) I've never used WebBatch - and have no real idea what it is or what it can do.  I've been using WinBatch since, well, forever, but have never done any of what the kewl people call "Web Publishing".  Do I even have WebBatch?  Is it included in the standard purchased product or is it an additional download and/or purchase?

WebBatch is a separate product from WinBatch. WebBatch costs $295. WebBatch is a CGI scripting language for Windows Web Servers.  WebBatch has NO Windows Interface of any kind. All user and programmer interaction with WebBatch is via html forms launched from a URL in your browser.

If you have a Windows NT-based web server, you can try WebBatch out right now!  Just download an evaluation copy and get a free 60-day license right here.  http://www.webbatch.com/webcgi/webbatch.exe?budu/weber.web+index.weber+60dayeval+null

WebBatch website: http://www.webbatch.com

2) I have a very simple web page with a bunch of pictures on it and some HTML that I generate with a script (written by me,  in AWK, not WinBatch).   Right now, it is just click on a picture, see it, go back to the menu, click on another picture, and repeat, but someone suggested/requested that there be a "click to see next/previous picture" functionality.

So, I did a web search for "simple HTML slideshow" and got some useful looking hits - but nothing that was obvious and easy enough for me to implement.  So, I thought about WebBatch and decided to post here.

Is this a live webpage running on a webserver? Or are you trying to accomplish this on a users local workstation?

[snowsnowsnow]

Well, the web site is actually hosted on a Unix (Linux) system, so it looks like, based on what you've said, that WebBatch won't work.

I take it, it's not possible to use WebBatch to generate the HTML code and then copy that to the Linux server, and have it run there?  That's the model that I was hoping for.

In any case, I may try downloading it and messing around with it at some point.  Thanks for the info!

[Deana]

Well, the web site is actually hosted on a Unix (Linux) system, so it looks like, based on what you've said, that WebBatch won't work.

I take it, it's not possible to use WebBatch to generate the HTML code and then copy that to the Linux server, and have it run there?  That's the model that I was hoping for.

In any case, I may try downloading it and messing around with it at some point.  Thanks for the info!

Sorry, WebBatch requires a Windows webserver. Note: You can use WinBatch to generate HTML files. For example: http://techsupt.winbatch.com/webcgi/webbatch.exe?techsupt/tsleft.web+WIL~Extenders/Pixie+Create~Thumbnail~Images~and~Display~in~HTML.txt

You might take a look at the BinaryTag__ functions in WIL, for use with a template file. Here is a nice tutorial that help explain the concept of using Template files that might be helpful: http://techsupt.winbatch.com/webcgi/webbatch.exe?techsupt/tsleft.web+WinBatch/Binary~Functions+!!Processing~Templates~Files~with~BinaryTag~-~Insider~Tech~Notes.txt

[snowsnowsnow]

http://techsupt.winbatch.com/webcgi/webbatch.exe?techsupt/tsleft.web+WIL~Extenders/Pixie+Create~Thumbnail~Images~and~Display~in~HTML.txt

does indeed look interesting.  I looked at it briefly, but it looks like it could be the solution to my problem.

Wil let you know...

[snowsnowsnow]

Well, it seems to work.  But it is a little hard to use in that you have to go back to the "main menu" (the thumbnails) each time.

What I really want is something with 3 options: "Next picture", "Previous picture", "Back to thumbs"

I can probably figure it out myself, but of course, if someone has already done this, and could share, that would be better (wheel re-invention and all that...)

[Deana]

Did you happen to take a look at the link that uses the BinaryTag functions?

http://techsupt.winbatch.com/webcgi/webbatch.exe?techsupt/tsleft.web+WinBatch/Binary~Functions+!!Processing~Templates~Files~with~BinaryTag~-~Insider~Tech~Notes.txt
 
Specifically the example: HTML Slideshow for JPG files. It seems to accomplish the previous and next picture options.

[JTaylor]

Maybe I'm missing something but wouldn't a small bit of javascript do what is needed?   Assuming the picture names are numbers...I tested with 8 pictures so will need to tweak those limitations.

Guessing it could be done better since I don't know much about javascript but might be a start if I haven't missed the whole point of the question.

Jim

Code: HTML5

<html>

<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Slideshow</title>

<script>       

function transition(direction){
  var num = document.getElementById("cntr").value;
  if (direction=="previous")
    {
       num=num-1;
    }
   else
    {
       num++;
    }
    if (num>8) num = 1
    if (num<1) num = 8
   document.getElementById("slide").src = num+'.jpg'  
   document.getElementById("cntr").value  = num;
}
</script>

</head>
<body>

</div>

<div align="center">
<table border="1" width="35%">
        <tr>
                <td colspan="2" align="center">                
                <img id="slide" border="2" src="1.jpg" >               
                </td>
        </tr>
        <tr>
                <td width="44%" align="left">
                <button id="previous" onclick="transition('previous')">Previous</button></td>
                <td width="54%">
                <p align="right">
                <button id="next" onclick="transition('next')">Next</button>
                <input type="hidden" id="cntr" value="1">
                </td>
        </tr>
</table>
</div>
</body>
</html>

 

[snowsnowsnow]

Guessing it could be done better since I don't know much about javascript but might be a start if I haven't missed the whole point of the question.

<Gushes>
Jim, you're a genius!
You say you don't know much, but it's much more than I do (which is zero).
Where did you learn the above stuff?
</Gushes>

That looks just fine.  One request for improvement: Could the filename be displayed along with the picture (so the user will know which file is being viewed).

[snowsnowsnow]

Did you happen to take a look at the link that uses the BinaryTag functions?

Yes, just now.  And, yes, it looks like it will work, too.

That's the kind of AWK-ish solution I was looking for in the first place.  Nice.

That's why I love this board.  Off-topic stuff is not only tolerated, it is is encouraged!  Well done, all!

[JTaylor]

Just things I've picked up along the way, help on this forum and a bit of Googling...

Code: HTML5

<html>

<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Slideshow</title>

<script>       

function transition(direction){
  var num = document.getElementById("cntr").value;
  if (direction=="previous")
    {
       num=num-1;
    }
   else
    {
       num++;
    }
    if (num>8) num = 1
    if (num<1) num = 8
   document.getElementById("slide").src = num+'.jpg'
   document.getElementById("fname").innerHTML = num+'.jpg'
   document.getElementById("fname").href = num+'.jpg'
   document.getElementById("cntr").value = num;
}
</script>

</head>
<body>


<div align="center">
<table border="1" width="35%">
        <tr>
                <td colspan="3" align="center">                
                <img id="slide" border="2" src="1.jpg" >               
                </td>
        </tr>
        <tr>
                <td width="17%" align="left">
                  <button id="previous" onclick="transition('previous')">Previous</button>
                </td>
                <td width="69%" align="center">
                  <a target="_top" href="1.jpg" id="fname">1.jpg</a>
                </td>
                <td width="11%" align="right">
                  <button id="next" onclick="transition('next')">Next</button>
                  <input type="hidden" id="cntr" value="1">
                </td>
        </tr>
</table>
</div>
</body>
</html>