var getRandomNo = function(seed){
var minAlowed = 4000;
var randXresult;
var randYresult;
var randMP;
arrayOfRandoms=[]
// random number 1
var randNo1 = Math.random(seed)*6000;
if(randNo1< minAlowed){
randNo1+=1050;}
// random number 2
var randNo2 = Math.random(seed)*6000;
if(randNo2< minAlowed){
randNo2+=590;}
// random x direction
var mathStartX = Math.random(seed)*6;
if(mathStartX>3)
{randXresult="right";}
else{randXresult="left"}
// random Y direction
var mathStartY = Math.random(seed)*6;
if(mathStartY>3)
{randYresult="top";}
else{randYresult="bottom"}
// random - or +
var mathStartNP = Math.random(seed)*6;
if(mathStartNP>3){
randMP="-";
}
else{randMP=" "};
var explodeSpeed = Math.random(seed)*2000;
if(explodeSpeed<500){explodeSpeed=+500}
// Set them to an array taht will return!
arrayOfRandoms[0] = parseInt(randNo1,10);
arrayOfRandoms[1] = parseInt(randNo2,10);
arrayOfRandoms[2] = randXresult;
arrayOfRandoms[3] = randYresult;
arrayOfRandoms[4] = randMP;
// added on Feb 18
arrayOfRandoms[5] = explodeSpeed
return arrayOfRandoms;
}
$(".innerColContainer>div").not(":animated").find(".lernMore").toggle(
function(){
$(this).html("Go Back").parent().parent().addClass("moreOpen").siblings().each(function(i){
// very big improvment here, calling getRandomNo() once per element instead of 4 times per el.
var temRandArray = getRandomNo(i)
var Xrandom =temRandArray[2];
var Yrandom =temRandArray[3];
var readRandNo1 = temRandArray[4] +temRandArray[0];
var readRandNo2 = temRandArray[4] +temRandArray[1];
//added on feb 18
var eachSpeed = temRandArray[5]
var props = {};
props[Xrandom]=readRandNo1;
props[Yrandom]=readRandNo2;
$(this).animate(props, eachSpeed);
})
.end()
.css({"position":"absolute",
top:0,
left:0})
.animate({"width":"465px"},eachSpeed)
.find(".more")
.fadeIn(eachSpeed);
},
function(){
$(this)
.html("Learn more")
.parent()
.parent()
.removeClass("moreOpen")
.siblings()
.css("position","relative")
.animate({
left:"0",
right:"0",
top:"0",
bottom:"0",
opacity:1},500,
function(){
$(".innerColContainer div")
.removeAttr("style");
})
.end()
.css("position","relative")
.animate({"width":"220px"},500)
.find(".more").fadeOut();
})
Refactorings
No refactoring yet !
Thomas Salvador
February 21, 2010, February 21, 2010 21:28, permalink
hi,
i suggest to change the way you get the random numbers. Instead of fetching the number and changing it, if too low, just get a smaller random number and add the minimum in every case.
for example
instead: rand = Math.random(seed)*6000; if (rand < minAlowed) rand += 1050;
[range is: 1050 .. 6000]
say: rand = 1050 + Match.random(seed)*(6000-1050);
[range is: 1050 .. 6000]
in addition you may want to use the conditional operator "?", to make it more compact.
attached an updated getRandomNo(). i do not use constants here for clarity.
regards,
thomas.
var getRandomNo = function(seed){
var minAlowed = 4000;
var randXresult;
var randYresult;
var randMP;
arrayOfRandoms=[];
arrayOfRandomd[0] = parseInt(1050 + Match.random(seed)*(6000-1050), 10);
arrayOfRandoms[1] = parseInt(1050 + Match.random(seed)*(6000-1050), 10);
arrayOfRandoms[2] = (Math.random(seed)*6 > 3 ? "right" : "left");
arrayOfRandoms[3] = (Math.random(seed)*6 > 3 ? "top" : "bottom");
arrayOfRandoms[4] = (Math.random(seed)*6 > 3 ? "-" : " ");
arrayOfRandoms[5] = 500 + Match.random(seed)*(2000-500);
return arrayOfRandoms;
}
Thomas Salvador
February 21, 2010, February 21, 2010 21:33, permalink
argh, the vars line 3 to 6 are no longer needed, of course. i missed to cancel them.
--thomas.
This jQuery snippet creates an effect that when user clicks on "learn more" of a section it sends off all its siblings in random directions and expands this "learn more" section, and toggles back when clicked once again.
Please let me know if it can be done in a more clever way...
Thanks