Sujet Précédent Sujet Suivant

Capture snapshot cam ip

vol68 Messages postés 33 Date d'inscription samedi 28 février 2004 Statut Membre Dernière intervention 8 mai 2016 - 6 févr. 2015 à 20:16
@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 - 8 févr. 2015 à 15:47
Bonjour,
Je souhaiterais savoir si il est possible de capturer une Div dans laquelle on affiche un snapshot provenant d'une caméra IP, je parviens à afficher un stream et un snapshot mais je ne trouve pas de solution pour récupérer l'image et la stocker en tant que jpeg ou png. Merci d'avance pour vos réponses

5 réponses

Réponse 1 / 5
@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 153
7 févr. 2015 à 11:21
bonjour

il manque des donnes du code pour pouvoir t'aider
0
Réponse 2 / 5
vol68 Messages postés 33 Date d'inscription samedi 28 février 2004 Statut Membre Dernière intervention 8 mai 2016
7 févr. 2015 à 12:10
effectivement je n'avais volontairement pas mis de code, je souhaitais avoir une réponse générale, mais vois le code que j'utilise, je parviens à afficher le stream dans une div, ainsi que les snapshots, je parviens ensuite à faire un screenshot du body, mais je ne parviens pas à obtenir un screenshot d'une des div de snapshot, le but étant ensuite de manipuler les images obtenues (sauvegarde, comparaison, etc...). merci de t'intéresser au sujet.

vol68 


<?php
	//creation d'une session a positionner avant out autre chose********************
	session_start();
	//interdiction affichage source*************************
	echo" ";		

	/*echo "<script type='text/javascript' src='./Resemble.js-master'></script>";*/
		
?>


<!--DOCTYPE HTML -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 5 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"-->
<html lang="fr">
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
	<!--link rel="stylesheet" type="text/css" href="photoShoot1/imageoriginestyles.css" /-->
	<!--link rel="stylesheet" type="text/css" href="photoShoot1/jquery.imageorigine.css" /-->
	
	<!--link rel="stylesheet" type="text/css" href="photoShoot2/imageteststyles.css" /-->
	<!--link rel="stylesheet" type="text/css" href="photoShoot2/jquery.imagetest.css" /-->
	
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
	<!--script type="application/javascript" src="compare.js"></script-->
	<script type="text/javascript" src="./canvas/html2canvas.js"></script>
	<!--script type='application/javascript' src='./Resemble.js-master/resemble.js'></script-->
	<!--script type='application/javascript' src='./Resemble.js-master/demoassetes/main.js'></script-->
	<!--script type="text/javascript" src="photoShoot1/jquery.imageorigine.js"></script-->
	<!--script type="text/javascript" src="photoShoot1/scriptimageorigine.js"></script-->
	
	<!--script type="text/javascript" src="photoShoot2/jquery.imagetest.js"></script-->
	<!--script type="text/javascript" src="photoShoot2/scriptimagetest.js"></script-->
	  <script src="http://code.createjs.com/easeljs-0.5.0.min.js"></script> 
	  <script src="http://code.jquery.com/jquery-1.8.2.js"></script>
	 
	  <script src="libs/export_canvas/base64.js" type="text/javascript"></script>
	  <script src="libs/export_canvas/canvas2image.js" type="text/javascript"></script>




</head>

<SCRIPT language="Javascript">
	function date_heure(id){
		var date = new Date;
		var annee = date.getFullYear();
		var moi = date.getMonth();
		var mois = new Array('Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre');
		var j = date.getDate();
		var jour = date.getDay();
		var jours = new Array('Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi');
		var h = date.getHours();
		if(h<10){
			h = "0"+h;
		}
		var m = date.getMinutes();
		if(m<10){
			m = "0"+m;
		}
		var s = date.getSeconds();
		if(s<10){
			s = "0"+s;
		}
		var resultat = jours[jour]+' '+j+' '+mois[moi]+' '+annee+' '+h+':'+m+':'+s;
 		//var resultat = jours[jour]+' '+j+' '+mois[moi]+' '+annee;
		var debutdivlayerinfos = "<div id='layerinfos' style='position:absolute; top:865px; left:10px; width:1010px; height:20px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:2; text-align: center; '>";
		var findivlayerinfos = "</div><!-- fin div layerinfos-->";
		document.write(debutdivlayerinfos+resultat+findivlayerinfos);
		setTimeout('date_heure(id);','1000');
		//return true;
 
		AffichageCameraIp();
		//var memorisationheuresnapshotorigine = resultat;
		GenerationImageOrigine();
	}
