3 Replies - 515 Views - Last Post: 13 December 2012 - 07:00 AM

#1 frijj  Icon User is offline

  • D.I.C Head

Reputation: 0
  • View blog
  • Posts: 50
  • Joined: 01-October 12

Javascript shortening

Posted 13 December 2012 - 04:36 AM

I wanted to know if i can shorten this code i made to to increase readability and make the code smaller and effcient. Its like is there any shorter way of doing the code.




<script LANGUAGE="Javascript"><!--
//===============================================================================================================================================================================
//DROP DOWN BOX
function SelectLink(){
     if (document.Links.max.options[document.Links.max.selectedIndex].value != "none"){ 
             url = document.Links.max.options[document.Links.max.selectedIndex].value
             location =url
       }        
}

//===============================================================================================================================================================================
//personalise webpage
<!--
function changeBGC(color){
document.bgColor = color;
}
//-->

//===============================================================================================================================================================================
var prefixZero="0";
var prefixHorz="H";
var prefixVert="V";
boxMade=0;
currUser=1;
userImg="blue.gif";
fillBox="blue.gif";
blueScore="InitVal";
redScore="InitVal";
initBlueScore=0;
initRedScore=0;
var redarrow = new Image();
redarrow.src = "red.gif";

//===================================================================================================================================================
function horzhighlight(imgHovered){
	currimg = document.images[imgHovered];
	orgSrc = currimg.src;
	currimg.src=".gif";
	}
function horzunhighlight(imgHovered){
	currimg = document.images[imgHovered];
	currimg.src=orgSrc;
	}
function verthighlight(imgHovered){
	currimg = document.images[imgHovered];
	orgSrc = currimg.src;
	currimg.src=".gif";
	}
function vertunhighlight(imgHovered){
	currimg = document.images[imgHovered];
	currimg.src=orgSrc;
	}
//====================================================================================================================================================
function changeUser(){
	currUser = currUser+1;
	turnImg="RedTurn.gif";
	if (currUser==3)
		currUser=1;
	if (currUser==1){
		turnImg=document.userImg;
		turnImg.src="RedTurn.gif";
		fillBox="blue.gif";
		}
	if (currUser==2){
		turnImg=document.userImg;
		turnImg.src="BlueTurn.gif";
		fillBox="red.gif";
		
		}
}
//==============================================================================================================================================
function selectlineh(imgClicked){
	currimg = document.images[imgClicked];
	LineHorzRes = orgSrc.match("blank");
	if (LineHorzRes == null)
		alert("Choose another piece");
	else {
		currimg.src="orange.gif";
		orgSrc=currimg.src;
		checkForBoxH(imgClicked);
		if (boxMade == 1)
			boxMade = 0;
		else
			changeUser(currUser);
		}//end of else
	}
//======================================================================================================================================================
function selectlinev(imgClicked){
	currimg = document.images[imgClicked];
	LineVertRes = orgSrc.match("blank");
	if (LineVertRes == null)
		alert("That piece has already been selected... please choose again.");
	else {
		currimg.src="orange.gif";
		orgSrc=currimg.src;
		checkForBoxV(imgClicked);
		if (boxMade == 1)
			boxMade = 0;
		else
			changeUser(currUser);
		}
	}
