[Resolved] marquee using PHP and JAVASCRIP

onairric · Jul 8, 2004

hi guys! im back with another marquee problem...

If you have read the thread about the browser editable marquee, THE DEFENDER suggested that I incorporate javascript to php to produce my marquee, but since I was having trouble with it, I used a marquee using php alone. But now, I want to use javascript also because this way, i can set the marquee to display one item at a time and pause.

I tried using a javascript marquee but Im having trouble making it work. This is the code I used:

// Read the file's contents into an array.
$data = file_get_contents ('text/news.txt');

// Display the marquee
echo '<script language="JavaScript1.2" type="text/JavaScript1.2">'

//Translucent scroller- By Dynamic Drive
//For full source code and more DHTML scripts, visit [url]http://www.dynamicdrive.com[/url]
//This credit MUST stay intact for use

var scroller_width='139px'
var scroller_height='174px'
var bgcolor='#FFFFFF'
var pause=9000 //SET PAUSE BETWEEN SLIDE (3000=3 seconds)

var scrollercontent=new Array()
//Define scroller contents. Extend or contract array as needed
scrollercontent[0]='This is my first message'
scrollercontent[1]='second message'
scrollercontent[2]='third message'
scrollercontent[3]='last message'


////NO need to edit beyond here/////////////

var ie4=document.all
var dom=document.getElementById&&navigator.userAgent.indexOf("Opera")==-1

if (ie4||dom)
document.write('<div style="position:relative;width:'+scroller_width+';height:'+scroller_height+';overflow:hidden"><div id="canvas0" style="position:absolute;background-color:'+bgcolor+';width:'+scroller_width+';height:'+scroller_height+';top:'+scroller_height+';filter:alpha(opacity=20);-moz-opacity:0.2;"></div><div id="canvas1" style="position:absolute;background-color:'+bgcolor+';width:'+scroller_width+';height:'+scroller_height+';top:'+scroller_height+';filter:alpha(opacity=20);-moz-opacity:0.2;"></div></div>')
else if (document.layers){
document.write('<ilayer id=tickernsmain visibility=hide width='+scroller_width+' height='+scroller_height+' bgColor='+bgcolor+'><layer id=tickernssub width='+scroller_width+' height='+scroller_height+' left=0 top=0>'+scrollercontent[0]+'</layer></ilayer>')
}

var curpos=scroller_height*(1)
var degree=10
var curcanvas="canvas0"
var curindex=0
var nextindex=1

function moveslide(){
if (curpos>0){
curpos=Math.max(curpos-degree,0)
tempobj.style.top=curpos+"px"
}
else{
clearInterval(dropslide)
if (crossobj.filters)
crossobj.filters.alpha.opacity=100
else if (crossobj.style.MozOpacity)
crossobj.style.MozOpacity=1
nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"
tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)
tempobj.innerHTML=scrollercontent[curindex]
nextindex=(nextindex<scrollercontent.length-1)? nextindex+1 : 0
setTimeout("rotateslide()",pause)
}
}

function rotateslide(){
if (ie4||dom){
resetit(curcanvas)
crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
crossobj.style.zIndex++
if (crossobj.filters)
document.all.canvas0.filters.alpha.opacity=document.all.canvas1.filters.alpha.opacity=20
else if (crossobj.style.MozOpacity)
document.getElementById("canvas0").style.MozOpacity=document.getElementById("canvas1").style.MozOpacity=0.2
var temp='setInterval("moveslide()",50)'
dropslide=eval(temp)
curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0"
}
else if (document.layers){
crossobj.document.write(scrollercontent[curindex])
crossobj.document.close()
}
curindex=(curindex<scrollercontent.length-1)? curindex+1 : 0
}

function resetit(what){
curpos=parseInt(scroller_height)*(1)
var crossobj=ie4? eval("document.all."+what) : document.getElementById(what)
crossobj.style.top=curpos+"px"
}

function startit(){
crossobj=ie4? eval("document.all."+curcanvas) : dom? document.getElementById(curcanvas) : document.tickernsmain.document.tickernssub
if (ie4||dom){
crossobj.innerHTML=scrollercontent[curindex]
rotateslide()
}
else{
document.tickernsmain.visibility='show'
curindex++
setInterval("rotateslide()",pause)
}
}

if (ie4||dom||document.layers)
window.onload=startit

'</script>';

I want the marquee to get its contents from a text file so I can edit the message with ease. The text file will have atleast four lines and I want each line to be displayed as one message in the marquee.

Can you guys help me make this work? Thanks in Advance!

ZibingsCoder · Jul 8, 2004

This would be something like what you'd want...

$contents = file_get_contents("file.txt");

$contents = explode("\n", $contents);

//then inside the javascript where you want to echo the messages