</SCRIPT>
<SCRIPT language="JavaScript">
function AffichageCameraIp(){	
	if ((navigator.appName == "Microsoft Internet Explorer")&&(navigator.platform != "MacPPC")){
		document.write("IE</br>");
		document.write("<OBJECT ID=\"VAtCtrl\" WIDTH=362 HEIGHT=310 name=\"VAtCtrl\"");
		document.write(" CLASSID=CLSID:210D0CBC-8B17-48D1-B294-1A338DD2EB3A");
		document.write(" CODEBASE=\"http://192.168.1.30:xxxx/VatDec.cab#version=1,0,0,48\">"); 
		document.write("<PARAM NAME=\"Url\" VALUE=\"http://192.168.1.30:8082/cgi-bin/control.cgi\">");
		document.write("<PARAM NAME=\"VSize\" VALUE=\"SIF\">");
		document.write("<PARAM NAME=\"Language\" VALUE=\"en\">"); 
		document.write("<PARAM NAME=\"Deblocking\" VALUE=\"true\">");
		document.write("<PARAM NAME=\"DisplayTimeFormat\" VALUE=\"1\">");
		document.write("<PARAM NAME=\"DigitalZoomEnableChk\" VALUE=\"true\">");
		document.write("<PARAM NAME=\"DigitalZoomEdit\" VALUE=\"true\">");
		document.write("</OBJECT>"); 
	} else {
		//document.write("<img src=\'http://192.168.1.30:8082/videostream.cgi?user=admin&pwd=ipwificam2' \width=500 height=395 top=100 left=100>");
		// CAMERA AVANT 192.168.1.30:xxxx
			/*
			var adresseipwificam2 = "192.168.1.30";
			var portipwificam2 = "xxxx";
			var debutdivlayeripwificam2 = "<div id='layercam2' style='position:absolute; top:20px; left:10px; width:500px; height:415px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:0; text-align: center; '>";
			var infosipwificam2 = "<B>CAMERA AVANT : "+adresseipwificam2+":"+portipwificam2+"</B></br>";
			var videostreamipwificam2 = "<img src=\'http://"+adresseipwificam2+":"+portipwificam2+"/videostream.cgi?user=admin&pwd=ipwificam2' \width=500 height=395 top=100 left=100></div>";
			var findivlayeripwificam2 = "</div><!-- fin div layercam2-->";
			document.write(debutdivlayeripwificam2+infosipwificam2+videostreamipwificam2+findivlayeripwificam2);
			*/
		// CAMERA ARRIERE 192.168.1.31:xxxx
			/*
			var adresseipwificam3 = "192.168.1.31";
			var portipwificam3 = "xxxx";
			var debutdivlayeripwificam3 = "<div id='layercam3' style='position:absolute; top:20px; left:520px; width:500px; height:415px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:0; text-align: center; '>";
			var infosipwificam3 = "<B>CAMERA ARRIERE : "+adresseipwificam3+":"+portipwificam3+"</B></br>";
			var videostreamipwificam3 = "<img src=\'http://"+adresseipwificam3+":"+portipwificam3+"/videostream.cgi?user=admin&pwd=ipwificam3' \width=500 height=395 top=100 left=100></div>";
			var findivlayeripwificam3 = "</div><!-- fin div layercam3-->";
			document.write(debutdivlayeripwificam3+infosipwificam3+videostreamipwificam3+findivlayeripwificam3);
			*/		
		// CAMERA INTERIEUR 192.168.1.40:xxxx
			var adresseipwificam1 = "192.168.1.40";
			var portipwificam1 = "xxxx"; //top:445px; left:10px;
			var debutdivlayeripwificam1 = "<div id='layercam1' style='position:absolute; top:20px; left:10px; width:500px; height:416px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: black; z-index:1; text-align: center; '>";
			var infosipwificam1 = "<B>CAMERA INTERIEUR : "+adresseipwificam1+":"+portipwificam1+"</B></br>";
			var videostreamipwificam1 = "<img src=\'http://"+adresseipwificam1+":"+portipwificam1+"/videostream.cgi?user=admin&pwd=ipwificam1' \width=500 height=400 top=100 left=100>";
			var findivlayeripwificam1 = "</div><!-- fin div layercam1-->";
			document.write(debutdivlayeripwificam1+infosipwificam1+videostreamipwificam1+findivlayeripwificam1);

		// CAMERA X 192.168.1.40:xxxx
			/*
			var adresseipwificam4 = "NON ACTIF";
			var portipwificam4 = "xxxx";
			if (adresseipwificam4 == "NON ACTIF"){
				var ipwificam4inactive = "X";
				var debutdivlayeripwificam4 = "<div id='layercam4' style='position:absolute; top:445px; left:520px; width:500px; height:415px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:0; text-align: center; '>";
				var infosipwificam4 = "<B>CAMERA X : "+adresseipwificam4+":"+portipwificam4+"</B></br>";
				var videostreamipwificam4 = "<img src=\'http://"+adresseipwificam4+":"+portipwificam4+"/videostream.cgi?user=admin&pwd=ipwificam4' \width=500 height=395 top=100 left=100></div>";
				//var valeurimage = document.getElementById(layercam2);
				//var videostreamipwificam4 = valeurimage.value;
				var findivlayeripwificam4 = "</div><!-- fin div layercam4-->";				
				document.write(debutdivlayeripwificam4+infosipwificam4+ipwificam4inactive+findivlayeripwificam4);
			} else {
				var debutdivlayeripwificam4 = "<div id='layercam4' style='position:absolute; top:445px; left:520px; width:500px; height:415px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:2; text-align: center; '>";
				var infosipwificam4 = "<B>CAMERA X : "+adresseipwificam4+":"+portipwificam4+"</B></br>";
				var videostreamipwificam4 = "<img src=\'http://"+adresseipwificam4+":"+portipwificam4+"/videostream.cgi?user=admin&pwd=ipwificam4' \width=500 height=395 top=100 left=100></div>";
				var findivlayeripwificam4 = "</div><!-- fin div layercam4-->";
				document.write(debutdivlayeripwificam4+infosipwificam4+videostreamipwificam4+findivlayeripwificam4);
			}
			*/
	}
	//date_heure(1);
}
</SCRIPT>

