cambiare valore variabile in java

[emilio79]

salve a tutti.
ho finito di realizzare un piccolo sito in php ma in uno slider ho dovuto inserire del codice java per dinamicizzare una progressbar.
ora il mio problema è che vorrei cambiare il colore della progressba una volta che arriva al 50% ed una volta che arriva all'80%.
in poche parole parte in colore arancio, poi al 50 % passa al rosso ed all'80% ad un rosso più intenso. ho provato in tutti i modi ma siccome sono alle prmissime armi in js ho capito che non ci sarei mai riuscito.
potete aiutarmi???
posto parte del codice.

var colorebarra='orange' ;       // COLORE PROGRESS BAR 
var coloresfbarra='white';     // COLORE SFONDO BARRA
var colorebordo='navy';            // COLORE BORDO BARRA
var barheight=5;                  // ALTEZZA IN PIXEL BARRA
var barwidth=800;                  // LUNGHEZZA BARRA IN PIXEL
var temposlide=<?php echo $temporefresh; ?>;                   // SECONDI DI REFRESH DA SETTARE TRAMITE FILE VARIABILI


var ns4=(document.layers)?true:false;
var ie4=(document.all)?true:false;
var blocksize=(barwidth-2)/temposlide/10;
var attivato=0;
var PBouter;
var PBdone;
var PBbckgnd;
var Pid=0;
var txt='';
if(ns4){
txt+='<table border=0 cellpadding=0 cellspacing=0><tr><td>';
txt+='<ilayer name="PBouter" visibility="hide" height="'+barheight+'" width="'+barwidth+'" onmouseup="hidebar()">';
txt+='<layer width="'+barwidth+'" height="'+barheight+'" bgcolor="'+colorebordo+'" top="0" left="0"></layer>';
txt+='<layer width="'+(barwidth-2)+'" height="'+(barheight-2)+'" bgcolor="'+coloresfbarra+'" top="1" left="1"></layer>';
txt+='<layer name="PBdone" width="'+(barwidth-2)+'" height="'+(barheight-2)+'" bgcolor="'+colorebarra+'" top="1" left="1"></layer>';
txt+='</ilayer>';
txt+='</td></tr></table>';
}else{
txt+='<div id="PBouter" onmouseup="hidebar()" style="position:relative; visibility:hidden; background-color:'+colorebordo+'; width:'+barwidth+'px; height:'+barheight+'px;">';
txt+='<div style="position:absolute; top:1px; left:1px; width:'+(barwidth-2)+'px; height:'+(barheight-2)+'px; background-color:'+coloresfbarra+'; font-size:1px;"></div>';
txt+='<div id="PBdone" style="position:absolute; top:1px; left:1px; width:0px; height:'+(barheight-2)+'px; background-color:'+colorebarra+'; font-size:1px;"></div>';
txt+='</div>';
}


document.write(txt);


function incrCount(){
window.status="Loading...";
attivato++;
if(attivato<0)attivato=0;
if(attivato>=temposlide*10){
clearInterval(Pid);
attivato=temposlide*10;
setTimeout('hidebar()',100);


}
if (attivato==temposlide*10) {
self.location="<?php echo $_GET['img']; ?>";
}
resizeEl(PBdone, 0, blocksize*attivato, barheight-2, 0);
}




function progressBarInit(){
PBouter=(ns4)?findlayer('PBouter',document):(ie4)?document.all['PBouter']:document.getElementById('PBouter');
PBdone=(ns4)?PBouter.document.layers['PBdone']:(ie4)?document.all['PBdone']:document.getElementById('PBdone');
resizeEl(PBdone,0,0,barheight-2,0);
if(ns4)PBouter.visibility="show";
else PBouter.style.visibility="visible";
Pid=setInterval('incrCount()',95);


}


function resizeEl(id,t,r,b,l){
if(ns4){
id.clip.left=l;
id.clip.top=t;
id.clip.right=r;
id.clip.bottom=b;
}else id.style.width=r+'px';
}


window.onload=progressBarInit;

[emilio79]

caspita tanto difficile è la situazione???

[KillerWorm]

Ciao, la soluzione mi sembra alquanto semplice.
E' probabile che qualcuno sia stato disorientato dal fatto che hai parlato di "codice java" mentre questo è il forum di javascript (sono due cose abbastanza differenti).
Ad ogni modo puoi risolvere con due condizioni in serie che verifichino quando la dimensione della barra arriva ad 80% o 50%, di conseguenza imposti il valore della proprietà backgroundColor.

Nella funzione resizeEl inserisci una roba del genere:

if(r/barwidth>=.8) id.style.backgroundColor='Red';
else if(r/barwidth>=.5) id.style.backgroundColor='OrangeRed';

[emilio79]

ciao e grazie della risposta
tuttavia ho provato come mi hai detto ma non funziona:

