script per screenshot

**fantacalciojarno** · 22-01-2012, 02.41.08

Scusate la domanda forse banale,ma esiste uno script che permetti di catturare l'immagine di una tabella tramite un pulsante e salvarla in una cartella?

**karl94** · 22-01-2012, 13.29.02

No, non è possibile.

**fantacalciojarno** · 22-01-2012, 14.51.44

Non si puo' con un javascript o non si puo'proprio?Mi pare strano che non ci sia nessun modo in assoluto..

**karl94** · 22-01-2012, 14.53.22

Non si può in Javascript, bisognerebbe implementare un motore di rendering. A cosa ti serve esattamente, la soluzione potrebbe essere più semplice di quel che tu credi.

**fantacalciojarno** · 22-01-2012, 15.01.23

mmm..ho una pagina con un javascript che mi permette di fare drag and drop con degli elementi,il problema è che quando aggiorno la pagina gli elementi tornano ovviamente al loro posto,quindi cercavo qualcosa che mi salvi l'immagine modificata con gli elementi dove ho deciso di metterli cosi da poterla visualizzare in un altra pagina....eheh..forse non è semplicissimo e spero di essermi spiegato in maniera esaustiva

**karl94** · 22-01-2012, 15.02.17

Allora semplicemente memorizza le posizioni degli elementi.

**fantacalciojarno** · 22-01-2012, 15.07.02

ssi..ma poi mi rimane una memorizzazione permanente e non posso piu'modificarla...e..mi hai segnalato?Perchè non 'potrei' cercare una soluzione allo stesso problema in php?

**karl94** · 22-01-2012, 15.08.58

Perché dovrebbe essere permanente? Dipende tutto da come implementi la soluzione.

**fantacalciojarno** · 22-01-2012, 15.10.30

tra tutto mi viene da ridere...ma tratteniamoci!Non so come implementare la memorizzazione allora ok?cosi rimando sul javascript e so tutti felici

**radiodelmomento** · 22-01-2012, 15.20.41

