www.webdeveloper.com
Results 1 to 5 of 5

Thread: Need Help Automating Next/Previous Automation

  1. #1
    Join Date
    Feb 2010
    Location
    NYC
    Posts
    2

    Unhappy Need Help Automating Next/Previous Automation

    Hello all, I have been banging my head on the desk trying to figure this out for half a day, so I thought it was time to ask some experts for advice.

    What I am trying to do is upgrade a website for work that has a large number of HTML files manually linked with <back | next> links. Currently, every time I have to add pages, it is a huge pain to re-link every link so that the order is correct.

    I have been trying to make a JavaScript applet that can automatically link the next/back link from the file-names or from an array or text file.

    The best thing I have gotten to work so far is by using numerical (001.html, 002.html) filenames, as coded below.

    Code:
    <script>
    
    var url = document.URL;
    var ThisPage=parseInt(url.substring(url.lastIndexOf("\/")+1,url.lastIndexOf("\.")),10);
    var NextPage=ThisPage+1;
    var PrevPage=ThisPage-1;
    
    </script>
    
    <!-- previous link -->
    <a href=javascript:void() onClick=previousnext(this,-1)>Prev</a>
    
    <!-- next link -->
    <a href=javascript:void() onClick=previousnext(this,1)>Next</a>
    This is very limited however, since if there is no way to disable the prev on the first page, or next on the last page, and adding pages in between number would involve having to rename every file after it.

    After a lot more Googling, I came across this script, which seems like it would do EXACTLY what I need, by using an array or file that has an index of the pages in order of navigation. This way there is a definite first and last page, and order can be changed easily. The link is here:

    The head code is:
    Code:
    <script type="text/javascript">
        function previousnext(anchor,n){
        
        // set up regex and input
        var reggie = /href=\"([^\"]+)\"/gi;
        var inputstr = '%toolbar%';
        
        //perform match
        var outputstr = inputstr.match(reggie);
        
        //this page
        var fname = location.href; 
        ii=0;
        for(i=0;i<fname.length;i++) 
            {
            if(fname.charAt(i) == '/') ii=i;
            }
        var thisPage = fname.substring(ii+1,fname.length);
        
        //find match
        ii=0;
        for(i=0;i<outputstr.length;i++)
            {
            jj=0;
            for(j=0;j<outputstr[i].length;j++)
                {
                if(outputstr[i].charAt(j) == '\"')
                    {
                    jj=j;
                    break;
                    }
                }
            outputstr[i] = outputstr[i].substring(jj+1,outputstr[i].length-1);
            if(thisPage == outputstr[i]) ii=i;
            }
        
        //set previous & next
        if(n==-1)
            { 
            if(!(ii == 0)) anchor.href=outputstr[ii-1];
            }
        if(n==1)
            {
            if(!(ii == outputstr.length-1)) anchor.href=outputstr[ii+1];
            }
        }
    </script>
    Body:
    Code:
    <!-- previous link -->
    <a href=javascript:void() onClick=previousnext(this,-1)>Prev</a>
    
    <!-- next link -->
    <a href=javascript:void() onClick=previousnext(this,1)>Next</a>
    I have been trying to modify this thing to work, but I can't figure out what this %toolbar% thing is, the 'reggie' variable can not be evaluated. I have tried creating an array of filenames as a var instead of %toolbar%, but I can't even get past setting up the regular expression 'reggie'

    Any suggestions or help would be greatly appreciated.

    Thanks in Advance

    Stan

  2. #2
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Code:
    function padFilename(page) {
    while( page.length < 3 ) {
    	page = '0' + page;
    	}
    return page;
    }
    
    var url = document.URL;
    var ThisPage=parseInt(url.substring(url.lastIndexOf("\/")+1,url.lastIndexOf("\.")),10);
    var LastPage = '999'; // must be updated
    var NextPage=(ThisPage!=LastPage)? ''+(ThisPage+1) : '001';
    var PrevPage=(ThisPage!=1)? ''+(ThisPage-1) : LastPage;
    if(NextPage.length<3) {NextPage = padFilename(NextPage);}
    if(PrevPage.length<3) {PrevPage = padFilename(PrevPage);}
    alert(PrevPage+":"+NextPage)
    At least 98% of internet users' DNA is identical to that of chimpanzees

  3. #3
    Join Date
    Feb 2010
    Location
    NYC
    Posts
    2

    Smile Got 'r done

    Thanks Fang,

    Just got it working exactly the way I wanted with your help and come tweaking. Here is my modified code, I made it so that the prev link is disabled on the first page and next is disabled on the last instead of looping. Also made is so that I can prefix the filename with anything as long as it ends with three numbers. Externalized into a js file here:

    Code:
    // JavaScript Document
    
    function padFilename(page) {
    while( page.length < 3 ) {
    	page = '0' + page;
    	}
    return page;
    }
    
    var url = document.URL;
    
    var ThisPage=parseInt( url.substring(url.lastIndexOf("\.")-3,url.lastIndexOf("\.")),10); //grabs last three numbers from page name
    
    var PagePrefix=url.substring(url.lastIndexOf("\/")+1,url.lastIndexOf("\.")-3); //grabs prefix of page number
    
    var FirstPage = '500'; // must be updated
    var LastPage = '503'; // must be updated
    var NextPage=(ThisPage!=LastPage)? ''+(ThisPage+1) : FirstPage; 
    var PrevPage=(ThisPage!=1)? ''+(ThisPage-1) : LastPage;
    if(NextPage.length<3) {NextPage = padFilename(NextPage);}
    if(PrevPage.length<3) {PrevPage = padFilename(PrevPage);}
    
    function WriteNext() {
    if(ThisPage == LastPage) {document.write('Next &gt;');}
    else{document.write('<a href="' + PagePrefix + NextPage + '.html' + '">' + 'Next &gt;' + '</a>');}
    
    }
    
    function WritePrev(){
    if (ThisPage == FirstPage) {document.write('&lt; Prev');}
    else {document.write('<a href="' + PagePrefix + PrevPage + '.html' + '">' + '&lt; Prev' + '</a>');}
    }
    Then I just call the WriteNext() and PritePrev() functions in any page.

    The last thing I might try to add is some way to chose from multiple values of the FirstPage and LastPage variables for a specific prefix.

    Thanks Again

  4. #4
    Join Date
    Jan 2010
    Posts
    25
    I'd like to point out that you are using the wrong tool for the job. It sounds like you need to look into something like PHP or something similar to create a more easily maintainable website.

    PHP isn't hard to learn and cases like this being solved with Javascript alienates people who don't use or can't use it, whereas PHP is run on the server.

    Any server-side scripting language can resolve this, just mentioning PHP specially because it's what I personally am fluent in.

  5. #5
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Quote Originally Posted by Powersurge360 View Post
    I'd like to point out that you are using the wrong tool for the job. It sounds like you need to look into something like PHP or something similar to create a more easily maintainable website.
    True for the majority of questions asked in the JavaScript forum. Your site should be functional without JavaScript.
    At least 98% of internet users' DNA is identical to that of chimpanzees

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles