Solved

jQuery, JavaScript - help with optimizing Prev / Next navigation codes

Posted on 2013-05-09
2
310 Views
Last Modified: 2013-05-10
I have working codes that get a variable that tells the number of available index pages. Based on the number and the current file name, sets a Prev page and Next page URL.

Current codes are too long and not very flexible. How can I make my codes more optimized and be production ready?

Here is JSFiddle

e.g)
If index3.html is not available, index2.html's next page URL is index1.html
index.html (index.html is a landing page only and doesn't need to be included in the prev nor next page navigation)
index1.html
index2.html
index3.html..

HTML

<div class="leftArrow"><a href="#"><<</a></div>
<div class="rightArrow"><a href="#">>></a></div>

Open in new window

JavaScript

var currentindex = '4'; //updated based on the current index data 

var indexNum = parseInt(currentindex);
var currentURL  = document.location.href.substring(document.location.href.lastIndexOf("/")+1, document.location.href.length);

var baseURL ="/en_US/";

var leftURL = "";
var rightURL = "";

switch(indexNum)
{
case 2: 
// if there are only index, index1, and index2

  if((currentURL.indexOf("index.html")>-1)||(currentURL.indexOf("index.")>-1)){
     leftURL= baseURL + "index" + parseInt(indexNum+1) + ".html";
     rightURL= baseURL + "index" + parseInt(indexNum+1) + ".html";
   } else {
     leftURL= baseURL + "index" + parseInt(indexNum-1) + ".html";
     rightURL= baseURL + "index" + parseInt(indexNum+1) + ".html";
   }
  break;
case 3:

  // if on index3.html or index.html
  // make the right arrow URL go back to index1.html

  if((currentURL.indexOf("index3.html")>-1)||(currentURL.indexOf("index.")>-1)){
     leftURL= baseURL + "index" + parseInt(indexNum-1) + ".html";
     rightURL= baseURL + "index" + parseInt(indexNum-2) + ".html";
   } else {
     leftURL= baseURL + "index" + parseInt(indexNum-1) + ".html";
     rightURL= baseURL + "index" + parseInt(indexNum+1) + ".html";
   }
  break;
case 4:
  if((currentURL.indexOf("index4.html")>-1)||(currentURL.indexOf("index.")>-1)){
     leftURL= baseURL + "index" + parseInt(indexNum-1) + ".html";
     rightURL= baseURL + "index" + parseInt(indexNum-3) + ".html";
   } else {
     leftURL= baseURL + "index" + parseInt(indexNum-1) + ".html";
     rightURL= baseURL + "index" + parseInt(indexNum+1) + ".html";
   }
  break;
case 5:
  if((currentURL.indexOf("index5.html")>-1)||(currentURL.indexOf("index.")>-1)){
     leftURL= baseURL + "index" + parseInt(indexNum-1) + ".html";
     rightURL= baseURL + "index" + parseInt(indexNum-3) + ".html";
   } else {
     leftURL= baseURL + "index" + parseInt(indexNum-1) + ".html";
     rightURL= baseURL + "index" + parseInt(indexNum+1) + ".html";
   }
  break;
default:
     // if no current index, disable the link
     leftURL= baseURL + "#";
     rightURL= baseURL + "#";
  
}

var leftArrow =$(".leftArrow").find("a").attr("href",leftURL);
var rightArrow =$(".rightArrow").find("a").attr("href",rightURL);

Open in new window

0
Comment
Question by:sunflowersh
2 Comments
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 39155479
What is the problem with the following?
var indexNum = currentindex * 1;
var prevIndexNum = indexNum - 1;
var nextIndexNum = indexNum + 1;
 
baseURL += "index";
var leftArrow = $(".leftArrow").find("a").attr("href", baseURL + prevIndexNum + ".html");
var rightArrow =$(".rightArrow").find("a").attr("href", baseURL + nextIndexNum + ".html");

Open in new window

0
 
LVL 2

Author Closing Comment

by:sunflowersh
ID: 39157190
Thank you!
0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Introduction Chart.js, used properly, can visually add a difference to your charting applications. It engages your visitors and allows them to interact with data they otherwise wouldn't be able to without expensive and complicated systems. For this…
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

708 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

17 Experts available now in Live!

Get 1:1 Help Now