function resizeEl(id,t,r,b,l){
if(ns4){
id.clip.left=l;
id.clip.top=t;
id.clip.right=r;
id.clip.bottom=b;
if(r/barwidth>=.8) id.style.backgroundColor='Red';
else if(r/barwidth>=.5) id.style.backgroundColor='OrangeRed';
}

[KillerWorm]

Ok, vedo che non ci siamo..
Toglilo da quella condizione e mettilo ad inizio funzione. Per intenderci, prima di: if(ns4){

[emilio79]

niente da fare nemmeno.
aggiungendo quel codice prima di if(ns4)
non mi visualizza più l'oggetto barra.

[emilio79]

ho provato a fare così
ho inserito all'interno della finzione incrCount un blocco if
come ho fatto per il redirect alla fine del conteggio ma niente.
forse sbaglio la sintassi di riassegnazione valore alla variabile????

function incrCount(){
window.status="Loading...";
attivato++;
if(attivato<0)attivato=0;
if(attivato>=temposlide*10){
clearInterval(Pid);
attivato=temposlide*10;
setTimeout('hidebar()',100);


}
if (attivato==temposlide*8) {
var colorebarra='Red';
}
if (attivato==temposlide*10) {
self.location="<?php echo $_GET['img']; ?>";
}
resizeEl(PBdone, 0, blocksize*attivato, barheight-2, 0);
}

[KillerWorm]

Ciao, non so che dirti. Il metodo che ti ho consigliato l'ho provato io sul tuo stesso codice e a me funziona perfettamente.
L'unico dubbio che mi viene in mente è che tu stia usando Netscape, per il quale è presente la condizione if(ns4). In tal caso è possibile che non funzioni. Io ho testato su FF, IE e CH. Va che una meraviglia.

Posto qui il codice completo della prova che ho fatto:

<!DOCTYPE HTML>
<html>
<head>
</head>
<body>

<script type="text/javascript">

var colorebarra='orange' ;       // COLORE PROGRESS BAR
var colorebarra50='OrangeRed';
var colorebarra80='Red';

var coloresfbarra='white';     // COLORE SFONDO BARRA
var colorebordo='navy';            // COLORE BORDO BARRA
var barheight=5;                  // ALTEZZA IN PIXEL BARRA
var barwidth=800;                  // LUNGHEZZA BARRA IN PIXEL
var temposlide=5;                   // SECONDI DI REFRESH DA SETTARE TRAMITE FILE VARIABILI

var ns4=(document.layers)?true:false;
var ie4=(document.all)?true:false;
var blocksize=(barwidth-2)/temposlide/10;
var attivato=0;
var PBouter;
var PBdone;
var PBbckgnd;
var Pid=0;
var txt='';
if(ns4){
txt+='<table border=0 cellpadding=0 cellspacing=0><tr><td>';
txt+='<ilayer name="PBouter" visibility="hide" height="'+barheight+'" width="'+barwidth+'" onmouseup="hidebar()">';
txt+='<layer width="'+barwidth+'" height="'+barheight+'" bgcolor="'+colorebordo+'" top="0" left="0"></layer>';
txt+='<layer width="'+(barwidth-2)+'" height="'+(barheight-2)+'" bgcolor="'+coloresfbarra+'" top="1" left="1"></layer>';
txt+='<layer name="PBdone" width="'+(barwidth-2)+'" height="'+(barheight-2)+'" bgcolor="'+colorebarra+'" top="1" left="1"></layer>';
txt+='</ilayer>';
txt+='</td></tr></table>';
}else{
txt+='<div id="PBouter" onmouseup="hidebar()" style="position:relative; visibility:hidden; background-color:'+colorebordo+'; width:'+barwidth+'px; height:'+barheight+'px;">';
txt+='<div style="position:absolute; top:1px; left:1px; width:'+(barwidth-2)+'px; height:'+(barheight-2)+'px; background-color:'+coloresfbarra+'; font-size:1px;"></div>';
txt+='<div id="PBdone" style="position:absolute; top:1px; left:1px; width:0px; height:'+(barheight-2)+'px; background-color:'+colorebarra+'; font-size:1px;"></div>';
txt+='</div>';
}
document.write(txt);
function incrCount(){
window.status="Loading...";
attivato++;
if(attivato<0)attivato=0;
if(attivato>=temposlide*10){
clearInterval(Pid);
attivato=temposlide*10;
setTimeout('hidebar()',100);
}
if (attivato==temposlide*10) {
self.location="<?php echo $_GET['img']; ?>";
}
resizeEl(PBdone, 0, blocksize*attivato, barheight-2, 0);
}

function progressBarInit(){
PBouter=(ns4)?findlayer('PBouter',document):(ie4)?document.all['PBouter']:document.getElementById('PBouter');
PBdone=(ns4)?PBouter.document.layers['PBdone']:(ie4)?document.all['PBdone']:document.getElementById('PBdone');
resizeEl(PBdone,0,0,barheight-2,0);
if(ns4)PBouter.visibility="show";
else PBouter.style.visibility="visible";
Pid=setInterval('incrCount()',95);
}

function resizeEl(id,t,r,b,l){
if(r/barwidth>=.8) id.style.backgroundColor='Red';
else if(r/barwidth>=.5) id.style.backgroundColor='OrangeRed';
if(ns4){
id.clip.left=l;
id.clip.top=t;
id.clip.right=r;
id.clip.bottom=b;
}else{
id.style.width=r+'px';
}
}

window.onload=progressBarInit;
</script> 
</body>
</html>

[emilio79]

uso crome ma comunque tu hai settato due nuove variabili all'inizio colorebarra50 e colorebarra80
perchè?
PROVATO funziona anche da me.
avrò sbagliato qualcosa io prima.
ho incollato il tuo codice e funziona.
le due variabili le ho cancellate.
Ciao e grazie

[KillerWorm]

Se usi chrome deve funzionare. Nel caso il problema è altrove.

Quelle due variabili sono rimaste da una prova precedente. In questo caso non incidono sul funzionamento. Puoi eliminarle.

Più precisamente le avevo usate inizialmente per assegnare il colore in questo modo:

if(r/barwidth>=.8) id.style.backgroundColor=colorebarra80;
else if(r/barwidth>=.5)id.style.backgroundColor=colorebarra50;

ma se lo assegni direttamente, cambia ben poco a livello di funzionamento.