Pagina 1 di 2

Oggetti web-oriented

Inviato: mar 23 ott 2012, 22:32
da darkstaring
Sera a tutti :)..
Vorrei realizzare degli "oggetti" trascinabili sopra una tabella scritta in html..
Questa tabella ha delle coordinate, le righe suddividono le ore e le colonne i dipendenti..
In pratica sto facendo un'agenda e vorrei che gli appuntamenti registrati possano essere trascinabili.
Ho trovato qualcosa in rete di pronto ma preferirei provare a farlo dà mè..
Sapete se si può fare con canvas o avete di meglio da consigliarmi da studiare?

Grazie

Re: Animazioni web-oriented

Inviato: mer 24 ott 2012, 1:08
da ZeroUno
che io mi ricordi i div sono trascinabili (non so se serve qualche parametro) ma l'ho mai fatto

Re: Animazioni web-oriented

Inviato: mer 24 ott 2012, 9:49
da teox99

Re: Animazioni web-oriented

Inviato: mer 24 ott 2012, 23:01
da darkstaring
Grazie.. Ho abbandonato l'idea del trascinabile per provare a riempire le tabelle mano mano, e verificare così tutti i minuti (cosa che non mi piace)...
la cpu viaggià al 100% se vedo tutti i dipendenti di tutte le sedi :)..

Adesso vorrei provare a scrivere prima la tabella e poi dati gli appuntamenti creare un'oggetto sopra per ogni appuntamento...

Credo di dover dare una grandezza fissa alle celle e dopo avere stampato la tabella dati gli appuntamenti posizionarli...
E' la via giusta???.. con cosa lo potrei fare???
Grazie :)

Re: Animazioni web-oriented[risolto]

Inviato: sab 27 ott 2012, 10:01
da darkstaring
Stavo guardando ImagicDraw ma mi dà errore quando tento di fare
new Imagick();

Cosa potrei usare???
Grazie :o

Re: Animazioni web-oriented

Inviato: sab 27 ott 2012, 10:24
da teox99
purtroppo non si capisce bene quello che chiedi...
prova ad essere più chiaro.

- posso dirti che la cpu va al 100% perché evidentemente la query tira fuori parecchi risultati da plottare, prova a dividere l'output per pagine.
- imageMagick per php è sicuramente sbagliato.

Re: Animazioni web-oriented

Inviato: sab 27 ott 2012, 10:48
da darkstaring
teox99 ha scritto:- imageMagick per php è sicuramente sbagliato.
Ahahahahah.....

In pratica avrei bisogno di uno strumento che mi permetta di creare un'oggetto e posizionarlo dove voglio...
Io dovrei metterlo sopra una tabella e far sì che sia grande quanto voglio io... per ora và più che bene anche se non è trascinabile..

....Il metodo attuale che riempie mano mano è sicuramente sbagliato (anche se funziona) perchè controllo se nel blocco che sto scrivendo ho un'appuntamento o no..

in pratica la procedura che scrive la tabella è grosso modo scritta così:

Codice: Seleziona tutto

