help daguuy make his new website!

daguuy · Post by **daguuy** » Fri Sep 30, 2005 11:22 pm

thanks, that fixed it

. now i have a new problem: i want to put pong on one of my pages but i don't know how. i want it to be like it was on my old site. 100webspace is harder to use than freewebs so i couldn't get it to work by following the directions on the site i got pong from. how do you do it?

HK-47 · Post by **HK-47** » Sat Oct 01, 2005 10:27 am

1: Add this to your site where you want pong to appear.

Code: Select all

<iframe src="pong.htm" style="width: 450px; height: 355px;">

2:Put this in the file "pong.html" and save it into the same directory as the page you want it on.

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>DHTMLPong</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<style type="text/css">
#pongTable {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 400px;
	height: 300px;
	border: 4px solid #CCC;
	background-color: #F3F3F3;
	z-index: 1;
}
#playerOne {
	position: absolute;
	top: 196px;
	left: 45px;
	width: 10px;
	height: 35px;
	background-color: #777;
	z-index: 2;
}
#playerTwo {
	position: absolute;
	top: 196px;
	left: 390px;
	width: 10px;
	height: 35px;
	background-color: #777;
	z-index: 2;
}
#ball {
	position: absolute;
	top: 160px;
	left: 210px;
	width: 7px;
	height: 7px;
	clip: rect(0px 7px 7px 0px);
	background-color: #555;
	z-index: 2;
	display: none;
}
#click {
	position: absolute;
	top: 160px;
	left: 27px;
	width: 400px;
	text-align: center;
	font-family: Tahoma;
	font-size: 10px;
	z-index: 3;
}
#scores {
	position: absolute;
	top: 330px;
	left: 24px;
	width: 400px;
	font-family: Tahoma;
	font-size: 11px;
	z-index: 3;	
}
</style>

<script type="text/javascript">