<SCRIPT language="Javascript">
	function GenerationImageOrigine(){
		//alert('Generation Image Origine');
		// CAMERA AVANT 192.168.1.30:xxxx
			/*
			var adresseipwificam2 = "192.168.1.30";
			var portipwificam2 = "xxxx";
			var datecam2 = new Date;
			var hcam2 = datecam2.getHours();
			if(hcam2<10){
				hcam2 = "0"+hcam2;
			}
			var mcam2 = datecam2.getMinutes();
			if(mcam2<10){
				mcam2 = "0"+mcam2;
			}
			var scam2 = datecam2.getSeconds();
			if(scam2<10){
				scam2 = "0"+scam2;
			}
			var infostimecam2 = hcam2+':'+mcam2+':'+scam2;			
			var debutdivlayeripwificam2 = "<div id='layercam2origine' style='position:absolute; top:260px; left:20px; width:200px; height:169px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:1; text-align: center; '>";
			var infosipwificam2 = "<small>Témoin : "+adresseipwificam2+":"+portipwificam2+"-"+infostimecam2+"</small></br>";
			var snapshotorigineipwificam2 = "<img src=\'http://"+adresseipwificam2+":"+portipwificam2+"/snapshot.cgi?user=admin&pwd=ipwificam2' \width=200 height=150";
			var findivlayeripwificam2 = "</div><!-- fin div layercam2origine-->";
			document.write(debutdivlayeripwificam2+infosipwificam2+snapshotorigineipwificam2+findivlayeripwificam2);
			*/
		// CAMERA ARRIERE 192.168.1.31:xxxx
			/*
			var adresseipwificam3 = "192.168.1.31";
			var portipwificam3 = "xxxx";
			var datecam3 = new Date;
			var hcam3 = datecam3.getHours();
			if(hcam3<10){
				hcam3 = "0"+hcam3;
			}
			var mcam3 = datecam3.getMinutes();
			if(mcam3<10){
				mcam3 = "0"+mcam3;
			}
			var scam3 = datecam3.getSeconds();
			if(scam3<10){
				scam3 = "0"+scam3;
			}
			var infostimecam3 = hcam3+':'+mcam3+':'+scam3;
			var debutdivlayeripwificam3 = "<div id='layercam3origine' style='position:absolute; top:-2px; left:510px; width:200px; height:169px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:3; text-align: center; '>";
			var infosipwificam3 = "<small>Témoin : "+adresseipwificam3+":"+portipwificam3+"-"+infostimecam3+"</small></br>";
			var snapshotorigineipwificam3 = "<img src=\'http://"+adresseipwificam3+":"+portipwificam3+"/snapshot.cgi?user=admin&pwd=ipwificam3' \width=200 height=150";
			var findivlayeripwificam3 = "</div><!-- fin div layercam2origine-->";
			document.write(debutdivlayeripwificam3+infosipwificam3+snapshotorigineipwificam3+findivlayeripwificam3);
			*/
		// CAMERA INTERIEUR 192.168.1.40:xxxx
			var adresseipwificam1 = "192.168.1.40";
			var portipwificam1 = "xxxx";
			var datecam1 = new Date;
			var hcam1 = datecam1.getHours();
			if(hcam1<10){
				hcam1 = "0"+hcam1;
			}
			var mcam1 = datecam1.getMinutes();
			if(mcam1<10){
				mcam1 = "0"+mcam1;
			}
			var scam1 = datecam1.getSeconds();
			if(scam1<10){
				scam1 = "0"+scam1;
			}
			var infostimecam1 = hcam1+':'+mcam1+':'+scam1;//top:420px; left:-510px; width:200px; height:169px;
			var debutdivlayeripwificam1 = "<div id='layercam1origine' style='position:absolute; top:445px; left:10px; width:240px; height:198px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:3; text-align: center; '>";
			var infosipwificam1 = "<Font color='red'><small>Témoin : "+adresseipwificam1+":"+portipwificam1+"-"+infostimecam1+"</small></Font></br>";
			var snapshotorigineipwificam1 = "";//"<img src=\'http://"+adresseipwificam1+":"+portipwificam1+"/snapshot.cgi?user=admin&pwd=ipwificam1' \width=500 height=395";
			var findivlayeripwificam1 = "</div><!-- fin div layercam1origine-->";
			document.write(debutdivlayeripwificam1+infosipwificam1+findivlayeripwificam1);

			var imagetemoin = "<img src=\'http://192.168.1.40:8081/snapshot.cgi?user=admin&pwd=ipwificam1' \width=\"240\" height=\"198\"/>"; 
			//je génère ma balise html à l'aide des paramètres qu'on lui aura passé 

			document.getElementById('layercam1origine').innerHTML = imagetemoin; 
			//je modifie le contenu html de l'élement nommé "principal et je lui affecte le nouveau contenu que j'ai précédemment mis dans la variable val 
							
		// CAMERA x 192.168.1.40:xxxx
			/*var adresseipwificam4 = "192.168.1.41";
			var portipwificam4 = "xxxx";
			var datecam4 = new Date;
			var hcam4 = datecam4.getHours();
			if(hcam4<10){
				hcam4 = "0"+hcam4;
			}
			var mcam4 = datecam4.getMinutes();
			if(mcam4<10){
				mcam4 = "0"+mcam4;
			}
			var scam4 = datecam4.getSeconds();
			if(scam4<10){
				scam4 = "0"+scam4;
			}
			var infostimecam4 = hcam4+':'+mcam4+':'+scam4;
			var debutdivlayeripwificam4 = "<div id='layercam4origine' style='position:absolute; top:0px; left:510px; width:200px; height:169px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:3; text-align: center; '>";
			var infosipwificam4 = "<small>Témoin : "+adresseipwificam4+":"+portipwificam4+"-"+infostimecam4+"</small></br>";
			//var snapshotorigineipwificam4 = "<img src=\'http://"+adresseipwificam4+":"+portipwificam4+"/snapshot.cgi?user=admin&pwd=ipwificam4' \width=200 height=150";
			var snapshotorigineipwificam4 = "toto";
			var findivlayeripwificam4 = "</div><!-- fin div layercam4origine-->";
			document.write(debutdivlayeripwificam4+infosipwificam4+snapshotorigineipwificam4+findivlayeripwificam4);*/
		
		GenerationImageTest();
	}
