Sign up ×
Code Review Stack Exchange is a question and answer site for peer programmer code reviews. It's 100% free, no registration required.

Fiddle: http://jsfiddle.net/fhBd5/

So the above is working but I'm having trouble trying to come up with a clean and concise way to do some type of loop on the if or statements.

Any help is very much appreciated!

var checkPositionOnLoad = function (e) {
        var currentPos = 0;
        var listItem = document.getElement('li.current');
        var currentSelected = $('list').getChildren('li').indexOf(listItem) + 1;

        if (currentSelected <= 3) {
            return false;
        }
        if(currentSelected==4||currentSelected==5||currentSelected==6){
            currentPos = -300 * 1;
            $('list').setStyle('left', currentPos);      
        }
        else if(currentSelected== 7||currentSelected==8||currentSelected==9){
            currentPos = -300 * 2;
            $('list').setStyle('left', currentPos);      
        }
        else if(currentSelected==10||currentSelected==11||currentSelected==12){
            currentPos = -300 * 3;
            $('list').setStyle('left', currentPos);      
        }
        else if(currentSelected==13||currentSelected==14||currentSelected==15){
            currentPos = -300 * 4;
            $('list').setStyle('left', currentPos);       
        };

    };
share|improve this question
    
Please post code into question. We can grantee that jsfiddle.net will be available in the future and thus the question may becomes meaningless for other people when reading it. –  Loki Astari Nov 22 '11 at 17:07
    
@LokiAstari not a problem! –  Starboy Nov 22 '11 at 18:10

1 Answer 1

up vote 1 down vote accepted

Here is my slightly "mathematical" version of the function you have posted:

var checkPositionOnLoad = function (e) {
    var currentPos = 0;
    var listItem = document.getElement('li.current');
    var currentSelected = $('list').getChildren('li').indexOf(listItem) + 1;

    currentPos = -300 * (Math.floor((currentSelected + 2) / 3) - 1);

    $('list').setStyle('left', currentPos);
};

I will try to explain how I got to that succinct version.

I removed the duplication and wrote the function as follows:

var checkPositionOnLoad = function (e) {
    var currentPos = 0;
    var listItem = document.getElement('li.current');
    var currentSelected = $('list').getChildren('li').indexOf(listItem) + 1;

    if (currentSelected <= 3) {
        currentPos = -300 * 0;
    }
    if (currentSelected == 4 || currentSelected == 5 || currentSelected == 6) {
        currentPos = -300 * 1;
    }
    else if (currentSelected == 7 || currentSelected == 8 || currentSelected == 9) {
        currentPos = -300 * 2;
    }
    else if (currentSelected == 10 || currentSelected == 11 || currentSelected == 12) {
        currentPos = -300 * 3;
    }
    else if (currentSelected == 13 || currentSelected == 14 || currentSelected == 15) {
        currentPos = -300 * 4;
    };

    $('list').setStyle('left', currentPos);
};

Then I realized you want to figure where a given selected element falls (in which group of triplets that is {1, 2, 3} {4, 5, 6}, etc..). I played around and came up with a mathematical formula:

Math.floor((i + 2) / 3) 

This basically tells you that for i = 7, the selected element falls in the third group {7, 8, 9} which is the third triplet after {1, 2, 3} and {4, 5, 6}

And the left property can be set using:

var currentPos = -300 * (Math.floor((i + 2) / 3) - 1); // (-1 to make it zero-based index)

And that's it.

share|improve this answer
    
Anas thanks so much! This is exactly what I needed! Brilliant! –  Starboy Nov 22 '11 at 18:37

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.