//=================================================================================================================================================
function checkForBoxH (imgClicked){
	basePossStr = imgClicked.substring(0,4);
	currVertStr = imgClicked.substring(4,6);
	currVert = Number(currVertStr);
	aboveIs = currVert-1;
	belowIs = currVert+1;
		if (aboveIs == 0)
			aboveBox=false;
		else
			aboveBox=true;
		if (belowIs == 22)
			belowBox=false;
		else
			belowBox=true;
	if (aboveBox==true){
		aboveIsStrA = String(aboveIs);
		if (aboveIsStrA.length ==1){
			aboveIsStr = prefixZero.concat(aboveIsStrA);
			}
		else
			{
			aboveIsStr = aboveIsStrA;
			}
		BoxAboveStr = basePossStr.concat(aboveIsStr);
		boxNum = BoxAboveStr;
		testBox(boxNum);
		if (sidesFull == 4){
			currBoxImg = document.images[boxNum];
			currBoxImg.src = fillBox;
			addToScore(currUser);
			boxMade=1;
			sidesFull = 0;
			}
		}
//==================================================================================================================================================	
	if (belowBox==true){
		belowIsStrA = String(belowIs);
		if (belowIsStrA.length ==1){
			belowIsStr = prefixZero.concat(belowIsStrA);
			}
		else
			{
			belowIsStr = belowIsStrA;
			}
		BoxBelowStr = basePossStr.concat(belowIsStr);
		boxNum = BoxBelowStr;
		testBox(boxNum);
		if (sidesFull == 4){
			currBoxImg = document.images[boxNum];
			currBoxImg.src = fillBox;
			addToScore(currUser);
			boxMade=1;
			sidesFull = 0;
			}
		}
	
}
//=====================================================================================================================================================
function checkForBoxV (imgClicked){
	currHorzStr = imgClicked.substring(1,3);
	basePossStr = imgClicked.substring(4,6);
	currHorz = Number(currHorzStr);
	leftIs = currHorz-1;
	rightIs = currHorz+1;
		if (leftIs == 0)
			leftBox=false;
		else
			leftBox=true;
		if (rightIs == 22)
			rightBox=false;
		else
			rightBox=true;
		if (leftBox==true){
			leftIsStrA = String(leftIs);
			if (leftIsStrA.length ==1){
				leftIsStr = prefixZero.concat(leftIsStrA);
				}
			else {
				leftIsStr = leftIsStrA;
				}
			BoxLeftAStr = prefixHorz.concat(leftIsStr);
			BoxLeftBStr = prefixVert.concat(basePossStr);
			BoxLeftStr = BoxLeftAStr.concat(BoxLeftBStr);
			boxNum = BoxLeftStr;
			testBox(boxNum);
			if (sidesFull == 4){
				currBoxImg = document.images[boxNum];
				currBoxImg.src = fillBox;
				addToScore(currUser);
				boxMade=1;
				sidesFull = 0;
				}
		}
//============================================================================================================================================		
		if (rightBox==true){
			rightIsStrA = String(rightIs);
			if (rightIsStrA.length ==1){
				rightIsStr = prefixZero.concat(rightIsStrA);
				}
			else {
				rightIsStr = rightIsStrA;
				}
			BoxRightAStr = prefixHorz.concat(rightIsStr);
			BoxRightBStr = prefixVert.concat(basePossStr);
			BoxRightStr = BoxRightAStr.concat(BoxRightBStr);
			boxNum = BoxRightStr;
			testBox(boxNum);
			if (sidesFull == 4){
				currBoxImg = document.images[boxNum];
				currBoxImg.src = fillBox;
				addToScore(currUser);
				boxMade=1;
				sidesFull = 0;
				}
			}
		
}
//===============================================================================================================================================
function testBox (boxNum){
	boxHorzStr=boxNum.substring(1,3);
	boxVertStr=boxNum.substring(4,6);
	boxHorz=Number(boxHorzStr);
	boxVert=Number(boxVertStr);
	leftNumA=boxHorz-1;
	rightNumA=boxHorz+1;
	topNumA=boxVert-1;
	bottomNumA=boxVert+1;
		leftNumAStr = leftNumA.toString();
		rightNumAStr = rightNumA.toString();
		topNumAStr = topNumA.toString();
		bottomNumAStr = bottomNumA.toString();
			if (leftNumAStr.length == 1)
				leftNum = prefixZero.concat(leftNumAStr);
			else leftNum = leftNumAStr;
			if (rightNumAStr.length == 1)
				rightNum = prefixZero.concat(rightNumAStr);
			else rightNum = rightNumAStr;
			if (topNumAStr.length == 1)
				topNum = prefixZero.concat(topNumAStr);
			else topNum = topNumAStr;
			if (bottomNumAStr.length == 1)
				bottomNum = prefixZero.concat(bottomNumAStr);
			else bottomNum = bottomNumAStr;
	leftSquareHorz = prefixHorz.concat(leftNum);
	leftSquareVert = prefixVert.concat(boxVertStr);
	leftSquare = leftSquareHorz.concat(leftSquareVert);
		rightSquareHorz = prefixHorz.concat(rightNum);
		rightSquareVert = prefixVert.concat(boxVertStr);
		rightSquare = rightSquareHorz.concat(rightSquareVert);
			topSquareHorz = prefixHorz.concat(boxHorzStr);
			topSquareVert = prefixVert.concat(topNum);
			topSquare = topSquareHorz.concat(topSquareVert);
				bottomSquareHorz = prefixHorz.concat(boxHorzStr);
				bottomSquareVert = prefixVert.concat(bottomNum);
				bottomSquare = bottomSquareHorz.concat(bottomSquareVert);
	//========================================================================================================================================
	chkImg = document.images[leftSquare];
	leftSrc = chkImg.src;
	chkImg = document.images[rightSquare];
	rightSrc = chkImg.src;
	chkImg = document.images[topSquare];
	topSrc = chkImg.src;
	chkImg = document.images[bottomSquare];
	bottomSrc = chkImg.src;
	leftRes = leftSrc.match("blank");
	rightRes = rightSrc.match("blank");
	topRes = topSrc.match("blank");
	bottomRes = bottomSrc.match("blank");
	sidesFull = 0;
	if (leftRes == null)
		sidesFull = sidesFull+1;
	if (rightRes == null)
		sidesFull = sidesFull+1;
	if (topRes == null)
		sidesFull = sidesFull+1;
	if (bottomRes == null)
		sidesFull = sidesFull+1;
}
//===============================================================================================================================================
function addToScore(currUser){
	
	if (currUser == 1){
		if (blueScore == "InitVal")
			blueScore = Number(initBlueScore);
		blueScore = blueScore+1;
		document.Score.Blue.value = blueScore;
		}
	if (currUser == 2){
		if (redScore == "InitVal")
			redScore = Number(initRedScore);
		redScore = redScore+1;
		document.Score.Red.value = redScore;
		}
	BlueScore = Number(document.Score.Blue.value);
	RedScore = Number(document.Score.Red.value);
	totalScore = blueScore + redScore;
	if (totalScore == 36)
		{
		if (blueScore > redScore)
			alert("Blue player won by "+blueScore+" to "+redScore+" !\nPress Reset to start over.");
		if (redScore > blueScore)
			alert("red player won by "+redScore+" to "+blueScore+" !\nPress Reset to start over.");
		if (blueScore == redScore)
			alert("Its a Draw!"+blueScore+" to "+redScore+" !\nPress Reset to start over.");
		}
}
//===================================================================================================================================================
</SCRIPT>


