asked on
Scrolling text on a website pulling from a database
Hi,
I am trying to create a website that will display my rush jobs from an access database that will scroll , I have around 100 jobs that change constently in an access database.
Basically what I want to accomplish is to have a big screen in my office displaying those jobs. I thought of doing a website , but I am not really sure about it.
I am open to any other way to accomplish this. the best would be to display it like an aiport screen ( flight informations) refreshing every so often.
I would appresciate some example of code or a tutorial on how to accomplish this
Thanks
I am trying to create a website that will display my rush jobs from an access database that will scroll , I have around 100 jobs that change constently in an access database.
Basically what I want to accomplish is to have a big screen in my office displaying those jobs. I thought of doing a website , but I am not really sure about it.
I am open to any other way to accomplish this. the best would be to display it like an aiport screen ( flight informations) refreshing every so often.
I would appresciate some example of code or a tutorial on how to accomplish this
Thanks
PHPWeb BrowsersWeb Development Software
Last Comment
taverny
ASKER CERTIFIED SOLUTION
THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
metarefresh: http://www.pageresource.com/html/metref.htm
ASKER
Matthew,
thanks for the responds. I haven't look at the scrollers demo yet, but I think you find the correct code for me. I briefly red the description of the AJAX XHTMLHTTPRequest and I think this what I am looking for.
I never wrote any Ajax , so I am gonna try to follow example right now.
Do you know of any example that would look better from what I am thinking of instead of scrolling? I have seen another nice way at the aiport is a display that shows the passengers on standby list and the page refresh every so often , but will go through the list in 2 or 3 pages. do you know about htis kind of features?
thanks
David
thanks for the responds. I haven't look at the scrollers demo yet, but I think you find the correct code for me. I briefly red the description of the AJAX XHTMLHTTPRequest and I think this what I am looking for.
I never wrote any Ajax , so I am gonna try to follow example right now.
Do you know of any example that would look better from what I am thinking of instead of scrolling? I have seen another nice way at the aiport is a display that shows the passengers on standby list and the page refresh every so often , but will go through the list in 2 or 3 pages. do you know about htis kind of features?
thanks
David
ASKER
ok, I got the scrolling I wanted and I am able to pull the data on the website from my database, now I am trying to replace the default text of the scrolling with mine.
i am trying to put the php code into it but I guess I am missing somehting :
here is the original code:
fcontent[0]="New scripts added to the Scroller category! Click here to visit";
and here is mine:
fcontent[0]="<?php
$fv = $rs->Fields("DISTRIBUTOR")
echo "Value: ".$fv->value."
\n";
$rs->MoveNext(); ?>";
i am having a parse error
i am trying to put the php code into it but I guess I am missing somehting :
here is the original code:
fcontent[0]="New scripts added to the Scroller category! Click here to visit";
and here is mine:
fcontent[0]="<?php
$fv = $rs->Fields("DISTRIBUTOR")
echo "Value: ".$fv->value."
\n";
$rs->MoveNext(); ?>";
i am having a parse error
SOLUTION
THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
ASKER
It finally worked. attached is the code that I used
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> PSH Rush Jobs </TITLE>
<meta http-equiv="refresh" content="15">
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="David Pelerin" CONTENT="">
<META NAME="Display Type Airport" CONTENT="">
<META NAME="This Code will display the Rush Job from our Access Database" CONTENT="">
<script type="text/javascript">
/***********************************************
* Local Time script- © Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
var weekdaystxt=["Sun", "Mon", "Tues", "Wed", "Thurs", "Fri", "Sat"]
function showLocalTime(container, servermode, offsetMinutes, displayversion){
if (!document.getElementById || !document.getElementById(container)) return
this.container=document.getElementById(container)
this.displayversion=displayversion
var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'
this.localtime=this.serverdate=new Date(servertimestring)
this.localtime.setTime(this.serverdate.getTime()+offsetMinutes*60*1000) //add user offset to server time
this.updateTime()
this.updateContainer()
}
showLocalTime.prototype.updateTime=function(){
var thisobj=this
this.localtime.setSeconds(this.localtime.getSeconds()+1)
setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second
}
showLocalTime.prototype.updateContainer=function(){
var thisobj=this
if (this.displayversion=="long")
this.container.innerHTML=this.localtime.toLocaleString()
else{
var hour=this.localtime.getHours()
var minutes=this.localtime.getMinutes()
var seconds=this.localtime.getSeconds()
var ampm=(hour>=12)? "PM" : "AM"
var dayofweek=weekdaystxt[this.localtime.getDay()]
this.container.innerHTML=formatField(hour, 1)+":"+formatField(minutes)+":"+formatField(seconds)+" "+ampm+" "
}
setTimeout(function(){thisobj.updateContainer()}, 1000) //update container every second
}
function formatField(num, isHour){
if (typeof isHour!="undefined"){ //if this is the hour field
var hour=(num>12)? num-12 : num
return (hour==0)? 12 : hour
}
return (num<=9)? "0"+num : num//if this is minute or sec field
}
</script>
</HEAD>
<BODY bgcolor="#ffffcc">
<!-- Code to Display Time -->
<H1><center>
<div>
<span id="timecontainer"></span>
<script type="text/javascript">new showLocalTime("timecontainer", "server-php", 0, "short")</script>
</div>
</center>
</H1>
<TABLE >
<TR>
<?php
$conn = new COM('ADODB.Connection') or die('Cannot start ADO');
$conn->Open('Provider=Microsoft.ACE.OLEDB.12.0; Data Source=C:\inetpub\wwwroot\share\PshincNew2.accdb; Persist Security Info=False;');
// SQL statement to build recordset.$rsElec for Electronic $rsHydr for Hydraulic
$rsElec = recordset;
$rsHydr = recordset;
$rsElec = $conn->Execute("SELECT [JOB #] FROM [JOB FOLDER] WHERE (([Rush] = TRUE) AND ([STATUS] ='A'))");
$rsHydr = $conn->Execute("SELECT [JOB #] FROM [SERVOHYDRAULICS] WHERE (([PRIORITY] = 'RUSH') AND ([STATUS] ='APPROVED'))");
//--variables initialized:
$NumberOfJobsElec=0;
$NumberPagesElec=0;
$counterElec=0;
$NumberOfJobsHydr=0;
$NumberPagesHydr=0;
$counterHydr=0;
//calculate the number of Rush in the records set for electronics
while (!$rsElec->EOF)
{
$rsElec->MoveNext();
$NumberOfJobsElec = $NumberOfJobsElec+1;
}
//calculate the number of Rush in the records set for electronics
while (!$rsHydr->EOF)
{
$rsHydr->MoveNext();
$NumberOfJobsHydr = $NumberOfJobsHydr+1;
}
//Calculate the number of Items per page
//Ceil Returns the next highest integer value by rounding up value if necessary
$NumberPagesElec = $NumberOfJobsElec/20;
$NumberPagesElec = ceil($NumberPagesElec);
$NumberPagesHydr = $NumberOfJobsHydr/20;
$NumberPagesHydr = ceil($NumberPagesHydr);
?>
<TD>
<font size="17" color=" #6600FF"><b><u><?php echo $NumberOfJobsElec." Rush Jobs in Electronics </p>"; ?></u></b></font>
</TD>
<TD>
<font size="17" color=" #6600FF"><b><u><?php echo $NumberOfJobsHydr." Rush Jobs in Hydraulics</p>";?></u></b></font>
</TD>
</TR>
<TR>
<TD>
<?php
//echo $NumberPagesElec." Pages with 20 job per page</p>";
//echo $NumberPagesHydr." Pages with 20 job per page</p>";
//--ack to the beginning of the recordset
$rsElec->MoveFirst();
$rsHydr->MoveFirst();
//Counter is to display the record number
$counterElec=1;
$counterHydr=1;
// Display all the values in the records set
//while (!$rsElec->EOF)
// {
// $RedData = $rsElec->Fields("JOB #");
// echo "Value: ".$counterElec."\n".$RedData->value."<br>\n";
// $rsElec->MoveNext();
// $counterElec += 1;
// }
// while (!$rsHydr->EOF)
// {
// $RedData = $rsHydr->Fields("JOB #");
// echo "Value: ".$counterHydr."\n".$RedData->value."<br>\n";
// $rsHydr->MoveNext();
// $counterHydr += 1;
// }
//re-populate the recorset because we are at the EOF
$rsElec->MoveFirst();
$rsHydr->MoveFirst();
// echo "test123:";
?>
<script type="text/javascript">
/***********************************************
* Fading Scroller- ? Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
var delay = 1000; //set delay between message change (in miliseconds)
var maxsteps=30; // number of steps to take to change from start color to endcolor
var stepdelay=40; // time in miliseconds of a single step
//**Note: maxsteps*stepdelay will be total time in miliseconds of fading effect
var startcolor= new Array(255,255,204); // start color (red, green, blue)
var endcolor=new Array(0,0,0); // end color (red, green, blue)
var fcontent=new Array();
begintag='<div style="font: normal 60px Arial; padding: 5px;">'; //set opening tag, such as font declarations
<?php
$counterElec=1;
while(!$rsElec->EOF)
{
echo 'fcontent[ fcontent.length ] = "' . str_replace('"','"',preg_replace('/\r?\n/U',"<br/>",$rsElec->Fields("JOB #")->Value)) . '<br/>\n' ."\";\n";
++$counterElec;
$rsElec->MoveNext();
}
$rsElec->Close();
?>
closetag='</div>';
var fwidth='690px'; //set scroller width
var fheight='660px'; //set scroller height
var fadelinks=0; //should links inside scroller content also fade like text? 0 for no, 1 for yes.
var ie4=document.all&&!document.getElementById;
var DOM2=document.getElementById;
var faderdelay=0;
var index=0;
/*Rafael Raposo edited function*/
//function to change content
var RECORDS_PER_SCREEN=8;
function changecontent()
{
if (index>=fcontent.length)
index=0;
var data = "";
for( var i=0; i < RECORDS_PER_SCREEN && typeof(fcontent[i+index])!="undefined"; ++i)
{
data+=fcontent[index + i];
}
if (DOM2)
{
document.getElementById("fscroller").style.color="rgb("+startcolor[0]+", "+startcolor[1]+", "+startcolor[2]+")";
document.getElementById("fscroller").innerHTML=begintag+data+closetag
if (fadelinks)
linkcolorchange(1);
colorfade(1, 15);
}
else if (ie4)
document.all.fscroller.innerHTML=begintag+data+closetag;
index+=RECORDS_PER_SCREEN;
}
// colorfade() partially by Marcio Galli for Netscape Communications. ////////////
// Modified by Dynamicdrive.com
function linkcolorchange(step)
{
var obj=document.getElementById("fscroller").getElementsByTagName("A");
if (obj.length>0)
{
for (i=0;i<obj.length;i++)
obj[i].style.color=getstepcolor(step);
}
}
/*Rafael Raposo edited function*/
var fadecounter;
function colorfade(step)
{
if(step<=maxsteps)
{
document.getElementById("fscroller").style.color=getstepcolor(step);
if (fadelinks)
linkcolorchange(step);
step++;
fadecounter=setTimeout("colorfade("+step+")",stepdelay);
}
else
{
clearTimeout(fadecounter);
document.getElementById("fscroller").style.color="rgb("+endcolor[0]+", "+endcolor[1]+", "+endcolor[2]+")";
setTimeout("changecontent()", delay);
}
}
/*Rafael Raposo's new function*/
function getstepcolor(step)
{
var diff
var newcolor=new Array(3);
for(var i=0;i<3;i++)
{
diff = (startcolor[i]-endcolor[i]);
if(diff > 0)
{
newcolor[i] = startcolor[i]-(Math.round((diff/maxsteps))*step);
}
else
{
newcolor[i] = startcolor[i]+(Math.round((Math.abs(diff)/maxsteps))*step);
}
}
return ("rgb(" + newcolor[0] + ", " + newcolor[1] + ", " + newcolor[2] + ")");
}
if (ie4||DOM2)
document.write('<div id="fscroller" style="border:0px solid black;width:'+fwidth+';height:'+fheight+'"></div>');
if (window.addEventListener)
window.addEventListener("load", changecontent, false)
else if (window.attachEvent)
window.attachEvent("onload", changecontent)
else if (document.getElementById)
window.onload=changecontent
</script>
</td>
<td>
<script type="text/javascript">
/***********************************************
* Fading Scroller- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
var delay1 = 1000; //set delay1 between message change (in miliseconds)
var maxsteps1=30; // number of steps to take to change from start color to endcolor1
var stepdelay1=40; // time in miliseconds of a single step
//**Note: maxsteps1*stepdelay1 will be total time in miliseconds of fading effect
var startcolor1= new Array(255,255,204); // start color (red, green, blue)
var endcolor1=new Array(0,0,0); // end color (red, green, blue)
var fcontent1=new Array();
begintag1='<div style="font: normal 60px Arial; padding: 5px;">'; //set opening tag, such as font declarations
<?php
$counterHydr=1;
while(!$rsHydr->EOF)
{
echo 'fcontent1[ fcontent1.length ] = "' . str_replace('"','"',preg_replace('/\r?\n/U',"<br/>",$rsHydr->Fields("JOB #")->Value)) . '<br/>\n' ."\";\n";
++$counterHydr;
$rsHydr->MoveNext();
}
$rsHydr->Close();
?>
closetag1='</div>';
var fwidth1='690px'; //set scroller width
var fheight1='660px'; //set scroller height
var fadelinks1=0; //should links inside scroller content also fade like text? 0 for no, 1 for yes.
///No need to edit below this line/////////////////
var ie14=document.all&&!document.getElementById;
var DOM21=document.getElementById;
var faderdelay1=0;
var index1=0;
/*Rafael Raposo edited function*/
//function to change content
var RECORDS_PER_SCREEN1=7;
function changecontent1()
{
if (index1>=fcontent1.length)
index1=0;
var data1 = "";
for( var i2=0; i2 < RECORDS_PER_SCREEN1 && typeof(fcontent1[i2+index1])!="undefined"; ++i2)
{
data1+=fcontent1[index1 + i2];
}
if (DOM21)
{
document.getElementById("fscroller1").style.color="rgb("+startcolor1[0]+", "+startcolor1[1]+", "+startcolor1[2]+")";
document.getElementById("fscroller1").innerHTML=begintag1+data1+closetag1
if (fadelinks1)
linkcolorchange1(1);
colorfade1(1, 15);
}
else if (ie14)
document.all.fscroller1.innerHTML=begintag1+data1+closetag1;
index1+=RECORDS_PER_SCREEN1;
}
/*Rafael Raposo edited function*/
var fadecounter1;
function colorfade1(step) {
if(step<=maxsteps1) {
document.getElementById("fscroller1").style.color=getstepcolor1(step);
if (fadelinks1)
linkcolorchange1(step);
step++;
fadecounter1=setTimeout("colorfade1("+step+")",stepdelay1);
}else{
clearTimeout(fadecounter1);
document.getElementById("fscroller1").style.color="rgb("+endcolor1[0]+", "+endcolor1[1]+", "+endcolor1[2]+")";
setTimeout("changecontent1()", delay1);
}
}
/*Rafael Raposo's new function*/
function getstepcolor1(step) {
var diff;
var newcolor=new Array(3);
for(var i=0;i<3;i++) {
diff = (startcolor1[i]-endcolor1[i]);
if(diff > 0) {
newcolor[i] = startcolor1[i]-(Math.round((diff/maxsteps1))*step);
} else {
newcolor[i] = startcolor1[i]+(Math.round((Math.abs(diff)/maxsteps1))*step);
}
}
return ("rgb(" + newcolor[0] + ", " + newcolor[1] + ", " + newcolor[2] + ")");
}
if (ie14||DOM21)
document.write('<div id="fscroller1" style="border:0px solid black;width:'+fwidth+';height:'+fheight1+'"></div>');
if (window.addEventListener)
window.addEventListener("load", changecontent1, false)
else if (window.attachEvent)
window.attachEvent("onload", changecontent1)
else if (document.getElementById)
window.onload=changecontent1
</script>
</td>
</tr>
</table>
<!-- Scrolling Marque on the bottom of the page -->
<script language="JavaScript1.2">
/*
Cross browser Marquee script- © Dynamic Drive (www.dynamicdrive.com)
For full source code, 100's more DHTML scripts, and Terms Of Use, visit http://www.dynamicdrive.com
Credit MUST stay intact
*/
//Specify the marquee's width (in pixels)
var marqueewidth="1400px"
//Specify the marquee's height
var marqueeheight="70px"
//Specify the marquee's marquee speed (larger is faster 1-10)
var marqueespeed=2
//configure background color:
var marqueebgcolor="#ffffcc"
//Pause marquee onMousever (0=no. 1=yes)?
var pauseit=0
//Specify the marquee's content (don't delete <nobr> tag)
//Keep all content on ONE line, and backslash any single quotations (ie: that\'s great):
var marqueecontent='<nobr><font size ="12" face="Arial">NEWS!!!! Price of Gas will go down to $2.00/gallon by the end of the summer</font></nobr>'
////NO NEED TO EDIT BELOW THIS LINE////////////
marqueespeed=(document.all)? marqueespeed : Math.max(1, marqueespeed-1) //slow speed down by 1 for NS
var copyspeed=marqueespeed //+1 added to speed the text
var pausespeed=(pauseit==0)? copyspeed: 0
var iedom=document.all||document.getElementById
if (iedom)
document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+marqueecontent+'</span>')
var actualwidth=''
var cross_marquee, ns_marquee
function populate(){
if (iedom){
cross_marquee=document.getElementById? document.getElementById("iemarquee") : document.all.iemarquee
cross_marquee.style.left=parseInt(marqueewidth)+8+"px"
cross_marquee.innerHTML=marqueecontent
actualwidth=document.all? temp.offsetWidth : document.getElementById("temp").offsetWidth
}
else if (document.layers){
ns_marquee=document.ns_marquee.document.ns_marquee2
ns_marquee.left=parseInt(marqueewidth)+8
ns_marquee.document.write(marqueecontent)
ns_marquee.document.close()
actualwidth=ns_marquee.document.width
}
lefttime=setInterval("scrollmarquee()",10)
}
window.onload=populate
function scrollmarquee(){
if (iedom){
if (parseInt(cross_marquee.style.left)>(actualwidth*(-1)+8))
cross_marquee.style.left=parseInt(cross_marquee.style.left)-copyspeed+"px"
else
cross_marquee.style.left=parseInt(marqueewidth)+8+"px"
}
else if (document.layers){
if (ns_marquee.left>(actualwidth*(-1)+8))
ns_marquee.left-=copyspeed
else
ns_marquee.left=parseInt(marqueewidth)+8
}
}
if (iedom||document.layers){
with (document){
document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
if (iedom){
write('<div style="position:relative;width:'+marqueewidth+';height:'+marqueeheight+';overflow:hidden">')
write('<div style="position:absolute;width:'+marqueewidth+';height:'+marqueeheight+';background-color:'+marqueebgcolor+'" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">')
write('<div id="iemarquee" style="position:absolute;left:0px;top:0px"></div>')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+marqueewidth+' height='+marqueeheight+' name="ns_marquee" bgColor='+marqueebgcolor+'>')
write('<layer name="ns_marquee2" left=0 top=0 onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed"></layer>')
write('</ilayer>')
}
document.write('</td></table>')
}
}
</script>
</BODY>
</HTML>