dati gli orari di apertura e di chiusura, dipendente e sede;
ore=orario_apertura
finchè ore è minore di orario di chiusura fai
<table>
<tr><td>{
if(verifica se a quest'ora ci sono appuntamenti)
se si lo scrivi altrimenti scrive un ' +' che sta per aggiungi
minuti += 15;
} </td></tr>
.....
La pecca è che se metto un'appuntamento alle 10:10 non lo trovo se non riduco l'intervallo (minuti)

sarebbe molto meglio chiedere tutti gli appuntamenti (di quel giorno, di quel dipendente)
ed in base ai risultati scrivere il blocco sopra la tabella dove deve stare...

Sono stato chiaro???

Re: Animazioni web-oriented

Inviato: sab 27 ott 2012, 11:10
da darkstaring
Preferirei usare php...
Ho visto in php "imagecreate" per creare l'immagine ed ho visto anche come dimensionarla, inserire il testo e cambiare il colore.. quello che mi serve

Ora devo solo capire come posso posizionarla sopra in ordine...
E' fattibile???

Re: Oggetti web-oriented

Inviato: sab 27 ott 2012, 13:53
da teox99
non capisco cosa è e come funziona "l'oggetto" di cui parli,
in genere per creare effetti grafici in html si usano i css o direttamente dei link ad immagini,
prova a postare un esempio grafico.

Re: Oggetti web-oriented

Inviato: sab 27 ott 2012, 15:23
da darkstaring
teox99 ha scritto:non capisco cosa è e come funziona "l'oggetto" di cui parli,
in genere per creare effetti grafici in html si usano i css o direttamente dei link ad immagini,
prova a postare un esempio grafico.
un esempio grafico?.. cioè?.. questa 'immagine mostra la tabella riempita mano mano: Immagine
Anche se funziona (circa), vorrei ottimizzare il processo
perchè adesso devo chiedere se l'appuntamento c'è o no invece di vedere solo gli appuntamenti che ci sono...

Invece di fare una select ogni 15 min per ogni dipendente ne faccio una per l'intero giorno di quel dipendente e poi
dati gli appuntamenti restituiti dal db li scrivo sopra la tabella. Questo è quello che vorrei fare per evitare controlli inutili...

... vorrei scrivere solo la tabella (senza gli appuntamenti) e successivamente aggiungerli sopra la tabella
dando: posizione,grandezza, testo da scrivere sopra e colore
tutto quì...

Re: Oggetti web-oriented

Inviato: sab 27 ott 2012, 16:18
da teox99
se vuoi scrivere la tabella e poi dopo riempirla ti servirà una tecnica chiamata AJAX o AHAH(Asynchronous HTML over HTTP)
in questo modo potrai controllare e riempire solo le celle con appuntamento.

ho fatto un sito simile a quello che vuoi fare tu (ma per il calcetto)
si chiama www.next-c5.org

Re: Oggetti web-oriented

Inviato: lun 29 ott 2012, 14:55
da darkstaring
teox99 ha scritto:se vuoi scrivere la tabella e poi dopo riempirla ti servirà una tecnica chiamata AJAX o AHAH(Asynchronous HTML over HTTP)
in questo modo potrai controllare e riempire solo le celle con appuntamento.

ho fatto un sito simile a quello che vuoi fare tu (ma per il calcetto)
si chiama http://www.next-c5.org
Non conoscendo AJAX ho dato un'occhiata a AHAH e da quel che sembra AHAH è leggero e semplice
ma non ho trovato niente che faccia a caso mio..
potresti postarmi qualche pagina con esempi o dove si discuta di quel che serve a mè ?

Grazie 1000 :D

Re: Oggetti web-oriented

Inviato: lun 29 ott 2012, 15:32
da teox99
puoi guardare qui ed intanto predere dimestichezza con il codice nel file .js
http://www.openjs.com/articles/ajax/aha ... over_http/

nel tuo caso, dovresti:
- plottare la tabella calendario vuota come già stai facendo
- associare ad ogni giorno un id <div id="20122910"></div>
- alla fine del tuo html chiamare la funzione (AHAH) che si scorre tutti gli id e controlla nel DB se ci sono appuntamenti, quindi aggiorna il relativo id del div in questione con l'ora dell'appuntamento trovato.
<div id="20122910">
<ul>
<li>ore 10:00 - Dottore</li>
<li>ore 11:10 - Calcetto</li>
...
</ul>
</div>

Re: Oggetti web-oriented

Inviato: lun 29 ott 2012, 17:38
da lablinux
Perché disegnarla vuota e poi riempirla?
Perché l'intervallo lo blocchi a 10 minuti. Non conosco l'applicativo e non ho capito molto bene l'immagine che hai inviato, è qualcosa tipo calendario?
Ma il simbolo "+" che si vede nell'immagine, serve ad aggiungere un'appuntamento? L'agenda è del singolo dipendente, cioè è personale e la vede il dipendente?

Re: Oggetti web-oriented

Inviato: lun 29 ott 2012, 17:58
da darkstaring
teox99 ha scritto:puoi guardare qui ed intanto predere dimestichezza con il codice nel file .js
http://www.openjs.com/articles/ajax/aha ... over_http/

nel tuo caso, dovresti:
- plottare la tabella calendario vuota come già stai facendo
- associare ad ogni giorno un id <div id="20122910"></div>
- alla fine del tuo html chiamare la funzione (AHAH) che si scorre tutti gli id e controlla nel DB se ci sono appuntamenti, quindi aggiorna il relativo id del div in questione con l'ora dell'appuntamento trovato.
<div id="20122910">
<ul>
<li>ore 10:00 - Dottore</li>
<li>ore 11:10 - Calcetto</li>
...
</ul>
</div>
Mamma mia che difficile :).. Non conosco javascript e sembrerebbe abbastanza difficile dati gli appuntamenti unire celle precedentemente create e metterci sù quello che mi serve... comunque proverò....