</SCRIPT>
<SCRIPT language="Javascript">
	function GenerationImageTest(){
		//alert('Generation Image Origine');
		// CAMERA AVANT 192.168.1.30:xxxx
			/*
			var adresseipwificam2 = "192.168.1.30";
			var portipwificam2 = "xxxx";
			var datecam2b = new Date;
			var hcam2b = datecam2b.getHours();
			if(hcam2b<10){
				hcam2b = "0"+hcam2b;
			}
			var mcam2b = datecam2b.getMinutes();
			if(mcam2b<10){
				mcam2b = "0"+mcam2b;
			}
			var scam2b = datecam2b.getSeconds();
			if(scam2b<10){
				scam2b = "0"+scam2b;
			}
			var infostimecam2b = hcam2b+':'+mcam2b+':'+scam2b;
			var debutdivlayeripwificam2 = "<div id='layercam2test' style='position:absolute; top:-423px; left:270px; width:200px; height:169px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:3; text-align: center; '>";
			var infosipwificam2 = "<small>Test : "+adresseipwificam2+":"+portipwificam2+"-"+infostimecam2b+"</small></br>";
			var snapshottestipwificam2 = "<img src=\'http://"+adresseipwificam2+":"+portipwificam2+"/snapshot.cgi?user=admin&pwd=ipwificam2' \width=200 height=150";
			var findivlayeripwificam2 = "</div><!-- fin div layercam2test-->";
			document.write(debutdivlayeripwificam2+infosipwificam2+snapshottestipwificam2+findivlayeripwificam2);
			*/
		// CAMERA AVANT 192.168.1.31:xxxx
			/*
			var adresseipwificam3 = "192.168.1.31";
			var portipwificam3 = "xxxx";
			var debutdivlayeripwificam3 = "<div id='layercam3test' style='position:absolute; top:-3px; left:510px; width:200px; height:169px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:3; text-align: center; '>";
			var infosipwificam3 = "<small>Test : "+adresseipwificam3+":"+portipwificam3+"</small></br>";
			var snapshottestipwificam3 = "<img src=\'http://"+adresseipwificam3+":"+portipwificam3+"/snapshot.cgi?user=admin&pwd=ipwificam3' \width=200 height=150";
			var findivlayeripwificam3 = "</div><!-- fin div layercam2test-->";
			document.write(debutdivlayeripwificam3+infosipwificam3+snapshottestipwificam3+findivlayeripwificam3);
			*/
		// CAMERA INTERIEUR 192.168.1.40:xxxx
			var adresseipwificam1 = "192.168.1.40";
			var portipwificam1 = "xxxx";
			var datecam1 = new Date;
			var hcam1 = datecam1.getHours();
			if(hcam1<10){
				hcam1 = "0"+hcam1;
			}
			var mcam1 = datecam1.getMinutes();
			if(mcam1<10){
				mcam1 = "0"+mcam1;
			}
			var scam1 = datecam1.getSeconds();
			if(scam1<10){
				scam1 = "0"+scam1;
			}
			var infostimecam1 = hcam1+':'+mcam1+':'+scam1;//top:420px; left:-515px; width:200px; height:169px;
			var debutdivlayeripwificam1 = "<div id='layercam1test' style='position:absolute; top:445px; left:270px; width:240px; height:198px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:3; text-align: center; '>";
			var infosipwificam1 = "<Font color='red'><small>Test : "+adresseipwificam1+":"+portipwificam1+"-"+infostimecam1+"</small></Font></br>";
			var snapshottestipwificam1 = "";//"<img src=\'http://"+adresseipwificam1+":"+portipwificam1+"/snapshot.cgi?user=admin&pwd=ipwificam1' \width=500 height=395";
			var findivlayeripwificam1 = "</div><!-- fin div layercam1test-->";
			document.write(debutdivlayeripwificam1+infosipwificam1+findivlayeripwificam1);

			var imagetest = "<img src=\'http://192.168.1.30:xxxx/snapshot.cgi?user=admin&pwd=ipwificam2' \width=\"240\" height=\"198\"/>"; 
			//je génère ma balise html à l'aide des paramètres qu'on lui aura passé 

			document.getElementById('layercam1test').innerHTML = imagetest; 


		// CAMERA INTERIEUR 192.168.1.40:xxxx
			/*var adresseipwificam4 = "192.168.1.41";
			var portipwificam4 = "xxxx";
			var debutdivlayeripwificam4 = "<div id='layercam4test' style='position:absolute; top:0px; left:510px; width:200px; height:169px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:3; text-align: center; '>";
			/*var infosipwificam4 = "<small>Test : "+adresseipwificam4+":"+portipwificam4+"</small></br>";
			var snapshottestipwificam4 = "<img src=\'http://"+adresseipwificam4+":"+portipwificam4+"/snapshot.cgi?user=admin&pwd=ipwificam4' \width=200 height=150";
			var findivlayeripwificam4 = "</div><!-- fin div layercam4test-->";
			document.write(debutdivlayeripwificam4+infosipwificam4+snapshottestipwificam4+findivlayeripwificam4);*/
		
	}