This post has been edited by frijj: 13 December 2012 - 04:37 AM


Is This A Good Question/Topic? 0
  • +

Replies To: Javascript shortening

#2 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3480
  • View blog
  • Posts: 10,028
  • Joined: 08-June 10

Re: Javascript shortening

Posted 13 December 2012 - 05:58 AM

you can shorten line #5/#6 to document.Links.max.value.

Introducing efficiency (performance-wise) is highly dependent on the used JIT compiler and JS engine. without knowing how the engine puts JS code into machine code, you can only stab in the blue.

a rule of thumb though, local variables are faster than global variables.
Was This Post Helpful? 1
  • +
  • -

#3 baavgai  Icon User is offline

  • Dreaming Coder
  • member icon

Reputation: 5775
  • View blog
  • Posts: 12,587
  • Joined: 16-October 07

Re: Javascript shortening

Posted 13 December 2012 - 06:04 AM

Your number of globals is staggering. I'd avoid that. Also, stop ditching all the curlies.

For shortening, try to take the near duplicate code and generalize it. e.g.
function selectLineGen(imgClicked){
	currimg = document.images[imgClicked];
	var lineRes = orgSrc.match("blank");
	if (lineRes !== null) {
		currimg.src="orange.gif";
		orgSrc=currimg.src;
		checkForBoxH(imgClicked);
		if (boxMade == 1) {
			boxMade = 0;
		} else {
			changeUser(currUser);
		}
	}
	return lineRes;
}

function selectlineh(imgClicked){
	LineHorzRes = selectLineGen(imgClicked);
	if (LineHorzRes == null) { alert("Choose another piece"); }
}

function selectlinev(imgClicked){
	LineVertRes = selectLineGen(imgClicked);
	if (LineVertRes == null) { alert("That piece has already been selected... please choose again."); }
}



Even if it doesn't make it shorter, it might make it more readable.
Was This Post Helpful? 1
  • +
  • -

#4 frijj  Icon User is offline

  • D.I.C Head

Reputation: 0
  • View blog
  • Posts: 50
  • Joined: 01-October 12

Re: Javascript shortening

Posted 13 December 2012 - 07:00 AM

Can you give give me another example please?
I need to get a better idea, currently bit not sure. ive tried doing some but i failed.

This post has been edited by Dormilich: 13 December 2012 - 07:27 AM
Reason for edit:: removed quote

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1