a proposito... che significa plottare??? è un termine che vedo spesso ma non nè conosco il significato
grazie
lablinux ha scritto:Perché disegnarla vuota e poi riempirla?
Perché l'intervallo lo blocchi a 10 minuti. Non conosco l'applicativo e non ho capito molto bene l'immagine che hai inviato, è qualcosa tipo calendario?
Ma il simbolo "+" che si vede nell'immagine, serve ad aggiungere un'appuntamento? L'agenda è del singolo dipendente, cioè è personale e la vede il dipendente?
No.. il calendario serve solo a portare alla data selezionata...
una volta data la data vengono stampate le tabelle delle sedi (tante quante sono),
all'interno di ogni tabella vengono create altre tabelle; la prima indica solo l'ora,
successivamente creo altre tabelle (tante quanti sono i dipendenti presenti in quella sede) sempre dentro la tabella sede.. e dentro questa tabella che scansiono gli appuntamenti...

Ti posto il sorgente di quella pagine nonostante il codice è inguardabile.. vorrebbe tutto risistemato #-o :

Codice: Seleziona tutto

<?php include("../../includi.php")?>

<center>
	
<div id="calendario">
<?php include("calendario.php");?>
</div>
<br>


 </center>

  <form method="post" action="">
  <input type="submit" name="associa" value="Aggiungi aggiunstamento">
  </form>

<?php

  //VARIABILE CHE MICLA MINUTI
  $incrementomin = "30";  
  $orarioapertura="09";
  $orariochiusura="20";

  $height="60";

if(isset($_POST['meseselezionato']) && isset($_POST['annoselezionato']) )
  {
	$mese = $_POST['meseselezionato'];
	$anno = $_POST['annoselezionato'];
	
	if(isset($_POST['giornoselezionato'])) $giorno=$_POST['giornoselezionato'];
	else $giorno=1;
	
	$data= mktime (0, 0, 0, $mese, $giorno, $anno);
	$dataattuale=getdate($data);
    }
else
  {
    $dataattuale=getdate();
  }
    $giorno=$dataattuale['mday'];
    $mese=$dataattuale['mon'];
    $anno=$dataattuale['year'];
    $wday=$dataattuale['wday']; 

   if (!checkdate($mese, $giorno, $anno))
   {
      print "data inserita inesistente <a href=\"#\"> Riprova </a>";
      break;
   }
   print "<h2><center>[$giorno - $mese - $anno]</center></h2>";
   
//RICHIAMA PROCEDURA AGENDA   
$sql=mysql_query("SELECT * FROM sedi");
if($sql==FALSE) print "Non ho accesso alle sedi";
else
  {
      for($i=0;$i<mysql_num_rows($sql);$i++)
      {
	  $codsede=mysql_result($sql,$i,'id');
	  $nomesede=mysql_result($sql,$i,'nome');
	  print "<div id=\"appuntamenti\">";
	  scrivisede($codsede, $nomesede);
	  print "</div>";
	  print "<br>";
      }
  }


?>



<?php