</SCRIPT>
<SCRIPT language="Javascript">
	//*********************************************************************************************************
//alert ('control');
(function (exports) {
    function urlsToAbsolute(nodeList) {
        if (!nodeList.length) {
            return [];
        }
        var attrName = 'href';
        if (nodeList[0].__proto__ === HTMLImageElement.prototype 
        || nodeList[0].__proto__ === HTMLScriptElement.prototype) {
            attrName = 'src';
        }
        nodeList = [].map.call(nodeList, function (el, i) {
            var attr = el.getAttribute(attrName);
            if (!attr) {
                return;
            }
            var absURL = /^(https?|data):/i.test(attr);
            if (absURL) {
                return el;
            } else {
                return el;
            }
        });
        return nodeList;
    }
	//'http://192.168.1.40:xxxx/snapshot.cgi?user=admin&pwd=ipwificam1'
    function screenshotPage() {
        urlsToAbsolute(document.images);
        //urlsToAbsolute(document.querySelectorAll('#layercam1origine'));
        urlsToAbsolute(document.querySelectorAll("link[rel='stylesheet']"));
		var screenshot = document.documentElement.cloneNode(true);
        var b = document.createElement('base');
       	// b.href = document.location.protocol + '#layercam1origine' + location.host;
       	b.href = document.location.protocol + '//' + location.host;
		var head = screenshot.querySelector('head');
        head.insertBefore(b, head.firstChild);
        screenshot.style.pointerEvents = 'none';
        screenshot.style.overflow = 'hidden';
        screenshot.style.webkitUserSelect = 'none';
        screenshot.style.mozUserSelect = 'none';
        screenshot.style.msUserSelect = 'none';
        screenshot.style.oUserSelect = 'none';
        screenshot.style.userSelect = 'none';
        screenshot.dataset.scrollX = window.scrollX;
        screenshot.dataset.scrollY = window.scrollY;
        var script = document.createElement('script');
        script.textContent = '(' + addOnPageLoad_.toString() + ')();';
       	//screenshot.querySelector('#layercam1origine').appendChild(script);
	    screenshot.querySelector('body').appendChild(script);
        var blob = new Blob([screenshot.outerHTML], {
            type: 'text/html'
        });
        return blob;
    }

    function addOnPageLoad_() {
        window.addEventListener('DOMContentLoaded', function (e) {
            var scrollX = document.documentElement.dataset.scrollX || 0;
            var scrollY = document.documentElement.dataset.scrollY || 0;
            window.scrollTo(scrollX, scrollY);
        });
    }

    function generate() {
        window.URL = window.URL || window.webkitURL;
        window.open(window.URL.createObjectURL(screenshotPage()));
    }
    exports.screenshotPage = screenshotPage;
    exports.generate = generate;
})(window);
//alert ('fin control');