Sarebbe una soluzione usare MySQL (cos'è).

**fantacalciojarno** · 22-01-2012, 15.24.44

e php quindi? O_O
Speriamo un moderatore mi sposti nella sezione giusta

EDIT:

poi ti ci metti da solo e ti ammoniscono

**alemoppo** · 22-01-2012, 18.49.40

Problema:

Originalmente inviato da fantacalciojarno

il problema è che quando aggiorno la pagina gli elementi tornano ovviamente al loro posto,quindi cercavo qualcosa che mi salvi l'immagine modificata con gli elementi dove ho deciso di metterli cosi da poterla visualizzare in un altra pagina

Soluzione:

Originalmente inviato da karl94

Allora semplicemente memorizza le posizioni degli elementi.

Dove memorizzare:

Originalmente inviato da radiodelmomento

Sarebbe una soluzione usare MySQL

Cosa non hai capito?

Anche se ci fosse un modo per fare uno screenshot, comunque non ti sarebbe utile: come posizioneresti gli elementi? Dovresti fare un sistema che riconosce gli elementi nello screenshot e misura di quanto sono stati spostati dalla situazione di default. Cosa troppo complicata, direi (se non impossibile, in javascript).
La soluzione più semplice e più immediata ti è stata indicata.

Ciao!

**fantacalciojarno** · 22-01-2012, 21.43.59

Sarebbe una soluzione se ne fossi capace...mi sposti?

**karl94** · 23-01-2012, 23.09.19

Originalmente inviato da fantacalciojarno

Mi sposti?

La questione è legata sia a Javascript che a PHP, spostando la discussione non si otterrebbe nessun beneficio.

Se vuoi essere aiutato evita di infrangere il regolamento e collabora con chi cerca di aiutarti: spiega il punto di partenza (indicando codice ed eventuali indirizzi di pagine d'esempio) e il punto di arrivo, se qualcuno vorrà e saprà aiutarti lo farà.

Comunque hai le idee molto confuse, Java e Javascript hanno in comune poche cose a parte la radice del nome, fare ciò che tu cerchi di fare appiccicando script obsoleti l'uno assieme all'altro senza avere idea di cosa si stia facendo non è il migliore dei modi.

Originalmente inviato da fantacalciojarno

Sarebbe una soluzione se ne fossi capace...

Se non sei capace, le cose sono due: o chiedi a qualcuno che lo faccia per te o spieghi quali sono le tue difficoltà in modo tale che ti si possa consigliare cosa fare, ti ricordo che non sappiamo nulla di te, di cosa conosci e non, di che tipo di studi fai e quant'altro, dunque non possiamo a priori consigliarti cosa fare.

**radiodelmomento** · 24-01-2012, 00.38.28

Potresti pubblicare il codice JS (JavaScript) che usi così vediamo di integrarlo al PHP (se non l'hai già fatto)?
Ciao!

**fantacalciojarno** · 25-01-2012, 16.41.20

Le idee un po confuse le avevo ma ora me le hanno un po chiarite (non qui), ma il problema della memorizzazione delle posizioni rimane.
La pagina, compresi js è questa:

Codice HTML:

<head>
<style type="text/css"> .dragme{position:relative;cursor: pointer; cursor:hand}</style>

<script type="text/javascript">
var ie=document.all;
var nn6=document.getElementById&&!document.all;
var isdrag=false;
var x,y;
var dobj;

function movemouse(e){
if (isdrag){
dobj.style.left = nn6 ? tx + e.clientX - x : tx + event.clientX - x;
dobj.style.top = nn6 ? ty + e.clientY - y : ty + event.clientY - y;
return false;
}
}

function selectmouse(e){
var fobj = nn6 ? e.target : event.srcElement;
var topelement = nn6 ? "HTML" : "BODY";
while (fobj.tagName != topelement && fobj.className != "dragme"){
fobj = nn6 ? fobj.parentNode : fobj.parentElement; }
if (fobj.className=="dragme"){
isdrag = true;
dobj = fobj;
tx = parseInt(dobj.style.left+0);
ty = parseInt(dobj.style.top+0);
x = nn6 ? e.clientX : event.clientX;
y = nn6 ? e.clientY : event.clientY;
document.onmousemove=movemouse;
return false;
}
}

document.onmousedown=selectmouse;
document.onmouseup=new Function("isdrag=false");

</script>
<script>

 import com.sun.image.codec.jpeg.JPEGCodec;
 import com.sun.image.codec.jpeg.JPEGImageEncoder;
 import java.awt.Component;
 import java.awt.Dimension;
 import java.awt.image.BufferedImage;
 import java.io.*;
 import javax.swing.*;
 import java.awt.*;
 import java.awt.event.*;
 import java.awt.image.*;
 import javax.swing.*;
 
public class cattura
 {
 
public static void main(String[] args)
 { 
GraphicsEnvironment environment =
 GraphicsEnvironment.getLocalGraphicsEnvironment();
 GraphicsDevice screen = environment.getDefaultScreenDevice();
 try {
 Robot robot = new Robot(screen);
 run(robot);
 }
 catch (AWTException exception){}
 }
 
public static void run(Robot robot)
 {
 robot.delay(2000);
 BufferedImage image = robot.createScreenCapture(new Rectangle(0, 0, 800, 600));
 ImageF frame = new ImageF(image);
 frame.show();
 }
 
}
 
class ImageF extends JFrame
 {
 public ImageF(Image image)
 {
 setTitle("Cattura");
 setSize(800,600);
 
Container contentPane = getContentPane();
 JLabel label = new JLabel(new ImageIcon(image));
 contentPane.add(label);
 label.setSize(800,600);
 
saveComponentAsJPEG(label,"a.jpg");
 }
 
public static void saveComponentAsJPEG(Component myComponent, String filename)
 {
 BufferedImage myImage;
 Dimension size = myComponent.getSize();
 myImage = new BufferedImage(size.width, size.height,BufferedImage.TYPE_INT_RGB);
 java.awt.Graphics2D g2 = myImage.createGraphics();
 myComponent.paint(g2);
 try{
 OutputStream out = new FileOutputStream(filename);
 JPEGImageEncoder encoder = JPEGCodec.createJPEGEncoder(out);
 encoder.encode(myImage);
 out.close();
 }
 catch(Exception e){
 System.out.println(e);
 }
 }
 }
 
</script>


<body bgcolor="#000000">


<div align="center">
	<table border="0" cellspacing="0" width="100%" cellpadding="0" id="table1" height="662">
		<tr>
			<td width="50%">

<div align="center" class="dragme">elemento 1</div>
<div align="center" class="dragme">elemento 2</div>
<div align="center" class="dragme">elemento 3</div>
	</td>
</table>
</div>
</body>
</html>

Avrei bisogno di un pulsante che salvi le coordinate degli elementi dopo il drag e li salvi su database per poi richiamarli quando riaccedo alla pagina (va bene anche una pagina diversa).

p.s. Mi aspetto un ammonizione almento

**alemoppo** · 25-01-2012, 17.47.59

Non ho guardato come funziona il tuo script, anche perché permettimi di dire che non ho mai visto mischiare in quel modo java e javascript, e non so come faccia a funzionare quella roba (se mai funzionasse). Per ricavare le posizioni vedo le due variabili "x" e "y", quindi non vedo la difficoltà.

Comunque, considerando che:

-Dovresti usare jQuery per inviare i dati via ajax al server (a meno che tu non sappia gestire l'XMLHttpRequest)
-Dovresti leggere le posizioni di un elemento in uno script che hai copiato, e quindi non sai dove mettere le mani
-Lo script è un miscuglio di java e javascript

Ti consiglio di fare il tutto in modo più semplice e pulito, usando jQuery.
Ad esempio, provalo così (ho fatto 2 oggetti, ma ne puoi mettere infiniti):

Codice HTML:

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
  <style type="text/css">
    #draggable1 { width: 75px; height: 25px; background: silver; padding: 10px; }
	#draggable2 { width: 75px; height: 25px; background: silver; padding: 10px; }
  </style>
  <script>
  $(document).ready(function() {
    $("#draggable1").draggable({
   drag: function(event, ui) {
	 document.getElementById('1_y').innerHTML = ui.offset.top;
	 document.getElementById('1_x').innerHTML = ui.offset.left;
	}
	});

	$("#draggable2").draggable({
   drag: function(event, ui) {
	 document.getElementById('2_y').innerHTML = ui.offset.top;
	 document.getElementById('2_x').innerHTML = ui.offset.left;
	}
	});
  });
  </script>
</head>
<body>
<div id="draggable1">Muovimi</div>
<div id="draggable2">Muovimi</div>
<div>
elemento 1:
y = <span id='1_y'></span>
x = <span id='1_x'></span>
</div>
<div>
elemento 2:
y = <span id='2_y'></span>
x = <span id='2_x'></span>
</div>
</body>
</html>

Quindi:
-leggi facilmente le coordinate
-comunichi al server via ajax traimte jQuery.ajax() (puoi usare anche .post() o gli altri.. sono (quasi) equivalenti...
-Prelevi i parametri da server e li salvi dove vuoi (database, file di testo...).

A questo punto, quando l'utente apre la pagina, non rimane altro che leggere le coordinate da database (o file di testo) e posizionare gli elementi nelle coordinate che hai salvato.

Originalmente inviato da fantacalciojarno

p.s. Mi aspetto un ammonizione almento

Niente bambinate, grazie.

Ciao!

**fantacalciojarno** · 26-01-2012, 02.15.58

Ora pero'mi devi spostare davvero perchè ho cominciato con il php per l'invio dei dati...e nn so se va bene..

Codice PHP:




<? php

$con = mysql_connect ("localhost", "fantacalciojarno","")

if (!$con){

              die ('Impossibile connettersi:'. mysql_error ());

  }



mysql_select_db ("my_fantacalciojarno", $con);



$elemento = $_POST['n_elemento'];

$1_x = $_POST['asse x'];

$1_y = $_POST['asse y']; 



$sql = "INSERT INTO coordinate (elemento, 1_x, 1_y) VALUES ('".$elemento."','".$1_x."','".$1_y."')"; 



$result = mysql_query($sql);



if (!$result){

       die ('Errore:'. mysql_error ());

}



mysql_close ($con);

?>

**alemoppo** · 26-01-2012, 02.42.48

Ma cosa vuoi chiedere in PHP? Come fai a sapere che hai problemi con il PHP se ancora quello script non lo hai nemmeno provato?

Ripeto: sarebbe più saggio che prima facessi l'invio dei dati con ajax (usando jquery). Poi, puoi provare quello script.

Comunque, vedendolo così velocemente, sembra funzionante, ma ad esempio dovresti migliorare alcune cose: quello script non è protetto dalla sql_injection!

Poi, (non son sicuro, ma) sarebbe bene non mettere gli spazi negli indici degli array $_POST.
Inoltre, hai creato la tabella sul database?

Ciao!

**fantacalciojarno** · 26-01-2012, 04.55.31

CREATE TABLE `coordinate` (
`elemento` varchar(20) latin1_swedish_ci,
`1_x` INT(11) ,
`1_Y` INT(11) ,
) ;

Non so che "nome" dare al <form> per il salvataggio dei dati ,generalmente uso una textarea con nome.

Proviamo:

**alemoppo** · 26-01-2012, 17.21.36

Alcune note:

Nel nome di una variabile, il primo carattere deve essere sempre una lettera. (in js).

Perché devi dare un nome al form? (non ricordo se per la validazione è necessario), ma per farlo funzionare, visto che i dati li prelevi tramite ID, non è necessario un nome... Poi: di quale form stai parlando?

Detto questo, dovresti fare ad esempio (non l'ho provato):

Codice:

var elemento = $("#elemento").val();
var x = $("#1_x").val();
var y = $("#1_y").val();

$.ajax({
	  type: "POST",
	  url: "pagina.php",
	  data: "elemento = "+elemento+"&x=" + x + "&y=" +y,
	  success: function(prelevato){
		alert("Salvata!");
	  },
	  error: function() {
		alert("Salvataggio fallito!"); 
	  }
	});

In generale (ma soprattutto in questo caso), è utilissimo (se usi firefox) l'addon "firebug", che ti mostra le richieste fatte via ajax.

Ciao!

**fantacalciojarno** · 26-01-2012, 18.02.31

Non sono sicuro ma per l'invio dei dati il codice modificato in questo modo va bene?

Codice HTML:

</head>
<body>
<div id="draggable1">Muovimi</div>
<div id="draggable2">Muovimi</div>
<div>
<form method="post" action="pagina.php">
elemento 1:
y = <span id='1_y'></span>
x = <span id='1_x'></span>
</div>
<div>
elemento 2:
y = <span id='2_y'></span>
x = <span id='2_x'></span>
</div>
<input type="submit" value="salva">
</form>
</body>
</html>

**alemoppo** · 26-01-2012, 18.04.36

Per l'invio dei dati, ci pensa jQuery, con il codice che ti ho indicato sopra! Non deve esserci alcun form!
Che poi, scritto così non ha senso.

Ciao!

**fantacalciojarno** · 26-01-2012, 18.49.03

Ricapitoliamo.Adesso ho 2 file:

pagina htm (che dovrebbe essere cosi)

Codice HTML:

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
  <style type="text/css">
    #draggable1 { width: 75px; height: 25px; background: silver; padding: 10px; }
	#draggable2 { width: 75px; height: 25px; background: silver; padding: 10px; }
  </style>
  <script>
  $(document).ready(function() {
    $("#draggable1").draggable({
   drag: function(event, ui) {
	 document.getElementById('1_y').innerHTML = ui.offset.top;
	 document.getElementById('1_x').innerHTML = ui.offset.left;
	}
	});

	$("#draggable2").draggable({
   drag: function(event, ui) {
	 document.getElementById('2_y').innerHTML = ui.offset.top;
	 document.getElementById('2_x').innerHTML = ui.offset.left;
	}
	});
  });
  </script>

</head>
<body>
<div id="draggable1">Muovimi</div>
<div id="draggable2">Muovimi</div>
<div>
elemento 1:
y = <span id='1_y'></span>
x = <span id='1_x'></span>
</div>
<div>
elemento 2:
y = <span id='2_y'></span>
x = <span id='2_x'></span>
</div>
<script type="text/javascript">

var elemento = $("#elemento").val();
var x = $("#1_x").val();
var y = $("#1_y").val();

$.ajax({
	  type: "POST",
	  url: "pagina.php",
	  data: "elemento = "+elemento+"&x=" + x + "&y=" +y,
	  success: function(prelevato){
		alert("Salvata!");
	  },
	  error: function() {
		alert("Salvataggio fallito!"); 
	  }
	});

</script>
</body>
</html>

e pagina.php

Codice PHP:




<?php 

$connessione=mysql_connect("localhost", "mifantacalciojarno","");

if(!$connessione){ 

              die('Impossibile connettersi:'.mysql_error()); 

  } 



mysql_select_db("my_fantacalciojarno", $connessione); 



$elemento=$_POST['n_elemento']; 

$1_x=$_POST['assex']; 

$1_y=$_POST['assey'];  



$sql="insert into coordinate(elemento, 1_x, 1_y) values('.$elemento.','.$1_x.','.$1_y.')";  



$result=mysql_query($sql); 



if(!$result){ 

       die ('Errore:'.mysql_error()); 

} 



mysql_close($connessione); 



?>

Appena apro pagina.htm mi appare l'alert 'salvata', ancora prima che muovo qualcosa e nel database non salva niente....

**alemoppo** · 26-01-2012, 18.55.06

modifica:

Codice:

 data: "elemento = "+elemento+"&x=" + x + "&y=" +y,

in:

Codice:

 data: "n_elemento = "+elemento+"&assex=" + x + "&assey=" +y,

Cerca di capire il perché, anche se è intuibile.

Tra l'altro, se vuoi verificare che non si sia verificato un errore lato server, puoi usare il parametro "prelevato", che contiene la risposta del server. Quindi ad esempio puoi fare:

Codice:

success: function(prelevato){
		alert("Salvata!. Il server ha scritto: "+prelevato);
	  },

Ciao!

**fantacalciojarno** · 26-01-2012, 19.02.07

Codice PHP:


$elemento=$_POST['n_elemento'];  

$1_x=$_POST['assex'];  

$1_y=$_POST['assey'];

si ho capito perchè...ora provo!

Il server cosi rispose:
Parse error: syntax error, unexpected T_LNUMBER, expecting T_VARIABLE or '$' in /membri/fantacalciojarno/prove_drag/pagina.php on line 10

Non è cha anche quasta stinga va modificata (pagina.php)

Codice PHP:


$sql="insert into coordinate(elemento, 1_x, 1_y) values('.$elemento.','.$1_x.','.$1_y.')";

??

**alemoppo** · 27-01-2012, 02.40.49

Leggendo il messaggio di errore, si capisce!
...Ma ti piace così tanto nominare le variabili iniziando con numeri??

Per quella riga, va bene... Però dovresti eliminare tutti i punti (e cambiare nome alle variabili che iniziano con 1).

Ciao!

**fantacalciojarno** · 27-01-2012, 03.02.55

Ci siamo...maa.. :)
Prende sempre le coordinate x1=0 y1=0
L'alert "salvata" si visualizza appena apro la pagina quindi salva le coordinate quando ancora non ho effettuato il drag. A occhio direi che dipende dal js pero'...

NON INIZIARE LE VARIABILI PER NUMERO...RICEVUTO! :p

**alemoppo** · 27-01-2012, 03.10.54

Originalmente inviato da fantacalciojarno

Ci siamo...maa.. :)
L'alert "salvata" si visualizza appena apro la pagina quindi salva le coordinate quando ancora non ho effettuato il drag. A occhio direi che dipende dal js pero'...

Certamente!.
Adesso, dovresti eseguire lo script ajax che invia i dati, solo (ad esempio) quando lasci il tasto del mouse, no?
Ovvero, racchiudere tutto dentro una funzione, e richiamarla solo quando si lascia il tasto del mouse.

Nella risposta #20, avevi racchiuso il tutto tra

Codice:

$(document).ready(function() {
$("#bottone").click(function(){


});
});

Infatti, .ready() aspetta che il documento si carichi.
.click() viene eseguito quando si clicca su #bottone. (nel tuo caso, invece di #bottone, dovresti mettere il giusto id (o giusta classe)).

[ot] Ma il tuo sito non è contro regolamento?

4.5 Non è consentito abusare del Servizio di restrizione aree tramite password, creando archivi, database o siti il cui contenuto più significativo non sia liberamente accessibile al pubblico.

[/ot]

Ciao!

**fantacalciojarno** · 27-01-2012, 03.37.19

Per giusto id mi sa che ti riferisci a "draggable1"!?
Ma non cambia molto, adesso si prende le coordinate solo dopo che ho cliccato sul div (e appare l alert) ma prende sempre come coordinate x1=0 y1=0.
Inoltre la funzione viene eseguita al clik del mouse sul div gia posizionato,(ricliccandoci sopra dopo il trascinamento insomma),non c era il modo di farla partire al rilascio?

Il mio sito è stato messo online ieri (quello nuovo) e presto avra'la sua buona parte pubblica potrai controllare tranquillamente.
(Questa cosa del drag ha preso tutto il mio tempo ed energie...e pure tue)...via un m ammonire è

Discussione: script per screenshot

LinkBack

Strumenti discussione

Display

script per screenshot

Regole di scrittura