function scrivisede($codsede,$nomesede)
{

global $giorno,$mese,$anno;

//INSERISCO TUTTI I DIPENDENTI IN UN'ARRAY ASSICIATIVO
$query2 = mysql_query("select dipendenti.nome,dipendenti.id
		      from dipendenti,dip_sedi where dip_sedi.id_dip=dipendenti.id
		      AND id_sede='$codsede' AND attivo=1 ORDER BY dipendenti.id;");
if($query2==FALSE) print "ERRORE";

if(mysql_num_rows($query2)<1) exit;

for ($dip=0; $dip < mysql_num_rows($query2); $dip++)
	  {
	    $iddipendete = mysql_result($query2,$dip,"id");
	    $nomedipendente = mysql_result($query2,$dip,"nome");
	    $vett_dip[]=array(
			      'id'   => "$iddipendete",
			      'nome' => "$nomedipendente",
			     );
	  }
//ELIMINO I DIPENDENTI PRESENTI IN FESTIVI		     
$sql=mysql_query("select * from festivi where data like '$anno-%$mese-%$giorno' ");
	if($sql==FALSE) print "Errore in select id from festivi where data like '$anno-$mese-$giorno' ";
	else
	{
	    for($i=0;$i<mysql_num_rows($sql);$i++)
	    {
	      $idriposo=mysql_result($sql,$i,'id_dipendente');
	      unset($vett_dip[$idriposo-1]) ;
	      
	    }
 	}
      $colonne=count($vett_dip)+1;
      print "\n \n \n \n<TABLE border=1>";
      print "<TH COLSPAN=\"".$colonne."\" height=\"100%\">$nomesede</TH></tr>";

      print "	<th  COLSPAN=\"".$colonne."\">
			  <form method=\"post\" action=\"APPUNTAMENTI/aggiungi.php\">
			  <input type=\"hidden\" name=\"codsede\" value=\"$codsede\">
			  <input type=\"submit\" value=\"+\" style=\"height: auto; width: 70%;\" >
			  </form> </th></tr> \n";
  
  
      print "<tr>";
      print "<td>";
	  scivi_orario();
      print "</td>";

      //CREO UNA TABELLA PER OGNI DIPENDENTE
      foreach($vett_dip as $vett)
      {
	  print "<td>";
	  $id=$vett['id'];
	  scrivi_dipendente($codsede,$id);
	  print "</td>";
      } 
  print "</tr></table>";
}

function add_incremento(&$minuti,&$ore)
{
global $incrementomin;
$minuti=(string) ((int)$minuti+$incrementomin);
	if($minuti>=60)
	    {
	      while($minuti>59)
	      {
		$ore++;
		$minuti=$minuti-60;
	      }
	    }
	    if($minuti<10)
	    $minuti="0".(string)$minuti;

}
function scivi_orario()
{
global $incrementomin, $orarioapertura, $orariochiusura, $height;

  $ore=$orarioapertura;
  $minuti="00";
  print "\n <table border=\"1\">";
  print "<tr><td><br><br></td></tr>";
  print "<tr><TH>ORE</TH></tr>";
      //CILO ORA/TEMPO
      while($ore<=$orariochiusura)
      {

       print "<TR><td height=$height>&nbsp";

	      print "$ore:$minuti";

       print "</td></tr>";
       add_incremento($minuti,$ore);
      }   
     print "</table>";
}

function scrivi_dipendente($codsede,$id)
{
global $incrementomin, $orarioapertura, $orariochiusura, $height;

global $giorno,$mese,$anno, $wday;

  $ore=$orarioapertura;
  $minuti="00";
  $totelementi=$incrementomin;
  print "<div id=\"dipendente_table\">";
print "<table border=\"1\">";
trovapercentuale($id);
$blocco=0;
print "<TH>".$id."</TH>";


      //CILO ORA/TEMPO
      while($ore<=$orariochiusura)
	{
	  print "<TR>";

//TEMPO: wday select * from tempo where '2012-11-05'  between data_inizio and data_fine;
$sql=mysql_query("select * from tempo
		  where giorno_sett=$wday and id_dip=$id and id_sede=$codsede
		  and 
		  ('$anno-$mese-$giorno' between data_inizio and data_fine
		  and '$ore:$minuti:00' between ora_inizio and ora_fine or '$ore:$minuti:00' = ora_inizio);
		");

if($sql==FALSE) print "Errore <br>".mysql_error();
else
{
  if(mysql_num_rows($sql)!=0)
  {
      $occupato=1;
  }
  else $occupato=0;
}

if($occupato==1)
{
  print "<td height=\"$height\">&nbsp</td>";
}
else
{
	  $query = "SELECT CONCAT(clienti.nome, ' ', clienti.cognome) AS CLIENTE,
			   id_trattamento, trattamento.durata,
			   id_dipendente,
			   appuntamenti.*
		    FROM dipendenti, appuntamenti, clienti, trattamento
		    WHERE (id_dipendente = dipendenti.id)  AND 
			  (id_cliente = clienti.id) AND
			  trattamento.id=appuntamenti.id_trattamento AND
			  (id_dipendente=".$id.") AND
			  dataora LIKE '$anno-%$mese-%$giorno $ore:$minuti:%%' AND
			  id_sede=$codsede ;";
			  //( (noshow=0) OR (noshow=5) ) AND

	  $query=mysql_query($query);
	  if($query==FALSE) print "Errore nella ricerca appuntamento";
	  else
	  {
	      if(mysql_num_rows($query) > 0) //SE PER QUESTO DIPENDETE A QUEST'ORA CI SONO APPUNTAMENTI FAI
	      { 
		for ($i=0; $i < mysql_num_rows($query); $i++)
		{
		$idmod=mysql_result($query,$i,"appuntamenti.id");
		$coddip=mysql_result($query,$i,"id_dipendente");
		$nomecliente = mysql_result($query,$i,"CLIENTE");
		$trattamento= mysql_result($query,$i,"id_trattamento");
		$durata= mysql_result($query,$i,"durata");
		$noshow= mysql_result($query,$i,"noshow");
		$id_stato= mysql_result($query,$i,"id_stato");


		$colore=trovacolore($id_stato,$noshow);
		
		$rowspan=(int)($durata/$incrementomin);
		
		$blocco=$rowspan;
		$height2=$height*$rowspan;
		print "\n
			<TD rowspan=\"$rowspan\" height=\"$height2\"  bgcolor=\"grey\">
			$ore:$minuti
			  <form method=\"post\" action=\"APPUNTAMENTI/scelta.php\">
			  <button style=\"background-color:$colore\">
			      $nomecliente <br><b>$trattamento</b>
			  </button>
			  
			  <input type=\"hidden\" name=\"id\" value=\"".$idmod."\"><br>
			  </form>";
		print "</TD> \n";
		$blocco--;
		}
	      }
	    else {
	    
		      if($blocco>0)
		      {
			  //print "</tr><tr><td>cancello blocco $blocco</td></tr>";
			  $blocco--;
		      }
		      else
			{
			  print "\n<td height=\"$height\">
			  <form method=\"post\" action=\"APPUNTAMENTI/aggiungi.php\">
			  <input type=\"hidden\" name=\"codsede\" value=\"$codsede\">
			  <input type=\"hidden\" name=\"ora\" value=\"$ore\">
			  <input type=\"hidden\" name=\"minuti\" value=\"$minuti\">
			  <input type=\"hidden\" name=\"data\" value=\"$giorno.$mese.$anno\">
 			  <input type=\"hidden\" name=\"coddip\" value=\"".$id."\" >
			  <input type=\"submit\" value=\"+\" style=\"height: auto; width: auto;\" >
			  </form> </TD>\n";
			  }
		  }
	  }
}
	  print "</TR>";
	  add_incremento($minuti,$ore);
	  }
print "</table>";
}

//function tempo ($giorno,$mese,$anno, $id_dip,)
    
//IN BASE ALL'APP SCELGO COLORE    
function trovacolore($id_stato,$noshow)
{
	switch($id_stato)
	{
		  case 1: $colore="lightgreen";
			  break;
		  case 2: $colore="orange";
			  break;
		  case 3: $colore="red";
			  break;
		  default:$colore="red";
		  break;
	}
	if($noshow==1) $colore="red";
return($colore);
}
function trovapercentuale($id)
{
global $giorno,$mese,$anno;
global $codsede;
global   $orarioapertura, $orariochiusura;

$tot_ore_lavora= $orariochiusura- $orarioapertura;
$minuti=$tot=0;

	  $query = "SELECT trattamento.durata
		    FROM dipendenti, appuntamenti, trattamento
		    WHERE (id_dipendente = dipendenti.id)  AND 
			  trattamento.id=appuntamenti.id_trattamento AND
			  (id_dipendente=".$id.") AND
			  dataora LIKE '$anno-%$mese-%$giorno %%:%%:%%' AND
			  id_sede=$codsede;";

	  $query=mysql_query($query);
	  if($query==FALSE) print "Errore nella ricerca appuntamento";
	  else
	  {
	      if(mysql_num_rows($query) > 0) //SE PER QUESTO DIPENDETE A QUEST'ORA CI SONO APPUNTAMENTI FAI
	      { 
		for ($i=0; $i < mysql_num_rows($query); $i++)
		{
		    $durata= mysql_result($query,$i,"durata");
		    $minuti+=$durata;
		}
	      }

	    if($minuti>=60)
	    {
	      while($minuti>59)
	      {
		$tot++;
		$minuti=$minuti-60;
	      }
	    }
	    
	    $tot += ($minuti/60);
	     $percentuale=($tot*100)/$tot_ore_lavora;
	  }
$percentuale = number_format($percentuale, 2, ',', '.');

if($percentuale>25) $colore="green";
else $colore="red";

print "<tr><td bgcolor=\"$colore\">";
print "Ha lavorato per il $percentuale % \n";
print "</td></tr>";
}
?>


<?php footer()?>