</SCRIPT>
	





<body >
	<form name='ipcam' id='ipcam' action='ipwificam20.php' method='post'>
		<script type="text/javascript">window.onload = date_heure();</script>	
		<div class='hero-unit holder' id='hero-unit holder' style='position:absolute; top:650px; left:10px; width:240px; height:20px; visibility:show; border:rgb(0, 0, 200) 2px solid; background-color: white; z-index:3; text-align: center; '>

		<p><a class="btn btn-success" href="javascript:void(0);" onClick="generate();">Generate Screenshot »</a></p>
		</div>	
	

	</form>

</body>
</html>


--
0
Réponse 3 / 5
@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 153
Modifié par kazma le 7/02/2015 à 13:18
ca en fait du code

ce que tu a si j'ai bien compris c'est un div qui contient une image que tu voudrait sauvegarder.

si c'est de facon automatique ce n'est pas possible il faudra toujour une action d'une personne. apres ca il y a la solution du clic droit sur l'image puis enregistrer l'image sous ou encore l'attribut dowload d'un lien qui en cliquant dessus permet de telecharger l'image mais qui n'est suppoté que par firefox et chrome. a tester ici

rien ne sert de courir il faut partir a point.
cours Forest cours !
0
Réponse 4 / 5
vol68 Messages postés 33 Date d'inscription samedi 28 février 2004 Statut Membre Dernière intervention 8 mai 2016
7 févr. 2015 à 14:48
Kazma