for ( $i = 0; $i < count($contents); $i++ )
{
    echo ( "scrollercontents[".$i."] = \"".$contents[$i]."\"";
}

Help?

onairric · Jul 8, 2004

i forgot to mention, im having parse errors inside the javascript where the line starts with var, if, else if, function, etc...

e.g.

var scroller_width='139px' 
var scroller_height='174px' 
var bgcolor='#FFFFFF' 
var pause=9000 //SET PAUSE BETWEEN SLIDE (3000=3 seconds) 

var scrollercontent=new Array() 
//Define scroller contents. Extend or contract array as needed 
scrollercontent[0]='This is my first message' 
scrollercontent[1]='second message' 
scrollercontent[2]='third message' 
scrollercontent[3]='last message' 


////NO need to edit beyond here///////////// 

var ie4=document.all 
var dom=document.getElementById&&navigator.userAgent.indexOf("Opera")==-1 

if (ie4||dom)
document.write('<div style=" position:relative;width:'+scroller_width+';height:
'+scroller_height+';overflow:hidden"><div id="canvas0" style="position:absolute;background- color:'+bgcolor+';width:'+scroller_width+';height:
'+scroller_height+';top:'+scroller_height+';filter
:alpha(opacity=20);-moz-opacity:0.2;"></div><div id="canvas1" style="position:absolute;background- color:'+bgcolor+';width:'+scroller_width+';height:
'+scroller_height+';top:'+scroller_height+';filter
:alpha(opacity=20);-moz-opacity:0.2;"></div></div>') 
else if (document.layers){ 
document.write('<ilayer id=tickernsmain visibility=hide width='+scroller_width+' height='+scroller_height+' bgColor='+bgcolor+'><layer id=tickernssub width='+scroller_width+' height='+scroller_height+' left=0 top=0>'+scrollercontent[0]+'</layer></ilayer>') 
} 

var curpos=scroller_height*(1) 
var degree=10 
var curcanvas="canvas0" 
var curindex=0 
var nextindex=1 

function moveslide(){ 
if (curpos>0){ 
curpos=Math.max(curpos-degree,0) 
tempobj.style.top=curpos+"px" 
} 
else{ 
clearInterval(dropslide) 
if (crossobj.filters) 
crossobj.filters.alpha.opacity=100 
else if (crossobj.style.MozOpacity) 
crossobj.style.MozOpacity=1 
nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1" 
tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas) 
tempobj.innerHTML=scrollercontent[curindex] 
nextindex=(nextindex<scrollercontent.length-1)? nextindex+1 : 0 
setTimeout("rotateslide()",pause) 
} 
} 

function rotateslide(){ 
if (ie4||dom){ 
resetit(curcanvas) 
crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas) 
crossobj.style.zIndex++ 
if (crossobj.filters) 
document.all.canvas0.filters.alpha.opacity=document.all.canvas1.filters.alpha.opacity=20 
else if (crossobj.style.MozOpacity) 
document.getElementById("canvas0").style.MozOpacity=document.getElementById("canvas1").style.MozOpacity=0.2 
var temp='setInterval("moveslide()",50)' 
dropslide=eval(temp) 
curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0" 
} 
else if (document.layers){ 
crossobj.document.write(scrollercontent[curindex]) 
crossobj.document.close() 
} 
curindex=(curindex<scrollercontent.length-1)? curindex+1 : 0 
} 

function resetit(what){ 
curpos=parseInt(scroller_height)*(1) 
var crossobj=ie4? eval("document.all."+what) : document.getElementById(what) 
crossobj.style.top=curpos+"px" 
} 

function startit(){ 
crossobj=ie4? eval("document.all."+curcanvas) : dom? document.getElementById(curcanvas) : document.tickernsmain.document.tickernssub 
if (ie4||dom){ 
crossobj.innerHTML=scrollercontent[curindex] 
rotateslide() 
} 
else{ 
document.tickernsmain.visibility='show' 
curindex++ 
setInterval("rotateslide()",pause) 
} 
} 

if (ie4||dom||document.layers) 
window.onload=startit 

'</script>';

what should i do with these lines?

ZibingsCoder · Jul 8, 2004

Well, tbh, you shouldn't be trying to echo that entire JavaScript from inside PHP.

Try breaking out of PHP, then breaking back in to output your scroller values, then break back out to finish writing the JavaScript, then break back in to finish the rest of your script if needed.

onairric · Jul 8, 2004

sorry but im confused...

where exactly do i put these:

//then inside the javascript where you want to echo the messages 

for ( $i = 0; $i < count($contents); $i++ ) 
{ 
    echo ( "scrollercontents[".$i."] = \"".$contents[$i]."\""); 
}

ZibingsCoder · Jul 8, 2004

There

var scroller_width='139px' 
var scroller_height='174px' 
var bgcolor='#FFFFFF' 
var pause=9000 //SET PAUSE BETWEEN SLIDE (3000=3 seconds) 

var scrollercontent=new Array() 
//Define scroller contents. Extend or contract array as needed 
<?php
for ( $i = 0; $i < count($contents); $i++ )  

{  

    echo ( "scrollercontents[".$i."] = \"".$contents[$i]."\"");  

}
?>

onairric · Jul 8, 2004

im still having trouble... error on page - the marquee doesnt display the contents.

when i right clicked and selected VIEW SOURCE, i detected that the code has an error here:

var scrollercontent=new Array()
//Define scroller contents. Extend or contract array as needed 
scrollercontents[0] = "firstmsg"scrollercontents[1] = "secondmsg"scrollercontents[2] = "thirdmsg"scrollercontents[3] = "fouthmsg"scrollercontents[4] = "fifthmsg" 

////NO need to edit beyond here/////////////

..the PHP should produce this code instead:

var scrollercontent=new Array()  

//Define scroller contents. Extend or contract array as needed 
scrollercontent[0]='This is my first message'  

scrollercontent[1]='second message'  

scrollercontent[2]='third message'  

scrollercontent[3]='last message'

help please...

ZibingsCoder · Jul 8, 2004

My bad...

echo ( "scrollercontents[".$i."] = \"".$contents[$i]."\";\n");

onairric · Jul 8, 2004

thanks! its now working!

ZibingsCoder · Jul 8, 2004

Mark 'er resolved please!

[Resolved] marquee using PHP and JAVASCRIP

Oonairric

ZZibingsCoder

Oonairric

ZZibingsCoder

Oonairric

ZZibingsCoder

Oonairric

ZZibingsCoder

Oonairric

ZZibingsCoder