Automagic Previous / Next Links

[Ian Rastall]

I do a site where I have a previous and next link at the bottom of
every page. It looks like:

<p><a href="foo01.html">Previous</a> | <a href="foo03.html">Next</a></p>

Seeing as they're always in sequential order, is there a way to
automagically go to the previous file or the next file using JS?

Ian
--
http://sundry.ws

[Evertjan.]

Ian Rastall wrote on 18 mrt 2006 in comp.lang.javascript:

I do a site where I have a previous and next link at the bottom of
every page. It looks like:

<p><a href="foo01.html">Previous</a> | <a href="foo03.html">Next</a></p>

Seeing as they're always in sequential order, is there a way to
automagically go to the previous file or the next file using JS?

Using serverside J(ava)script/ASP:

<%@ language="jscript"%>
<%
thisOne = request.servervariables('SCRIPT_NAME')
thisNumber = +thisOne.replace(/.*?\//g,'').replace(/\D+/g,'')

nextNumber = ++thisnumber
if(nextNumber<0||nextNumber>99)nextNumber=0
nextNumber = (nextNumber<10)?'0'+nextNumber:nextNumber

//about the same for lastNumber

%>

<a href="foo<%=lastNumber%>.html">Previous</a> |
<a href="foo<%=nextNumber%>.html">Next</a>

Not tested

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[Ian Rastall]

Evertjan. wrote:

Using serverside J(ava)script/ASP:

Hi Evertjan. I've never used server-side JS, and don't know if
AffordableHost uses it. (I'd have to ask.) Two questions:

1. Would it require me to change the extensions?
2. Can it be done client-side?

What I'm trying to do is make every page as close to the same as
possible. I'm working with over 2,500 files right now, and doing them
by hand.

I wonder if a preprocessor would work, but that's a question for
CIWAH, I imagine.

Ian
--
http://sundry.ws

[David Dorward]

Ian Rastall wrote:

Evertjan. wrote:

Using serverside J(ava)script/ASP:

1. Would it require me to change the extensions?
That depends on the host
2. Can it be done client-side?
Then it would break if client side scripting was unavailable or turned off
(this covers a significant number of users and all major search engine
indexers).
I wonder if a preprocessor would work,
Probably
but that's a question for CIWAH, I imagine.

You could write one in JavaScript :)

--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
Home is where the ~/.bashrc is

[Ian Rastall]

David Dorward wrote:

Ian Rastall wrote:

2. Can it be done client-side?

Then it would break if client side scripting was unavailable or turned off
(this covers a significant number of users and all major search engine
indexers).

Okay, here's an idea. This is along the lines of graceful degradation.
If I coded the "Previous | Next" entirely in JS, including the HTML
bits, it would simply not be there if the user had JS turned off, and
they would just go back up to the top of the file and refer to the
table of contents. Not as handy, but still useable. The site wouldn't
break.

So *is* this something that can be done client-side? I've realized
that a pre-processor would be almost as much trouble, and the reason I
ask about JS is so I don't have to change the extensions. I have no
idea how I would redirect 2,500 pages from .html to .php or something,
unless there were a way to do it in .htaccess. Granted, most people
probably have only the front page bookmarked, but still....

Ian
--
http://sundry.ws

[TheBagbournes]

Ian Rastall wrote:

I do a site where I have a previous and next link at the bottom of every
page. It looks like:

<p><a href="foo01.html">Previous</a> | <a href="foo03.html">Next</a></p>

Seeing as they're always in sequential order, is there a way to
automagically go to the previous file or the next file using JS?

Ian

Look at top.location.href (which will be something like
"http://host/root/whatever/foo03.html")

Parse out the number, put the new number into that string and put it
into top.location.href.

[Ian Rastall]

TheBagbournes wrote:

Look at top.location.href (which will be something like
"http://host/root/whatever/foo03.html")

Parse out the number, put the new number into that string and put it
into top.location.href.

Thanks! I'm definitely not sleeping now. :-)

Ian
--
http://sundry.ws

[Ian Rastall]

TheBagbournes wrote:

Parse out the number, put the new number into that string and put it
into top.location.href.

Okay, I'm making progress, but I'm a bit stuck. The bottom of the page
looks like:

<a href="#" onclick="previous();">Previous</a> | <a href="#"
onclick="next();">Next</a></p>

and in the <script> section, for the first function, there's:

var addy = top.location.href;
function previous() {
var result1 = addy.indexOf(".html");
var num1 = addy.substring(result1-3,result1);
if(isNaN(num1)){
num1 = addy.substring(result1-2,result1);
}
num1--;
}

I know it's a mess. The problem is, it's a string up until it gets
decremented, at which time it becomes a number, and loses the leading
0. This won't always be a problem, but it will whenever there's a
leading zero. I also have no idea how to put the number back into the
string. Am I going about this the wrong way?

Ian
--
http://sundry.ws

[Evertjan.]

Ian Rastall wrote on 18 mrt 2006 in comp.lang.javascript:

Evertjan. wrote:

Using serverside J(ava)script/ASP:
Hi Evertjan. I've never used server-side JS, and don't know if
AffordableHost uses it. (I'd have to ask.) Two questions:

1. Would it require me to change the extensions?

You would need a server with ASP. The extensins are usually .asp but could
be set to anything.
2. Can it be done client-side?
Sure, but not as nice and not as usefull.

[php would be just as good as ASP, but that is not j(ava)script]
What I'm trying to do is make every page as close to the same as
possible. I'm working with over 2,500 files right now, and doing them
by hand.
2,500 files without serverside programming does not sound very usable.

With serverside ASP and includes, you write only one include file and
include the file in all 2,500.
I wonder if a preprocessor would work, but that's a question for
CIWAH, I imagine.

Don't know anythng about that.
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[Evertjan.]

Ian Rastall wrote on 18 mrt 2006 in comp.lang.javascript:

TheBagbournes wrote:

Parse out the number, put the new number into that string and put it
into top.location.href.

Okay, I'm making progress, but I'm a bit stuck. The bottom of the page
looks like:

<a href="#" onclick="previous();">Previous</a> | <a href="#"
onclick="next();">Next</a></p>

and in the <script> section, for the first function, there's:

var addy = top.location.href;
function previous() {
var result1 = addy.indexOf(".html");
var num1 = addy.substring(result1-3,result1);
if(isNaN(num1)){
num1 = addy.substring(result1-2,result1);
}
num1--;
}

I know it's a mess. The problem is, it's a string up until it gets
decremented, at which time it becomes a number, and loses the leading
0. This won't always be a problem, but it will whenever there's a
leading zero. I also have no idea how to put the number back into the
string. Am I going about this the wrong way?

Yes you are.

Look at my earlier serverside code and use the same clientside:

================================

var thisNumber = top.location.href;
thisNumber = +thisOne.replace(/.*?\//g,'').replace(/\D+/g,'')

var lastNumber = thisnumber-1
if (lastNumber <0) lastNumber = 0
lastNumber = (lastNumber <10) ? '0'+lastNumber : lastNumber

document.write('<a href="foo'+lastNumber +'.html">Last</a> |')

var nextNumber = thisnumber+1
if(nextNumber<0||nextNumber>99)nextNumber=0
nextNumber = (nextNumber<10)?'0'+nextNumber:nextNumber

document.write('<a href="foo'+nextNumber+'.html">Next</a>')

=================================

not tested

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[Evertjan.]

David Dorward wrote on 18 mrt 2006 in comp.lang.javascript:

2. Can it be done client-side?

Then it would break if client side scripting was unavailable or turned
off (this covers a significant number of users and all major search
engine indexers).

Not necessarily, use the DOM for changing the default nonscripted html:

<div id=mydiv>
<a href="fooDefault.html">go to choice page</a>
[or simpler code]
</div>

<script type=...>
...............

var mydiv = document.getelementById('mydiv')
mydiv.innerHTML = '<a href="foo'+nextNumber+'.html">Next</a>'
</script>
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[Ian Rastall]

Evertjan. wrote:

================================

var thisNumber = top.location.href;
thisNumber = +thisOne.replace(/.*?\//g,'').replace(/\D+/g,'')

var lastNumber = thisnumber-1
if (lastNumber <0) lastNumber = 0
lastNumber = (lastNumber <10) ? '0'+lastNumber : lastNumber

document.write('<a href="foo'+lastNumber +'.html">Last</a> |')

var nextNumber = thisnumber+1
if(nextNumber<0||nextNumber>99)nextNumber=0
nextNumber = (nextNumber<10)?'0'+nextNumber:nextNumber

document.write('<a href="foo'+nextNumber+'.html">Next</a>')

=================================

Oh my goodness, and I just finshed, too! Here's what I wrote:

===================================

var addy = top.location.href;
function previous() {
var result1 = addy.indexOf(".html");
var num1 = addy.substring(result1-3,result1);
if(isNaN(num1)){
num1 = addy.substring(result1-2,result1);
num1--;
var backa = num1.toString();
if(backa.indexOf("0")){
backa = "0" + backa;}
var newaddya = addy.slice(0,result1-2);
newaddya = newaddya + backa + ".html";
location.href = newaddya;
} else {
num1--;
var backb = num1.toString();
if(backb.indexOf("00")){
backb = "00" + backb;} else if(backb.indexOf("0")) {
backb = "0" + backb;}
var newaddyb = addy.slice(0, result1-3);
newaddyb = newaddyb + backb + ".html";
location.href = newaddyb;
}
}
function next() {
var result2 = addy.indexOf(".html");
var num2 = addy.substring(result2-3,result2);
if(isNaN(num2)){
num2 = addy.substring(result2-2,result2);
num2++;
var backc = num2.toString();
if(backc.indexOf("0")){
backc = "0" + backc;}
var newaddyc = addy.slice(0,result2-2);
newaddyc = newaddyc + backc + ".html";
location.href = newaddyc;
} else {
num2++;
var backd = num2.toString();
if(backd.indexOf("00")){
backd = "00" + backb;} else if(backd.indexOf("0")) {
backd = "0" + backd;}
var newaddyd = addy.slice(0, result2-3);
newaddyd = newaddyd + backd + ".html";
location.href = newaddyd;
}
}

=================================

Sorry for the length. You know, I hate to say it, but I think I pasted
this in just to lament the inelegance of my code. I mean, it works,
but it's ugly. I'm going to try what you wrote and see if I can't make
it work. Thanks for the suggestion.

Ian
--
http://sundry.ws

[Ian Rastall]

Ian Rastall wrote:

I'm going to try what you wrote and see if I can't make it
work.

Well, I fixed a few bugs and got it to work for the "Previous" link,
but not the "Next" link, as it thinks the page number is a string by
the time it gets to that point in the program, so "2" becomes "21",
not "3". Probably easy to fix, but one problem is that this only works
within one folder. The "foo" in this case changes for each book. My
code, though ugly, works across the whole site, so I'll probably just
go with that, and try not to get hit by lightning. :-)

Thanks for all the help.

Ian
--
http://sundry.ws

[Evertjan.]

Ian Rastall wrote on 18 mrt 2006 in comp.lang.javascript:

Ian Rastall wrote:

I'm going to try what you wrote and see if I can't make it
work.

Well, I fixed a few bugs and got it to work for the "Previous" link,
but not the "Next" link, as it thinks the page number is a string by
the time it gets to that point in the program, so "2" becomes "21",
not "3". Probably easy to fix, but one problem is that this only works
within one folder. The "foo" in this case changes for each book. My
code, though ugly, works across the whole site, so I'll probably just
go with that, and try not to get hit by lightning. :-)

Thanks for all the help.

Ian

you could also detect the part before the number by regex deleting the part
from the first figure:

var s = 'abcd1234.html'
var beforenumber = s.replace(/\d.*/,'')
alert(beforenumber) // shows: abcd

tested ;-)

==============

btw, I would urgently urge you to take the serverside code way,
sidestepping all the inconsistencies of clientside scripting.

Having heard the amount of pages, Ian, your site consists of,
it can only be to your advantage.

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[Ian Rastall]

Evertjan. wrote:

I would urgently urge you to take the serverside code way,
sidestepping all the inconsistencies of clientside scripting.

Hi Evertjan. I know it's off-topic to a JavaScript group, but is
..htaccess the best way to redirect all those pages, since I'll be
changing the extension on them? I can ask on CIWAH if need be.

Ian
--
http://sundry.ws

[Evertjan.]

Ian Rastall wrote on 18 mrt 2006 in comp.lang.javascript:

Evertjan. wrote:

I would urgently urge you to take the serverside code way,
sidestepping all the inconsistencies of clientside scripting.

Hi Evertjan. I know it's off-topic to a JavaScript group, but is
.htaccess the best way to redirect all those pages, since I'll be
changing the extension on them? I can ask on CIWAH if need be.

..htaccess is linux only, I presume, so php.

Jscript serverside is on Windows servers under ASP.

redirection under ASP can easily and "dedicatedly" be done
in a dedicated 404.asp page, like this:

===================================
<% ' vbscript, ASP, 404.asp-page

qstr = lcase(Request.ServerVariables("QUERY_STRING"))
pos = instr(qstr,"/myolddirectory/")

if pos>0 and instr(qstr,".html")>0 then
file = mid(qstr, instr(qstr,pos+16)
file = "/mynewASPdirectory/" & replace(file,".html",".asp")
server.transfer file
end if

%>

file <%=qstr %> not found, this is the 404 page<hr>
===================================

not tested.

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[Randy Webb]

Evertjan. said the following on 3/18/2006 1:28 PM:

Ian Rastall wrote on 18 mrt 2006 in comp.lang.javascript:

Evertjan. wrote:

I would urgently urge you to take the serverside code way,
sidestepping all the inconsistencies of clientside scripting.

Hi Evertjan. I know it's off-topic to a JavaScript group, but is
.htaccess the best way to redirect all those pages, since I'll be
changing the extension on them? I can ask on CIWAH if need be.

..htaccess is linux only, I presume, so php.

No. .htaccess is Apache and has nothing to do with the server side
language or the OS. Apache for Windows has .htaccess as well.

Sidenote: One thing that has not been mentioned yet as a drawback to
client-side scripting is that it has no way of knowing the last page
unless you update the script every time you add a page.

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

[Evertjan.]

Randy Webb wrote on 18 mrt 2006 in comp.lang.javascript:

..htaccess is linux only, I presume, so php.

No. .htaccess is Apache and has nothing to do with the server side
language or the OS. Apache for Windows has .htaccess as well.

Ah...pache, Indian story?
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[Randy Webb]

Evertjan. said the following on 3/18/2006 5:48 PM:

Randy Webb wrote on 18 mrt 2006 in comp.lang.javascript:

..htaccess is linux only, I presume, so php.

No. .htaccess is Apache and has nothing to do with the server side
language or the OS. Apache for Windows has .htaccess as well.

Ah...pache, Indian story?

Yup, brave warrior he was :) Or was it a she? Hmmmmm

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

[Lasse Reichstein Nielsen]

Ian Rastall <id*******@gmail.com> writes:

I do a site where I have a previous and next link at the bottom of
every page. It looks like:

<p><a href="foo01.html">Previous</a> | <a href="foo03.html">Next</a></p>

Seeing as they're always in sequential order, is there a way to
automagically go to the previous file or the next file using JS?

If you know the algorithm for computing the link to the next/previous
page from the URL of the current one, sure:

function addPrevNext() {
var prevLink = calculatePrevLink(location.href);
var nextLink = calculateNextLink(location.href);
var p = document.createElement("p")
if (prevLink) {
var pa = document.createElement("a");
pa.href = prevLink
pa.appendChild(document.createTextNode("Previous") );
p.appendChild(pa);
if (nextLink) {
p.appendChild(document.createTextNode(" | "));
}
}
if (nextLink) {
var na = document.createElement("a");
na.href = nextLink
na.appendChild(document.createTextNode("Next"));
p.appendChild(na);
}
document.body.appendChild(p);
}

You must then implement the strategy for finding previous/next links,
e.g.:

function modifyStringNumber(string, mod) {
var n = String(Number(string) + mod);
if (string.charAt(0)=='0') { // prefix 0's
while(n.length < string.length) {
n = "0" + n;
}
}
return n;
}
function calculatePrevLink(url) {
return url.replace(/\d+/g, function(match,index,string) {
return modifyStringNumber(match, -1);
});
}
function calculateNextLink(url) {
return url.replace(/\d+/g, function(match,index,string) {
return modifyStringNumber(match, +1);
});
}

However, you might want to use the feature defined in the HTML standard
for specifying previous and next page links:
<link rel="prev" href="foo03.html">
<link rel="next" href="foo03.html">

/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

[Ian Rastall]

Lasse Reichstein Nielsen wrote:

If you know the algorithm for computing the link to the next/previous
page from the URL of the current one, sure:

Thanks, Lasse. I'll see if I can get that to work. I thought the
script I had written was working fine, but there were problems with
it, not least of which that when it runs into the first file it can't
go back any further ... though it tries. Thanks again.

Ian
--
http://sundry.ws

[Thomas 'PointedEars' Lahn]

Ian Rastall wrote:

I've realized that a pre-processor would be almost as much trouble, and
the reason I ask about JS is so I don't have to change the extensions. I
have no idea how I would redirect 2,500 pages from .html to .php or
something,

<URL:http://www.w3.org/QA/Tips/uri-choose>
PointedEars

[Dr John Stockton]

JRS: In article <JB******************@fe08.news.easynews.com>, dated
Sat, 18 Mar 2006 09:42:02 remote, seen in news:comp.lang.javascript, Ian
Rastall <id*******@gmail.com> posted :

I do a site where I have a previous and next link at the bottom of
every page. It looks like:

<p><a href="foo01.html">Previous</a> | <a href="foo03.html">Next</a></p>

Seeing as they're always in sequential order, is there a way to
automagically go to the previous file or the next file using JS?

You say elsewhere that you are editing 2500 pages manually.

Assuming you have access to DOS, Windows, or UNIX, you should be able to
do many repeated edits with MiniTrue.

Number your pages from, say, 10000 or 1000000 and then you will never be
troubled by leading zeroes.

If you have access to DOS or Windows, then COLS, via
<URL:http://www.merlyn.demon.co.uk/programs/00index.htm>,
should be able to generate a batch file to rename them ...
and a MiniTrue command file to alter all the extant links.
Use script to write that paragraph, and then in the absence of script it
will not appear; be sure to have always a link to the index page.

The script on each page should just be like

<script type="text/javascript"> LastNext() </script>

with function LastNext() defined in an Include file as in
<URL:http://www.merlyn.demon.co.uk/js-nclds.htm>.
To get the current page number, try

var N = +location.href.match(/(\d+)\.html/)[1]

To construct a new name

vat S = "foo" + (N+1) + ".html"

--
© John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v4.00 MIME. ©
Web <URL:http://www.merlyn.demon.co.uk/> - FAQish topics, acronyms, & links.
I find MiniTrue useful for viewing/searching/altering files, at a DOS prompt;
free, DOS/Win/UNIX, <URL:http://www.idiotsdelight.net/minitrue/>

[Ian Rastall]

Dr John Stockton wrote:

To get the current page number, try

var N = +location.href.match(/(\d+)\.html/)[1]

To construct a new name

vat S = "foo" + (N+1) + ".html"

Thanks, John. I will hopefully have this problem solved soon, and this
group has been a big help. Hope you're well,

Ian
--
http://sundry.ws

[Dr John Stockton]

JRS: In article <Xf********************@comcast.com>, dated Sat, 18 Mar
2006 17:51:13 remote, seen in news:comp.lang.javascript, Randy Webb
<Hi************@aol.com> posted :

Sidenote: One thing that has not been mentioned yet as a drawback to
client-side scripting is that it has no way of knowing the last page
unless you update the script every time you add a page.

That's no great problem, since the script should be in an include file.

It's easy enough, if desired (assuming DOS batch or UNIX or HLL[*]) to
process the master directory and update the include file. IIRC, an
include file can cause another include file to be included; and that
only need contain

var MaxPage = 1002500

which can readily enough be generated in Batch.
Alternatively, label the Next button "Try for the next page" ... <g>.

[*] In Win32+, that could be done with the aid of javascript executed by
CSCRIPT, or by in DOS/Win/UNIX by MiniTrue; example :

dir *.bat | mtr -c- -x+ -o "^\s*(\d+) file\(s\).*" = "\r\n\tvar MaxPage = \1\r\n\r\n"

-> var MaxPage = 25

which edits the
25 file(s) 10,599 bytes
line given by DOS dir.

Or, for not too many files,

dir *.bat | OVER | COLS & #9 ` 'var * 'MaxPage * '= * 1-10 .
-> var MaxPage = 25

or HUNT *.bat q0 | COLS &3 #9 ` 'var * 'MaxPage * '= * 31+7 .

HUNT, OVER, COLS, for DOS, via
<URL:http://www.merlyn.demon.co.uk/programs/00index.htm>

--
© John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v4.00 MIME. ©
Web <URL:http://www.merlyn.demon.co.uk/> - FAQish topics, acronyms, & links.
I find MiniTrue useful for viewing/searching/altering files, at a DOS prompt;
free, DOS/Win/UNIX, <URL:http://www.idiotsdelight.net/minitrue/>