Ca fait du code car j'ai 4 cameras. en fait je ne parviens pas à "screenshoter" une seule div mais uniquement toute la page en plus pour pouvoir manipuler les images extraites il faut que se soit un png ou un jepg. mais je no'bients que des screenshots blanc, pas d'images dons pas de comparaison possible, ce que je ne parviens pas à solutionner c'est que ca marche pour la page entiere dans le script, mais pas pour une div, de plus je souhaite utiliser un minimum de php afin de ne pas régénérer la page continuellement.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 5
@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 153
8 févr. 2015 à 15:47
en regardant le script il semble evident que la capture de la page se fait dans la fonction screenshotPage() et plus precisement sur la ligne comportant cloneNode 
var screenshot = document.documentElement.cloneNode(true);


et teste deja en remplacant document.documentElement qui correspond a la page par un des div en utilisant document.getElementById('l_id_du_div')
ce sera deja un debut d' approche
0

Discussions similaires

Partie entiére d'un nombre
stephbb75 -
stephbb75 -

2 réponses
integrer une variable javascript dans un lien hypertext
rabixpvb -
Stopub -

4 réponses
est-ce que "goto" existe en javascript ?
dmk04 -
bultez -

4 réponses
Partie entière d'un nombre
Sniper_Vgaerr -
DeAtHCrAsH -

2 réponses
Redirection par header ou javascript?
Evangun -
Anthomicro -

8 réponses
Rejoignez-nous