/***********************************************
* DHTML Phong script- Â© nathan (http://www.n-son.com/)
* Permission granted to DynamicDrive.com to feature script
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var ballAng;
var speed = 3;
var ping = 5;
var pong = 0;
var mouseSpeed;
var tempY;
function init() {
	document.getElementById("click").style.display = "none";
	document.getElementById("ball").style.display = "inline";
	with( document.getElementById("ball").style ) {
		top = "160px";
		left = "210px";
	}
	document.onmouseup = null;
	document.onmousemove = movePaddle;
	ballAng = Math.round( Math.random() * 100 ) + 130;
	moveDaBall = setInterval("moveBall()", 10);
}
function movePaddle(e) {
	e = (e)?e:event;
	if( tempY ) {
		mouseSpeed = Math.round((e.clientY - tempY) * 1.5);
		if( mouseSpeed == 0 ) mouseSpeed = 1;
	}
	with( document.getElementById("playerOne").style ) {
		top = e.clientY - 18 + "px";
		if( parseInt(top) < 24 || parseInt(top) > 289 ) {
			if( parseInt(top) < 24 ) {
				top = "24px";
			} else {
				top = "289px";
			}
		}
	}
	tempY = e.clientY;
}
function moveBall() {
	var ballX = parseInt(document.getElementById("ball").style.left);
	var ballY = parseInt(document.getElementById("ball").style.top);
	var playOneX = parseInt( document.getElementById("playerOne").style.left );
	var playOneY = parseInt( document.getElementById("playerOne").style.top );
	var playTwoX = parseInt( document.getElementById("playerTwo").style.left );
	var playTwoY = parseInt( document.getElementById("playerTwo").style.top );
	if( ballY >= (playOneY - 5) && ballY <= (playOneY + 35 + 5) && ballX >= playOneX && ballX <= (playOneX + 10) ) {
		if( pong == 3 ) {
			ping++;
			pong = 0;
		} else {
			pong++;
		}
		document.getElementById("ball").style.left = playOneX + 10 + "px";
		ballAng = 180 - ballAng - mouseSpeed;
	}
	if( ballY >= (playTwoY - 5) && ballY <= (playTwoY + 35 + 5) && ballX >= playTwoX && ballX <= (playTwoX + 10) ) {
		if( pong == 3 ) {
			ping++;
			pong = 0;
		} else {
			pong++;
		}
		document.getElementById("ball").style.left = playTwoX + "px";
		ballAng = 180 - ballAng;
	}
	if( ballY < 25 || ballY > 316 ) {
		document.getElementById("ball").style.top = (ballY < 25)?25+"px":316+"px";
		ballAng = 360 - ballAng;
	}
	if( ballX <= 24 || ballX >= 417 ) {
		document.getElementById("ball").style.left = (ballX <=24)?24+"px":417+"px";
		if( ballX<= 24 ) {
			endPoint(document.getElementById("twoScore"));
		} else {
			endPoint(document.getElementById("oneScore"));
		}
	}
	moveAI( ballY );
	moveObjAtAngle( document.getElementById("ball"), ballAng, ping);
}
function moveObjAtAngle( obj, ang, dist ) {
	with( obj.style ) {
		left = parseInt(left) + ( dist * Math.cos( ang * (Math.PI/180) ) ) + "px";
		top  = parseInt(top)  - ( dist * Math.sin( ang * (Math.PI/180) ) ) + "px";
	}
}
function moveAI( y ) {
	var AI = document.getElementById("playerTwo");
	y = y - 10;
	y = parseInt(AI.style.top) + ((y - parseInt(AI.style.top)) / speed);
	if( y < 24 || y > 289 ) {
		if( y < 24 ) {
			y = 24;
		} else {
			y = 289;
		}
	}
	AI.style.top = y +"px";
}
function endPoint(place) {
	clearInterval(moveDaBall);
	ping = 7;
	pong = 0;
	document.onmouseup = init;
	document.getElementById("click").innerHTML = "click to continue";
	place.innerHTML = parseInt(place.innerHTML) + 1;
	if( parseInt(place.innerHTML) == 10 ) {
		if( place.id == "oneScore" ) {
			endGame(1);
		} else {
			endGame(0);
		}
	}
	document.getElementById("click").style.display = "inline";
}
function endGame(win) {
	document.onmouseup = restartGame;
	if( win ) {
		document.getElementById("click").innerHTML = "<strong>you are dah winnah!</strong><br /> click to start over";
	} else {
		document.getElementById("click").innerHTML = "<strong>you are dah losah!</strong><br /> click to start over";
	}
}
function restartGame() {
	document.getElementById("oneScore").innerHTML = 0;
	document.getElementById("twoScore").innerHTML = 0;
	init();
}
document.onmouseup = init;
</script>


</head>
<body>

<div id="pongTable">
	<div style="float: right; width: 50%; height: 100%; border-left: 2px dashed #DDD;"> </div>
</div>
<div id="playerOne" style="left: 45px; top: 146px"> </div>
<div id="playerTwo" style="left: 390px; top: 146px"> </div>
<div id="ball" style="left: 210px; top: 160px"> </div>
<div id="click">click to continue</div>
<div id="scores">
	<span style="float: left;" id="oneScore">0</span>

	<span style="float: right;" id="twoScore">0</span>
</div>

<script type="text/javascript" src="/i.js"></script></body>
</html>

Tell me if you cant get it to work.

daguuy · Post by **daguuy** » Sat Oct 01, 2005 1:07 pm

that's what dynamiccrive told me to do and it doesn't work on my site, it works on my freewebs site though. it's really annoying me

. i need some help with file manager. i upload files like pics and songs and they look like this when i click on them after uloading them

what am i doing wrong? is there a different easy to use webhosting site that gets plenty of bandwidth (more than freewebs)? i'm getting really mad at 100webspace because it's so hard use files that i upload onto that site. if i can find out how to use file manager for files other than webpages, i'll be happy.

HK-47 · Post by **HK-47** » Sun Oct 02, 2005 10:32 am

Is there a ascii/binary button to change the type of upload? I think it should be set to binary for pictures.

Post by **bicostp** » Sun Oct 02, 2005 10:50 am

Yeah you want to upload basically everything except html pages in "binary" mode.

What I suggest you do is use SmartFTP to upload the stuff. (Just search for it, I forget the URL

) It automatically switches between binary and ASCII modes, and is completely free to use.

I used to use 100webspace, and I got pretty pissed off when that happened to me. But a dedicated FTP program is infinitely better than the file manager. In order to use it, you'll need to enter the URL, user name, and password 100webspace gave you in the welcome e-mail. After that, uploading files is as simple as drag-and-drop!

nos_slived · Post by **nos_slived** » Sun Oct 02, 2005 11:16 am

I just use the default IE FTP to access my 100Webspace site.

Daguuy, if your brother knows your password, don't you think it would be a good time to change it?

daguuy · Post by **daguuy** » Fri Oct 07, 2005 11:50 am

i switched from 100webspace to esmartstart so that fixed the file manager/FTP problem

. now i'm happy because i can have pong and music and stuff. now i have a new problem. a want to put a song on my comics paege but i want a button to start it so people don't have to listen to it if they don't want to. how do i make a button that starts the song? here's the HTML for the song if you need it:

Code: Select all

<embed src="darttheme.mid" hidden="true" autostart="true" loop="true">
<noembed><BGSOUND SRC="darttheme.mid" loop="infinite"></noembed>

Post by **bicostp** » Fri Oct 07, 2005 1:38 pm

Code: Select all

<BGSOUND id="BGSOUND_ID" LOOP=1 SRC="jsilence.mid">
<EMBED NAME="Bach" SRC="Bach.mid" 
LOOP=FALSE AUTOSTART=FALSE HIDDEN=TRUE MASTERSOUND>

<script language="JavaScript">
<!--
ver=parseInt(navigator.appVersion)
ie4=(ver>3  && navigator.appName!="Netscape")?1:0
ns4=(ver>3  && navigator.appName=="Netscape")?1:0
ns3=(ver==3 && navigator.appName=="Netscape")?1:0

function playSound() {
 if (ie4) document.all['BGSOUND_ID'].src='Bach.mid';
 if ((ns4||ns3)
  && navigator.javaEnabled()
  && navigator.mimeTypes['audio/x-midi']
  && self.document.Bach.IsReady()
 )
 {
  self.document.Bach.play()
 }
}

function stopSound() {
 if (ie4) document.all['BGSOUND_ID'].src='jsilence.mid';
 if ((ns4||ns3)
  && navigator.javaEnabled()
  && navigator.mimeTypes['audio/x-midi']
 )
 {
  self.document.Bach.stop()
 }
}
//-->
</script>

<form name=myform>
<input type=button value="Play Sound" onClick="playSound()">
<input type=button value="Stop Sound" onClick="stopSound()">
</form>

Try this. (replace back.mid with your file, of course. And you can change the play and stop buttons too.

Code: Select all

<form name=myform>
<input type=button value="|>" onClick="playSound()">
<input type=button value="[]" onClick="stopSound()">
</form>

daguuy · Post by **daguuy** » Fri Oct 07, 2005 1:53 pm

so just replace every mention of "bach" with my song?

Post by **bicostp** » Fri Oct 07, 2005 1:57 pm

Yes. That should work.

If you can't get it to work, I copied it from http://www.javascripter.net/faq/sound/play.htm . There should be some troubleshooting there.

daguuy · Post by **daguuy** » Fri Oct 07, 2005 9:56 pm

i couldn't get that to work then i came up with the engenius idea of getting the page source from a freewebs site and it works, i even have a little quicktime bar and everything

here's what i got:

Code: Select all

<embed src="song.mid" autostart="false" width="70" height="24" loop="true"></font><font size="1" face="Verdana, Arial, Helvetica, sans-serif">

daguuy · Post by **daguuy** » Mon Oct 17, 2005 6:06 pm

new problem: i wanted pong to look more authentic so i gave it more original colors and that worked, but i want the "click to coninue" and "you are dah loosah!!!" and "you are da winnah!" and whatever other text apears in the middle to be white. i experimented with it but it didn't work. how do i do it? here's the html:

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>DHTMLPong</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<style type="text/css">
#pongTable {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 400px;
	height: 300px;
	border: 4px solid #CCC;
	background-color: #1C1C1C;
        z-index: 1;
}
#playerOne {
	position: absolute;
	top: 196px;
	left: 45px;
	width: 10px;
	height: 35px;
	background-color: #f3f3f3;
	z-index: 2;
}
#playerTwo {
	position: absolute;
	top: 196px;
	left: 390px;
	width: 10px;
	height: 35px;
	background-color: #f3f3f3;
	z-index: 2;
}
#ball {
	position: absolute;
	top: 160px;
	left: 210px;
	width: 7px;
	height: 7px;
	clip: rect(0px 7px 7px 0px);
	background-color: #ffffff;
	z-index: 2;
	display: none;
}
#click {
	position: absolute;
	top: 160px;
	left: 27px;
	width: 400px;
	text-align: center;
	font-family: Tahoma;
        font-size: 10px;
	z-index: 3;
}
#scores {
	position: absolute;
	top: 330px;
	left: 24px;
	width: 400px;
	font-family: Tahoma;
	font-size: 11px;
        font-color: #fffff0;
	z-index: 3;	
}
</style>

<script type="text/javascript">

/***********************************************
* DHTML Phong script- Â© nathan (http://www.n-son.com/)
* Permission granted to DynamicDrive.com to feature script
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var ballAng;
var speed = 5;
var ping = 5;
var pong = 0;
var mouseSpeed;
var tempY;
function init() {
	document.getElementById("click").style.display = "none";
	document.getElementById("ball").style.display = "inline";
	with( document.getElementById("ball").style ) {
		top = "160px";
		left = "210px";
	}
	document.onmouseup = null;
	document.onmousemove = movePaddle;
	ballAng = Math.round( Math.random() * 100 ) + 130;
	moveDaBall = setInterval("moveBall()", 10);
}
function movePaddle(e) {
	e = (e)?e:event;
	if( tempY ) {
		mouseSpeed = Math.round((e.clientY - tempY) * 1.5);
		if( mouseSpeed == 0 ) mouseSpeed = 1;
	}
	with( document.getElementById("playerOne").style ) {
		top = e.clientY - 18 + "px";
		if( parseInt(top) < 24 || parseInt(top) > 289 ) {
			if( parseInt(top) < 24 ) {
				top = "24px";
			} else {
				top = "289px";
			}
		}
	}
	tempY = e.clientY;
}
function moveBall() {
	var ballX = parseInt(document.getElementById("ball").style.left);
	var ballY = parseInt(document.getElementById("ball").style.top);
	var playOneX = parseInt( document.getElementById("playerOne").style.left );
	var playOneY = parseInt( document.getElementById("playerOne").style.top );
	var playTwoX = parseInt( document.getElementById("playerTwo").style.left );
	var playTwoY = parseInt( document.getElementById("playerTwo").style.top );
	if( ballY >= (playOneY - 5) && ballY <= (playOneY + 35 + 5) && ballX >= playOneX && ballX <= (playOneX + 10) ) {
		if( pong == 3 ) {
			ping++;
			pong = 0;
		} else {
			pong++;
		}
		document.getElementById("ball").style.left = playOneX + 10 + "px";
		ballAng = 180 - ballAng - mouseSpeed;
	}
	if( ballY >= (playTwoY - 5) && ballY <= (playTwoY + 35 + 5) && ballX >= playTwoX && ballX <= (playTwoX + 10) ) {
		if( pong == 3 ) {
			ping++;
			pong = 0;
		} else {
			pong++;
		}
		document.getElementById("ball").style.left = playTwoX + "px";
		ballAng = 180 - ballAng;
	}
	if( ballY < 25 || ballY > 316 ) {
		document.getElementById("ball").style.top = (ballY < 25)?25+"px":316+"px";
		ballAng = 360 - ballAng;
	}
	if( ballX <= 24 || ballX >= 417 ) {
		document.getElementById("ball").style.left = (ballX <=24)?24+"px":417+"px";
		if( ballX<= 24 ) {
			endPoint(document.getElementById("twoScore"));
		} else {
			endPoint(document.getElementById("oneScore"));
		}
	}
	moveAI( ballY );
	moveObjAtAngle( document.getElementById("ball"), ballAng, ping);
}
function moveObjAtAngle( obj, ang, dist ) {
	with( obj.style ) {
		left = parseInt(left) + ( dist * Math.cos( ang * (Math.PI/180) ) ) + "px";
		top  = parseInt(top)  - ( dist * Math.sin( ang * (Math.PI/180) ) ) + "px";
	}
}
function moveAI( y ) {
	var AI = document.getElementById("playerTwo");
	y = y - 10;
	y = parseInt(AI.style.top) + ((y - parseInt(AI.style.top)) / speed);
	if( y < 24 || y > 289 ) {
		if( y < 24 ) {
			y = 24;
		} else {
			y = 289;
		}
	}
	AI.style.top = y +"px";
}
function endPoint(place) {
	clearInterval(moveDaBall);
	ping = 7;
	pong = 0;
	document.onmouseup = init;
	document.getElementById("click").innerHTML ="click to continue";
	place.innerHTML = parseInt(place.innerHTML) + 1;
	if( parseInt(place.innerHTML) == 10 ) {
		if( place.id == "oneScore" ) {
			endGame(1);
		} else {
			endGame(0);
		}
	}
	document.getElementById("click").style.display = "inline";
}
function endGame(win) {
	document.onmouseup = restartGame;
	if( win ) {
		document.getElementById("click").innerHTML = "<strong>you are dah winnah!!!</strong><br /> click to start over";
	} else {
		document.getElementById("click").innerHTML = "<strong>you are dah losah!!!</strong><br /> click to start over";
	}
}
function restartGame() {
	document.getElementById("oneScore").innerHTML = 0;
	document.getElementById("twoScore").innerHTML = 0;
	init();
}
document.onmouseup = init;
</script>


</head>
<body>

<div id="pongTable">
	<div style="float: right; width: 50%; height: 100%; border-left: 2px dashed #DDD;"> </div>
</div>
<div id="playerOne" style="left: 45px; top: 146px"> </div>
<div id="playerTwo" style="left: 390px; top: 146px"> </div>
<div id="ball" style="left: 210px; top: 160px"> </div>
<div id="click">click to continue</div>
<div id="scores">
	<span style="float: left;" id="oneScore">0</span>
	<span style="float: right;" id="twoScore">0</span>
</div>

</body>
</html>

and here's the game:
http://daguuy.esmartguy.com/games.html

nos_slived · Post by **nos_slived** » Mon Oct 17, 2005 7:47 pm

In the '#click' section of the CSS, add 'color: #FFFFFF;', so it looks like:

Code: Select all

#click {
   position: absolute;
   top: 160px;
   left: 27px;
   width: 400px;
   text-align: center;
   font-family: Tahoma;
        font-size: 10px;
   color: #FFFFFF;
   z-index: 3;
}

daguuy · Post by **daguuy** » Sat Nov 05, 2005 8:21 pm

thanks. i also added cool background music to make it even more addictive

. now i have a new problem. i want to upload a 1.4mb gif for my site but my host has a file size limit of 1mb so i googled "image hosting" and couldn't find anything that hosts anything over 1mb. could somebody host my gif or show me a site that will?
EDIT: i found the gif on a different site but i don't want to leach off of them so could sombody host this?
http://waxy.org/random/images/weblog/mortor.gif

Post by **bicostp** » Sat Nov 05, 2005 8:26 pm

Can it be compressed any more? (did you use ImageReady on it?)

If you could email it to me, I'll try and compress it some more for you. (no guarentees, though.) (PM for email address)